/*-----------------------------------------------------------------*/ /* CSS Table of Contents /*-----------------------------------------------------------------*/ /* 1. Reset 2. Global 2-1. table 2-2. button 2-3. product 3. Layout 3-1. wrapper 3-2. header 3-3. nav 3-4. footer 4. Page 4-1. 메인 4-2. 상점 4-3. 회원 4-4. 마이페이지 4-5. 추가페이지 5. ETC /*-----------------------------------------------------------------*/ /* 1. Reset /*-----------------------------------------------------------------*/ /* webfont - Manrope */ @font-face { font-family:'Manrope'; font-weight:300; src:local(※), url('/_skin/bona/img/etc/Manrope_Light.woff2') format('woff2'); } @font-face { font-family:'Manrope'; font-weight:400; src:local(※), url('/_skin/bona/img/etc/Manrope-Regular.woff2') format('woff2'); } @font-face { font-family:'Manrope'; font-weight:500; src:local(※), url('/_skin/bona/img/etc/Manrope-Medium.woff2') format('woff2'); } @font-face { font-family:'Manrope'; font-weight:600; src:local(※), url('/_skin/bona/img/etc/Manrope-SemiBold.woff2') format('woff2'); } @font-face { font-family:'Manrope'; font-weight:700; src:local(※), url('/_skin/bona/img/etc/Manrope-Bold.woff2') format('woff2'); } /* webfont - Pretendard */ @font-face { font-family:'Pretendard'; font-weight:300; src:local(※), url('/_skin/bona/img/etc/Pretendard-Light.woff') format('woff'); } @font-face { font-family:'Pretendard'; font-weight:400; src:local(※), url('/_skin/bona/img/etc/Pretendard-Regular.woff') format('woff'); } @font-face { font-family:'Pretendard'; font-weight:500; src:local(※), url('/_skin/bona/img/etc/Pretendard-Medium.woff') format('woff'); } @font-face { font-family:'Pretendard'; src:url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-SemiBold.woff') format('woff'); font-weight:600; font-style:normal; } @font-face { font-family:'Pretendard'; font-weight:700; src:local(※), url('/_skin/bona/img/etc/Pretendard-Bold.woff') format('woff'); } @font-face { font-family:'Pretendard'; font-weight:800; src:local(※), url('/_skin/bona/img/etc/Pretendard-ExtraBold.woff') format('woff'); } *[onclick] { cursor: pointer; } input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } input[type=number]{ -moz-appearance: textfield; } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin:0; padding:0; border:0; outline:0; color:#333; font-family:'Pretendard',sans-serif; font-size:14px; line-height:1.4; vertical-align:baseline;} body.overflow {height:100%; overflow:hidden;} body * {word-break: keep-all;} /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block;} body {min-width:320px; word-break:break-all; -webkit-text-size-adjust:none;} ol, ul, li {list-style:none;} blockquote, q {quotes:none;} blockquote:before, blockquote:after, q:before, q:after {content: ''; content:none;} table {border-collapse:collapse; border-spacing:0;} img {vertical-align:top;} input[type=radio], input[type=checkbox] {margin-top:-1px; vertical-align:top;} input[type=text], input[type=email], input[type=password] {vertical-align:top;} input[type=checkbox] {display:inline-block; overflow:hidden; width:1.429rem; height:1.429rem; margin:0; margin-top:-0.071rem; margin-right:5px; border:0; background:no-repeat center; background:url('/_skin/bona/img/common/checkbox.png')no-repeat center/1.429rem; outline:0; -webkit-appearance:none; appearance:none; cursor:pointer;} input[type=checkbox]:checked {background-image:url('/_skin/bona/img/common/checkbox_on.png');} input[type=checkbox]:checked + label {color:#3d3d3d !important;} input[type=checkbox]::-ms-check {display:none;} input[type=radio] {display:inline-block; overflow:hidden; width:1.286rem; height:1.286rem; margin:0; margin-top:0; margin-right:4px; border:0; background:no-repeat center; background:url('/_skin/bona/img/common/radio.png')no-repeat center/1.286rem; outline:0; -webkit-appearance:none; appearance:none; cursor:pointer;} input[type=radio]:checked {background-image:url('/_skin/bona/img/common/radio_on.png');} input[type=radio]:checked + label {color:#3d3d3d !important;} input[type=radio]::-ms-check {display:none;} a, a:hover, a:active, a:focus {text-decoration:none;} *, *:before, *:after {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} input[type=text], input[type=password], input[type=submit], input[type=button], input[type=search], input[type=tel], input[type=number], input[type=email], textarea {border-radius:0; -webkit-appearance:none; font-family:'Pretendard',sans-serif;} /*-----------------------------------------------------------------*/ /* 2. Global /*-----------------------------------------------------------------*/ .editorFrm {width:100% !important; } .finish {margin-top:2.143rem; padding:5.786rem 0 2.286rem; border-bottom:0.714rem solid #F9F9F9; background:url('/_skin/bona/img/common/icon_ordercompleted.png')no-repeat center top/4.857rem; letter-spacing:-0.24px;} .finish p {text-align:center; font-size:1.714rem; font-weight:700; line-height:2.286rem; letter-spacing:-0.24px;} .finish p strong {color:#FD5000; font-size:1.714rem; line-height:2.286rem; letter-spacing:-0.24px;} .finish p span {display:block; margin-top:0.786rem; color:#D90028; font-weight:400;} .dn {display:none !important;} .hidden {visibility:hidden; overflow:hidden; width:0 !important; height:0 !important; margin:0 !important; padding:0 !important; font-size:0; line-height:0;} .tac {text-align:center !important;} .tal {text-align:left !important;} .tar {text-align:right !important;} .empty {padding:1.429rem 0 !important; text-align:center;} .fl {float:left !important;} .fr {float:right !important;} .clear {clear:both;} .bc {display:block; margin-left:auto; margin-right:auto;} .p_color {color:#d53838 !important;} .i_info {display:inline-block; position:relative; top:0.286rem; width:1.071rem; height:1.071rem; background:url('/_skin/bona/img/common/icon_info.png') no-repeat center/1.071rem; font-style:normal; font-weight:normal; line-height:1;} iframe body {font-size:14px;} /* 상품 팝업 */ #qdMain {max-width:640px; width:100% !important; left:50% !important;} /* 지도 */ #mapwrap {position:fixed !important; top:0; left:50%; z-index:99;} #mapwrap .close {display:block; position:relative; padding:1.000rem 0; text-align:center; cursor:pointer;} #mapwrap .close span {display:inline-block; width:3.857rem; height:0.714rem; border-radius:0.357rem; background:url('/_skin/bona/img/common/sheet_close.png')no-repeat center/3.857rem;} #mapwrap #pickup_addr_list {position:fixed; top:0; left:50%; z-index:99; width:640px; height:100vh} #mapwrap #pickup_addr_list .pickup_bg {position:fixed; top:0; left:50%; width:640px; height:100vh; background:rgba(0,0,0,0.5); cursor:pointer;} #mapwrap #pickup_addr_list .pickup_wrap {position:fixed; bottom:0; left:50%; width:640px; height:46.875vh; border-radius:20px 20px 0 0; background:#F9F9F9;} #mapwrap #pickup_addr_list .pickup_wrap ul {overflow-y:auto; width:640px; max-height:calc(100% - 38px); height:100%; padding:0 2.429rem 0 3.571rem; background:#F9F9F9;} #mapwrap #pickup_addr_list li {position:relative; padding:0.736rem 3.571rem 0.736rem 3.929rem; border-radius:4px; background:url('/_skin/bona/img/common/icon_location_etc.png')no-repeat left 1.214rem center/1.429rem; cursor:pointer;} #mapwrap #pickup_addr_list li.H {background:url('/_skin/bona/img/common/icon_location_home.png')no-repeat left 1.214rem center/1.643rem;} #mapwrap #pickup_addr_list li.C {background:url('/_skin/bona/img/common/icon_location_company.png')no-repeat left 1.214rem center/1.429rem;} #mapwrap #pickup_addr_list li.select {border:1px solid #FD5000; background:url('/_skin/bona/img/common/icon_location_etc_s.png')no-repeat left 1.214rem center/1.429rem;} #mapwrap #pickup_addr_list li.H {background:url('/_skin/bona/img/common/icon_location_home.png')no-repeat left 1.214rem center/1.643rem;} #mapwrap #pickup_addr_list li.H.select {background:url('/_skin/bona/img/common/icon_location_home_s.png')no-repeat left 1.214rem center/1.643rem;} #mapwrap #pickup_addr_list li.C {background:url('/_skin/bona/img/common/icon_location_company.png')no-repeat left 1.214rem center/1.429rem;} #mapwrap #pickup_addr_list li.C.select {background:url('/_skin/bona/img/common/icon_location_company_s.png')no-repeat left 1.214rem center/1.429rem;} #mapwrap #pickup_addr_list li.select:after {position:absolute; top:50%; right:1.143rem; width:1.571rem; height:1.071rem; margin-top:-0.893rem; background:url('/_skin/bona/img/etc/addr_check.png')no-repeat center/1.571rem; content:'';} #mapwrap #pickup_addr_list li h4 {margin-bottom:0.429rem; font-size:1.143rem; font-weight:600;} #mapwrap #pickup_addr_list li.select h4 {color:#FD5000;} #mapwrap #pickup_addr_list li h4 span {display:none; height:1.571rem; margin:-0.071rem 0 0 0.571rem; padding:0 0.500rem 0 1.286rem; border-radius:0.214rem; background:#FD5000 url('/_skin/bona/img/common/basic_check.png')no-repeat left 0.214rem top 0.500rem/0.857rem; color:#fff; font-size:0.857rem; line-height:1.571rem; vertical-align:top;} #mapwrap #pickup_addr_list li p {color:#999; font-size:1.071rem;} #mapwrap #pickup_addr_list li .btn {position:absolute; top:0; right:0;} #mapwrap #pickup_addr_list li .btn a {display:inline-block; margin-left:0.857rem; color:#999; font-size:0.929rem;} #mapwrap #pickup_addr_name {overflow:hidden; white-space:nowrap; text-overflow:ellipsis; width:9.786rem; padding:0 1.429rem; height:3.000rem; border-radius:3.000rem; background:#fff url('/_skin/bona/img/shop/select_down_black.png')no-repeat right 1.071rem center/0.786rem; line-height:3.000rem; letter-spacing:-0.14px; vertical-align:middle;} #mapwrap {position:relative;overflow:hidden;} #mapwrap .select_prd {padding:0 4.68%; font-size:0;} #mapwrap .select_prd .img {display:inline-block; overflow:hidden; width:4.286rem; height:4.286rem; margin:0.357rem 0 1.071rem; vertical-align:middle;} #mapwrap .select_prd .img img {width:100%;} #mapwrap .select_prd .text {display:inline-block; position:relative; width:calc(100% - 4.286rem); margin:0.357rem 0 1.071rem; padding:0 7.143rem 0 1.071rem; vertical-align:middle;} #mapwrap .select_prd .text span {display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:#999;} #mapwrap .select_prd .text p {overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:#333; font-size:1.286rem; font-weight:700;} #mapwrap .select_prd .text .price {position:absolute; top:50%; right:0; margin-top:-0.893rem; color:#333; font-size:1.286rem; font-weight:700; letter-spacing:-0.45px;} #mapwrap .menu {position:absolute; top:5.000rem; left:4.68%; z-index:10; font-size:0;} #mapwrap.type1 .menu {top:6rem;} #mapwrap .menu .swiper-slide {display:inline-block; width:auto; height:3.000rem; margin-right:0.571rem; padding:0 1.071rem; border-radius:3.000rem; background:#fff; line-height:3.000rem; box-shadow:0px 0.214rem 0.429rem #00000014; vertical-align:middle;} #mapwrap .menu .swiper-slide span {display:inline-block; width:1.286rem; height:1.286rem; margin-right:0.214rem; border-radius:50%; vertical-align:middle;} #mapwrap .menu .swiper-slide span.red {background:#FD5000;} #mapwrap .menu .swiper-slide span.yellow {background:#F7B511;} #mapwrap .menu .swiper-slide.fillter {width:3.000rem; height:3.000rem; background:#fff url('/_skin/bona/img/common/btn_filter.png')no-repeat center/1.286rem;} #mapwrap .menu .swiper-slide.fillter.on {background:#FD5000 url('/_skin/bona/img/common/btn_filter_on.png')no-repeat center/1.286rem;} #mapwrap .shop_info {overflow:hidden; position:absolute; bottom:2.214rem; left:0; z-index:60; width:calc(100% - 5.714rem); margin:0 2.857rem; border-radius:10px; background:#fff; font-size:0; cursor:pointer;} #mapwrap .shop_info > div {display:flex; align-items:center; font-size:0;} #mapwrap .shop_info .img {display:inline-block; width:30.92%; background:#F5F5F5; vertical-align:middle;} /* 20231019 사이즈 변경 width:23.92%; */ #mapwrap .shop_info .img img {width:100%;} #mapwrap .shop_info .text {display:inline-block; position:relative; width:76.08%; padding:1.429rem 1.571rem 1.429rem 1.071rem; background:#fff; vertical-align:middle;} #mapwrap .shop_info .text h3 {position:relative; margin-bottom:0.500rem; padding-right:7.143rem; font-size:1.214rem; letter-spacing:-0.17px;} #mapwrap .shop_info .text h3 span {display:inline-block; position:absolute; top:0; right:0; padding-left:0.857rem; background:url('/_skin/bona/img/etc/icon_phone2.png')no-repeat left center/0.857rem; font-weight:400;} #mapwrap .shop_info .text h3 span a {font-size:0.929rem; font-weight:400px; letter-spacing:-0.13px; text-decoration:underline;} #mapwrap .shop_info .text div {margin-bottom:0.143rem; letter-spacing: -0.14px;} #mapwrap .shop_info .text div.add {display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:3; -webkit-box-orient:vertical; position:relative; min-height:18px; padding:0 5.714rem 0 4.071rem;} #mapwrap .shop_info .text div strong {position:absolute; top:0; left:0; font-weight:500; letter-spacing:-0.14px;} #mapwrap .shop_info .text div p {position:relative; color:#999; font-size:0.929rem; letter-spacing: -0.13px;} #mapwrap .shop_info .text div p span {display:inline-block; position:absolute; bottom:0; right:0; height:1.286rem; padding:0 5px; border-radius:18px; background:#FD5000; color:#fff; letter-spacing:-0.12px; line-height:1.286rem;} #mapwrap .shop_info .text div.addr {display:block; width:100%; padding-right:80px; position:relative;} #mapwrap .shop_info .text div.addr span {display:inline-block; position:absolute; top:0; right:0; height:1.286rem; padding:0 5px; border-radius:18px; background:#FD5000; color:#fff; letter-spacing:-0.12px; line-height:1.286rem;} #mapwrap .shop_info .text .box_btn.block * {margin-top:4px;} #mapwrap .shop_info .text .box_btn.block * {height:3.286rem; line-height:3.286rem;} #mapwrap .top_btn {position:fixed; top:43.33%; left:calc(50% + 41.286rem); z-index:60;} #mapwrap .bottom_btn {position:fixed; top:53.91%; left:calc(50% + 41.286rem); z-index:60;} #mapwrap .add_btn li {margin-bottom:0.143rem;} #mapwrap .top_btn li.plus a {background:#fff url('/_skin/bona/img/etc/map_expansion.png')no-repeat center/1rem;} #mapwrap .top_btn li.minus a {background:#fff url('/_skin/bona/img/etc/map_shrinkage.png')no-repeat center/1rem;} #mapwrap .top_btn li.point a {background:#fff url('/_skin/bona/img/etc/map_location.png')no-repeat center/1.571rem;} #mapwrap .bottom_btn li.home a {background:#fff url('/_skin/bona/img/etc/map_home.png')no-repeat center/1.500rem;} #mapwrap .bottom_btn li.point a {background:#fff url('/_skin/bona/img/etc/map_location.png')no-repeat center/1.571rem;} #mapwrap .add_btn li a {display:inline-block; width:3.000rem; height:3.000rem; border-radius:50%; background-color:#fff; box-shadow:0px 3px 6px #00000024; cursor:pointer;} #mapwrap .customoverlay {position:absolute; top:-98px; left:-42px; width:83px; height:1.714rem; border-radius:4px; background:#6F8A6B; color:#fff; font-size:0.929rem; text-align:center; line-height:1.714rem;} #mapwrap .customoverlay.on {top:-98px; left:-34px;} #mapwrap .customoverlay:after {position:absolute; bottom:-0.429rem; left:50%; width:0.643rem; height:0.429rem; margin-left:-0.286rem; background:url('/_skin/bona/img/etc/custom_after.png')no-repeat center/0.643rem; content:'';} @media (max-width:430px) { #mapwrap .customoverlay {top:-92px; left:-34px;} #mapwrap .customoverlay.on { top:-92px; left:-34px; } } #mapwrap .fillter {display:inline-block; height:3rem; margin-right:0.571rem; padding:0 1.071rem; border-radius:3rem; background:#fff; line-height:3.000rem; box-shadow:0px 0.214rem 0.429rem #00000014; cursor:pointer;} #mapwrap .fillter_wrap {display:none; position:absolute; top:0; left:0; z-index:70; width:100%; height:100vh;} #mapwrap .fillter_wrap .bg {position:absolute; top:0; left:0; z-index:-1; width:100%; height:100vh; background:rgba(0,0,0,0.5);} #mapwrap .fillter_wrap .selected_addr {margin:9px 0 45px; font-size:0;} #mapwrap .fillter_wrap .selected_addr input[type=checkbox] {display:none;} #mapwrap .fillter_wrap .selected_addr input[type=checkbox] + label {display:inline-block; padding:10px 18px; margin:0 5px 5px 0; border-radius:21px; background:#F8F8F8;} #mapwrap .fillter_wrap .selected_addr input[type=checkbox]:checked + label {background:#FD5000; color:#fff !important;} #mapwrap .fillter_wrap .box {position:absolute; bottom:0; left:0; width:100%; padding:0 6.25% 30px; border-radius:1.429rem 1.429rem 0 0; background:#fff;} #mapwrap .fillter_wrap .pickup_fillter h3 {padding:0.714rem 0 0.429rem; background:#fff; color:#333; font-size:1.429rem;} .bale {display:none; position:absolute; top:0; left:0; z-index:65; width:100%; height:100vh; background:rgba(0,0,0,0.5);} .bale .bg {position:absolute; bottom:0; left:0; width:100%; height:100vh;} .bale .bale_list {overflow-y:scroll; position:absolute; bottom:0; left:0; width:100%; height:500px; border-radius:20px 20px 0 0; background:#fff;} .bale .bale_list ul {padding:20px 6.25%;} .bale .bale_list li {padding:1.000rem 0; padding-left:3.071rem; background:url('/_skin/bona/img/etc/map_type1.png')no-repeat left center/2rem; cursor:pointer;} .bale .bale_list li:first-child {padding-top:0;} .bale .bale_list li.type2 {background:url('/_skin/bona/img/etc/map_type2.png')no-repeat left center/2rem;} .bale .bale_list li.type3 {background:url('/_skin/bona/img/etc/map_type3.png')no-repeat left center/2rem;} .bale .bale_list li.type4 {background:url('/_skin/bona/img/etc/map_type4.png')no-repeat left center/2rem;} .bale .bale_list li .name {margin-bottom:0.500rem; font-size:1.143rem; font-weight:600;} .bale .bale_list li .addr {color:#999; font-size:1.071rem;} .bale .bale_list .close {display:block; position:relative; padding:1.000rem 0; text-align:center; cursor:pointer;} .bale .bale_list .close span {display:inline-block; width:3.857rem; height:0.714rem; border-radius:0.357rem; background:url('/_skin/bona/img/common/sheet_close.png')no-repeat center/3.857rem;} /* 클러스터 */ .shop_info_clustered {position:absolute; left:0; top:16rem; width:100px; max-height:300px; display:none; z-index:60; background:#fff; overflow:hidden; overflow-y:auto;} /* input 기본 스타일 */ .form_input {height:3.571rem; padding:0.286rem 1.071rem; border:1px solid #E9E9E9; background:#fff; color:#666; font-family:'Pretendard',sans-serif; font-size:1rem; transition:all .3s ease;} .form_input:focus {border-color:#000; outline:none !important;} .form_input.block {width:100% !important;} .form_input:-ms-input-placeholder {color:#666; font-family:'Pretendard',sans-serif; } .form_input::-webkit-input-placeholder {color:#666; font-family:'Pretendard',sans-serif; } .form_input::-moz-placeholder {color:#666; font-family:'Pretendard',sans-serif; } .form_input.readonly {background:#e0e0e0 !important;} .form_input.gray {background:#fafafa;} .form_input.gray:focus {background:#fff;} textarea.form_input {height:auto;} /* 셀렉트 */ select {max-width:100%; height:2.429rem; padding:0.286rem 0.429rem; border:1px solid #dcdcdc; border-radius:0; background:url('/_skin/bona/img/common/select_arrow.png') no-repeat right 0.714rem center /0.714rem 0.429rem #fff; color:#666; font:inherit; -webkit-appearance:none; -moz-appearance:none; -ms-appearance:none;} select.block {width:100%;} select:focus {border-color:#000; outline:none !important;} /* 서브 페이지 타이틀 */ .subtitle {overflow:hidden; text-overflow:ellipsis; white-space:nowrap; width:50%; margin:0 auto; padding:1.143rem 0; font-size:1.429rem; font-weight:700; text-align:center;} /* 페이징 */ .paging * {vertical-align:middle;} .paging {margin-top:1.071rem; font-size:0; text-align:center;} .paging li {display:inline; padding:0 0.143rem; color:#9e9e9e; vertical-align:middle;} .paging li strong {display:inline-block; width:34px; height:34px; border:1px solid #FD5000; background:#FD5000; color:#fff; line-height:34px;} .paging li a {display:inline-block; width:34px; height:34px; border:1px solid #e0e0e0; background:#fff; color:#6e6e6e; line-height:34px;} /* 박스 스타일 - 수량 */ .box_qty {display:inline-block; position:relative; width:5.429rem;} .box_qty.block {width:100%;} .box_qty .form_input {height:2.143rem; padding:0 1.857rem; border:1px solid #DDDDDD; font-size:1rem; text-align:center;} .box_qty input[type="number"]::-webkit-outer-spin-button, .box_qty input[type="number"]::-webkit-inner-spin-button {-webkit-appearance:none; -moz-appearance:none; appearance:none;} .box_qty .form_input:hover {border-color:#dcdcdc;} .box_qty .minus {display:inline-block; position:absolute; left:0; top:0; width:1.857rem; height:2.143rem; background:url('/_skin/bona/img/shop/cart_minus.png') no-repeat center/0.643rem; cursor:pointer;} .box_qty .plus {display:inline-block; position:absolute; right:0; top:0; width:1.857rem; height:2.143rem; background:url('/_skin/bona/img/shop/cart_plus.png') no-repeat center/0.643rem; cursor:pointer;} /* 컬러칩 리스트 */ .color_option {font-size:0;} .color_option:after {display:block; clear:both; content:'';} .color_option li {float:left;} .color_option li a {display:block; width:17px; height:17px; margin:1px; border:1px solid #fff;} .color_option li a.selected {border:1px solid #fff; outline:1px solid #ff1111;} .color_option li a img {width:15px; height:15px;} .text_option {font-size:0;} .text_option:after {display:block; clear:both; content:'';} .text_option li {float:left; text-align:left;} .text_option li a {overflow:hidden; display:block; height:20px; margin:1px; padding:0 6px; border:1px solid #d8d8d8; line-height:20px; text-align:center;} .text_option li a.selected {border:1px solid #ff1111;} .text_option li a.soldout {background:#ff1111; color:#fff;} /* 글쓰기 - 주문서,1:1문의 */ .write > div {margin-bottom:0.714rem; text-align:left;} .write > div:last-child {margin-bottom:0;} .write > div.line {margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid #dcdcdc;} .write > div > label {display:none;} .write > div.all_chk > label {display:block;} .write > .msg {margin-bottom:1.429rem; line-height:34px;} .write > .msg * {vertical-align:middle;} /* 상단 셀렉트 메뉴 */ .top_select_menu {height:40px; border-top:1px solid transparent; border-right:1px solid transparent; border-left:1px solid transparent; background-color:#f1f1f1;} /* 상품리스트 정렬 */ .sort_line {padding-bottom:15px;} .sort_line:after {display:block; clear:both; content:'';} .sort_line .sort {float:left; width:50%;} .sort_line .sort select {width:100%;} .sort_line .type {float:left; width:50%; height:34px; border:1px solid #dcdcdc; border-left:0; color:#666;} .sort_line .type a {display:block; width:100%; height:100%; padding:0 10px; background-repeat:no-repeat; background-position:right center; background-size:32px; color:inherit; line-height:34px;} .sort_line .type a.type1 {background-image:url('/_skin/bona/img/shop/type1.png');} .sort_line .type a.type2 {background-image:url('/_skin/bona/img/shop/type2.png');} .sort_line .type a.type3 {background-image:url('/_skin/bona/img/shop/type3.png');} .sort_line .type a.type4 {background-image:url('/_skin/bona/img/shop/type4.png');} .sort_line .type a.type5 {background-image:url('/_skin/bona/img/shop/type5.png');} /* 엔진 - 레이어 딤드(게시판 상품 선택, 퀵프리뷰 팝업) */ #qdBackground {position:fixed !important; top:0; left:50% !important; width:640px !important; height:100% !important;} /* 상품후기 평점 */ .gradebox {display:inline-block; position:relative; width:11.286rem; height:2.143rem; background:url('/_skin/bona/img/shop/grade.png') no-repeat left top/auto 100%; font-size:0;} .gradebox:after {display:block; position:absolute; left:0; top:0; height:100%; background:url('/_skin/bona/img/shop/grade_over.png') no-repeat left top/auto 100%; content:'';} .gradebox.small {width:5.643rem; height:1.071rem;} .gradebox.point1:after {width:20%;} .gradebox.point2:after {width:40%;} .gradebox.point3:after {width:60%;} .gradebox.point4:after {width:80%;} .gradebox.point5:after {width:100%;} .gradebox.write label {display:inline-block !important; position:relative; z-index:10; width:2.214rem; height:100%; opacity:0; font-size:0; cursor:pointer;} .gradebox.write input {cursor:pointer;} /* 사은품 리스트 */ .list_gift > h3 {padding-bottom:15px;} .list_gift > ul {border-top:1px solid #e5e5e5; font-size:0;} .list_gift > ul > li {padding:20px 0; border-bottom:1px solid #e5e5e5; text-align:left; vertical-align:middle;} .list_gift > ul > li > .box > .img {display:table-cell; position:relative; width:100px; height:100px; border:1px solid #e5e5e5;} .list_gift > ul > li > .box > .img img {position:absolute; left:50%; top:50%; max-width:100%; max-height:100%; transform:translate(-50%, -50%);} .list_gift > ul > li > .box > .name {display:table-cell; padding:0 20px 0 10px; vertical-align:middle;} /* 쿠폰 다운로드 리스트 */ .list_cpn_down > .box {border:1px solid #dcdcdc;} .list_cpn_down > .box > ul > li {position:relative; padding:15px 130px 15px 15px; border-top:1px solid #dcdcdc; text-align:left; vertical-align:middle;} .list_cpn_down > .box > ul > li:first-child {border-top:0;} .list_cpn_down > .box > ul > li:before {display:inline-block; position:absolute; right:120px; top:15px; width:1px; height:calc(100% - 30px); background-color:#e5e5e5; content:'';} .list_cpn_down > .box > ul > li > .sale {font-size:1.417rem; font-weight:bold;} .list_cpn_down > .box > ul > li > .name {font-weight:bold;} .list_cpn_down > .box > ul > li > span {position:absolute; right:15px; top:50%; margin-top:-20px;} .list_cpn_down > .box > ul > li > span.fin {display:inline-block; min-width:90px; height:40px; padding:4px 8px; border:1px solid #c3c3c3; background:#fff; color:#666 !important; line-height:32px; text-align:center; vertical-align:top; white-space:nowrap;} .list_cpn_down > .box > ul > li > span.box_btn * {min-width:90px; height:40px; line-height:32px;} /* 타이머 */ .box_timer {display:inline-block; margin-top:10px; border:1px solid #dcdcdc; border-radius:20px; font-size:0;} .box_timer > .title {display:inline-block; position:relative; padding:5px; border-radius:20px; background-color:#333; color:#fff; font-size:0; vertical-align:top;} .box_timer > .title:before {display:inline-block; width:13px; height:13px; border:1px solid #fff; border-radius:50%; vertical-align:top; content:'';} .box_timer > .title:after {display:inline-block; position:absolute; left:8px; top:50%; width:4px; height:4px; margin-top:-2px; border:1px solid #fff; border-width:0 1px 1px 0; content:'';} .box_timer > ._timesale_timer {display:inline-block; padding:0 10px 0 5px;} .box_timer > ._timesale_timer * {color:#333; font-size:1rem; line-height:23px;} .box_timer > ._timesale_timer > ._timer_num {font-weight:900;} .box_timer.big > .title {font-size:1rem;} .box_timer.big > .title:before {margin:2px 5px 0 0;} .box_timer.big > ._timesale_timer * {font-size:1.083rem; line-height:26px;} #detail .box_timer {margin-bottom:20px;} /* 이메일 자동 완성 */ .auto_complete_dialog {display:none; position:absolute; z-index:10; width:100%; margin-top:-1px; padding:10px 0; border:1px solid #535353; background-color:#fff; word-break:break-all;} .auto_complete_dialog li {padding:5px 20px; font-size:14px; cursor:pointer;} .auto_complete_dialog li:hover, .auto_complete_dialog li.selected {background-color:#f0f2f6;} #join_input .auto_complete_dialog {width:calc(100% - 52px);} /* 체크박스, 라디오 */ .check_chg input[type=checkbox] {display:none;} .check_chg input[type=checkbox] + label {display:inline-block; min-height:18px; padding-left:1.857rem; background:url('/_skin/bona/img/common/checkbox.png')no-repeat left center/1.429rem; vertical-align:top; cursor:pointer;} .check_chg input[type=checkbox]:checked + label {background-image:url('/_skin/bona/img/common/checkbox_on.png');} .check_chg.black input[type=checkbox]:checked + label {background-image:url('/_skin/bona/img/common/bullet_cb_checked_black.png');} .radio_chg input[type=radio] {display:none;} .radio_chg input[type=radio] + label {display:inline-block; min-height:18px; padding-left:1.857rem; background:url('/_skin/bona/img/common/bullet_radio.png') no-repeat left center; background-size:18px; vertical-align:top; cursor:pointer;} .radio_chg input[type=radio]:checked + label {background-image:url('/_skin/bona/img/common/bullet_radio_checked.png');} /* QR 코드 */ .qrbox {overflow:hidden; position:relative; border-radius:0.286rem;} .qrbox {margin-bottom:30px;} .qrbox .upload-name {display:inline-block; height:40px; padding:0 10px; vertical-align:middle; border:1px solid #dddddd; width:78%; color:#999999;} .qrbox label {display:inline-block; position:absolute; top:0; left:0; width:100%; padding:1.143rem 0; background:#FD5000; color:#fff; font-size:1.071rem; font-weight:600; cursor:pointer; text-align:center;} .qrbox label img {width:1.571rem; margin-right:0.429rem;} .qrbox p {display:inline-block; top:0; left:0; width:100%; padding:1.143rem 0; background:#FD5000; color:#fff; font-size:1.071rem; font-weight:600; cursor:pointer; text-align:center;} .qrbox p img {width:1.571rem; margin-right:0.429rem;} .qrbox .fake {width:100%; height:3.571rem; margin-bottom:2.143rem; padding:0 1.071rem; border:1px solid #E9E9E9;} .qrbox input[type="file"] {position:absolute; width:0; height:0; padding:0; overflow:hidden; border:0;} .qrbox .file_del {position:absolute; top:1.143em; left:1.143em; color:#999; letter-spacing:-0.14px; font-weight:400;} .qrbox .file_del b {color:#999; letter-spacing:-0.14px; font-weight:400;} .qrbox .file_del {position:absolute; top:1.143em; left:1.143em; color:#999; letter-spacing:-0.14px; font-weight:400;} .qrbox .input-file-button {display:none; padding:6px 25px; background-color:#FF6600; border-radius:4px; color:white; cursor:pointer;} /*-----------------------------------------------------------------*/ /* 2-1. table /*-----------------------------------------------------------------*/ /* 테이블 스타일 - 가로 */ .tbl_col {table-layout:fixed; clear:both; width:100%; border-collapse:collapse;} .tbl_col caption {padding-bottom:20px; font-weight:bold; text-align:left;} .tbl_col > thead > tr > th {padding:15px 0; border-top:1px solid #e0e0e0; border-bottom:1px solid #e0e0e0; font-weight:normal; text-align:center; vertical-align:middle;} .tbl_col > tbody > tr > td {padding:15px 0; border-bottom:1px solid #e0e0e0; text-align:center; vertical-align:middle;} .tbl_col > tbody > tr > td * {color:#666;} .tbl_col > tbody > tr > td.tal {padding-left:15px !important;} .tbl_col > tbody > tr > td.img img {width:100px; height:auto;} /* 테이블 스타일 - 가로 - 장바구니, 주문조회 */ .tbl_col.prd > tbody > tr > td {padding:0;} .tbl_col.prd > tbody > tr > td.order_number a {font-weight:bold; text-decoration:underline;} .tbl_col.prd > tbody > tr > td.delete_wish a {display:inline-block; position:relative;} .tbl_col.prd > tbody > tr > td.delete_wish a:first-child:after {position:absolute; right:0; top:8px; width:1px; height:15px; background:#e0e0e0; content:'';} .tbl_col.prd > tbody > tr > td .btn_edit {display:inline-block; vertical-align:top;} .tbl_col.prd > tbody > tr > td .btn_edit a {font-size:0.917rem; text-decoration:underline; line-height:35px;} /* 테이블 스타일 - 가로 - qna, review */ .tbl_col.board > tbody > tr > td.notice_cnt {padding:0; border:0;} .tbl_col.board > tbody > tr > td.notice_cnt .notice_cnt_frame {display:none; padding:15px; border-bottom:1px solid #e0e0e0; background:#fafafa; text-align:left; word-break:break-all; word-wrap:break-word;} .tbl_col.board > tbody > tr > td.subject .prdname {padding-bottom:5px;} .tbl_col.board > tbody > tr > td .best {display:inline-block; margin-right:5px; padding:3px 5px; background:#f00; color:#fff;} /* 테이블 스타일 - 세로 */ .tbl_row {table-layout:fixed; width:100%; border-top:1px solid #e0e0e0;} .tbl_row caption {padding-bottom:20px; font-weight:bold; text-align:left;} .tbl_row thead th, .tbl_row thead td {text-align:center;} .tbl_row th {padding:10px; border-bottom:1px solid #e0e0e0; font-weight:normal; text-align:left; vertical-align:middle;} .tbl_row td {padding:10px; border-bottom:1px solid #e0e0e0; text-align:left; vertical-align:middle; word-break:break-all; word-wrap:break-word;} /* 테이블 스타일 - 주문서, 주문완료, 주문상세조회, 장바구니 */ .tbl_order {table-layout:fixed; width:100%; margin:0 auto;} .tbl_order caption {padding-bottom:20px; font-weight:bold; text-align:left;} .tbl_order th {padding:0.286rem 0; color:#333; font-size:1.071rem; font-weight:600; text-align:left; vertical-align:middle; letter-spacing:-0.15px;} .tbl_order .total_row td {color:#FD5000;} .tbl_order td {padding:0.286rem 0; color:#999; font-size:1.071rem; text-align:left; vertical-align:middle; letter-spacing:-0.15px;} .tbl_order td * {color:#999; font-size:1.071rem; letter-spacing:-0.15px;} .tbl_order td strong {color:#333;} .tbl_order td strong span {color:#333;} .tbl_order.sale {margin:5px 0; border:1px solid #dcdcdc; border-width:1px 0;} .tbl_order .total td .view_info {display:none; margin-top:5px;} .tbl_order .total_price, .tbl_order .total_price * {color:#FD5000; font-size:1.071rem; font-weight:600;} .tbl_order.order tr:last-child th {padding-bottom:1.429rem;} .tbl_order.order td:last-child {padding-bottom:1.429rem;} .tbl_order.total {border-top:1px dashed #D9D9D9;} .tbl_order.total * {vertical-align:top;} .tbl_order.total th {padding:1.429rem 0; color:#333; font-size:1.143rem; font-weight:500;} .tbl_order.total td {padding:1.429rem 0;} .tbl_order.total td strong {display:block; margin-bottom:0.143rem;} .tbl_order.total td strong span {font-size:1.286rem; vertical-align:bottom;} .tbl_order.total td .point {display:inline-block; margin-bottom:0.857rem; padding-left:1.214rem; background:url('/_skin/bona/img/shop/icon_milage.png')no-repeat left top/1.143rem;} .tbl_order.total td .point span {color:#EB3B16; font-size:1.071rem; font-weight:600;} .tbl_order.total .coupon {display:block;} .tbl_order.total .coupon input {height:2.429rem; padding:0 0.643rem 0 2.071rem; border:0; border-radius:4px; background:#F8F8F8 url('/_skin/bona/img/shop/icon_coupon.png')no-repeat left 0.643rem top 0.571rem/1.286rem; color:#333; font-weight:500;} .tbl_order2 {table-layout:fixed; width:100%; margin:0 auto;} .tbl_order2 caption {padding-bottom:20px; font-weight:bold; text-align:left;} .tbl_order2 th {padding:0.286rem 0; color:#999999; font-size:1.071rem; font-weight:400; text-align:left; vertical-align:middle; letter-spacing:-0.15px;} .tbl_order2 td {padding:0.286rem 0; color:#999999; font-size:1.071rem; vertical-align:middle; letter-spacing:-0.15px; text-align:left;} .tbl_order2 td * {color:#999; font-size:1.071rem; letter-spacing:-0.15px;} .tbl_order2 td strong span {color:#333;} .tbl_order2.sale {margin:5px 0;} .tbl_order2 .total td .view_info {display:none; margin-top:5px;} .tbl_order2 .total_price, .tbl_order2 .total_price * {color:#FD5000; font-size:1.071rem; font-weight:600;} .tbl_order2.order tr:last-child th {padding-bottom:1.429rem;} .tbl_order2.order td:last-child {padding-bottom:1.429rem;} .tbl_order2.total {border-top:1px dashed #D9D9D9;} .tbl_order2.total * {vertical-align:top;} .tbl_order2.total th {padding:1.429rem 0; color:#333; font-size:1.143rem; font-weight:500;} .tbl_order2.total td {padding:1.429rem 0; color:#333;} .tbl_order2.total td strong {display:block; margin-bottom:0.143rem; color:#333; font-size:1.286rem; font-weight:700;} .tbl_order2.total td strong span {color:#333; font-size:1.286rem; font-weight:700; vertical-align:bottom;} .tbl_order2.total td .point {display:inline-block; margin-bottom:0.857rem; padding-left:1.214rem; background:url('/_skin/bona/img/shop/icon_milage.png')no-repeat left top/1.143rem;} .tbl_order2.total td .point span {color:#EB3B16; font-size:1.071rem; font-weight:600;} .tbl_order2.total .coupon {display:block;} .tbl_order2.total .coupon input {height:2.429rem; padding:0 0.643rem 0 2.071rem; border:0; border-radius:4px; background:#F8F8F8 url('/_skin/bona/img/shop/icon_coupon.png')no-repeat left 0.643rem top 0.571rem/1.286rem; color:#333; font-weight:500;} .tbl_order3 {table-layout:fixed; width:100%; margin:0 auto;} .tbl_order3 caption {padding-bottom:20px; font-weight:bold; text-align:left;} .tbl_order3 th {padding:0.429rem 0; color:#333; font-size:1.071rem; font-weight:600; text-align:left; vertical-align:middle; letter-spacing:-0.15px;} .tbl_order3 td {padding:0.429rem 0; color:#333; font-size:1.071rem; text-align:left; vertical-align:middle; letter-spacing:-0.15px;} .tbl_order3 td * {color:#333; font-size:1.071rem; letter-spacing:-0.15px;} .tbl_order3 td.total, .tbl_order3 td.total * {color:#333; font-size:1.071rem; font-weight:600; letter-spacing:-0.15px;} .tbl_order3 td strong span {color:#333;} .tbl_order3.sale {margin:5px 0; border:1px solid #dcdcdc; border-width:1px 0;} .tbl_order3 .total td .view_info {display:none; margin-top:5px;} .tbl_order3 .total_price, .tbl_order3 .total_price * {color:#FD5000; font-size:1.071rem; font-weight:600;} .tbl_order3.order tr:last-child th {padding-bottom:1.429rem;} .tbl_order3.order td:last-child {padding-bottom:1.429rem;} .tbl_order3.total {border-top:1px dashed #D9D9D9;} .tbl_order3.total * {vertical-align:top;} .tbl_order3.total th {padding:1.429rem 0; color:#333; font-size:1.143rem; font-weight:500;} .tbl_order3.total td {padding:1.429rem 0;} .tbl_order3.total td strong {display:block; margin-bottom:0.143rem;} .tbl_order3.total td strong span {font-size:1.286rem;} .tbl_order3.total td .point {display:inline-block; margin-bottom:0.857rem; padding-left:1.214rem; background:url('/_skin/bona/img/shop/icon_milage.png')no-repeat left top/1.143rem;} .tbl_order3.total td .point span {color:#EB3B16; font-size:1.071rem; font-weight:600;} .tbl_order3.total .coupon {display:block;} .tbl_order3.total .coupon input {height:2.429rem; padding:0 0.643rem 0 2.071rem; border:0; border-radius:4px; background:#F8F8F8 url('/_skin/bona/img/shop/icon_coupon.png')no-repeat left 0.643rem top 0.571rem/1.286rem; color:#333; font-weight:500;} /* 테이블 스타일 - 상품정보고시 */ .tbl_prdinfo {table-layout:fixed; /*width:100%; margin:1.429rem 0 3.214rem;*/ margin:1.429rem 6.25% 3.214rem 6.25%; border-top:1px solid #333333;} .tbl_prdinfo.funding {margin-top:2.714rem;} .tbl_prdinfo caption {padding:0.571rem 0; font-size:1.429rem; font-weight:700; text-align:left;} .tbl_prdinfo th {padding:1.000rem 0.786rem 0.929rem; border-bottom:1px solid #F6F6F6; font-size:1.071rem; font-weight:600; text-align:left; vertical-align:middle;} .tbl_prdinfo td {padding:1.000rem 0.786rem 0.929rem; border-bottom:1px solid #F6F6F6; font-size:1.071rem; text-align:left; vertical-align:middle;} /*-----------------------------------------------------------------*/ /* 2-2. button /*-----------------------------------------------------------------*/ /* 버튼스타일 - 기본 */ .box_btn {display:inline-block; text-align:center; vertical-align:top;} .box_btn > * {display:inline-block; margin:0; padding:0.571rem 0.857rem; border:1px solid #FD5000; border-radius:4px; outline:none; background:#FD5000; color:#fff !important; font-size:1rem; font-family:'Pretendard',sans-serif; font-weight:normal; text-align:center; vertical-align:middle; line-height:1.4; white-space:nowrap; cursor:pointer; -webkit-appearance:none; transition:all .2s ease;} /* 버튼스타일 - 크기 */ .box_btn.small > * {padding:4px 8px;} .box_btn.large > * {padding:9.5px 16px; font-size:1.167rem;} .box_btn.more_btn {display:block; margin:0.071rem auto 0;} .box_btn.more_btn > * {width:11.429rem; height:2.857rem; padding:0; border:0; border-radius:2.857rem; background:#FD5000; font-size:1.071rem; font-weight:500; line-height:2.857rem; box-shadow:0px 0.714rem 0.714rem #8585851A;} .box_btn.more_btn * * {display:inline-block; padding-right:1.357rem; border:0; background:url('/_skin/bona/img/common/toggle_down.png')no-repeat right center/1.286rem; color:#fff; font-size:1.071rem; font-weight:500; line-height:2.857rem;} /* 메인 모어버튼 추가 */ .box_btn.more_main {display:block; margin:1.714rem auto 0;} .box_btn.more_main > * {width:8.571rem; height:2.857rem; padding:0; border:1px solid #ddd; border-radius:2.857rem; background:#F8F8F8; font-size:1.071rem; font-weight:500; line-height:2.857rem; box-shadow:0px 0.714rem 0.714rem #8585851A; color:#333 !important;} /* 버튼스타일 - 가로길이 */ .box_btn.block {display:block;} .box_btn.block > * {width:100%; height:3.571rem; padding:0; border-radius:4px; font-size:1.071rem; font-weight:600; line-height:3.571rem;} .box_btn.w50 > * {width:50px;} .box_btn.w75 > * {width:75px;} .box_btn.w100 > * {width:100px;} .box_btn.w125 > * {width:125px;} .box_btn.w150 > * {width:150px;} .box_btn.w175 > * {width:175px;} .box_btn.w200 > * {width:200px;} .box_btn.w225 > * {width:225px;} .box_btn.w250 > * {width:250px;} .box_btn.w275 > * {width:275px;} .box_btn.w300 > * {width:300px;} .box_btn.w325 > * {width:325px;} .box_btn.w350 > * {width:350px;} /* 버튼스타일 - 색상 */ .box_btn.white * {border-color:#EEEEEE; background:#EEEEEE; color:#333 !important;} .box_btn.gray * {border-color:#EEEEEE; background:#EEEEEE; color:#333 !important;} .box_btn.gray:hover *, .box_btn.gray:active *, .box_btn.gray:focus * {background:#dadada;} .box_btn.gray2 * {border-color:#dcdcdc; background:#eee; color:#666 !important;} .box_btn.gray2:hover *, .box_btn.gray2:active *, .box_btn.gray2:focus * {background:#dadada;} .box_btn.gray3 * {border-color:#e9e9e9; background:#e9e9e9; color:#666 !important;} .box_btn.gray3:hover *, .box_btn.gray3:active *, .box_btn.gray3:focus * {background:#d6d3d3;} .box_btn.orange * {border-color:#FD5000; background:#FD5000; color:#fff !important;} /* 버튼스타일 - 텍스트 */ .box_btn.strong * {font-weight:bold;} .box_btn.radius * {border-radius:6px;} /* 나열 버튼 */ .btn_col {width:100%;} .btn_col:after {display:block; clear:both; content:'';} .btn_col span {float:left; width:49%;} .btn_col span:last-child {float:right;} .btn_col.detail span {float:left; width:49.2%;} .btn_col.detail span:last-child {float:right;} .btn_col.col3 span {float:left; width:32%;} .btn_col.col3 span:nth-child(3n-1) {margin:0 2%;} .btn_col2 {width:100%;} .btn_col2:after {display:block; clear:both; content:'';} .btn_col2 span {float:left; width:50%;} .btn_col2 span:last-child {float:right; position:relative; left:-1px;} /*-----------------------------------------------------------------*/ /* 2-3. product /*-----------------------------------------------------------------*/ /* 상품스타일 - 기본 */ .prd_basic {display:inline-block; width:100%; font-size:0; text-align:left !important;} .prd_basic > li {display:inline-block; padding-bottom:1.357rem; text-align:center; vertical-align:top;} .prd_basic > li > .type {display:none;} .prd_basic .box {position:relative; width:100%; margin:0 auto;} .prd_basic .box .img {position:relative; z-index:1; width:100%; margin:0 auto; background:#fff; text-align:center;} .prd_basic .box .img .prdimg {transition:all .3s ease;} .prd_basic .box .img .prdimg img {width:100%; height:100%; border-radius:0.571rem;}/* 수정 230803 - 상품 라운딩 */ .prd_basic .box .img .prdimg .cart {display:inline-block; width:;} .prd_basic .box .img .soldout {display:none;} .prd_basic .box .flag {position:absolute; left:0.714rem; top:1.000rem; z-index:10;} .prd_basic .box .flag img {width:1.286rem !important; height:auto;} .prd_basic .box .wish {position:absolute; right:0.286rem; top:0.429rem; z-index:10;} .prd_basic .box .wish a {display:block; width:2.286rem; height:2.286rem; background:url('/_skin/bona/img/common/btn_wish_off.png') no-repeat center/1.229rem;} .prd_basic .box .wish a.wish_on {background-image:url('/_skin/bona/img/shop/btn_wish_on.png');} .prd_basic .box.out .img .prdimg {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=30); opacity:.3;} .prd_basic .box.out .img .soldout {display:block; position:absolute; left:0; top:50%; z-index:5; width:100%; color:#000; font-size:1.167rem; font-weight:bold; text-align:center; cursor:pointer;} /* 품절시 soldout 출력 */ .prd_basic .box .img .num {display:none; position:absolute; bottom:-1.500rem; right:0.714rem; width:2.857rem; height:2.857rem; border-radius:50%; background:#fff; color:#333; font-size:1.214rem; font-weight:900; line-height:2.857rem;} .prd_basic .box .img .cart {display:inline-block; position:absolute; bottom:1.071rem; right:1.071rem; width:2.714rem; height:2.714rem;} .prd_basic .box .img .cart a {display:inline-block; width:2.714rem; height:2.714rem; background:url('/_skin/bona/img/shop/list_cart.png')no-repeat center/2.714rem;} .prd_basic .box .img .tpickup {display:inline-block; position:absolute; bottom:0rem; right:0rem; width:6rem; height:4.5rem;} .prd_basic .box .img .tpickup img {margin-top:15%;} .prd_basic .box .info {position:relative; z-index:20; padding-top:0.28rem; text-align:left;} .prd_basic .box.pick .info {margin-bottom:20px;} .prd_basic .type2 .box .info {margin-bottom:13px;} .prd_basic .box .type {margin-bottom:3px; color:#999999; font-size:1.000rem; font-weight:500;} .prd_basic .box .name * {display:-webkit-box; overflow:hidden; color:#333; font-size:1.286rem; font-weight:600; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical; line-height:1.357rem;} .prd_basic .box .price {padding:1.143rem 0 1.143rem; font-size:0;} .prd_basic .box.time .price {padding:0 0 1rem; font-size:0;} .prd_basic .box .price p {display:inline-block; word-break:break-all; word-wrap:break-word;} .prd_basic .box .price p.sell {display:block; word-break:break-all; word-wrap:break-word;} .prd_basic .box .price .consumer {display:inline-block; margin-bottom:-0.143rem; color:#999; font-size:1rem; text-decoration:line-through;} .prd_basic .box .price .sell strong {color:#333; font-size:1.429rem; font-weight:900;} .prd_basic .box .price .sell strong span {display:none;} .prd_basic .box.pick .price .sell strong span {display:inline-block;} .prd_basic .box .price .sellY {} .prd_basic .box .price .discount {display:none;} .prd_basic .box .price .discountY {font-size:1.143rem; font-weight:700;} .prd_basic .box .price .discountY * {font-size:1.143rem; font-weight:700;} .prd_basic .box .price .percent {margin-right:0.500rem; color:#FD5000; font-size:1.143rem; font-weight:900;} .prd_basic .box .summary {padding-top:0.714rem; color:#888; font-size:0.917rem; word-break:break-all; word-wrap:break-word;} .prd_basic .box .icon {padding-top:0.571rem;} .prd_basic .box .icon img {width:auto !important; height:1.143rem; margin:0 0.143rem 0.143rem 0.143rem; vertical-align:middle;} .prd_basic .box .icon .test_icon {display:inline-block; width:2.643rem; height:1.286rem; background:#F3F3F3; font-size:0.857rem; line-height:1.286rem; text-align:center;} .prd_basic .box .today {display:inline-block; margin:0.714rem auto 0px; padding:0.214rem; background-color:#ebebeb; font-size:0.917rem;} .prd_basic .box .today * {font-size:inherit;} .prd_basic .box .today > span {color:#666; padding-left:0.357rem;} .prd_basic .box .review_star {color:#B5B5B5; padding-left:1.143rem; font-size:0.929rem; background:url('/_skin/bona/img/common/icon_star.png')no-repeat left center;} .gage {overflow:hidden; position:relative; padding:0 42px; font-size:0;} .gage .per_wrap {position:relative; padding:31px 0 0;} .gage .per {display:inline-block; position:absolute; top:0; max-left:100%; min-width:85px; height:24px; padding:0 8px; border-radius:24px; background:#FD5000; color:#fff; line-height:24px; transform:translate(-50%,0); text-align:center;} .gage .per strong {display:inline-block; color:#fff; line-height:24px;} .gage .per:after {position:absolute; bottom:-4px; left:50%; width:10px; height:5px; margin:0 0 0 -5px; background:url('/_skin/bona/img/common/per_dot.png')no-repeat center/10px; content:'';} /* 20230911 위치수정 */ .gage .bar {position:relative; width:100%; height:0.429rem; margin-bottom:0.357rem; border-radius:6px; background:#E9E9E9;} .gage .bar .stick {position:absolute; top:0; left:0; max-width:100%; height:6px; border-radius:6px; background:#FD5000;} .gage .qt {display:inline-block; float:left; width:auto; font-size:1.071rem;} .gage .qt * {font-size:1.071rem;} .gage .day {display:inline-block; float:right; width:auto; text-align:right;} .gage .day span {font-weight:700; color:#FD5000;} /* 상품스타일 - 보기갯수 */ .prd_basic.col1 > li {width:100%;} .prd_basic.col1 .box .name * {font-size:1.429rem;} .prd_basic.col1 .box .price .consumer {display:inline-block; margin-right:7px; font-size:1.143rem;} .prd_basic.col1 .box .price .percent {font-size:1.429rem;} .prd_basic.col1 .box .price .sell strong {font-size:1.429rem;} .prd_basic.col1 .box .icon img {height:21px;} .prd_basic.col1 .box .icon {padding-top:2px;} .prd_basic.col2 > li {width:50%; padding-right:1.5625% !important;} .prd_basic.col2 {padding:0 6.25%;} .prd_basic.col2 > li:nth-child(2n) {padding-right:0 !important; padding-left:1.5625% !important;} .prd_basic.col3 > li {width:32%;} .prd_basic.col3 > li:nth-child(3n-1) {margin:0 2%;} .prd_basic.col_img > li {width:50%; padding-right:1.5625%;} .prd_basic.col_img > li:nth-child(2n) {padding-right:0; padding-left:1.5625%;} .prd_basic.col_img .box .info {display:none;} .prd_basic.col_list > li {width:100%; padding-bottom:12px; border-bottom:0;} .prd_basic.col_list > li .box {font-size:0;} .prd_basic.col_list > li .box:after {display:block; clear:both; content:'';} .prd_basic.col_list > li .box .img {display:inline-block; width:130px; vertical-align:top;} .prd_basic.col_list > li .box .info {display:inline-block; width:calc(100% - 130px); padding-left:20px; text-align:left; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; vertical-align:middle;} .prd_basic.col_list .box .type {padding-top:0;} .prd_basic.col_list > li .box .name {padding:0 40px 0 0;} .prd_basic.col_list .box .price .consumer {display:inline-block; margin-right:0.500rem;} .prd_basic.col_list > li .box .wish {top:50%; z-index:55; margin:-16px 9px 0 0;} .prd_basic.col_list_pick {margin-top:0.857rem;} .prd_basic.col_list_pick > li {width:100%; padding-bottom:1.429rem; border-bottom:0;} .prd_basic.col_list_pick > li .box {font-size:0;} .prd_basic.col_list_pick > li .box:after {display:block; clear:both; content:'';} .prd_basic.col_list_pick > li .box .img {display:inline-block; width:130px; height:130px; vertical-align:middle;} /* 20231018 픽업매장 탭 추가 수정 padding:0 40px 0 20px; */ .prd_basic.col_list_pick > li .box .info {display:inline-block; width:calc(100% - 130px); padding:0 30px 0 20px; text-align:left; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; vertical-align:top;} .prd_basic.col_list_pick > li .box .name {padding:0 0 0 0;} .prd_basic.col_list_pick > li .box .name * {font-size:1.143rem; line-height:24px;} .prd_basic.col_list_pick > li .box .sum {overflow:hidden; white-space:nowrap; height:1.5rem; text-overflow:ellipsis;} .prd_basic.col_list_pick .box .type {margin-top:1.357rem; padding-top:0;} .prd_basic.col_list_pick .box .type span {color:#FD5000;} .prd_basic.col_list_pick .box .addr {display:inline-block; color:#999;} .prd_basic.col_list_pick .box .map {position:absolute; right:0; top:2px; z-index:28;} .prd_basic.col_list_pick .box .map a {display:block; width:1.714rem; height:2.071rem; background:url('/_skin/bona/img/etc/map_pin_default.png') no-repeat center/1.714rem;} /* 20231018 픽업매장 탭 추가 */ .prd_basic.col_list_pick > li .box .ev {display:flex; align-items: flex-start; gap:4px; margin-top: 16px; color:#111;} .prd_basic.col_list_pick > li .box .ev .blit {padding: 2px 4px; background:#fd5000; border-radius:4px; font-size:10px; color:#fff;} .prd_basic.col_list_pick .box .map_ev {position:absolute; right:0; top:2px; z-index:28;} .prd_basic.col_list_pick .box .map_ev a {display:block; width:1.714rem; height:2.071rem; background:url('/_skin/bona/img/etc/map_type2.png') no-repeat center/1.714rem;} /* 맛집공유 페이지 */ .prd_basic .box .funding_state {display:inline-block; margin-bottom:10px; padding:3px 6px; border:1px solid #FD5000; border-radius:2px; color:#FD5000; font-size:0.857rem;} .prd_basic .box .funding_before {background:#FD5000; color:#fff;} .prd_basic .box .funding_end {border-color:#707070; background:#fff; color:#707070;} /* .prd_basic .box .share_info {padding-bottom:2px; color:#999; font-size:1rem; letter-spacing:-0.35px;} .prd_basic .box .share_info > span {color:#FD5000; font-size:1rem; letter-spacing:-0.35px;} .prd_basic.col_list_pick > li .share_box .name {margin-bottom:4px;} .prd_basic.col_list_pick > li .share_box .sum {margin-bottom:10px;} .prd_basic.col_list_pick > li .share_box .info {padding-right:60px;} */ /*-----------------------------------------------------------------*/ /* 3. Layout /*-----------------------------------------------------------------*/ /* 픽업지 소개 */ .pickup_info {position:fixed !important; top:100%; left:50%; z-index:99; overflow-y:auto; -webkit-transform:all 0.5s ease; -moz-transform:all 0.5s ease; -ms-transform:all 0.5s ease; transition:all 0.5s ease; padding-bottom:100px;} #_pickup_store_detail_make_layer.on .pickup_info{top:0; -webkit-transform:all 0.5s ease; -moz-transform:all 0.5s ease; -ms-transform:all 0.5s ease; transition:all 0.5s ease;} .pickup_info.share_link {top:0;} .pickup_info h2 {padding:2rem 0 0.071rem; font-size:1.286rem; font-weight:700; text-align:center;} .pickup_info h2 + p {margin-bottom:1.143rem; color:#999999; text-align:center; letter-spacing:-0.14px;} .pickup_info h2 + p span {color:#FD5000; letter-spacing:-0.14px;} .pickup_info .mange_info {/*margin-bottom:1.000rem; */ margin-bottom:1.143rem; padding:1.857rem 2.143rem 1.857rem; border-radius:6px; background:#F8F8F8;} .pickup_info .mange_info h3 {margin-bottom:1.143rem; color:#333; font-size:1.286rem; letter-spacing:-0.18px;} .pickup_info .mange_info .info {color:#333; font-size:1.071rem; letter-spacing:-0.15px;} .pickup_info .pickup_img img {width:100%;} .pickup_info .info_wrap1 {margin-bottom:2.5rem;} /* 수정 230803 - 여백조정 */ .pickup_info ul li {position:relative; min-height:21px; margin-bottom:5px; padding-left:9.286rem; font-size:0;} .pickup_info ul li > * {display:block; vertical-align:top;} .pickup_info ul li .wrap {margin-bottom:20px; font-size:1.071rem;} .pickup_info ul li span {display:inline-block; position:absolute; top:0; left:0; width:9.286rem; padding-left:2.4em; background:url('/_skin/bona/img/etc/icon_hours.png')no-repeat 0.2rem center/1.4rem; color:#999999; font-size:1.071rem; letter-spacing:-0.16px;}/* 수정 230803 - 아이콘사이즈조정 */ .pickup_info ul li.addr span {background:url('/_skin/bona/img/etc/icon_address.png')no-repeat left center/1.2rem; font-size:1.143rem; font-weight:600; letter-spacing:-0.16px;} /* 수정 230803 - 아이콘사이즈조정 */ .pickup_info ul li.addr p {color:#333; font-size:1.143rem; font-weight:600; letter-spacing:-0.16px;} .pickup_info ul li.tel span {background:url('/_skin/bona/img/etc/icon_phone.png')no-repeat left center/1.4rem;} /* 수정 230803 - 아이콘사이즈조정 */ .pickup_info ul li.tel p {text-decoration:underline;} .pickup_info ul li.time span {background:url('/_skin/bona/img/etc/icon_hours.png')no-repeat left center/1.4rem;} /* 수정 230803 - 아이콘사이즈조정 */ .pickup_info ul li p {/*width:calc(100% - 9.286rem);*/ width:100%; color:#333; font-size:1.071rem; letter-spacing:-0.16px;} /* 수정 230803 - 사이즈조정 */ .pickup_info ul li .wrap p {width:100%;} .pickup_info ul li p span {width:auto; padding-left:0;} .pickup_info .service {margin-bottom:5.714rem; font-size:1.286rem; font-weight:600;} .pickup_info .service h3 {margin-bottom:0.500rem; font-size:1.286rem; font-weight:600;} .pickup_info .service ul {margin-bottom:2.143rem; font-size:0;} .pickup_info .service ul li {display:inline-block; margin-right:2.286rem; padding-left:0;} .pickup_info .service ul li:last-child {margin-right:0;} .pickup_info .service ul li img {width:3.429rem; vertical-align:bottom;} .pickup_info .service .img {margin-bottom:2.143rem;} .pickup_info .service .img img {display:block; width:100%; margin-bottom:10px;} .pickup_info .service .img img:nth-child(n+3) {display:none;} .pickup_info .service .text {display:none;} .pickup_info .service .text .img_wrapper img {width:100%;} .pickup_info .service .box_btn.more_btn {padding-bottom:8.000rem; text-align:center;} .pickup_info .service .box_btn.more_btn > * {display:inline-block; width:14.286rem; height:2.857rem; padding:0; border:0; border-radius:2.857rem; background:#FD5000; font-size:1.071rem; font-weight:500; line-height:2.857rem; box-shadow:0px 0.714rem 0.714rem #8585851A;} .pickup_info .service .box_btn.more_btn * * {display:inline-block; padding-right:1.357rem; border:0; background:url('/_skin/bona/img/common/toggle_down.png')no-repeat right center/1.286rem; color:#fff; font-size:1.071rem; font-weight:500; line-height:2.857rem;} .pickup_info .add_sum {display:none; margin-bottom:5.714rem; font-size:1.286rem; font-weight:600;} .pickup_info .add_sum h3 {margin-bottom:0.500rem; font-size:1.286rem; font-weight:600;} .pickup_info .add_sum img {width:100%;} .pickup_info .add_sum2.slide .swiper-container {padding:0 6.25%;} .pickup_info .add_sum2.slide h3 {margin-bottom:0.786rem; padding:0 6.25%; font-size:1.286rem; font-weight:600;} .pickup_info .add_sum2.slide h3 a {display:inline-block; float:right; margin-top:0.286rem; text-decoration:underline; font-weight:500;} .pickup_info .box_btn.more_btn {padding-bottom:2.5rem; text-align:center;} /* 수정 230803 - 여백조정 */ .pickup_info .box_btn.more_btn > * {display:inline-block; width:100%; height:3.571rem; padding:0; border:0; border-radius:0.286rem; border:1px solid #707070; background:#fff; color:#333333 !important; font-size:1.071rem; font-weight:600; line-height:3.571rem;} .pickup_info .pick_button {position:fixed; bottom:-100%; left:50%; z-index:55; width:640px; -webkit-transform:all 0.5s ease; -moz-transform:all 0.5s ease; -ms-transform:all 0.5s ease; transition:all 0.5s ease;} #_pickup_store_detail_make_layer.on .pickup_info .pick_button {bottom:0;} .pickup_info .pick_button * {display:block; width:100%; height:4.286rem; background:#FD5000; color:#fff; font-size:1.143rem; text-align:center; letter-spacing:-0.32px; line-height:4.286rem; cursor:pointer;} .pickup_info .pickup_img {overflow:hidden; position:relative; width:100%; height:25.714rem;} .pickup_info .pickup_img img {position:absolute; top:50%; left:50%; width:100%; transform:translate(-50%,-50%);} .pbig_section {margin-bottom:7.5rem;} /* 수정 230803 - rem변경 */ .pbig_section .sort {position:relative;} .pbig_section .sort p {padding:0.643rem 0 0; color:#ABABAB; font-size:1rem;} .pbig_section .sort p span {color:#FD5000; font-size:1rem; font-weight:600;} .pbig_section .sort select {position:absolute; top:1.214rem; right:0; padding-right:2.214rem; border:0; background:url('/_skin/bona/img/shop/select_down_black.png')no-repeat right center/0.786rem; color:#ABABAB; font-size:1rem;} .pbig_section .btn_bottom2 {position:fixed; bottom:0; left:50%; z-index:66; width:640px;} .pbig_section .btn_bottom2 span * {height:4.286rem; padding:0; border:0; border-radius:0; background:#FD5000; color:#fff !important; font-size:1.143rem; line-height:4.286rem;} /*-----------------------------------------------------------------*/ /* 3-1. wrapper /*-----------------------------------------------------------------*/ #skin_main_index_big_div {max-width:1280px; margin:0 auto;} .pc_side {position:fixed; top:30px; left:16%; width:560px;} .pc_side img {width:300px;} .total_wrap {opacity:0; position:absolute; top:0; left:50%; width:640px; min-height:100vh; background:#fff; box-shadow:0px 0.714rem 2.143rem #0000000D;} .total_wrap.on {opacity:1;} #cnt {min-height:calc(100vh - 340px);} /* .wrap_inner {padding:4.68% 6.25%;} dev 컨텐츠 사이즈 */ .wrap_inner {padding:0 6.25% 4.68%;} .wrap_inner2 {padding:0 6.25%;} body {background:#EFECEA url('/_skin/bona/img/common/main_bg.png')no-repeat center bottom/1920px; background-attachment:fixed; -webkit-transition:visibility 0.5s, opacity 0.5s; -moz-transition:visibility 0.5s, opacity 0.5s; transition:visibility 0.5s, opacity 0.5s;} body.on {opacity:1;} body.view_nav {overflow:hidden;} body.view_nav #dimmed {display:block;} select {padding:0 2.214rem 0 1.071rem; background:url('/_skin/bona/img/shop/select_down_black.png')no-repeat right 0.714rem center/0.786rem; color:#ABABAB; font-size:1rem;} /*-----------------------------------------------------------------*/ /* 3-2. header /*-----------------------------------------------------------------*/ header {position:relative; max-width:640px; height:4.286rem;} header .gnb {position:relative; z-index:30; width:640px; height:4.286rem; transform:all 0.3s ease; -webkit-transform:all 0.3s ease; -moz-transform:all 0.3s ease;-ms-transform:all 0.3s ease; transition:all .15s ease;} header .gnb.fixed {position:fixed; left:50%; top:0; width:100%; max-width:640px; background-color:#fff;} header.nav .gnb.fixed {z-index:1;} header .gnb .gnb_wrap {position:relative; max-width:1350px; margin:0 auto; padding:0 4.16%; font-size:0; text-align:left;} header.type4 .gnb .gnb_wrap header .gnb h1 {display:none; padding:0.857rem 0;} header .gnb span a {display:inline-block; position:absolute; top:0; height:4.286rem;} header .gnb .back a {left:2.143rem; width:1.429rem; background:url('/_skin/bona/img/common/hd_back.png')no-repeat center/1.429rem; cursor:pointer;} header .gnb .home a {display:inline-block; left:70px; width:1.571rem; background:url('/_skin/bona/img/common/hd_btn_home.png')no-repeat center/1.571rem; cursor:pointer;} header.type3 .gnb .home a {display:inline-block; left:2.143rem;} header .gnb .home_addr {overflow:hidden; white-space:nowrap; text-overflow:ellipsis; position:absolute; top:1.429rem; right:4.16%; max-width:9.714rem; padding:0 1.429rem 0 1.571rem; background:url('/_skin/bona/img/common/hd_toggle_down_black.png')no-repeat right center/1.071rem; color:#000; font-size:1.071rem; font-weight:500; cursor:pointer;} header .gnb .home_addr:before {position:absolute; left:0; top:0.071rem; width:1.214rem; height:1.214rem; background:url('/_skin/bona/img/common/hd_location_black.png')no-repeat left top/1.071rem; content:'';} header .gnb .m_search {display:none; position:absolute; top:1.071rem; right:4.16%; width:2.143rem; height:2.14rem; background:url('/_skin/bona/img/common/hd_search.png')no-repeat center/ 1.429rem;} header .gnb .bell {display:none; position:absolute; top:1.071rem; right:31.5%; width:2.143rem; height:2.14rem; background:url('/_skin/bona/img/common/hd_bell_black.png')no-repeat center/ 1.429rem; cursor:pointer;} header .gnb .bellx {display:none; position:absolute; top:1.071rem; right:31.5%; width:2.143rem; height:2.14rem; background:url('/_skin/bona/img/common/hd_bell_orange.png')no-repeat center/ 1.429rem; cursor:pointer;} header .bigsection {position:fixed; top:0; left:50%; z-index:100; max-width:640px; width:100%; background:#fff; text-align:center; box-shadow:0px 3px 16px #00000008;} header .bigsection .title {position:relative; max-width:640px; background:#fff;} header .title h2 {overflow:hidden; text-overflow:ellipsis; white-space:nowrap; position:absolute; left:50%; top:0; margin-left:-150px; z-index:60; max-width:300px; width:300px; height:60px; font-size:1.429rem; text-align:center; line-height:4.286rem;} header .title h2 span {display:inline-block; height:4.286rem; padding-right:1.286rem; background:url('/_skin/bona/img/shop/hd_toggle_down_black.png')no-repeat right center/1.071rem; font-size:1.429rem; text-align:center; line-height:4.286rem; cursor:pointer;} header .title.open h2 span {background:url('/_skin/bona/img/shop/hd_toggle_down_up.png')no-repeat right center/1.071rem;} header .title ul {display:none; position:absolute; left:0; top:4.286rem; z-index:60; width:640px; margin-top:-0.214rem; padding-bottom:1.500rem; background:#fff; text-align:center;} header .title.open ul {display:block;} header .title ul li a {display:block; padding:0.964rem; font-size:1.429rem; font-weight:700;} header .title .bg {display:none; position:fixed; left:0; top:0; z-index:-10; height:100vh; width:1000%;} /* 메인전용 css */ header.main {position:fixed; top:0; left:50%; z-index:70; max-width:640px; width:100%; background:none;} header.main .gnb h1 {display:inline-block; padding:0.857rem 0;} header.main .gnb h1 a {display:inline-block; width:5.571rem; height:2.286rem; background:url('/_skin/bona/img/logo/main_logo.png')no-repeat center/5.571rem; color:#B9005B; font-size:24px;} header.main .gnb .back a {display:none;} header.main .gnb .home a {display:none;} header.main .gnb.fixed h1 a {background:url('/_skin/bona/img/logo/logo.png')no-repeat center/5.571rem;} header.main .gnb .home_addr {display:inline-block; background:url('/_skin/bona/img/common/hd_toggle_down.png')no-repeat right center/1.071rem; color:#fff; font-size:1.071rem;} header.main .gnb .home_addr:before {position:absolute; left:0; top:0.071rem; width:1.214rem; height:1.214rem; background:url('/_skin/bona/img/common/hd_location.png')no-repeat left/1.214rem; content:'';} header.main .gnb .m_search {background:url('/_skin/bona/img/common/hd_search_fff.png')no-repeat center/ 1.429rem;} header.main .gnb .bell {background:url('/_skin/bona/img/common/hd_bell_white.png')no-repeat center/ 1.429rem;} header.main .gnb .bellx {background:url('/_skin/bona/img/common/hd_bell_orange.png')no-repeat center/ 1.429rem;} header.main .gnb.fixed .home_addr {background:url('/_skin/bona/img/common/hd_toggle_down_black.png')no-repeat right center/1.071rem; color:#000;} header.main .gnb.fixed .home_addr:before {position:absolute; left:0; top:0.071rem; width:1.214rem; height:1.214rem; background:url('/_skin/bona/img/common/hd_location_black.png')no-repeat left/1.214rem; content:'';} header.main .gnb.fixed .m_search {display:none; position:absolute; top:1.071rem; right:4.16%; width:2.143rem; height:2.14rem; background:url('/_skin/bona/img/common/hd_search.png')no-repeat center/ 1.429rem;} header.main .gnb.fixed .bell {display:none; position:absolute; top:1.071rem; right:31.5%; width:2.143rem; height:2.14rem; background:url('/_skin/bona/img/common/hd_bell_black.png')no-repeat center/ 1.429rem; cursor:pointer;} header.main .gnb.fixed .bellx {display:none; position:absolute; top:1.071rem; right:31.5%; width:2.143rem; height:2.14rem; background:url('/_skin/bona/img/common/hd_bell_orange.png')no-repeat center/ 1.429rem; cursor:pointer;} /* 헤더 타입1 css */ header.type1 .gnb .home a {display:inline-block;} header.type1 .gnb .home_addr {display:none;} /* 헤더 타입2 css */ header.type2 .gnb .home_addr {display:none;} /* 헤더 리스트 css */ header.big_section .title h2 {display:inline-block; width:auto; margin-left:0; transform:translate(-50%,0);} /* 마이페이지 전용 css */ header.mypage .gnb {background:#FD5000;} header.mypage .gnb.fixed {background:#fff;} header.mypage .gnb .home_addr {display:none;} header.mypage .subtitle {color:#fff;} header.mypage .gnb .back a {background:url('/_skin/bona/img/common/hd_back_white.png')no-repeat center/1.429rem;} header.mypage .gnb.fixed .back a {background:url('/_skin/bona/img/common/hd_back.png')no-repeat center/1.429rem;} header.mypage .gnb .home a {background:url('/_skin/bona/img/common/hd_btn_home_w.png')no-repeat center/1.571rem;} header.mypage .gnb.fixed .home a {background:url('/_skin/bona/img/common/hd_btn_home.png')no-repeat center/1.571rem;} header.mypage .gnb.fixed .subtitle {color:#333;} header.mypage .gnb .m_search {background:url('/_skin/bona/img/common/hd_search_fff.png')no-repeat center/ 1.429rem;} header.mypage .gnb.fixed .m_search {display:none; position:absolute; top:1.071rem; right:4.16%; width:2.143rem; height:2.14rem; background:url('/_skin/bona/img/common/hd_search.png')no-repeat center/ 1.429rem;} .my_menu.mypage dl.sub {display:none;} header.mypage .gnb .bell {background:url('/_skin/bona/img/common/hd_bell_white.png')no-repeat center/ 1.429rem;} header.mypage .gnb .bellx {background:url('/_skin/bona/img/common/hd_bell_orange.png')no-repeat center/ 1.429rem;} header.mypage .gnb.fixed .bell {display:none; position:absolute; top:1.071rem; right:31.5%; width:2.143rem; height:2.14rem; background:url('/_skin/bona/img/common/hd_bell_black.png')no-repeat center/ 1.429rem; cursor:pointer;} header.mypage .gnb.fixed .bellx {display:none; position:absolute; top:1.071rem; right:31.5%; width:2.143rem; height:2.14rem; background:url('/_skin/bona/img/common/hd_bell_orange.png')no-repeat center/ 1.429rem; cursor:pointer;} header.mypage .gnb .home_addr {display:none;} header.mypage .gnb .bell {display:inline-block;} header.mypage .gnb .bellx {display:inline-block;} /* 판매자 마이페이지 전용 css */ header.sell {max-width:640px; background:#FD5000;} header.sell .gnb {display:none; background:#FD5000;} header.sell .gnb .home_addr {display:none;} header.sell .subtitle {color:#fff;} header.sell .gnb .back a {background:url('/_skin/bona/img/common/hd_back_white.png')no-repeat center/1.429rem;} header.sell .gnb.fixed .back a {background:url('/_skin/bona/img/common/hd_back.png')no-repeat center/1.429rem;} header.sell .gnb .home a {background:url('/_skin/bona/img/common/hd_btn_home_w.png')no-repeat center/1.571rem;} header.sell .gnb.fixed .home a {background:url('/_skin/bona/img/common/hd_btn_home.png')no-repeat center/1.571rem;} header.sell .gnb.fixed .subtitle {color:#333;} header.sell .gnb .home_addr {display:none;} .fake_header .gnb_wrap {position:relative; z-index:66; max-width:1350px; margin:0 auto; padding:0 4.16%; font-size:0; text-align:left;} .fake_header h1 {display:none; padding:0.857rem 0;} .fake_header span a {display:inline-block; position:absolute; top:0; height:4.286rem;} .fake_header .back a {left:2.143rem; width:1.429rem; background:url('/_skin/bona/img/common/hd_back.png')no-repeat center/1.429rem; cursor:pointer;} .fake_header.type1 .back a {background-image:url('/_skin/bona/img/common/hd_back_white.png');} .fake_header .home a {display:none; left:70px; width:1.571rem; background:url('/_skin/bona/img/common/hd_btn_home.png')no-repeat center/1.571rem; cursor:pointer;} .fake_header.type2 .home a {display:inline-block;} .fake_header .home_addr {position:absolute; top:1.429rem; right:4.16%; z-index:66; padding:0 1.429rem 0 1.571rem; background:url('/_skin/bona/img/common/hd_toggle_down_black.png')no-repeat right center/1.071rem; color:#000; font-size:1.071rem; font-weight:500; cursor:pointer;} .fake_header .home_addr:before {position:absolute; left:0; top:0.071rem; width:1.214rem; height:1.214rem; background:url('/_skin/bona/img/common/hd_location_black.png')no-repeat left top/1.071rem; content:'';} .box_search {position:fixed !important; top:181px; left:50%; z-index:40; width:640px; height:100%; padding:0 20px; margin-left:-640px; opacity:1; visibility:visible; position:relative; transition:all .2s;} .box_search h1 {margin-bottom:24px;} .box_search form {display: inline-block; transition:all .4s;} .box_search form .box {overflow:hidden; position:relative; width:25.000rem; min-height:3.571rem; margin-bottom:35px; border-radius:6px; background:#fff; border-bottom:1px solid #fff; color:#fff; text-align:left;} .box_search form .box .basic_search {overflow:hidden; white-space:nowrap; text-overflow:ellipsis; width:100%; padding-right:2.857rem; border:0; background:transparent; font-size:16px; color:#000;} .box_search form .box .btn {position:absolute; top:1.071rem; right:0.786rem; width:1.429rem; height:1.429rem;} .box_search form .box .btn:after {position:absolute; top:0; right:0; width:30px; height:30px; background:url('/_skin/bona/img/common/btn_fff.png')no-repeat center;} .box_search.active {opacity:1; visibility:visible;} .box_search.active form {width:100%; height:100%; text-align:left;} .box_search .keyword h3 {margin-bottom:10px; font-weight:500;} .box_search .keyword ul {width:calc(100% + 16px); margin-left:-16px; margin-bottom:4px; font-size:0;} .box_search .keyword ul li {display:inline-block; margin:0 0 5px 16px;} .box_search .keyword ul li a {display:inline-block; height:34px; padding:0 5px 0 33px; background:#F5F5F5 url('/_skin/bona/img/common/hd_search_tag.png')no-repeat left 8px center/24px; line-height:34px;} .box_search .keyword {width:460px; font-size:0;} .box_search .keyword li {display:inline-block; margin:0 0.357rem 0.714rem 0;} .box_search .keyword li a {display:block; height:2.714rem; padding:0 15px; border-radius:38px; background:#F8F8F8; color:#111; font-size:1.071rem; line-height:2.714rem;} .box_search .close {display:none; position:relative; width:3.571rem; height:3.571rem; color:#fff; text-align:center; cursor:pointer;} .box_search .close:after {position:absolute; top:50%; left:50%; width:20px; height:2px; margin-left:-10px; background:#000; content:''; transform:rotate(45deg);} .box_search .close:before {position:absolute; top:50%; left:50%; width:20px; height:2px; margin-left:-10px; background:#000; content:''; transform:rotate(135deg);} .bottom_nav {position:fixed; bottom:-90px; left:50%; z-index:70; max-width:640px; width:100%; height:4.286rem; transform:all 0.3s ease; -webkit-transform:all 0.3s ease; -moz-transform:all 0.3s ease;-ms-transform:all 0.3s ease; transition:all .15s ease;} .bottom_nav.on {bottom:0;} .bottom_nav.off {display:none !important;} .bottom_nav.none {display:none !important;} .bottom_nav ul {font-size:0; background:url('/_skin/bona/img/common/ft_bg02.png')no-repeat center/auto 100%;} .bottom_nav ul li {display:inline-block; width:20%; height:4.286rem; background:#fff; vertical-align:top;} .bottom_nav ul li a {display:block; width:100%; height:4.286rem; padding-top:2.714rem; color:#111; font-size:0.929rem; font-weight:500; text-align:center; letter-spacing:-0.5px;} .bottom_nav ul li.cate a {background:url('/_skin/bona/img/common/ft_menu.png')no-repeat center top 1.143em/1.429rem;} .bottom_nav ul li.ref_prd {background:none;} .bottom_nav ul li.ref_prd a {background:url('/_skin/bona/img/common/ft_recently.png')no-repeat center top 0.857rem/1.714rem;} .bottom_nav ul li.home {position:relative; background:none;} .bottom_nav ul li.home a {position:absolute; top:10%; left:50%; background:url('/_skin/bona/img/common/ft_home.png')no-repeat center top/3.929rem; transform:translate(-50%,-50%);} .bottom_nav ul li.mypage {background:none;} .bottom_nav ul li.mypage a {background:url('/_skin/bona/img/common/ft_my.png')no-repeat center top 0.857rem/1.643rem;} .bottom_nav ul li.cart a {background:url('/_skin/bona/img/common/ft_cart.png')no-repeat center top 0.857rem/1.429rem auto;} #map_api {overflow-y:auto; position:fixed; top:100%; left:50%; z-index:99; max-width:640px; width:100%; height:calc(100vh - 5.714rem); border-radius:1.429rem 1.429rem 0 0; background:#fff; transition:all 0.3s ease; -webkit-transform:all 0.3s ease;. -moz-transform:all 0.3s ease;} #map_api.open {top:5.714rem;} #map_api .close {display:block; position:relative; height:2.019rem; padding:1.000rem 0; text-align:center; cursor:pointer;} #map_api .close span {display:inline-block; position:absolute; top:2.857rem; right:2.857rem; z-index:55; width:1.214rem; height:1.214rem; border-radius:0.357rem; background:url('/_skin/bona/img/etc/bg_close.png')no-repeat center/1.214rem;} #map_api h3 {padding:2.071rem 0 1.714rem; border:0; background:#fff; color:#333; font-size:1.429rem; text-align:center;} #map_api .step1 {position:relative; height:calc(100% - 2.357rem); background:#F9F9F9;} #map_api .step1.next {display:none;} #map_api .step1 .addr_search {padding:0 9.375% 3.286rem; border:0; background:#fff;} #map_api .step1 .addr_search .find_addr {width:100%; height:3.571rem; margin-bottom:1.786rem; border:0; background:#F9F9F9 url('/_skin/bona/img/common/hd_search.png')no-repeat right 0.714rem center/1.500rem; cursor:pointer;} #map_api .step1 .addr_search span {display:inline-block; height:1.214rem; padding-left:1.500rem; background:url('/_skin/bona/img/common/icon_location_current.png')no-repeat left center/1.214rem; font-size:1.214rem; font-weight:500; line-height:1.214rem; cursor:pointer;} #map_api .step1 .addr_detail {height:0; opacity:0;} #map_api .step1 .addr_list {overflow-y:auto; max-height:54vh; padding:2.000rem 9.375%; background:#F9F9F9;} #map_api .step1 .addr_list li {position:relative; margin:2.000rem 0; padding:0 0 0 2.714rem; background:url('/_skin/bona/img/common/icon_location_etc.png')no-repeat left center/1.429rem;} #map_api .step1 .addr_list li.Y {background:url('/_skin/bona/img/common/icon_location_etc_s.png')no-repeat left center/1.429rem;} #map_api .step1 .addr_list li.H {background:url('/_skin/bona/img/common/icon_location_home.png')no-repeat left center/1.643rem;} #map_api .step1 .addr_list li.H.Y {background:url('/_skin/bona/img/common/icon_location_home_s.png')no-repeat left center/1.643rem;} #map_api .step1 .addr_list li.C {background:url('/_skin/bona/img/common/icon_location_company.png')no-repeat left center/1.429rem;} #map_api .step1 .addr_list li.C.Y {background:url('/_skin/bona/img/common/icon_location_company_s.png')no-repeat left center/1.429rem;} #map_api .step1 .addr_list li h4 {margin-bottom:0.429rem;} #map_api .step1 .addr_list li h4 span.name {display:inline-block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:58%; font-size:1.143rem; font-weight:600;} #map_api .step1 .addr_list li.Y h4 span.name {color:#FD5000;} #map_api .step1 .addr_list li h4 span.selected {display:inline-block; height:1.571rem; margin:-0.071rem 0 0 0.571rem; padding:0 0.500rem 0 1.286rem; border-radius:0.214rem; background:#FD5000 url('/_skin/bona/img/common/basic_check.png')no-repeat left 0.214rem top 0.500rem/0.857rem; color:#fff; font-size:0.857rem; line-height:1.571rem; vertical-align:top;} #map_api .step1 .addr_list li p {color:#999; font-size:1.071rem;} #map_api .step1 .addr_list li .btn {position:absolute; top:0; right:0;} #map_api .step1 .addr_list li .btn a {display:inline-block; margin-left:0.857rem; color:#999; font-size:0.929rem;} #map_api .step1 .find_addr.bottom {display:block; position:absolute; left:50%; bottom:3.571rem; width:37.143rem; height:3.286rem; margin-left:-18.571rem; padding:0 1.429rem; border:0; border-radius:0.286rem; background:#FD5000; color:#fff; font-size:1.071rem; font-weight:600; line-height:3.286rem; text-align:center; cursor:pointer;} /* 수정 20230801 */ @media only screen and (max-width:440px) { #map_api.open {top:5.714rem; background:#F9F9F9;} #map_api .close {background:#fff;} #map_api .step1 .find_addr.bottom {left:0; width:100%; width:-webkit-fill-available; margin:0 1.429rem;} } #map_api .step2 {display:none; padding:0 9.375%;} #map_api .step2.next {display:block;} #map_api .step2 .selected_addr {margin-bottom:0.714rem;} #map_api .step2 .selected_addr input[type=text] {width:calc(100% - 5.500rem); height:3.571rem; padding:0 1.429rem; border:0; border-radius:0.286rem; background:#F9F9F9;} #map_api .step2 .selected_addr input[type=button] {width:4.571rem; height:3.571rem; margin-left:0.429rem; padding-left:1.500rem; border:0; border-radius:0.286rem; border:0; background:url('/_skin/bona/img/common/hd_search.png')no-repeat left center; font-size:1.071rem; font-weight:600;} #map_api .step2 .selected_addr_detail input[type=text] {width:100%; height:3.571rem; padding:0 1.429rem; border:0; border-radius:0.286rem; background:#F9F9F9;} #map_api .step2 .selected_addr_detail label {font-size:1.071rem;} #map_api .step2 .point {font-size:0; text-align:center;} #map_api .step2 .point li {display:inline-block;} #map_api .step2 .point input {display:none;} #map_api .step2 .point li label {display:inline-block; width:8.571rem; height:8.571rem; padding:4.429rem 0 0; background:url('/_skin/bona/img/common/icon_location_etc.png')no-repeat center top 2.571rem; color:#333; font-size:1.000rem; opacity:0.5;} #map_api .step2 .point li.home label {background:url('/_skin/bona/img/common/icon_location_home.png')no-repeat center top 2.857rem;} #map_api .step2 .point li.company label {background:url('/_skin/bona/img/common/icon_location_company.png')no-repeat center top 2.857rem;} #map_api .step2 .point li input[type=radio]:checked + label {opacity:1;} #map_api .step2 .nickname {margin-bottom:3.571rem;} #map_api .step2 .nickname input {width:100%; height:3.571rem; padding:0 1.429rem; border:0; border-radius:0.286rem; background:#F9F9F9;} #map_api .step2 .save * {display:block; width:100%; height:3.286rem; padding:0 1.429rem; border:0; border-radius:0.286rem; background:#FD5000; color:#fff; font-size:1.071rem; line-height:3.286rem; text-align:center;} .map_bg {position:fixed; top:0; left:50%; z-index:98; width:640px; height:100vh; background:rgba(0,0,0,0.5); cursor:pointer;} #map_api2 {overflow-y:auto; position:fixed; top:100%; left:50%; z-index:99; max-width:640px; height:calc(100vh - 5.714rem); border-radius:1.429rem 1.429rem 0 0; background:#fff; transition:all 0.3s ease; -webkit-transform:all 0.3s ease;. -moz-transform:all 0.3s ease;} #map_api2.add {max-width:640px; width:100%; height:100vh;} #map_api2 h3 {padding:2.071rem 0 1.714rem; background:#fff; color:#333; font-size:1.429rem; text-align:center;} #map_api2.open {top:5.714rem;} #map_api2 .close {display:block; position:relative; height:2.019rem; padding:1.000rem 0; text-align:center; cursor:pointer;} #map_api2 .close span {display:inline-block; position:absolute; top:2.857rem; right:2.857rem; z-index:55; width:1.214rem; height:1.214rem; border-radius:0.357rem; background:url('/_skin/bona/img/etc/bg_close.png')no-repeat center/1.214rem;} #map_api2 .step2 {padding:0 9.375%;} #map_api2 .step2.next {display:block;} #map_api2 .step2 .selected_addr {margin-bottom:0.714rem} #map_api2 .step2 .selected_addr input[type=text] {width:calc(100% - 5.500rem); height:3.571rem; padding:0 1.429rem; border:0; border-radius:0.286rem; background:#F9F9F9;} #map_api2 .step2 .selected_addr input[type=text].edit {width:100%;} #map_api2 .step2 .selected_addr input[type=button] {width:4.571rem; height:3.571rem; margin-left:0.429rem; padding-left:1.500rem; border:0; border-radius:0.286rem; border:0; background:url('/_skin/bona/img/common/hd_search.png')no-repeat left center/1.429rem; font-size:1.071rem; font-weight:600;} #map_api2 .step2 .selected_addr_detail input[type=text] {width:100%; height:3.571rem; padding:0 1.429rem; border:0; border-radius:0.286rem; background:#F9F9F9;} #map_api2 .step2 .selected_addr_detail label {font-size:1.071rem; cursor:pointer;} #map_api2 .step2 .selected_addr_detail input {margin-bottom:0.714rem;} #map_api2 .step2 .point {font-size:0; text-align:center;} #map_api2 .step2 .point li {display:inline-block;} #map_api2 .step2 .point input {display:none;} #map_api2 .step2 .point li label {display:inline-block; width:8.571rem; height:8.571rem; padding:4.429rem 0 0; background:url('/_skin/bona/img/common/icon_location_etc.png')no-repeat center top 2.571rem; color:#333; font-size:1rem; opacity:0.5;} #map_api2 .step2 .point li.home label {background:url('/_skin/bona/img/common/icon_location_home.png')no-repeat center top 2.857rem;} #map_api2 .step2 .point li.company label {background:url('/_skin/bona/img/common/icon_location_company.png')no-repeat center top 2.857rem;} #map_api2 .step2 .point li input[type=radio]:checked + label {opacity:1;} #map_api2 .step2 .nickname {margin-bottom:3.571rem;} #map_api2 .step2 .nickname input {width:100%; height:3.571rem; padding:0 1.429rem; border:0; border-radius:0.286rem; background:#F9F9F9;} #map_api2 .step2 .save * {display:block; width:100%; height:3.286rem; padding:0 1.429rem; border:0; border-radius:0.286rem; background:#FD5000; color:#fff; font-size:15px; line-height:3.286rem; text-align:center;} #map_api2 .back * {cursor:pointer; height:3.286rem; font-weight:400; line-height:3.286rem;} /* 주소선택 */ /*-----------------------------------------------------------------*/ /* 3-3. nav /*-----------------------------------------------------------------*/ nav {visibility:hidden; overflow:auto; position:fixed; top:0; z-index:20; width:227px; height:100%; transition:all 0.3s ease; -webkit-overflow-scrolling:touch;} nav.lnb {left:-227px; background:#fff; background:-webkit-linear-gradient(right, #fff 97% , #ddd 100%); background:-o-linear-gradient(right, #fff 97%, #ddd 100%); background:-moz-linear-gradient(right, #fff 97%, #ddd 100%); background:linear-gradient(to right, #fff 97%, #ddd 100%);} nav.lnb .category {padding-top:50px;} nav.lnb .category:after {display:block; width:20px; height:1px; margin:10px auto; background:#000; content:'';} nav.lnb .category li a {display:block; padding:10px; color:#000; font-size:1.167rem;} nav.lnb .category li.promotion:after {display:block; width:20px; height:1px; margin:10px auto; background:#000; content:'';} nav.lnb .board li a {display:block; padding:10px; color:#000; font-size:1.167rem;} nav.lnb .share {padding:40px 0;} nav.lnb .share li {display:inline; padding:0 5px;} nav.lnb .share li img {width:16px; height:16px;} nav.lnb .close {display:inline-block; position:absolute; right:20px; top:27px; width:14px; height:14px; background:url('/_skin/bona/img/button/close.png') no-repeat center; background-size:cover; text-indent:-9999px;} nav.lnb.is_show {visibility:visible; left:0;} nav.mypage {right:-227px; background:#fff; background:-webkit-linear-gradient(left, #fff 97% , #ddd 100%); background:-o-linear-gradient(left, #fff 97%, #ddd 100%); background:-moz-linear-gradient(left, #fff 97%, #ddd 100%); background:linear-gradient(to left, #fff 97%, #ddd 100%);} nav.mypage .close {display:inline-block; position:absolute; right:20px; top:27px; width:14px; height:14px; background:url('/_skin/bona/img/button/close.png') no-repeat center; background-size:cover; text-indent:-9999px;} nav.mypage.is_show {visibility:visible; right:0;} nav.mypage .login {padding-top:50px;} nav.mypage .login:after {display:block; width:20px; height:1px; margin:10px auto; background:#000; content:'';} nav.mypage .login li a {display:block; padding:10px; color:#000; font-size:1.167rem;} nav.mypage .list li a {display:block; padding:10px; color:#000; font-size:1.167rem;} /*-----------------------------------------------------------------*/ /* 3-4. footer /*-----------------------------------------------------------------*/ footer {padding:1.500rem 2.857rem 7.786rem 2.857rem; background:#F6F6F6; text-align:center;} footer .menu {background:#F6F6F6; font-size:0; text-align:left;} footer .menu li {display:inline-block; margin-right:1.929rem; padding:0.143rem 0;} footer .menu li a {display:inline-block; height:3.571rem; font-size:1rem; line-height:3.571rem; letter-spacing:-0.35px;} footer .share {padding:1.714rem 0 0.714rem;} footer .share li {display:inline; padding:0 0.714rem;} footer .share li img {width:1.143rem; height:1.143rem;} footer .quick {margin-bottom:0.429rem; text-align:left; background:#F6F6F6;} footer .quick div.box {padding-bottom:1px;} footer .quick div.box h3 {height:3.571rem; padding-top:2.071rem; margin-bottom:1.000rem; border-top:1px solid #F0F0F0; font-size:1.143rem; font-weight:700; text-align:left;} footer .quick div.box h3.active {background:url('/_skin/bona/img/common/btn_minus.png')no-repeat right 1.286rem center/1.143rem;} footer .quick div.box .quick_cnt {margin-bottom:0.786rem;} footer .quick div.box #quick_cs {color:#777;} footer .quick div.box #quick_cs strong {display:block; margin-top:-0.357rem; color:#FD5000; font-size:1.714rem; font-weight:600; letter-spacing:-0.6px;} footer .quick div.box #quick_return dd {padding:10px 0 0; color:#888; font-size:1.167rem; letter-spacing:-0.35px;} footer .quick li {padding:0.714rem 0; color:#333; font-size:1rem; letter-spacing:-0.35px;} footer .quick li * {display:inline-block; color:#333; font-size:1rem; letter-spacing:-0.35px;} footer .quick li:first-child {padding-top:0;} footer .quick .bank_name {padding-top:0.714rem; color:#888; font-size:1.167rem; letter-spacing:-0.35px;} /* 20230911 상단 운영시간 수정 */ footer .quick div.box div ul.customer {} footer .quick div.box div ul.customer li h4 {margin:16px 0 8px 0;} footer .quick div.box div ul.customer li p {display:block; margin-bottom:4px;} footer .bottom {margin-bottom:2.071rem; text-align:left;} footer .bottom h3 {display:inline-block; padding-right:1.571rem; background:url('/_skin/bona/img/common/ft_toggle_down.png')no-repeat right center/1.429rem; color:#333; font-size:1.071rem; font-weight:500; text-align:left; cursor:pointer;} footer .bottom h3.active {background:url('/_skin/bona/img/common/ft_toggle_up.png')no-repeat right center/1.429rem;} footer .notice { margin-top: 16px; padding: 8px; border: 1px solid #e6e6e6; border-radius:8px;text-align: left;word-break: break-all;} footer .notice p { margin-bottom: 8px;} footer .notice p:last-child { margin-bottom: 0;} footer .notice .hidden { display: none;} footer .f_logo {margin-bottom:1.071rem; color:#fff; font-size:2.417rem; font-family:'Pretendard',sans-serif; font-weight:600;} footer .sns {font-size:0; text-align:left;} footer .sns li {display:inline-block; margin-right:0.429rem;} footer .sns li img {height:2.429rem;} footer .info, footer .info * {color:#999; font-size:0.929rem; font-style:normal;} footer .info {display:none; margin-bottom:-0.929rem; padding-top:1.143rem;} footer .info span {display:inline-block; position:relative; line-height:1.571rem;} footer .copyright {text-align:left;} footer .copyright, footer .copyright * {color:#999; font-size:0.929rem;} footer .copyright {padding-top:1.714rem;} footer .copyright a strong, footer .copyright a:hover {color:#3fc0e5;} /* 메인전용 css */ footer.main {position:relative; z-index:60;} /* 회원가입 전용 */ footer.join_input {display:none;} .btn_scroll {display:none; position:fixed; right:50%; bottom:1rem; z-index:55; width:3.929rem; margin-right:1.786rem;} .btn_scroll a {display:block; height:3.929rem; background-repeat:no-repeat; background-position:center; background-color:#fff; background-size:3.929rem auto; font-size:0; text-align:center; cursor:pointer;} .btn_scroll a.up {overflow:hidden; border-radius:50%; background:url('/_skin/bona/img/common/btn_scroll_top.png')no-repeat center/1.071rem;} .btn_scroll a.up span {display:block; height:3.929rem; background:#fff; opacity:0.3;} #dimmed {display:none; position:fixed; left:50%; top:0; z-index:80; max-width:640px; width:100%; height:100%; background:rgba(0,0,0,0.5);} /*-----------------------------------------------------------------*/ /* 4. Page /*-----------------------------------------------------------------*/ /* 스토어 편집 */ #shop_edit textarea {max-width:100%; min-width:100%; width:100%; height:10.500rem; padding:12px 20px; border-color:#E9E9E9; line-height:24px; letter-spacing:-0.14px;} #shop_edit iframe {width:100% !important;} #shop_edit > .info {padding:1.643rem 6.25% 1.786rem; border-bottom:0.714rem solid #F9F9F9;} #shop_edit > .info:first-child {padding:1.286rem 6.25% 1.786rem;} #shop_edit > .info h3 {position:relative; margin-bottom:1.214rem; font-size:1.429rem;} #shop_edit > .info.detail h3 {margin-bottom:1.429rem;} #shop_edit .line {font-size:0;} #shop_edit .line .box {display:inline-block; width:100%; font-size:0;} #shop_edit .line .box .wrap {font-size:0;} #shop_edit .line .box .select_wrap {display:inline-block; max-width:calc(100% - 3.786rem); margin-bottom:10px; font-size:0;} #shop_edit .line .box .select {display:inline-block; min-width:11.643rem; width:33.33%; padding-right:0.357rem;} #shop_edit .line .box .select select {width:100%; height:3.286rem; border:1px solid #E9E9E9; border-radius:4px;} #shop_edit .line span {display:inline-block; vertical-align:top;} #shop_edit .line span a {display:inline-block; width:3.786rem; height:3.286rem; padding:0.929rem 0 0 1.500rem; border:1px solid #E9E9E9; background:url('/_skin/bona/img/etc/select_del.png')no-repeat left 0.571rem center/1.000rem;} #shop_edit .menu .btn {padding:0.714rem 0 0;} #shop_edit .menu .btn span {display:block;} #shop_edit .menu .btn span a {display:block; height:3.571rem; border-radius:4px; background:#EEEEEE; color:#333; font-size:1.143rem; text-align:center; line-height:3.571rem;} #shop_edit .input {font-size:0;} #shop_edit .input input {margin-right:0.500rem;} #shop_edit .input label {padding:0 1.071rem 0 0; letter-spacing:-0.14px;} #shop_edit .btn {padding:1.786rem 6.25% 3.143rem;} #shop_edit .btn span {display:block;} #shop_edit .btn * {display:block; width:100%; height:3.571rem; border-radius:4px; border:0; background:#FD5000; color:#fff; font-size:1.071rem; text-align:center; line-height:3.571rem;} #shop_edit .filebox {position:relative;} #shop_edit .filebox .upload-name {display:inline-block; height:40px; padding:0 10px; vertical-align:middle; border:1px solid #dddddd; width:78%; color:#999999;} #shop_edit .filebox label {display:inline-block; position:absolute; top:0; right:0; width:6.071rem; height:3.571rem; color:#FD5000; font-weight:600; cursor:pointer; text-align:center; line-height:3.571rem;} #shop_edit .filebox label:after {position:absolute; top:0.786rem; left:0; width:1px; height:1.857rem; background:#E9E9E9; content:'';} #shop_edit .filebox .fake {width:100%; height:3.571rem; margin-bottom:0.714rem; padding:0 1.071rem; border:1px solid #E9E9E9;} #shop_edit .filebox input[type="file"] {position:absolute; width:0; height:0; padding:0; overflow:hidden; border:0;} #shop_edit .filebox .file_del {position:absolute; top:1.143em; left:1.143em; color:#999; letter-spacing:-0.14px; font-weight:400;} #shop_edit .filebox .file_del b {color:#999; letter-spacing:-0.14px; font-weight:400;} #shop_edit .input-file-button {display:none; padding:6px 25px; background-color:#FF6600; border-radius:4px; color:white; cursor:pointer;} /* 매출 정산 리스트 */ .sales_list {padding-bottom:3.214rem;} .sales_list h3 {padding-bottom:0.714rem; font-size:1.429rem;} .sales_list h4 {padding-bottom:0.929rem; font-size:1.071rem; font-weight:600;} .sales_list .data {margin-bottom:1.571rem; padding:0 6.25% 1.714rem; border-bottom:0.714rem solid #F9F9F9;} .sales_list .date_input {display:inline-block; width:100%; margin-bottom:2.000rem; text-align:left;} .sales_list .date_input div {position:relative; line-height:3.286rem; text-align:left; vertical-align:top;} .sales_list .date_input div > .form_input {display:inline-block; width:47%; height:3.286rem; border-color:#DFDFDF; border-radius:4px;} .sales_list .date_input div > .form_input:nth-child(2) {position:absolute; top:0; right:0;} .sales_list .date_input div:after {position:absolute; top:1.643rem; left:50%; width:0.571rem; height:0.071rem; margin-left:-0.286rem; background:#000; content:'';} .sales_list .date_select select {width:100%; height:3.286rem; margin-bottom:1.429rem; border-radius:4px; color:#333;} .sales_list .date_select .box_btn * {width:100%; height:3.571rem; padding:0; border:1px solid #707070; border-radius:4px; background:#fff; color:#333 !important; font-size:1.071rem; font-weight:600; line-height:3.571rem;} .sales_list .list > li {margin-bottom:0.286rem; border-top:1px solid #E9E9E9;} .sales_list .list .info {padding:1.286rem 0 1.357rem;} .sales_list .list .info p {color:#FD5000; font-size:1.143rem; font-weight:700; letter-spacing:-0.16px;} .sales_list .list .info li {display:inline-block; position:relative; width:100%; min-height:1.357rem; margin:0.357rem 0; padding-left:10rem; font-size:1.071rem; letter-spacing:-0.15px;} .sales_list .list .info li strong {font-size:1.071rem; letter-spacing:-0.15px;} .sales_list .list .info li span {display:inline-block; position:absolute; top:0; left:0; width:10rem; font-size:1.071rem; font-weight:600; letter-spacing:-0.15px;} /* 매장안내 */ #shop_info {padding:0 6.25%;} #shop_info > .info {padding:1.643rem 0 0.857rem; border-bottom:1px dashed #DCDCDC;} #shop_info > .info:first-child {padding:1.286rem0 0.857rem;} #shop_info > .info h3 {position:relative; margin-bottom:1.214rem; font-size:1.429rem;} #shop_info > .info.detail h3 {margin-bottom:1.429rem;} #shop_info > .info h3 span.small {display:inline-block; position:absolute; top:-0.071rem; right:0;} #shop_info > .info h3 span.small a {display:block; width:4.714rem; height:2.143rem; padding:0; border-color:#DDDDDD; border-radius:4px; background:#fff; color:#333 !important; font-size:0.929rem; font-weight:500; text-align:center; line-height:2.143rem;} #shop_info > .info > ul > li {position:relative; min-height:1.500rem; margin-bottom:2.857rem; padding:0 0 0 9rem; font-size:1.071rem; font-weight:500;} #shop_info > .info > ul > li:last-child {margin-bottom:0;} #shop_info > .info > ul > li > span {display:inline-block; position:absolute; top:0; left:0; font-size:1.071rem; font-weight:700;} #shop_info > .info > ul > li > .wrap {padding-right:9rem;} #shop_info > .info > ul > li .wrap {position:relative; margin-bottom:10px; font-size:1.071rem; line-height:1.786rem;} #shop_info > .info > ul > li .wrap > .btn_col {display:inline-block; position:absolute; top:0; right:0; width:5rem; line-height:1.786rem;} #shop_info > .info > ul > li .wrap > p {font-weight:700;} #shop_info > .info > ul > li .wrap .box_btn > * {padding:0; border:0; background:none; color:#999 !important; font-size:0.929rem;} #shop_info .btn span {display:block;} #shop_info .btn span a {display:block; height:3.571rem; border-radius:4px; background:#FD5000; color:#fff; font-size:1.071rem; text-align:center; line-height:3.571rem;} #shop_info .btn span a {display:block; height:3.571rem; border-radius:4px; background:#FD5000; color:#fff; font-size:1.071rem; text-align:center; line-height:3.571rem;} #shop_info .btn.list {margin-top:2.143rem;} /* 매장정보 */ #shop_info2 > .info {padding:1.643rem 6.25% 0.857rem; border-bottom:0.714rem solid #F9F9F9;} #shop_info2 > .info:first-child {padding:1.286rem 6.25% 0.857rem;} #shop_info2 > .info h3 {position:relative; margin-bottom:1.214rem; font-size:1.429rem;} #shop_info2 > .info.detail h3 {margin-bottom:1.429rem;} #shop_info2 > .info h3 span {display:inline-block; position:absolute; top:-0.071rem; right:0;} #shop_info2 > .info h3 span a {display:block; width:4.714rem; height:2.214rem; border:1px solid #DDDDDD; border-radius:4px; font-weight:500; text-align:center; line-height:2.214rem;} #shop_info2 > .info > ul > li {position:relative; min-height:1.500rem; margin-bottom:0.643rem; padding-left:10.000rem; font-size:1.071rem; font-weight:500;} #shop_info2 > .info > ul > li > span {display:inline-block; position:absolute; top:0; left:0;} #shop_info2 > .info .line {margin-bottom:2.000rem; padding-bottom:1.071rem; border-bottom:1px dashed #E3E3E3;} #shop_info2 > .info .line h4 {margin-bottom:1.286rem; font-size:1.214rem;} #shop_info2 > .info .line .box .list {position:relative; min-height:1.500rem; margin-bottom:0.786rem; padding-left:10rem; font-size:1.071rem;} #shop_info2 > .info .line .box .list.total {line-height:2.143rem;} #shop_info2 > .info .line .box .list span {position:absolute; top:0; left:0; font-size:1.071rem; font-weight:600;} #shop_info2 > .info .line .box .list.total span {top:0.286rem;} #shop_info2 > .info .line .box img {width:100%; margin-bottom:10px;} #shop_info2 .btn {padding:1.786rem 6.25% 3.143rem;} #shop_info2 .btn span {display:block;} #shop_info2 .btn span a {display:block; height:3.571rem; border-radius:4px; background:#FD5000; color:#fff; font-size:1.071rem; text-align:center; line-height:3.571rem;} /* 매장시간설정 */ .store_time {padding:0 6.25% 1.786rem;} .store_time input[type=checkbox] {margin-right:4px;} .store_time .table {display:table; width:100%; background:#fff; box-sizing:border-box;} .store_time_wrap h3 {position:relative; padding:1.286rem 6.25% 0; font-size:1.286rem;} .store_time .tr {display:table-row; width:100%; font-size:0;} .store_time .tr > div {display:block; vertical-align:top; padding:0.857rem 0 0; padding-bottom:0; color:#000; font-size:0; vertical-align:middle;} .store_time .tr > .td {margin-bottom:0.357rem; padding:0.500rem 0 0;} .store_time .tr .th {width:100%; padding-left:0; padding-bottom:0; font-size:1.143rem; font-weight:bold; text-align:left;} .store_time .tr .step1 {font-size:0;} .store_time .tr .step1 input {display:none;} .store_time .tr .step1 label {display:inline-block; width:32%; height:3.571rem; border:1px solid #E9E9E9; border-radius:0.286rem; font-size:1.071rem; text-align:center; line-height:3.571rem;} .store_time .tr .step1 label.typeB {margin:0 2%;} .store_time .tr .step1 label.on {border:2px solid #FD5000; color:#FD5000 !important; font-weight:600;} .store_time .tr .td > div {padding-bottom:0.714rem; font-size:0;} .store_time .tr .td > div.text_type {display:inline-block; margin-right:1.429rem; font-size:1.071rem;} .store_time .tr .td > div.text_type input {width:12.857rem; margin-right:0.714rem;} .store_time .tr .td > div.fake_title {width:100%; margin-top:1.286rem; padding-left:0; font-size:1.143rem; font-weight:bold; text-align:left;} .store_time .tr .td > div.fake_title.on {display:none;} .store_time .tr .td.on > div.all {display:inline-block; margin-left:1.286rem; vertical-align:middle;} .store_time .tr .td > div.select select {width:100%;} .store_time .tr .td .before, .store_time .tr .td .after {display:inline-block; width:calc(50% - 0.964rem); font-size:0; vertical-align:middle;} .store_time .tr .td .middle {display:inline-block; width:1.929rem; font-size:1rem; vertical-align:middle; text-align:center;} .store_time .tr .td.on .middle {display:inline-block; width:2.143rem; vertical-align:middle; text-align:center;} .store_time .tr .td .before input, .store_time .tr .td .after input {display:inline-block; width:49.61%; margin-right:4.59%;} .store_time .tr .td .before select, .store_time .tr .td .after select {display:inline-block; width:45.80%;} .store_time .tr .td.on .before, .store_time .tr .td.on .after {display:inline-block; width:calc(50% - 3.571rem);} .store_time .tr .td.on .before select, .store_time .tr .td.on .after select {width:100%;} .store_time .tr .td .box_btn_s {margin-left:10px;} .store_time .tr .td select {height:3.286rem; vertical-align:middle;} .store_time .tr .td select:disabled {border:1px solid #E9E9E9; background:#F0F0F0;} .store_time .tr .td .input {height:3.286rem; padding:0.286rem 1.071rem; margin-right:0; border:1px solid #E9E9E9; background:#fff; color:#999; font-family:'Pretendard',sans-serif; font-size:1rem; transition:all .3s ease; vertical-align:middle;} .store_time .tr .td textarea {border:1px solid #E9E9E9; border-radius:0.286rem;} .store_time .tr .td.day label {display:inline-block; width:5.000rem; margin-right:0.286rem; margin-bottom:0.357rem} .store_time .tr .td.brake {font-size:0;} .store_time .tr .td.brake input {display:none;} .store_time .tr .td.brake label {display:inline-block; width:32%; height:3.571rem; margin-right:10px; border:1px solid #E9E9E9; border-radius:0.286rem; font-size:1.071rem; text-align:center; line-height:3.571rem;} .store_time .tr .td.brake label.on {border:2px solid #FD5000; color:#FD5000 !important; font-weight:600;} .store_time .tr .td.brake .before, .store_time .tr .td.brake .after {display:inline-block; width:calc(50% - 3.571rem);} .store_time .tr .td.brake .before select, .store_time .tr .td.brake .after select {width:100%;} .store_time .tr .td .date {font-size:0;} .store_time .tr .td .date input {display:none;} .store_time .tr .td .date label {display:inline-block; width:32%; height:3.571rem; margin-right:10px; border:1px solid #E9E9E9; border-radius:0.286rem; font-size:1.071rem; text-align:center; line-height:3.571rem;} .store_time .tr .td .date label.on {border:2px solid #FD5000; color:#FD5000 !important; font-weight:600;} .store_time .tr .td .date .before, .store_time .tr .td .date .after {display:inline-block; width:calc(50% - 3.571rem);} .store_time .tr .td .date .before select, .store_time .tr .td .date .after select {width:100%;} .box_bottom {margin-bottom:30px; text-align:center;} .box_bottom .box_btn {width:87.5%;} .box_bottom .box_btn * {width:100%; height:3.571rem; border-radius:0.286rem;} /* 카테고리 */ .category_menu {background:#FD5000;} .category_menu .top {position:relative; height:6.429rem; padding:0 6.875%;} .category_menu .top p {padding:1.857rem 0; color:#fff; font-size:1.286rem;} .category_menu .top p strong {color:#fff; font-size:1.857rem; font-weight:600;} .category_menu .top p a {color:#fff; font-size:1.857rem; font-weight:600; text-decoration:underline;} .category_menu .top ul {position:absolute; top:2.929rem; right:5.46875%; font-size:0;} .category_menu .top ul li {display:inline-block; margin-left:1.071rem;} .category_menu .top ul li a {display:block; height:1.286rem; padding-left:1.357rem; color:#fff; font-size:1rem; line-height:1.286rem;} .category_menu .top ul li.info_edit a {background:url('/_skin/bona/img/common/icon_infor.png')no-repeat left center/1.286rem;} .category_menu .top ul li.logout a {background:url('/_skin/bona/img/common/icon_lock.png')no-repeat left center/1.286rem;} .category_menu .top ul li.join a {padding-left:1.786rem; background:url('/_skin/bona/img/common/icon_join.png')no-repeat left center/1.500rem;} .category_menu .top ul li.close {display:inline-block; height:1.286rem; padding-left:1.357rem; background:url('/_skin/bona/img/common/icon_close.png')no-repeat left center/1.286rem; color:#fff; font-size:1rem; line-height:1.286rem; cursor:pointer;} .category_menu .middle {padding:3.214rem 0 0; border-radius:1.429rem 1.429rem 0 0; background:#fff;} .category_menu .middle h2 a.link {float:right; color:#999; font-size:1rem; font-weight:400; text-decoration:underline;} .category_menu .middle h2 {overflow:hidden; margin-bottom:0.786rem; padding:0 9.375%; font-size:1.429rem; font-weight:700;} .category_menu .middle h2 a.title {overflow:hidden; font-size:1.429rem; font-weight:700;} .category_menu .middle .funding {margin-bottom:2rem;} .category_menu .middle ul {margin-bottom:2.214rem; padding:0 9.375%; font-size:0;} .category_menu .middle ul li {display:inline-block; width:50%;} .category_menu .middle ul li a {display:block; padding:0.393rem 0; color:#888888; font-size:1.214rem;} .category_menu .middle .event .swiper-container {margin-bottom:3.571rem; padding:0 9.375%;} .category_menu .middle .event .swiper-container.board {margin-bottom:0; padding:0 6.25% 3.214rem;} .category_menu .middle .event .swiper-slide {display:inline-block; width:auto; text-align:center;} .category_menu .middle .event .board .swiper-slide {text-align:left;} .category_menu .middle .event .swiper-slide a {color:#333; font-size:1.071rem;} .category_menu .middle .event .swiper-slide img {display:block; width:100%; margin-bottom:0.571rem;} .category_menu .middle .event .board .swiper-slide img {margin-bottom:1.429rem;} .category_menu .middle .event .swiper-slide h3 {margin-bottom:0.571rem; padding:0 1.429rem;} .category_menu .middle .event .swiper-slide h3 a {font-size:1.714rem;} .category_menu .middle .event .swiper-slide p {padding:0 1.429rem;} .category_menu .middle .event .swiper-slide p a {font-size:1.071rem;} .category_menu .middle .event .swiper-slide .category_menu .middle .event .swiper-horizontal > .swiper-pagination-bullets, .category_menu .swiper-pagination-bullets.swiper-pagination-horizontal {position:static; margin:2.143rem 0;} .category_menu .middle .event .swiper-pagination .swiper-pagination-bullet {width:0.500rem; height:0.500rem; border:0; background:#E3E3E3; opacity:1;} .category_menu .middle .event .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {width:2.143rem; height:0.500rem; border-radius:0.500rem; background:#FD5000;} .category_menu .bottom {padding:2.929rem 0; background:#F6F6F6;} .category_menu .bottom h2 {margin-bottom:1.357rem; padding:0 9.375%; font-size:1.429rem;} .category_menu .bottom ul {margin-bottom:6.000rem; padding:0 9.375%; font-size:0;} .category_menu .bottom ul li {display:inline-block; width:50%;} .category_menu .bottom ul li a {display:block; padding:0.393rem 0; color:#888888; font-size:1.214rem;} /*-----------------------------------------------------------------*/ /* 4-1. 메인 /*-----------------------------------------------------------------*/ #layer {top:0 !important; left:50% !important; max-width:640px; width:100% !important; height:100vh !important;} #main {position:relative;} #main .content {position:relative; z-index:60; width:100%; border-radius:2.143rem 2.143rem 0 0; background:#fff; transition:all 0.3s ease;} #main .content .link {font-size:0; text-align:center;} #main .content .link li {display:inline-block; width:15%;} #main .subtitle {width:100%; margin-bottom:0.857rem; padding:0.286rem 0; border-bottom:0; font-weight:bold; font-style:normal; font-size:2.000rem;} #main .swiper-pagination-progressbar {position:relative; top:auto; left:0; z-index:5; width:100%; height:0.286rem; background:#f2f2f2;} #main .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {background:#1a1a1a;} #main .swiper_visual {position:fixed; top:0; left:50%; width:640px; height:auto;} #main .swiper_visual .swiper-slide img {width:100%; height:auto;} #main .swiper_visual .swiper-slide .txt {display:none; position:absolute; top:50%; left:2.143rem;} #main .swiper_visual .swiper-counter {position:absolute; bottom:6.214rem !important; left:25.000rem; z-index:5; width:100%; height:1.357rem; color:#CFCFCF; font-size:0.786rem; font-weight:600; text-align:left;} #main .swiper_visual .swiper-counter * {height:1.357rem; color:inherit; font:1.000rem; font-weight:400; vertical-align:middle;} #main .swiper_visual .swiper-counter .current {color:#fff; font-size:1.143rem; font-weight:600; vertical-align:middle;} #main .swiper_visual .swiper-pagination-progressbar {overflow:hidden; position:absolute; left:4.286rem; bottom:6.571rem !important; width:20.000rem; border-radius:0.286rem; background:none;} #main .swiper_visual .swiper-pagination-progressbar:after {position:absolute; left:0; top:0; width:100%; height:0.357rem; background:rgba(255,255,255,0.5); content:'';} #main .swiper_visual .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {z-index:60; background:#fff;} #main .swiper_visual .swiper-slide img {width:100%; height:auto;} #main .content .link {padding:0 3rem; font-size:0;} #main .content .link li a {display:block; padding:2.857rem 0; color:#ABABAB; font-size:1.286rem; font-weight:500; letter-spacing:-0.24px;} #main .content .link li a img {margin-bottom:0.786rem;} #main .content .link li:nth-child(1) a img {width:2.929rem;} #main .content .link li:nth-child(2) a img {width:2.857rem;} #main .content .link li:nth-child(3) a img {width:2.857rem;} #main .content .link li:nth-child(4) a img {width:3.000rem;} #main .content .link li:nth-child(5) a img {width:2.286rem;} #main .content .link li:nth-child(6) a img {width:2.286rem;} #main .bestitem {margin-bottom:3.714rem;} #main .bestitem .prd_basic .box .img .num {display:block;} /* 우리동네 잘 팔리는 술 추가 */ #main .neighborhood {margin-bottom:5.714rem; padding:0 6.25%; text-align:center;} #main .neighborhood h2 {margin-bottom:1rem;} #main .neighborhood .col3 > li {width:32%;} #main .neighborhood .col3 > li:nth-child(3n-1) {margin:0 2%;} /* 알림ON 특가GET */ #main .timesale {margin-bottom:5.714rem; text-align:center;}/* 수정 230803 - 하단여백수정 */ #main .timesale h2 {margin-bottom:-8px;} #main .timesale .swiper-container {padding:0 40px 0;} /* 수정 230803 - 하단여백수정 */ #main .timesale .prd_basic .box .box_timer {display:block; position:relative; left:50%; width:260%; opacity:0; margin:0 auto 2.786rem; border:0; text-align:center; transition:all 0.3s; transform:translate(-50%, 0px);} #main .timesale .prd_basic .swiper-slide-active .box .box_timer {opacity:1;} #main .timesale .prd_basic .box .box_timer > .title{display:none;} #main .timesale .prd_basic .box .box_timer * {font-size:2.571rem !important; font-weight:700; vertical-align:middle; line-height:3.071rem; color:#fd5000;} #main .timesale .prd_basic .box .img {margin-bottom:0.857rem;} #main .timesale .prd_basic .box .img .prdimg img {border-radius:50%;} #main .timesale .prd_basic .box .img .percent {display:inline-block; position:absolute; top:0; right:0; width:6.214rem; height:5.714rem; padding:1.000rem 0.571rem 0 0; background:url('/_skin/bona/img/shop/icon_sale.png')no-repeat center/6.214rem auto; color:#fff; font-size:1.143rem;} #main .timesale .prd_basic .swiper-slide-active .box .img {transform:scale(1.2);} #main .timesale .prd_basic .box .info {opacity:0; text-align:center;} #main .timesale .prd_basic .swiper-slide-active .box .info {opacity:1; margin-top:3.429rem;} #main .timesale .prd_basic .box .price {padding-top:0.286rem;} #main .timesale .prd_basic .box .price .consumer {display:inline-block; margin-right:0.500rem;} #main .timesale .prd_basic .box .price .sell strong {font-size:1.419rem;} #main .timesale .prd_basic .box .price .sellY {display:none;} #main .timesale .prd_basic .box .price .discountY {display:inline-block; font-size:1.429rem; font-weight:900;} #main .timesale .prd_basic .box .price .discountY * {font-size:1.429rem; font-weight:900;} #main .new {margin-bottom:5.714rem;} #main .new img {width:100%;} #main .new .swiper-container {position:relative; z-index:1; margin-top:-5.143rem; padding:0 6.25%;} /* 배너 */ #main .main_banner {width:100%; margin-bottom:5.714rem;} #main .main_banner img {width:100%;} /* 취향저격 */ #main .season .swiper-container {padding:0 6.25% 5.714rem;} #main .season .swiper-container .swiper-slide > .img {margin-bottom:1.429rem;} #main .season .swiper-container .swiper-slide > .img img {width:100%; border-radius:0.571rem;} /* 수정 230803 - 상품 라운딩 */ /* 20230830 수정 */ @media only screen and (max-width:640px) { .prd_basic .box.pick .info {margin-bottom:0;} } /* 사심 가득한 추천 */ #main .interested {margin-bottom:5.714rem; text-align:center;} #main .interested h2 {margin-bottom:1rem;} /* 공동구매 이미지 */ #main .purchase { margin-bottom: 5.714rem; text-align: center; } #main .purchase h2 { margin-bottom: 1rem; } #main .purchase img { padding: 0 6.25%; width: 100%; } /* 우리술 */ #main .traditional {margin-bottom:5.714rem;} #main .traditional .traditional_tab {padding:0 6.25%; font-size:0; text-align:center;} #main .traditional .traditional_tab.swiper-wrapper.off {display:block; box-sizing:border-box;} #main .traditional .traditional_tab > div {display:inline-block; width:auto; height:2.071rem; color:#ABABAB; font-size:1.143rem; line-height:2.071rem; letter-spacing:-0.16px; text-align:center;} #main .traditional .traditional_tab > div span {display:block; width:auto; height:2.071rem; margin-right:2.143rem; padding:0; color:#ABABAB; font-size:1.223rem; font-weight:500; line-height:2.071rem; letter-spacing:-0.16px; text-align:center; cursor:pointer;} #main .traditional .traditional_tab.swiper-wrapper.off > div:last-child span {margin-right:0;} #main .traditional .traditional_tab > div.on {position:relative; z-index:10; color:#111; font-weight:700;} #main .traditional .traditional_tab > div.on span {position:relative; z-index:10; color:#111; font-weight:700;} #main .traditional .slide .swiper-container {margin-bottom:1.429rem; padding:0 6.25%;} #main .traditional .slide .swiper-container .swiper-slide {margin-right:10px;} #main .traditional .traditional_tab > div.on:after {position:absolute; bottom:0.214rem; left:0; width:calc(100% - 2.143rem); height:0.200rem; background:#FD5000; content:'';} #main .traditional .traditional_btn li {display:inline-block; vertical-align:top;} #main .traditional .traditional_btn li a {display:block; padding:0 0.857rem; color:#ababab; font-size:1.042rem;} #main .traditional .traditional_btn li a.active {color:#000;} #main .traditional .traditional_btn li:first-child a {padding-left:0;} #main .traditional .traditional_banner {margin-top:0.500rem; margin-bottom:2.143rem;} #main .traditional .traditional_banner img {width:100%;} #main .traditional .traditional_banner .text {padding:1.429rem 6.25% 0;} #main .traditional .traditional_banner .text h4 {margin-bottom:0.857rem; color:#111; font-size:1.857rem;} #main .traditional .traditional_banner .text p {color:#777; font-size:1.243rem; font-weight:500; line-height:1.671rem;} #main .traditional .swiper-pagination {position:relative; top:auto; left:auto; margin-top:1.071rem; background-color:#ededed; height:2px;} #main .traditional .swiper-pagination span {background-color:#262626;} #main .traditional .prd_basic.col_list2 > div:nth-child(even) {border-bottom:none;} /* 소장가치 UP */ #main .best {margin-bottom:5.714rem;} #main .best img {width:100%;} #main .best .swiper-container {position:relative; z-index:1; margin-bottom:.0; padding:0 6.25%;} /* 실시간 검색어 */ #main .real {margin-bottom:5.714rem; padding:0 6.25%; text-align:center;} #main .real h2 {margin-bottom:1rem;} /* 키워드 */ #main .keyword {margin-bottom:5.714rem; padding:0 0 0 6.25%; text-align:center;} #main .keyword h2 {margin-bottom:0.5rem;} #main .keyword .txt {margin-bottom:1.714rem; font-size:1.429rem; font-weight:600; text-align:center;} #main .keyword .keyword_tab {margin-bottom:24px; font-size:0; text-align:center;} #main .keyword .keyword_tab.swiper-wrapper.off {display:block; box-sizing:border-box;} #main .keyword .keyword_tab > div {display:inline-block; margin-right:0.571rem; padding:8px 16px; width:auto; border:1px solid #D1D1D1; border-radius:8px; color:#000; font-size:1.071rem; letter-spacing:-0.16px; text-align:center;} #main .keyword .keyword_tab > div span {display:block; width:auto; padding:0; color:#000; font-size:1.071rem; font-weight:400; letter-spacing:-0.16px; text-align:center; cursor:pointer;} #main .keyword .keyword_tab.swiper-wrapper.off > div:last-child span {margin-right:0;} #main .keyword .keyword_tab > div.on {background:#fd5000; border:1px solid #fd5000; font-weight:400; color:#fff;} #main .keyword .keyword_tab > div.on span {font-weight:400; color:#fff;} #main .keyword .slide .swiper-container {margin-bottom:1.429rem; padding:0 6.25%;} #main .keyword .slide .swiper-container .swiper-slide {margin-right:10px;} #main .keyword .prd_basic.col_list2 > div:nth-child(even) {border-bottom:none;} /* 기획상품 모음전 */ #main .special_collect {margin-bottom:5.714rem; padding: 0 0 0 6.25%; text-align:center;} #main .special_collect h2 { margin-bottom: 0.5rem; } #main .special_collect .txt { margin-bottom: 1.714rem; font-size: 1.429rem; font-weight: 600; text-align:center;} @media only screen and (max-width:640px) { #main .keyword {padding:0 0 0 6.25%;} #main .keyword .keyword_tabs {margin-bottom:1.714rem;} } /* 우리동네 픽업지는 어디? */ #main .main_pickup {padding-bottom:5.714rem;} #main .main_pickup .swiper-container {padding:0 6.25%;} #main .main_pickup .swiper-wrapper {height:580px; font-size:0;} #main .main_pickup .swiper-slide {position:relative; margin-top:0 !important; padding:30px 2.857rem 0; font-size:0;} #main .main_pickup .swiper-slide:nth-child(3n-2):after {position:absolute; top:0; left:0; width:100%; height:550px; border:1px solid #E3E3E3; border-radius:1.429rem; content:''; z-index:-1;} #main .main_pickup .swiper-slide .swiper-slide {padding:1.071rem 2.857rem; font-size:0; cursor:pointer;} #main .main_pickup .swiper-slide {height:calc((100% - 5px) / 3.33);} #main .main_pickup .swiper-slide > a {display:block; width:100%; vertical-align:middle; font-size:0;} #main .main_pickup .swiper-slide > a > div {display:inline-block; width:100%; vertical-align:middle;} #main .main_pickup .swiper-slide > a > div {display:inline-block; width:100%; vertical-align:middle;} #main .main_pickup .swiper-slide .img {display:inline-block; position:relative; width:10.000rem; height:10rem; border-radius:50%; box-shadow:0px 0.571rem 1.071rem #0000001A;} #main .main_pickup .swiper-slide .img img {width:100%; height:100%; border-radius:50%;} #main .main_pickup .swiper-slide .img .no {position:absolute; top:0; left:0; border-bottom:0.143rem solid #333; color:#333; font-size:1.714rem; font-weight:700; line-height:1;} #main .main_pickup .swiper-slide .text {display:inline-block; position:relative; width:calc(100% - 10.000rem); padding:0 0 0 2.857rem;} #main .main_pickup .swiper-slide .text > span {font-size:1.000rem;} #main .main_pickup .swiper-slide .text p {display:-webkit-box; overflow:hidden; color:#111; font-size:1.143rem; font-weight:600; text-overflow:ellipsis; -webkit-line-clamp:1; -webkit-box-orient:vertical;} #main .main_pickup .swiper-slide .text .km {color:#FD5000; font-weight:400;} #main .main_pickup .swiper-slide .text .km span {color:#999;} #main .main_pickup .swiper-slide .text .addr {display:block; margin-top:0.429rem;} #main .main_pickup .swiper-pagination {position:static; margin:0;} #main .main_pickup .swiper-pagination .swiper-pagination-bullet {width:0.500rem; height:0.500rem; border:0; background:#E3E3E3; opacity:1;} #main .main_pickup .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {width:2.143rem; height:0.500rem; border-radius:0.500rem; background:#FD5000;} #main .main_pickup .slick-prev, #main .main_pickup .slick-next {display:none !important;} /* 스크롤배너 */ #main .autoscroll {margin-bottom:5.714rem; width:100%; background-color:#90FBE0;} #main .autoscroll .swiper-container {} #main .autoscroll .swiper-container .swiper-wrapper {} #main .autoscroll .swiper-container .swiper-wrapper .swiper-slide {margin-right:0} #main .autoscroll .swiper-container .swiper-wrapper .swiper-slide img {width:100%;} /*-----------------------------------------------------------------*/ /* 4-2.상점 /*-----------------------------------------------------------------*/ /* 주문배송비메세지 - 장바구니(/shop/cart.php), 주문서(/shop/order.php) */ .msg_delivery {position:relative; padding:15px;} .msg_delivery.check {padding-left:45px;} .msg_delivery.check input[type=checkbox] {position:absolute; left:15px; top:17px;} .msg_delivery span, .msg_delivery span * {font-size:0.917rem;} /* 상품리스트 - 장바구니(/shop/cart.php), 주문서(/shop/order.php), 주문완료(/shop/order_finish.php), 재입고 알림 신청 내역(/mypage/notify_restock.php) */ .list_cart {position:relative; padding:1.429rem 1.786rem 0; border-radius:0.714rem 0.714rem 0 0; background:#fff;} .list_cart.cart {margin-top:1.429rem;} .list_cart.cart:before {position:absolute; bottom:-0.714rem; left:0; width:1.071rem; height:1.571rem; background:url('/_skin/bona/img/shop/oder_right.png')no-repeat center/1.071rem; content:'';} .list_cart.cart:after {position:absolute; bottom:-0.714rem; right:0; width:1.071rem; height:1.571rem; background:url('/_skin/bona/img/shop/oder_left.png')no-repeat center/1.071rem; content:'';} .list_cart > li {padding:0.714rem 0; font-size:0; text-align:left;} .list_cart.cart > li:last-child {padding-bottom:1.429rem; border-bottom:1px dashed #D9D9D9;} .list_cart.orderfin > li {padding-left:0; padding-right:0;} .list_cart > li:after {display:block; clear:both; content:'';} .list_cart > li > .check {display:inline-block; vertical-align:top;} .list_cart > li > .box {display:inline-block; width:calc(100% - 1.786rem); padding-left:0.357rem; font-size:0; vertical-align:top;} .list_cart > li > .box:after {display:block; clear:both; content:'';} .list_cart > li > .box .img {display:inline-block; width:6.429rem; height:auto; vertical-align:top;} .list_cart > li > .box .img img {width:100%; height:auto;} .list_cart > li > .box .info {display:inline-block; width:calc(100% - 6.429rem); padding-left:0.857rem; vertical-align:top;} .list_cart > li > .box .info .name {position:relative;} .list_cart > li > .box .info .name > a {display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding-right:4rem; font-size:1.143rem; font-weight:600; letter-spacing:-0.16px;} .list_cart > li > .box .info .name .box_del a {display:inline-block; position:absolute; top:-0.143rem; right:-0.429rem; width:1.714rem; height:1.714rem; background:url('/_skin/bona/img/shop/cart_del.png')no-repeat center/1.286rem;} .list_cart > li > .box .info .price {font-size:0;} .list_cart > li > .box .info .price strong {font-size:1.071rem; letter-spacing:-0.15px;} .list_cart > li > .box .info .price span {display:inline-block; margin-left:0.429rem; padding-left:1.214rem; background:url('/_skin/bona/img/shop/icon_milage.png')no-repeat left center/1.143rem; color:#C7C7C7; letter-spacing:-0.14px;} .list_cart > li > .box .info .price span.eqt {padding-left:0; background:none; color:#333;} .list_cart > li > .box .info .price .eqt {padding:0; color:#333; font-size:1rem; font-weight:500; background:none;} .list_cart > li > .box .info .bottom {position:relative; margin-top:0.429rem; font-size:0;} .list_cart > li > .box .info .bottom .total.list_total {position:absolute !important; top:0.286rem; right:0; font-size:1.071rem; letter-spacing:-0.15px;} .list_cart > li > .box .info .bottom .total strong {font-size:1.071rem; font-weight:500; letter-spacing:-0.15px;} .list_cart > li > .box .info .bottom .box_qty {margin-right:0.571rem;} .list_cart > li > .box .info .bottom .box_qty + a {position:static; border-bottom:1px solid #333; color:#333;} .list_cart > li > .box .info .bottom .stat {position:absolute; bottom:0; right:0; color:#FD5000; font-size:1.143rem; font-weight:700; letter-spacing:-0.16px;} .list_cart > li > .box .info > p, .list_cart > li > .box .info > div {padding-top:0.143rem;} .list_cart > li > .box .info > p + div {position:relative; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; margin:5px 0; padding-right:60px; color:#999;} .list_cart > li > .box .info > p + div * {color:#999;} /* .list_cart > li > .box .info > p + div > a {display:inline-block; position:absolute; top:0; right:0; height:1.214rem; border-bottom: 1px solid #333; color: #333;} .list_cart > li > .box .info > .opt_change {position:relative; padding:0;} .list_cart > li > .box .info > .opt_change > a {display:inline-block; position:absolute; top:-1.571rem; right:0; height:1.214rem; border-bottom: 1px solid #333; color: #333;} */ .list_cart > li > .box .info > p:first-child, .list_cart > li > .box .info > div:first-child {padding-top:0;} .list_cart > li > .box .info > div.nr_stat {padding-top:15px;} .list_cart > li > .box .info > div.nr_stat span.stat1 {color:#111;} .list_cart > li > .box .info > div.nr_stat span.stat2 {color:#2591bc;} .list_cart > li > .box .info > div.nr_stat span.stat3 {color:#c05b5b;} .list_cart > li > .box .info > div.nr_stat span.stat4 {color:#999;} .list_cart > li > .box .info > div.nr_stat .box_btn {vertical-align:middle;} .list_cart > li > .sbs {margin-top:15px; padding-top:10px; border-top:1px solid #dbdbdb;} .list_cart > li > .sbs > p {padding:5px;} .list_cart > li > .sbs > p > span {float:right;} .list_cart > li > .today {margin-top:10px; padding:10px; border:1px solid #e5e5e5;} .list_cart > li > .today > span {padding-left:5px; color:#666;} .list_cart > li > .total {margin-top:10px; padding:15px; border:1px solid #dbdbdb; border-width:1px 0; background:#f8f8f8;} .list_cart > li > .total strong {float:right; font-size:1.083rem;} .list_cart > li > .stat {padding:10px 15px; border-bottom:1px solid #dbdbdb; background:#f8f8f8; line-height:34px;} .list_cart > li > .stat .box_btn {float:right; margin-top:4px;} .list_cart > li > .stat:after {display:block; clear:both; content:'';} .list_cart > li > .trace {margin-top:1.429rem;} .list_cart > li > .trace span * {height:3.571rem; padding:0; border:1px solid #707070; color:#333 !important; font-size:1.071rem; font-weight:600; line-height:3.571rem;} .list_cart > li > .trace > p {padding-top:5px;} .list_cart > li > .btn {margin-top:10px;} .list_cart > li > .btn .box_btn a {position:relative; padding-left:30px;} .list_cart > li > .btn .wish a:before {display:inline-block; position:absolute; left:50%; top:50%; width:13px; height:13px; margin:-7px 0 0 -30px; background:url('/_skin/bona/img/common/icon_wish.png') no-repeat; background-size:cover; content:'';} .list_cart > li > .btn .wish a.wish_on:before {background-image:url('/_skin/bona/img/common/icon_wish_on.png')} .list_cart > li > .btn .del a:before {display:inline-block; position:absolute; left:50%; top:50%; width:13px; height:13px; margin:-7px 0 0 -30px; background:url('/_skin/bona/img/common/icon_delete.png') no-repeat; background-size:cover; content:'';} /* 세트상품 */ .list_cart > li.set {margin-top:-1px; padding-left:75px; background:#fdfdfd url('/_skin/bona/img/shop/icon_set.png') no-repeat left 45px center/8px 6px;} .list_cart > li.set .opt {position:relative; padding-right:40px;} .list_cart > li.set .opt .btn_edit {display:inline-block; position:absolute; top:5px; right:0;} .list_cart > li.set .opt .btn_edit a {font-size:11px; text-decoration:underline;} .list_cart + .sum {margin-bottom:2.143rem; padding:1.429rem 1.786rem 1.643rem; border-radius:0 0 0.714rem 0.714rem;} .list_cart.order {padding:0;} .list_cart.order:after {display:none;} .list_cart.order:before {display:none;} .list_cart.order > li {padding:0.786rem 1.786rem 1.429rem; border:0; border-bottom:1px solid #E9E9E9;} .list_cart.order.type2 > li {padding:1.429rem; border:0; border-bottom:1px solid #E9E9E9;} .list_cart.order > li:last-child {border-bottom:0;} .list_cart.order > li > .box {padding:0;} .list_cart.order > li > .box .img {position:relative; width:5.714rem;} .list_cart.order > li > .box .img .country {position:absolute; top:0.500rem; left:0.500rem; width:1rem; height:1rem;} .list_cart.order > li > .box .img .country img {width:100%;} .list_cart.order > li > .stat {overflow:hidden; margin-bottom:0.643rem; padding:0; border:0; background:none; color:#FD5000; font-size:1.143rem; font-weight:700; letter-spacing:-0.16px;} .list_cart.order > li > .stat .box_btn {margin-top:0.214rem;} .list_cart.order > li > .stat .box_btn * {width:4.714rem; height:2.214rem; padding:0; border:1px solid #6F8A6B; border-radius:4px; background:#6F8A6B; font-size:0.929rem; line-height:2.214rem; letter-spacing:-0.13px;} .list_cart.order > li > .box .info .price {margin-bottom:0;} .list_cart.order.type2 > li > .box .info .price {margin-bottom:0.286rem;} .list_cart.order.type2 > li > .box .info > p, .list_cart.order.type2 > li > .box .info > div {padding-top:0;} .list_cart.order > li > .box .info .price strong {font-weight:500;} .ord_box {padding:0 6.25%;} .list_wrap {overflow:hidden; margin-bottom:1.500rem; border:1px solid #E9E9E9; border-radius:6px;} .list_wrap .company_info {position:relative; padding:0.929rem 4.357rem 0.857rem 1.357rem; color:#999999; background:#F6F6F6; letter-spacing:-0.14px;} .list_wrap .company_info p {font-size:1.143rem; font-weight:600; letter-spacing:-0.16px;} .list_wrap .company_info span {margin-right:5px; color:#FD5000; font-size:1.143rem;} .list_wrap .company_info span.map {display:inline-block; position:absolute; top:50%; right:1.357rem; width:1.143rem; height:1.429rem; margin-top:-0.714rem; background:url('/_skin/bona/img/mypage/map_pin_default.png')no-repeat center/1.143rem; cursor:pointer;} .list_wrap .company_info span.map * {display:inline-block; width:1.143rem; height:1.429rem;} .list_wrap .trace {padding:0 1.667rem 1.667rem;} .list_wrap .trace .box_btn > * {border:1px solid #707070; background:#fff; color:#333;} .list_cart.order4 {padding:0;} .list_cart.order4 > li {padding:1.429rem;} .list_cart.order4 > li > .box {position:relative; width:100%; padding:0;} .list_cart.order4 > li > .box .img {vertical-align:middle;} .list_cart.order4 > li > .box .info {padding-bottom:0 !important; vertical-align:middle;} .list_cart.order4 > li > .box .info .eqt {position:absolute; top:50%; right:0; margin-top:-10px;} /* 상품목록(/shop/big_section.php) */ #big_section {padding-bottom:3.857rem;} #big_section .swiper-container.middle {padding:0 4.16%;} #big_section .swiper-container.middle .swiper-slide {display:inline-block; width:auto;} #big_section .swiper-container.middle .swiper-slide a {color:#ABABAB; font-size:1.223rem; font-weight:500;} #big_section .swiper-container.middle .swiper-slide.on a {color:#ABABAB; font-size:1.223rem;} #big_section .swiper-container.small {padding:0 4.16%;} #big_section .best_area .prd_basic .box .summary {display:none;} #big_section .swiper-container.middle {margin:0.429rem 0 1.643rem; height:auto;} #big_section .swiper-container.middle .swiper-slide {display:inline-block; width:auto; height:2.071rem; margin-right:2.143rem; color:#ABABAB; font-size:1.143rem; line-height:2.071rem; letter-spacing:-0.16px; text-align:center;} #big_section .swiper-container.middle .swiper-slide a {display:block; width:auto; height:2.071rem; padding:0; color:#ABABAB; font-size:1.143rem; line-height:2.071rem; letter-spacing:-0.16px; text-align:center; cursor:pointer;} #big_section .swiper-container.middle .swiper-slide.on {position:relative; z-index:10; color:#111; font-weight:700;} #big_section .swiper-container.middle .swiper-slide.on a {position:relative; z-index:10; color:#111; font-weight:700;} #big_section .swiper-container.middle .swiper-slide.on:after {position:absolute; bottom:0.214rem; left:0; width:100%; height:0.200rem; background:#FD5000; content:'';} #big_section .swiper-container.small .swiper-slide {display:inline-block; width:auto; height:2.714rem; margin-right:2.5px; color:#ABABAB; font-size:1.143rem; line-height:2.714rem; letter-spacing:-0.16px; text-align:center;} #big_section .swiper-container.small .swiper-slide a {display:block; width:auto; height:2.714rem; padding:0 1.286rem; border-radius:2.714rem; background:#F8F8F8; color:#111; font-size:1.071rem; font-weight:500; line-height:2.786rem; letter-spacing:-0.16px; text-align:center; cursor:pointer;} #big_section .swiper-container.small .swiper-slide.on {position:relative; z-index:10; color:#fff; font-weight:700;} #big_section .swiper-container.small .swiper-slide.on a {position:relative; z-index:10; background:#FD5000; color:#fff; font-weight:700;} #big_section .sort p {padding:0; color:#ABABAB; font-size:1rem;} #big_section .sort p span {color:#EB3B16; font-size:1rem; font-weight:600;} #big_section .sort select {position:static; top:1.214rem; right:6.25%; width:130px; padding:0 2.214rem 0 0; border:0; background:url('/_skin/bona/img/shop/select_down_black.png')no-repeat right center/0.786rem; color:#ABABAB; font-size:1rem;} #big_section .prd_normal li {padding:0 6.25%;} #big_section .prd_normal .col2 li {padding:0; padding-bottom:1.357rem;} #big_section .prd_normal li:first-child {padding-top:0 !important; border-top:0 !important;} .pbig_section .pbig_search {padding:0 6.25%;} .pbig_section .pbig_search form .box {position:relative;} .pbig_section .pbig_search form .box .basic_search {overflow:hidden; white-space:nowrap; text-overflow:ellipsis; width:100%; height:3.286rem; margin-bottom:0.714rem; padding-right:2.857rem; border:1px solid #E9E9E9; border-radius:4px; background:transparent; font-size:16px; color:#000;} .pbig_section .pbig_search form .box .basic_search::placeholder {color:#111;} .pbig_section .pbig_search form .box .btn {position:absolute; top:0.857rem; right:0.786rem; width:1.429rem; height:1.429rem;} .pbig_section .pbig_search form .box .btn:after {position:absolute; top:0; right:0; width:30px; height:30px; background:url('/_skin/bona/img/common/btn_fff.png')no-repeat center;} #big_section .funding_filter {display:grid; grid-template-columns:repeat(3,1fr); justify-content:start; align-items:center; position:relative; width:100%; height:48px; margin-top:35px; padding:0; border-bottom:1px solid #e3e3e3;} #big_section .funding_filter:after {position:absolute; top:-10px; left:0; width:100%; height:10px; background:#f9f9f9; content:'';} #big_section .funding_filter > li {width:100%; height:100%;} #big_section .funding_filter > li > a {display:flex; justify-content:center; align-items:center; width:100%; height:100%; padding:0; background:#fff; border-radius:0; color:#111; font-size:1.071rem;} #big_section .funding_filter > li[selected] > a {position:relative; font-weight:600;} #big_section .funding_filter > li[selected] > a:after {position:absolute; bottom:-2px; left:0; width:100%; height:3px; background:#FD5000; content:'';} #big_section .sort {position:relative; display:flex; justify-content:space-between; align-items:center; padding:0.714rem 6.25% 0rem;} #big_section .prd_basic .box .funding_timer_box {display:flex; align-items:center; justify-content:center; column-gap:5px; width:100%; height:50px; border:1px solid #FD5000; border-radius:4px; color:#FD5000; font-size:1.0714rem; font-weight:600;} #big_section .prd_basic .box .funding_timer_box * {color:#FD5000; font-size:1.0714rem; font-weight:600;} #big_section .prd_basic .box .funding_timer_box.end {border-color:#eee; background:#eee; color:#333;} #big_section .prd_basic .box .funding_timer_box.end * {color:#333; font-size:1.0714rem; font-weight:600;} /* 최근 검색어 css */ .search_wrap .box_search {display:block !important; left:50%; top:0; margin:0; padding-top:2.143rem; background:#EFECEA;} .search_wrap .box_search h1 {display:block; width:18.786rem; margin:0 auto 1.714rem;} .search_wrap .box_search h1 img {width:100%;} .search_wrap .box_search .keyword {margin:0 auto;} .search_wrap .box_search form {text-align:center; transition:all .4s;display: block;} .search_wrap .box_search form .box {margin:0 auto 2.500rem;} .search_wrap .box_search .close {display:inline-block;} .search_wrap .box_search .close a {display:inline-block; width:100%; height:100%;} @media only screen and (max-width:1239px) { .search_wrap .box_search {margin-left:-320px;} } @media only screen and (max-width:640px) { .search_wrap .box_search {left:0; margin-left:0;} } .box { position:relative ; margin: 0 auto 2.5rem; } .box .search_list_area { top:48px; width: 100%; border-radius: 8px; background:#fff; display:none;} .box .search_list_area .search_list_box { display: flex; flex-direction: row; align-items: center; justify-content: space-between; border-bottom: 1px solid #e3e3e3;} .box .search_list_area .search_list_box:hover {background:#f1faff;} .box .search_list_area .search_list_box:first-child { width: 100%; height: 30px; background:#F9F9F9; border-bottom: 0; cursor: default; border-bottom: 1px solid #e3e3e3; border-top: 1px solid #e3e3e3;} .box .search_list_area .search_list_box:first-child a {display: block; padding: 0 16px; font-size: 13px; color:#888; cursor: default;} .box .search_list_area .search_list_box:last-child { width: 100%; height: 42px; background:#F9F9F9; border-bottom: 0; border-radius: 0 0 8px 8px; flex-direction: row-reverse;cursor: default;} .box .search_list_area .search_list_box:last-child a {display: block; padding: 0 16px; font-size: 13px; color:#888; cursor: pointer;} .box .search_list_area .search_list_box .word { display: block; padding-left: 16px; font-size: 14px; font-weight: 500; color:#333; width: 85%; cursor: pointer; height: 3.571rem; display: flex; align-items: center;} .box .search_list_area .search_list_box .close { display: block; } .box .search_list_area .search_list_box .close:before { position: absolute; top: 50%; left: 50%; width: 16px; height: 2px; margin-left: -10px; background: #888; content: ''; transform: rotate(135deg); } .box .search_list_area .search_list_box .close:after { position: absolute; top: 50%; left: 50%; width: 16px; height: 2px; margin-left: -10px; background: #888; content: ''; transform: rotate(45deg); } /* 최근 검색어 css */ /* 20231101 탭 추가 */ /* .pbig_section .pbig_search form .type {display:flex; margin-bottom: 0.714rem;} .pbig_section .pbig_search form .type a {display:flex; justify-content:center; align-items:center; width:100%; height:40px; border:1px solid #E3E3E3;} .pbig_section .pbig_search form .type a.on {border-bottom:0; border-left: 1px solid #333; border-right: 1px solid #333; border-top: 1px solid #333; border-radius: 8px 8px 0 0; font-weight:600; background:#fff; color:#333;} .pbig_section .pbig_search form .type a.off {border-bottom: 1px solid #333; border-radius: 8px 8px 0 0; font-weight:400; background:#F9F9F9; color:#888;} */ .pbig_section .pbig_search form .type { display: flex; margin-bottom: 0.714rem; } .pbig_section .pbig_search form .type a { display: flex; justify-content: center; align-items: center; width: 100%; height: 40px; border: 1px solid #E3E3E3; } .pbig_section .pbig_search form .type a:nth-child(1) { border-radius: 40px 0 0 40px; } .pbig_section .pbig_search form .type a:nth-child(2) { border-left:0; } .pbig_section .pbig_search form .type a:nth-child(3) { border-radius: 0 40px 40px 0; border-left:0; } .pbig_section .pbig_search form .type a.on { border: 0; background: #F47743; font-weight: 600; color: #fff; } .pbig_section .pbig_search form .type a.off { background: #fff; font-weight: 600; color: #333; } /* 20231101 탭 추가 */ .pbig_section .pbig_search form .select {display:flex; justify-content:space-between; margin-bottom:0.286rem;} .pbig_section .pbig_search form select {width:23.6%; height:2.857rem; padding:0 20px; border-radius:2.857rem; color:#111; font-weight:600; line-height:2.857rem;} .pbig_section .swiper-container.middle {padding:0 4.16%;} .pbig_section .swiper-container.middle .swiper-slide {display:inline-block; width:auto;} .pbig_section .swiper-container.middle .swiper-slide a {color:#ABABAB; font-size:1.223rem; font-weight:500;} .pbig_section .swiper-container.middle .swiper-slide.on a {color:#ABABAB; font-size:1.223rem;} .pbig_section .swiper-container.middle {margin:0.429rem 0 1.643rem;} .pbig_section .swiper-container.middle .swiper-slide {display:inline-block; width:auto; height:2.071rem; margin-right:2.143rem; color:#ABABAB; font-size:1.143rem; line-height:2.071rem; letter-spacing:-0.16px; text-align:center;} .pbig_section .swiper-container.middle .swiper-slide a {display:block; width:auto; height:2.071rem; padding:0; color:#ABABAB; font-size:1.143rem; line-height:2.071rem; letter-spacing:-0.16px; text-align:center; cursor:pointer;} .pbig_section .swiper-container.middle .swiper-slide.on {position:relative; z-index:10; color:#111; font-weight:700;} .pbig_section .swiper-container.middle .swiper-slide.on a {position:relative; z-index:10; color:#111; font-weight:700;} .pbig_section .swiper-container.middle .swiper-slide.on:after {position:absolute; bottom:0.214rem; left:0; width:100%; height:0.200rem; background:#FD5000; content:'';} /* 상품상세페이지(/shop/detail.php) */ .detail_name {position:relative; height:60px; font-size:20px; font-weight:700; text-align:center; line-height:60px;} .detail_name span {display:inline-block; position:absolute; top:20px; right:31px; width:18px; height:18px; background:url('/_skin/bona/img/common/hd_close.png')no-repeat center/18px;} #detail {padding-bottom:5.000rem;} #detail .share {display:none; position:fixed; left:50%; top:0; width:640px; height:100%; z-index:40; background:rgba(0,0,0,0.5);} #detail .share .box {position:absolute; top:50%; left:50%; width:28.571rem; height:12.143rem; margin:-6.071rem 0 0 -14.286rem; padding:2.571rem 0; border-radius:10px; background:#fff;} #detail .share .box h3 {margin-bottom:1.357rem; font-size:1.286rem; text-align:center;} #detail .share .box > a {display:inline-block; position:absolute; top:1.429rem; right:1.429rem; width:1.429rem; height:1.429rem; background:url('/_skin/bona/img/shop/sns_close.png')no-repeat center/1.429rem;} #detail .share .list {font-size:0; text-align:center;} #detail .share .list li {display:inline-block; margin:0 0.286rem;} #detail .share .list li a {display:block; overflow:hidden; width:3.571rem; height:3.571rem; border-radius:50%; background-repeat:no-repeat; background-position:center; background-size:46px; text-align:center; text-indent:-9999px;} #detail .share .list li.kakao a {background-image:url('/_skin/bona/img/shop/icon_kakao.png');} #detail .share .list li.kakaostory a {background-image:url('/_skin/bona/img/shop/icon_kakaostory.png');} #detail .share .list li.twitter a {background-image:url('/_skin/bona/img/shop/icon_twitter.png');} #detail .share .list li.facebook a {background-image:url('/_skin/bona/img/shop/icon_facebook.png');} #detail .share .list li.url a {background-image:url('/_skin/bona/img/shop/icon_url.png');} #detail .prdimg {overflow:hidden; position:relative; text-align:center;} #detail .prdimg img {width:100%; height:auto;} #detail .prdimg .flag {position:absolute; top:1.143rem; left:2.143rem; z-index:20;} #detail .prdimg .flag img {width:3rem; height:auto;} #detail .prdimg .addimg {display:none;} #detail .addimg .swiper-pagination-progressbar {position:relative; top:auto; left:0; z-index:5; width:100%; height:0.286rem; background:#f2f2f2;} #detail .addimg .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {background:#1a1a1a;} #detail .addimg .swiper-horizontal > .swiper-pagination-bullets, #detail .addimg .swiper-pagination-bullets.swiper-pagination-horizontal {bottom:25px;} #detail .addimg .swiper-pagination .swiper-pagination-bullet {width:0.500rem; height:0.500rem; border:0; background:#E3E3E3; opacity:1;} #detail .addimg .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {width:2.143rem; height:0.500rem; border-radius:0.500rem; background:#FD5000;} #detail form .prd_info {padding:2.143rem 6.25% 0.500rem;} #detail .prd_info .icon {margin-bottom:1.214rem;} #detail .prd_info .icon img {width:auto; height:1.357rem; margin-right:0.143rem;} #detail .prd_info .test_icon {display:inline-block; width:3.000rem; height:1.500rem; background:#F3F3F3; font-size:0.857rem; line-height:1.500rem; text-align:center;} #detail .prd_info h2 {margin-bottom:1.143rem;} #detail .prd_info h2 .en {margin-bottom:0.286rem; color:#999; font-size:1.143rem; font-weight:400;} #detail .prd_info h2 .kr {color:#333; font-size:1.714rem; font-weight:600;} #detail .prd_info > .price {position:relative; margin-bottom:1.43rem; font-size:0;} #detail .prd_info > .price .consumer {margin-right:7px; color:#999; font-size:1.071rem; text-decoration:line-through;} #detail .prd_info > .price .consumerY {display:none;} #detail .prd_info > .price .percent {margin-right:7px; color:#FD5000; font-size:1.571rem; font-weight:700;} #detail .prd_info > .price .sell {display:block;} #detail .prd_info > .price .sell, #detail .prd_info > .price .sell * {font-size:1.571rem; font-weight:400; letter-spacing:-0.55px;} #detail .prd_info > .price .sell strong {font-weight:900;} #detail .prd_info > .price .sell span {display:none;} #detail .prd_info > .price .sell span.Y {display:inline; font-weight:900;} #detail .prd_info > .price .sellY {display:none;} #detail .prd_info > .price .sellY, #detail .prd_info > .price .sellY * {color:#888; font-size:1rem; font-weight:400; text-decoration:line-through;} #detail .prd_info > .price .discount, #detail .prd_info > .price .discount * {font-size:1.571rem; letter-spacing:-0.55px;} #detail .prd_info > .price .discount {display:none;} #detail .prd_info > .price .discountY {display:block;} #detail .prd_info > .price .coupon {display:inline-block; padding-right:20px; background:url('/_skin/bona/img/shop/download_coupon.png') no-repeat 90% center/10px #676767; cursor:pointer;} #detail .prd_info > .price .card_info {display:inline-block; position:absolute; top:0.429rem; right:0; height:1.357rem; padding-left:1.571rem; border-bottom:1px solid #333; background:url('/_skin/bona/img/shop/icon_creditcard.png')no-repeat left top/1.429rem; font-weight:500; cursor:pointer;} #detail .card_view {display:none; position:fixed; top:0; left:50%; z-index:99; width:640px; height:100%; background:rgba(0,0,0,0.5);} #detail .card_view img {position:absolute; top:50%; left:50%; width:65%; height:auto; transform:translate(-50%,-50%);} #detail .prd_info > .price .coupon strong {display:inline-block; padding:2px 5px; background:#363636; color:#fff; font-size:0.917rem; font-weight:normal; letter-spacing:-1px;} #detail .prd_info .pop_coupon {display:none; position:fixed; left:0; top:50%; z-index:1001; width:100%; padding:15px; border:1px solid #d9d9d9; background:#fff;} #detail .prd_info .pop_coupon > h2 {color:#000; font-size:1.167rem;} #detail .prd_info .pop_coupon > .count {margin-top:20px; padding:15px 20px; background:#fafafa;} #detail .prd_info .pop_coupon > .list {overflow:auto; max-height:200px; margin-top:10px;} #detail .prd_info .pop_coupon > .list > li {position:relative; padding:15px 130px 15px 15px; border-bottom:1px solid #e0e0e0; text-align:left;} #detail .prd_info .pop_coupon > .list > li:first-child {border-top:1px solid #e0e0e0;} #detail .prd_info .pop_coupon > .list > li > div.name {font-weight:bold;} #detail .prd_info .pop_coupon > .list > li > div.btn {position:absolute; right:15px; top:50%; margin-top:-13px;} #detail .prd_info .pop_coupon > .list > li > div.btn span.box_btn * {min-width:100px;} #detail .prd_info .pop_coupon > .list > li > div.btn span.fin {display:inline-block; min-width:100px; padding:4px 8px; border:1px solid #676767; background-color:#fff; color:#000; text-align:center;} #detail .prd_info .pop_coupon > .close {display:inline-block; position:absolute; right:15px; top:10px; width:21px; height:21px; background:url('/_skin/bona/img/button/close.png') no-repeat center / 16px; text-indent:-9999px; cursor:pointer;} #detail .prd_info > .summary {padding-top:5px; color:#888; word-break:break-all;} #detail .prd_info > .sbs {margin-top:15px; border:1px solid #e5e5e5; text-align:center;} #detail .prd_info > .sbs > label {display:inline-block; margin:0 15px; line-height:40px; cursor:pointer;} #detail .prd_info > .sbs > label > input {vertical-align:middle;} #detail .prd_info > .today {margin-top:10px; padding:10px; border:1px solid #e5e5e5;} #detail .prd_info > .today > span {display:block; padding-top:5px; color:#666;} #detail .info .buy_info {display:block; opacity:0; visibility:hidden; position:fixed; bottom:0; left:50%; z-index:100; width:640px; height:100%;} #detail .info .buy_info.on {opacity:1; visibility:visible;} #detail .info .buy_info .buy_bg {position:fixed; bottom:0; left:50%; z-index:66; width:640px; height:100%; background:rgba(0,0,0,0.5);} #detail .info .buy_info .buy_info_wrap {position:fixed; bottom:-100%; left:50%; z-index:66; width:640px; padding-bottom:0.714rem; border-radius:20px 20px 0 0; background:#fff; -webkit-transform:all 0.3s ease; -moz-transform:all 0.3s ease; -ms-transform:all 0.3s ease; transition:all 0.3s ease;} #detail .info .buy_info.on .buy_info_wrap {bottom:0;} #detail .info .buy_info .close {display:block; position:relative; padding:1.000rem 0; text-align:center; cursor:pointer;} #detail .info .buy_info .close span {display:inline-block; width:4.286rem; height:1.071em; border-radius:0.357rem; background:url('/_skin/bona/img/common/sheet_close.png')no-repeat center/3.857rem;} #detail .info .buy_info .pickup_shop {padding:0 6.25%;} #detail .info .buy_info .pickup_shop h3 {padding:0.714rem 0 0.429rem; background:#fff; color:#333; font-size:1.429rem;} #detail.N .info .buy_info .pickup_shop {display:none;} #detail .info .buy_info .selected_addr {margin-bottom:0.714rem;} #detail .info .buy_info .selected_addr input[type=text] {width:calc(100% - 7.143rem); height:3.571rem; padding:0 1.429rem; border:0; border-radius:0.286rem; background:#F9F9F9;} #detail.Y .info .buy_info .selected_addr input[type=text] {width:100%;} #detail .info .buy_info .selected_addr input[type=button] {width:5.714rem; height:3.571rem; margin-left:1.429rem; padding-left:1.500rem; border:0; border-radius:0.286rem; border:0; background:url('/_skin/bona/img/common/hd_search.png')no-repeat left center/1.429rem; color:#333; font-size:1.071rem; font-weight:600; cursor:pointer;} #detail.Y .info .buy_info .selected_addr input[type=button] {display:none;} #detail .info .buy_info .selected_addr_detail input[type=text] {width:100%; height:3.571rem; padding:0 1.429rem; border:0; border-radius:0.286rem; background:#F9F9F9;} #detail .info .buy_info .selected_addr_detail label {font-size:1.071rem;} #detail .pickup_time {height:3.857rem; margin-bottom:1.071rem; padding:0 3.429rem; border-radius:0.429rem; background:#FEF8D6 url('/_skin/bona/img/shop/icon_time.png')no-repeat left 1.071rem center/1.857rem; background-position:left 0.571rem center; font-size:1.143rem; line-height:3.857rem; letter-spacing:-0.16px; line-height: initial; padding: 10px 40px 10px 40px; height: auto;} #detail.SN .pickup_time {display:none;} #detail.N .pickup_time {display:none;} #detail .pickup_time strong {font-size:1.143rem; font-weight:600; letter-spacing:-0.16px; line-height: initial; padding: 10px 40px 10px 40px; height: auto;} #detail .pickup_msg {padding-left:1.857rem; background:url('/_skin/bona/img/shop/icon_bell.png')no-repeat left top/1.143rem; color:#999999; font-size:1.071rem; letter-spacing:-0.3px;} #detail.N .pickup_msg {display:none;} #detail .pickup_msg ul {margin-top:1.214rem;} #detail .pickup_msg ul li {margin-bottom:0.143rem; color:#999999; font-size:1.071rem; letter-spacing:-0.3px;} #detail .info .buy_info .list {width:100%; margin-top:1px; border-width:1px 0;} #detail .info .buy_info .list.set_table {margin-top:-1px;} #detail .info .buy_info .list > tbody > tr > th {padding:0.429rem 0; color:#333; font-size:1.071rem; font-weight:normal; text-align:left; vertical-align:middle;} #detail .info .buy_info .list > tbody > tr > td {padding:0.429rem 0; color:#333; text-align:left; vertical-align:middle;} #detail .info .buy_info .list > tbody > tr > td .box_qty {width:9.286rem; height:2.857rem;} #detail .info .buy_info .list > tbody > tr > td .box_qty .form_input {width:9.286rem; height:2.857rem;} #detail .info .buy_info .list > tbody > tr > td .box_qty a {width:3.071rem; height:2.857rem; background-size:0.929rem;} #detail .info .buy_info .list > tbody > tr:first-child > th, #detail .info .buy_info .list > tbody > tr:first-child > td {padding-top:20px;} #detail .info .buy_info .list > tbody > tr:last-child > th, #detail .info .buy_info .list > tbody > tr:last-child > td {padding-bottom:20px;} #detail .info .buy_info .list > tbody > tr > td input[type=text], #detail .info .buy_info .list > tbody > tr > td select {width:100%; height:2.857rem;} #detail .info .buy_info .list > tbody > tr > td .box_info {display:inline-block; position:relative;} #detail .info .buy_info .list > tbody > tr > td .box_info .info {display:none; position:absolute; left:20px; top:-8px; z-index:10; width:150px; padding:5px 10px; border:1px solid #dcdcdc; background:#fff;} #detail .info .buy_info .list > tbody > tr > td .box_info .info.delivery {left:-100px; top:25px; width:230px;} #detail .info .buy_info .list > tbody > tr > td .box_info:hover .info {display:block;} #detail .info .buy_info .list_set {margin-top:20px; border-bottom:1px solid #e0e0e0; text-align:left;} #detail .info .buy_info .list_set > h3 {padding:10px 0; border:1px solid #e0e0e0; border-width:1px 0;} #detail .info .buy_info .list_set > .box {overflow:auto; max-height:335px;} #detail .info .buy_info .list_set > .box > ul {margin-bottom:-1px;} #detail .info .buy_info .list_set > .box > ul > li {overflow:hidden; position:relative; padding:15px 0; border-top:1px solid #e0e0e0;} #detail .info .buy_info .list_set > .box > ul > li:first-child {border-top:0;} #detail .info .buy_info .list_set > .box > ul > li > div {margin-left:110px;} #detail .info .buy_info .list_set > .box > ul > li > div.img {float:left; width:90px; margin-left:0;} #detail .info .buy_info .list_set > .box > ul > li > div.img img {width:100%; height:auto;} #detail .info .buy_info .list_set > .box > ul > li > div.info {margin-bottom:7px;} #detail .info .buy_info .list_set > .box > ul > li > div.info * {font-size:1.083rem;} #detail .info .buy_info .list_set > .box > ul > li > div.opt {padding-bottom:7px;} #detail .info .buy_info .list_set > .box > ul > li > div.opt input[type=text], #detail .info .buy_info .list_set > .box > ul > li > div.opt select {width:100%; margin:3px 0;} #detail .info .buy_info .list_set > .box > ul > li > div.btn .quick {position:absolute; top:15px; right:0;} #detail .info .buy_info .list_set > .box > ul > li > div.btn .quick > a {width:34px; height:34px; background:url('/_skin/bona/img/shop/icon_set_quick.png') no-repeat center/14px; color:transparent; font-size:0; text-indent:-9999px;} #detail .info .buy_info .list_set.select > .box > ul > li > div.info {padding-right:40px;} #detail .info .buy_info .restock {padding-top:20px;} #detail .info .buy_info .restock > p {padding-bottom:10px; letter-spacing:-0.5px;} #detail .info .buy_info .multi_opt {margin-top:-1px;} #detail .info .buy_info .multi_opt .selected_list > li:after {display:block; clear:both; content:'';} #detail .info .buy_info .multi_opt .selected_list > li {position:relative; padding:1.357rem 10px 1.357rem 0; border-top:1px dashed #ABABAB; font-size:0;} #detail .info .buy_info .multi_opt .selected_list > li:first-child {border-top:1px solid #eee;} #detail .info .buy_info .multi_opt .selected_list > li > *{vertical-align:middle;} #detail .info .buy_info .multi_opt .selected_list > li .name {display:inline-block; width:50%; word-break:break-all;} #detail .info .buy_info .multi_opt .selected_list > li .box_qty {display:inline-block; width:7.143rem;} #detail .info .buy_info .multi_opt .selected_list > li .prd {display:inline-block; width:calc(50% - 100px); padding-right:2.857rem; font-size:1.071rem; font-weight:600; text-align:right;} #detail .info .buy_info .multi_opt .selected_list > li .prd * {font-size:1.071rem; font-weight:600;} #detail .info .buy_info .multi_opt .selected_list > li .del {position:absolute; right:0; top:50%; margin-top:-5px;} #detail .info .buy_info .multi_opt .selected_list > li .del img {width:10px; height:10px; vertical-align:top;} #detail .info .buy_info .multi_opt .opt_total {clear:both; position:relative; padding:1.714rem 0; border-top:0.071rem solid #F6F6F6; text-align:right;} #detail .info .buy_info .multi_opt .opt_total .title {position:absolute; left:0; top:50%; margin-top:-10px; font-size:1.286rem; font-weight:500;} #detail .info .buy_info .multi_opt .opt_total strong, #detail .info .buy_info .multi_opt .opt_total strong * {color:#333; font-size:1.286rem;} #detail .info .buy_info .multi_opt .opt_total .coupon {display:inline-block; margin-right:5px; padding:2px 20px 2px 5px; border:1px solid #c3c3c3; background:url('/_skin/bona/img/shop/apply_coupon.png') no-repeat 90% center; font-size:11px; cursor:pointer;} #detail .info .buy_info .box_btn > * {height:3.571rem; padding:0; font-size:1.071rem; font-weight:600; line-height:3.571rem; letter-spacing:-0.15px;} #detail .info .fake_btn {position:fixed; bottom:0; left:50%; z-index:20; width:640px; height:5.000rem; padding:10px 2.143rem; background:#fff; font-size:0;} #detail .info .fake_btn .radius {display:inline-block; width:3.571rem; height:3.571rem;} #detail .info .fake_btn .radius a {display:inline-block; width:3.571rem; height:3.571rem; border:1px solid #EEEEEE; border-radius:50%;} #detail .info .fake_btn .sns {margin-right:0.714rem; background:url('/_skin/bona/img/shop/btn_sns.png')no-repeat center/3.571rem; vertical-align:middle;} #detail .info .fake_btn .wish {vertical-align:middle;} #detail .info .fake_btn .wish a {background:url('/_skin/bona/img/shop/btn_detailwish.png')no-repeat center/3.571rem; vertical-align:middle;} #detail .info .fake_btn .wish a.wish_on {background:url('/_skin/bona/img/shop/btn_detailwish_on.png')no-repeat center/3.571rem; vertical-align:middle;} #detail .info .fake_btn .buy {display:none; width:calc(100% - 7.857rem); height:3.571rem; padding-left:1.429rem; vertical-align:middle;} #detail .info .fake_btn .buy * {display:inline-block; width:100%; height:3.571rem; background:#FD5000; border-radius:4px; color:#fff; font-size:1.143rem; font-weight:600; line-height:3.571rem; text-align:center; letter-spacing:-0.16px;} #detail .info .fake_btn .buy a.funding_off {background:#EEE; color:#333 !important;} #detail .info > .btn .wish.on * {background-image:url('/_skin/bona/img/button/wish_on.png');} /* 240401 펀딩버튼 */ #detail .info .fake_btn .alarm_btn {display:none; width:calc(100% - 7.857rem); height:3.571rem; padding-left:1.429rem; vertical-align:middle;} #detail .info .fake_btn .btn_field {display:flex; justify-content:space-between; align-items:center; column-gap:10px; width:100%; height:100%;} #detail .info .fake_btn .btn_field .funding_alarm, #detail .info .fake_btn .btn_field .timer_field {display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-align:center;} #detail .info .fake_btn .btn_field .timer_field > a {display:flex; justify-content:center; align-items:center; width:100%; height:100%; border:none; border-radius:4px; color:#333; font-size:1.142rem; font-weight:600; letter-spacing:-0.16px;} #detail .info .fake_btn .btn_field .funding_alarm > a {display:flex; justify-content:center; align-items:center; width:100%; height:100%; border:1px solid #707070; border-radius:4px; color:#333; font-size:1.142rem; font-weight:600; letter-spacing:-0.16px;} #detail .info .fake_btn .btn_field .timer_field {width:100%; height:100%; background:#eee; border-radius:4px; color:#333; font-size:1.142rem; font-weight:600; letter-spacing:-0.16px;} #detail .info .fake_btn .btn_field .timer_field ._funding_timer > span {color:#333; font-size:1.142rem; font-weight:600; letter-spacing:-0.16px;} #detail .info > .pay {text-align:center;} #detail .info > .pay > div {margin-top:10px;} #detail .info_grade {margin-bottom:2.857rem; font-size:0;} #detail .info_grade > * {display:inline-block; vertical-align:top;} #detail .info_grade .grade {margin-right:5px;} #detail .info_grade .grade .icon {display:inline-block; position:relative; width:5.643rem; height:1.071rem; margin-bottom:0; background:url('/_skin/bona/img/shop/grade.png') no-repeat left top/cover;} #detail .info_grade .grade .icon > i {display:block; position:absolute; left:0; top:0; height:100%; background:url('/_skin/bona/img/shop/grade_over.png') no-repeat left top/80px 15px;} #detail .info_grade .average {margin-right:3px; color:#333333; font-weight:500;} #detail .info_grade .total {color:#999999; font-weight:500;} #detail .tab_area {height:48px; margin-bottom:20px;} #detail .tab_area > .tab:after {display:block; clear:both; content:'';} #detail .tab_area > .tab li {float:left; width:25%; text-align:center;} #detail .tab_area > .tab li a {display:block; padding:15px 0; background:#fafafa; border:1px solid #c3c3c3; border-width:1px 0 1px 1px; color:#888;} #detail .tab_area > .tab li a.active {background:#fff; border-bottom-color:#fff; color:#333; font-weight:bold;} #detail .tab_area > .tab li:first-child a {border-left:0;} #detail .tab_area > .tab.fixed {position:fixed; left:40%; top:69px; z-index:10; max-width:640px; width:100%; background:#fff;} #detail .wrap_info .taste {margin-bottom:5.000rem; padding:3.000rem 0 2.500rem; border-radius:6px; background:#F7F2EF;} #detail .wrap_info .taste h3 {margin-bottom:1.286rem; font-size:1.571rem; text-align:center;} #detail .wrap_info .taste dl {margin-bottom:0.571rem; font-size:0; text-align:center;} #detail .wrap_info .taste dl dt {display:inline-block; font-size:1.071rem; font-weight:600; vertical-align:middle;} #detail .wrap_info .taste dl dd {display:inline-block; width:63.4%; margin-left:1.000rem; font-size:0; vertical-align:middle;} #detail .wrap_info .taste dl span {display:inline-block; width:19.5%; margin-left:0.071rem; height:0.857rem;} #detail .wrap_info .taste dl span.gage1 {border-radius:0.857rem 0 0 0.857rem; background:#910000; opacity:0.2;} #detail .wrap_info .taste dl span.gage2 {background:#910000; opacity:0.4;} #detail .wrap_info .taste dl span.gage3 {background:#910000; opacity:0.6;} #detail .wrap_info .taste dl span.gage4 {background:#910000; opacity:0.8;} #detail .wrap_info .taste dl span.gage5 {border-radius:0 0.857rem 0.857rem 0; background:#910000; opacity:1;} #detail .wrap_info .taste dl dd.level1 span.gage2 {background:#fff; opacity:1;} #detail .wrap_info .taste dl dd.level1 span.gage3 {background:#fff; opacity:1;} #detail .wrap_info .taste dl dd.level1 span.gage4 {background:#fff; opacity:1;} #detail .wrap_info .taste dl dd.level1 span.gage5 {border-radius:0 0.857rem 0.857rem 0; background:#fff; opacity:1;} #detail .wrap_info .taste dl dd.level2 span.gage3 {background:#fff; opacity:1;} #detail .wrap_info .taste dl dd.level2 span.gage4 {background:#fff; opacity:1;} #detail .wrap_info .taste dl dd.level2 span.gage5 {border-radius:0 0.857rem 0.857rem 0; background:#fff; opacity:1;} #detail .wrap_info .taste dl dd.level3 span.gage4 {background:#fff; opacity:1;} #detail .wrap_info .taste dl dd.level3 span.gage5 {border-radius:0 0.857rem 0.857rem 0; background:#fff; opacity:1;} #detail .wrap_info .taste dl dd.level4 span.gage5 {border-radius:0 0.857rem 0.857rem 0; background:#fff; opacity:1;} #detail .wrap_info .tabcnt_detail h3 {color:#333; font-size:1.429rem;} #detail .wrap_info .tabcnt_detail.tabcnt_detail0 h3 {padding:0 6.25%; color:#333; font-size:1.429rem;} #detail .wrap_info .detail_info, #detail .wrap_info .common_info {margin-top:1.071rem; word-break:break-all;} #detail .wrap_info .detail_info {margin-bottom:20px;} #detail .wrap_info .detail_info * {font-family:'Pretendard',sans-serif; font-size:inherit; text-align:inherit; line-height:inherit;} #detail .wrap_info .detail_info + .box_btn {display:block; margin:0.071rem auto 2.857rem;} #detail .wrap_info .detail_info + .box_btn > * {width:11.429rem; height:2.857rem; padding:0 4.643rem 0 3.929rem; border:0; border-radius:2.857rem; background:#FD5000 url('/_skin/bona/img/common/toggle_down.png')no-repeat right 3.286rem top 0.786rem/1.286rem; color:#fff !important; font-size:1.071rem; font-weight:500; line-height:2.857rem; box-shadow:0px 0.714rem 0.714rem #8585851A;} #detail .wrap_info .detail_info + .box_btn > *.wing-detail-more-hide {background:#FD5000 url('/_skin/bona/img/common/ft_toggle_up_w.png')no-repeat right 3.286rem top 0.786rem/1.286rem;} #detail .wrap_info .detail_info + .box_btn > * * {display:inline-block; padding-right:1.357rem; border:0; color:#fff; font-size:1.071rem; font-weight:500; line-height:2.857rem;} #detail .wrap_info .detail_info img, #detail .wrap_info .common_info img {max-width:100%; height:auto; font-size:0; line-height:0;} #detail .wrap_info .detail_qnarev .title_btn {padding-bottom:15px;} #detail .wrap_info .detail_qnarev .title_btn:after {display:block; clear:both; content:'';} #detail .wrap_info .detail_qnarev .title_btn h3 {float:left; padding-top:7px; font-size:1.167rem;} #detail .wrap_info .detail_qnarev .title_btn h3 span {color:#888; font:inherit;} #detail .wrap_info .detail_qnarev .title_btn .btn {float:right;} #detail .wrap_info .detail_qnarev .more {margin-top:10px;} #detail .detail_related .title {margin-bottom:0.357rem; padding:0.857rem 6.25%; font-size:1.417rem; text-align:left;} #detail .detail_related .swiper-container {padding:0 6.25%;} #detail #review_area .info {padding:0;} #detail .detail_related .info > .price {margin-bottom:0;} #detail .detail_related .box_btn {margin-top:10px;} #detail .cart_slide {margin-bottom:2.500rem;} #detail .cart_slide h3 {margin-bottom:1.214rem; padding:0 6.25%; font-size:1.417rem; text-align:left;} #detail .cart_slide .swiper-container {padding:0 6.25%;} #detail .title_qnarev {position:relative; margin-top:2.000rem; padding-bottom:0.571rem;} #detail .title_qnarev.none {border-bottom:0;} #detail .title_qnarev > h3 {margin-bottom:0.357rem; font-size:1.417rem; text-align:left;} #detail .title_qnarev > h3 > span {font-size:inherit;} #detail .title_qnarev > .btn {position:absolute; right:0; top:0.357rem; font-size:0;} #detail .title_qnarev > .btn > a {display:inline-block; position:relative; margin-left:1.000rem; padding-left:18px; color:#666; background-repeat:no-repeat; background-position:left center;} #detail .title_qnarev > .btn > a:last-child:after {display:none;} #detail .title_qnarev > .btn > a.write {background-image:url('/_skin/bona/img/shop/btn_write.png'); background-size:16px auto;} #detail .title_qnarev > .btn > a.list {background-image:url('/_skin/bona/img/shop/btn_list.png'); background-size:17px auto;} #detail .title_qnarev > .sort {padding:0.357rem 0 0.500rem; font-size:0;} #detail .title_qnarev > .sort > li {display:inline-block;} #detail .title_qnarev > .sort > li:after {display:inline-block; width:0.143rem; height:0.143rem; margin:0.571rem 0.714rem 0 0.714rem; border-radius:50%; background-color:#999; vertical-align:top; content:'';} #detail .title_qnarev > .sort > li:last-child:after {display:none;} #detail .title_qnarev > .sort > li a {color:#ABABAB;} #detail .title_qnarev > .sort > li a.selected {color:#FD5000; font-weight:600;} #detail #review_area {border-top:1px solid #333;} #detail .detail_qnarev > .summary {padding:2.143rem 0; border-radius:6px; background-color:#F6F6F6; font-size:0; text-align:center;} #detail .detail_qnarev > .summary > div {display:inline-block; width:50%; vertical-align:middle;} #detail .detail_qnarev > .summary > div > h4 {font-weight:normal;} #detail .detail_qnarev > .summary > div.grade .icon {display:inline-block; position:relative; width:9.643rem; height:1.786rem; margin-top:0.714rem; background:url('/_skin/bona/img/shop/grade.png') no-repeat left top/cover;} #detail .detail_qnarev > .summary > div.grade .icon > i {display:block; position:absolute; left:0; top:0; height:100%; background:url('/_skin/bona/img/shop/grade_over.png') no-repeat left top/9.643rem 1.786rem;} #detail .detail_qnarev > .summary > div.grade .average {color:#bebebe; font-size:30px;} #detail .detail_qnarev > .summary > div.grade .average strong {color:#333; font-size:inherit;} #detail .detail_qnarev > .summary > div.ratio .graph {display:block;} #detail .detail_qnarev > .summary > div.ratio .graph > li {display:block; width:100%; padding:0.214rem 0; font-size:0;} #detail .detail_qnarev > .summary > div.ratio .graph > li span {display:inline-block;} #detail .detail_qnarev > .summary > div.ratio .graph > li .score {min-width:1.357rem; font-size:0.929rem;} #detail .detail_qnarev > .summary > div.ratio .graph > li .bar {width:12.857rem; height:0.571rem; margin:0 0.571rem; border-radius:5px; background-color:#fff; font-size:0; text-align:left;} #detail .detail_qnarev > .summary > div.ratio .graph > li .bar > i {display:inline-block; height:100%; border-radius:inherit; background-color:#b8b7b7;} #detail .detail_qnarev > .summary > div.ratio .graph > li .bar.max > i {background-color:#FD5000;} #detail .detail_qnarev > .summary > div.ratio .graph > li .bar.min > i {background-color:#FD5000;} #detail .detail_qnarev > .summary > div.ratio .graph > li .count {min-width:1.786rem; border-radius:5px; font-size:0.929rem; text-align:left;} #detail .detail_qnarev > .summary > div.ratio .graph > li .count.max {color:#FD5000; font-weight:600;} #detail #detail_review_ajax_list {margin-bottom:4.000rem;} #detail #review_area.list {margin-bottom:2.143rem;} #detail #review_area.list > li {width:100%; padding:2.214rem 0 2.143rem; border-bottom:1px solid #e0e0e0;} #detail #review_area.list > li:first-child {padding-top:1.571rem;} #detail #review_area.list > li > .info {padding:0; vertical-align:middle;} #detail #review_area.list > li > .info .review_area {border-top:1px solid #333;} #detail #review_area.list > li > .info {position:relative;} #detail #review_area.list > li > .info .grade {display:inline-block; margin-top:-0.071rem; padding-left:0.357rem; font-weight:500; vertical-align:top;} #detail #review_area.list > li > .info .name {position:absolute; top:-0.357rem; right:0; padding-top:5px; color:#888;} #detail #review_area.list > li > .info .name span {display:inline-block; position:relative; padding:0 0.786rem; color:#999; font-size:0.929rem;} #detail #review_area.list > li > .info .name span:first-child:after {position:absolute; top:3px; right:0; width:1px; height:0.786rem; background:#E3E3E3; content:'';} #detail #review_area.list > li > .info .prd_name {padding-top:10px;} #detail #review_area.list > li > .info .prd_name a {color:#555; font-size:1.167rem;} #detail #review_area.list > li > .info .title, #detail #review_area.list > li > .info .title * {font-size:1.143em; font-weight:600;} #detail #review_area.list > li > .info .title {padding-top:0.500rem;} #detail #review_area.list > li > .info .title img {width:auto; height:18px; vertical-align:middle;} #detail #review_area.list > li > .info .title .best {display:inline-block; padding:0 3px; background:#f00; color:#fff !important;} #detail #review_area.list > li > .info .content {padding-top:0.643rem; color:#ABABAB; line-height:23px;} #detail #review_area.list > li > .info .more {display:inline-block; padding-top:10px; color:#ABABAB; font-size:0.929rem; text-decoration:underline;} #detail #review_area.list li .upfile {width:9.286rem; margin-top:0.857rem; vertical-align:middle;} #detail #review_area.list li .upfile a {display:block; position:relative; overflow:hidden; width:9.286rem; height:9.286rem; vertical-align:middle;} #detail #review_area.list li .upfile a img {position:absolute; top:50%; left:50%; width:9.286rem; height:auto; transform:translate(-50%, -50%);} #detail #review_area.list li .upfile .count {display:block; position:absolute; bottom:0; right:0; width:1.286rem; height:1.286rem; background-color:#FD5000; color:#fff; font-size:0.857rem; text-align:center; line-height:1.286rem;} #detail .list_photo {position:relative; width:100%; font-size:0;} #detail .list_photo .slick-dots {margin-top:10px;} #detail .list_photo .frame {margin-right:0.500rem;} #detail .list_photo .box {display:block; position:relative; overflow:hidden; width:100%; vertical-align:middle;} #detail #qna {margin-bottom:4.214rem;} #detail .tabcnt_detail3 h3 {margin-bottom:1.000rem; font-size:1.429rem;} #detail .tabcnt_detail3 .box {padding:1.929rem 0 0; border-top:1px solid #333;} #detail .tabcnt_detail3 .box dl {overflow:hidden; height:0;} #detail .tabcnt_detail3 .box dl.dl0, #detail .tabcnt_detail3 .box dl.dl2 {height:auto !important; margin-bottom:1.643rem !important;} #detail .tabcnt_detail3 .box dl.on {height:auto; margin-bottom:1.643rem;} #detail .tabcnt_detail3 .box dl br {display:none;} #detail .tabcnt_detail3 .box dl dt {margin-bottom:0.429rem; font-size:1.214rem; font-weight:600;} #detail .tabcnt_detail3 .box dl dd {padding:0.286rem 0; color:#999; font-size:1.071rem; line-height:1.571rem;} #detail .list_photo .box > img {width:100%; height:auto; border-radius:;} .detail_gift {border-top:0.143rem solid #F6F6F6;} .detail_gift > p {position:relative; padding:1.500rem 0; font-size:1.071rem;} .detail_gift > p span {display:inline-block; position:absolute; top:50%; right:0; width:1.714rem; height:1.714rem; margin-top:-0.857rem; background:url('/_skin/bona/img/etc/btn_toggle.png')no-repeat center/1.714rem;} .detail_gift.close2 > p span {transform:rotate(180deg);} .detail_gift ul {overflow-y:scroll; position:relative; max-height:16.714rem; height:auto; transform:all 0.3s ease;} .detail_gift ul::-webkit-scrollbar {display:none;} .detail_gift.close2 ul {overflow:hidden; height:0;} .detail_gift ul li {margin-bottom:10px;} .detail_gift ul li .box {font-size:0;} .detail_gift ul li .box > * {display:inline-block; vertical-align:middle;} .detail_gift ul li .box .chk {width:5.35%;} .detail_gift ul li .box .img {width:17.85%;} .detail_gift ul li .box .img img {width:100%; height:auto;} .detail_gift ul li .box .center {width:54.28%; font-size:0;} .detail_gift ul li .box .center > * {display:inline-block; vertical-align:middle;} .detail_gift ul li .box .name {width:67.10%; padding:0 10px;} .detail_gift ul li .box .box_qty2 {display:inline-block; position:relative; width:7.143rem; height:2.143rem; margin:0;} .detail_gift ul li .box .box_qty2 input {width:7.143rem; height:2.143rem; text-align:center;} .detail_gift ul li .box .box_qty2 .ea_up {display:inline-block; position:absolute; right:0; top:0; width:1.857rem; height:2.143rem; background:url('/_skin/bona/img/shop/cart_plus.png') no-repeat center/0.643rem; cursor:pointer;} .detail_gift ul li .box .box_qty2 .ea_down {display:inline-block; position:absolute; left:0; top:0; width:1.857rem; height:2.143rem; background:url('/_skin/bona/img/shop/cart_minus.png') no-repeat center/0.643rem; cursor:pointer;} .detail_gift ul li .box .prc {width:22.52%; text-align:right;} /* 상품상세페이지 - 개인결제 (/shop/detail_private.php) */ #detail.private .info {text-align:center;} #detail.private .info > .price .sell, #detail.private .info > .price .sell * {font-size:2rem;} #detail.private .info > .btn {padding-right:0;} /* 퀵프리뷰 - 팝업(/shop/detail_popup.php) */ #detail_pop {position:relative; height:100vh; padding:0;} #detail_pop #detail .info .buy_info .list > tbody > tr > td .box_qty {height:3.333rem;} #detail_pop #detail form {background:#fff;} #detail_pop .box_qty .form_input {width:8.333rem; height:2.500rem;} #detail_pop .box_qty .minus {width:2.167rem; height:2.500rem; background-size:0.750rem;} #detail_pop .box_qty .plus {width:2.167rem; height:2.500rem; background-size:0.750rem;} #detail_pop #detail .info .buy_info .close {padding:1.167rem 0; height:0.833rem;} #detail_pop #detail > .close {display:block; overflow:hidden; position:absolute; right:0; top:0; z-index:5; width:46px; height:46px; background:url('/_skin/bona/img/button/close.png') no-repeat center/16px; text-indent:-9999px; cursor:pointer;} #detail_pop #detail .info .buy_info .close span {width:4.500rem;} #detail_pop #detail .prd_info h2 .kr {font-size:1.833rem;} #detail_pop #detail .prd_info > .price .consumer {font-size:1.250rem;} #detail_pop #detail .prd_info > .price .percent {font-size:1.833rem;} #detail_pop #detail .prd_info > .price .sell, #detail_pop #detail .prd_info > .price .sell * {font-size:1.833rem;} #detail_pop #detail .prd_info > .price .card_info {height:1.500rem; padding-left:1.750rem; background-size:1.667rem; font-size:1.167rem;} #detail_pop #detail .info_grade .grade .icon {width:6.583rem; height:1.250rem;} #detail_pop #detail .info_grade .total {font-size:1.167rem;} #detail_pop #detail .info .buy_info .list > tbody > tr > td .box_qty .form_input {width:10.833rem; height:3.333rem; font-size:1.167rem;} #detail_pop #detail .info .buy_info .list > tbody > tr > td .box_qty a {width:3.583rem; height:3.333rem;} #detail_pop #detail .info .buy_info .list > tbody > tr > th {font-size:1.250rem;} #detail_pop #detail .info .buy_info .list > tbody > tr > td {font-size:1.250rem;} #detail_pop #detail .info .buy_info .list > tbody > tr > td input[type=text], #detail_pop #detail .info .buy_info .list > tbody > tr > td select {height:3.333rem; font-size:1.167rem;} #detail_pop #detail .info .buy_info .multi_opt .opt_total .title {font-size:1.500rem;} #detail_pop #detail .info .buy_info .multi_opt .opt_total strong, #detail_pop #detail .info .buy_info .multi_opt .opt_total strong * {font-size:1.500rem;} #detail_pop #detail .info .buy_info .box_btn > * {height:4.167rem; font-size:1.250rem; line-height:4.167rem;} #detail_pop #detail .info .buy_info .multi_opt .selected_list > li .name {font-size:1.167rem;} #detail_pop #detail .info .buy_info .multi_opt .selected_list > li .prd {font-size:1.250rem;} #detail_pop #detail .info .buy_info .multi_opt .selected_list > li .prd * {font-size:1.250rem;} #detail_pop #detail .info .fake_btn {height:5.833rem;} #detail_pop #detail .info .fake_btn .radius a {width:4.167rem; height:4.167rem; background-size:4.167rem; font-size:1.333rem; line-height:4.167rem;} #detail_pop #detail .info .fake_btn .radius {width:4.167rem; height:4.167rem; background-size:4.167rem;} #detail_pop #detail .info .fake_btn .buy {width:calc(100% - 9.083rem); height:4.167rem; padding-left:1.667rem;} #detail_pop #detail .info .fake_btn .buy * {height:4.167rem; font-size:1.333rem; line-height:4.167rem;} /* 장바구니(/shop/cart.php) */ #cart {padding-bottom:10.786rem; background:#F8F8F8;} #cart .cart_banner img {width:100%;} #cart:after {display:block; clear:both; content:'';} #cart form[name=cartFrm] {padding:2.286rem 6.25% 4.286rem;} #cart .all_chk {position:relative; padding-bottom:15px; border-bottom:1px solid #E3E3E3;} #cart .cart_all {color:#333; font-size:1.071rem;} #cart .select_del {position:absolute; top:-0.714rem; right:0;} #cart .select_del a {display:inline-block; height:2.857rem; padding-left:1.071rem; background:url('/_skin/bona/img/shop/cart_del2.png')no-repeat left top 0.714rem/1.143rem; line-height:2.857rem;} #cart .msg_delivery {margin:1.571rem 0 0.071rem; padding:0; font-size:0;} #cart .msg_delivery.head_office {height:1.429rem;} #cart .msg_delivery.check input[type=checkbox] {position:static;} #cart .msg_delivery strong {display:inline-block; padding-left:0.357rem;} #cart .msg_delivery strong * {display:inline-block; margin-right:5px; color:#FD5000; font-size:1rem;} #cart .free {padding-left:2.143rem; color:#999999;} #cart .company_info {position:relative; margin-bottom:0.714rem; padding:0 5.000rem 0 2.143rem; color:#999;} #cart .company_info .prd_link {position:absolute; top:0; right:0; font-weight:500; text-decoration:underline;} #cart .pickup_time {height:3.857rem; margin-bottom:1.071rem; padding:0 3.429rem; border-radius:0.429rem; background:#FEF8D6 url('/_skin/bona/img/shop/icon_time.png')no-repeat left 1.071rem center/1.857rem; font-size:1.143rem; line-height:3.857rem; letter-spacing:-0.16px;} #cart .pickup_time strong {font-size:1.143rem; font-weight:600; letter-spacing:-0.16px;} .cart_tab {font-size:0; border-bottom:1px solid #ededed;} .cart_tab li {display:inline-block; width:50%;} .cart_tab li a {display:block; position:relative; width:100%; height:3.929rem; font-size:1.143rem; text-align:center; line-height:3.929rem;} .cart_tab li.on a {font-weight:700;} .cart_tab li.on a:after {position:absolute; bottom:-1px; left:0; width:100%; height:2px; background:#FD5000; content:'';} #cart .cart_slide {margin-bottom:1.714rem;} #cart .cart_slide h3 {margin-bottom:1.000rem; padding:0 6.25%; font-size:1.714rem;} #cart .cart_slide .swiper-container {padding:0 6.25%;} #cart .tab_sbs {margin-top:-1px; font-size:0; text-align:center;} #cart .tab_sbs > li {display:inline-block; width:50%; font-size:0;} #cart .tab_sbs > li > a {display:block; position:relative; margin-left:-1px; padding:15px 5px; border:1px solid #e0e0e0; border-bottom-color:#333; color:#666; font-size:14px;} #cart .tab_sbs > li > a > span {color:#999;} #cart .tab_sbs > li.active > a {z-index:1; border-color:#333; border-bottom:0; color:#333;} #cart .tab_sbs > li:first-child > a {border-left:0;} #cart .tab_sbs > li:last-child > a {border-right:0;} #cart .sum {background:#fff;} #cart .total {position:relative; background:#fff; color:#333;} #cart .total * {color:#333;} #cart .sum.total {padding:1.071rem 1.786rem 0.429rem;} #cart .total:after {position:absolute; bottom:-10px; left:0; width:100%; height:10px; background:url('/_skin/bona/img/shop/bottom_after.png')repeat left top/auto 10px; content:'';} #cart .title_total {height:3.571rem; border-radius:0.714rem 0.714rem 0 0; background:#6F8A6B; color:#fff; font-size:1.286rem; font-weight:500; text-align:center; line-height:3.571rem;} #cart .btn_bottom2 {position:fixed; bottom:0; left:50%; z-index:30; width:640px;} #cart .btn_bottom2 span * {height:4.286rem; padding:0; border:0; border-radius:0; background:#FD5000; color:#fff !important; font-size:1.143rem; line-height:4.286rem;} #cart .pay {text-align:center;} #cart .pay > div {margin-top:10px;} #cart .cart_info {margin-top:2.714rem; padding:0 6.25%;} #cart .cart_info dt {padding-bottom:10px; color:#333; font-size:1.214rem; font-weight:bold;} #cart .cart_info dd {position:relative; margin-bottom:0.143rem; padding-left:0.571rem; color:#999;} #cart .cart_info dd:after {position:absolute; top:0.429Rem; left:0; width:0.286rem; height:0.286rem; border-radius:50%; background:#6F8A6B; content:'';} /* 장바구니 옵션 변경 */ #option_change_layer {position:fixed; left:50%; top:0;} #option_change_layer .cart_change_option {overflow-y:scroll; position:fixed; left:50%; top:0; width:640px; height:100vh; background:#fff;} /* .cart_change_option .img {width:100%;} .cart_change_option .img img {width:100%; height:auto;} .cart_change_option .info {padding:0 6.25%;} .cart_change_option .info .name {font-size:1.571rem;} .cart_change_option .info .name {font-size:1.571rem;} .cart_change_option .info .opt {padding-top:5px;} .cart_change_option .info .price {padding:10px 0; font-family:'Pretendard',sans-serif; } .cart_change_option .info .price strong {color:#000; font-family:'Pretendard',sans-serif; font-size:1.667rem;} .cart_change_option .info .list_opt li {padding-bottom:10px;} .cart_change_option .info .list_opt li select, .cart_change_option .info .list_opt li input {width:100%;} .cart_change_option .info .list_opt li input[type=checkbox], .cart_change_option .info .list_opt li input[type=radio] {width:auto;} .cart_change_option .info .total_prc {padding:10px; text-align:right;} .cart_change_option .info .total_prc span {margin-left:3px; color:#000; font-family:'Pretendard',sans-serif; } .cart_change_option .info .total_prc span .sell_prc_str_total {color:inherit; font-family:'Pretendard',sans-serif; font-size:1.667rem; font-weight:bold;} */ #option_change_layer .prdimg {overflow:hidden; position:relative; text-align:center;} #option_change_layer .prdimg img {width:100%; height:auto;} #option_change_layer .prdimg .flag {position:absolute; top:1.143rem; left:2.143rem; z-index:20;} #option_change_layer .prdimg .flag img {width:3rem; height:auto;} #option_change_layer .prdimg .addimg {display:none;} #option_change_layer .addimg .swiper-pagination-progressbar {position:relative; top:auto; left:0; z-index:5; width:100%; height:0.286rem; background:#f2f2f2;} #option_change_layer .addimg .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {background:#1a1a1a;} #option_change_layer .addimg .swiper-horizontal > .swiper-pagination-bullets, #option_change_layer .addimg .swiper-pagination-bullets.swiper-pagination-horizontal {bottom:25px;} #option_change_layer .addimg .swiper-pagination .swiper-pagination-bullet {width:0.500rem; height:0.500rem; border:0; background:#E3E3E3; opacity:1;} #option_change_layer .addimg .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {width:2.143rem; height:0.500rem; border-radius:0.500rem; background:#FD5000;} #option_change_layer .info {padding:0 6.25% 4.429rem;} #option_change_layer .info > .name {padding:2.000rem 0 0; font-size:1.571rem; font-weight:700;} #option_change_layer .info .gift, #option_change_layer .info .opt {color:#999999; font-size:1.143rem;} #option_change_layer .info .price {margin-top:0.286rem; font-size:1.429rem; font-weight:700; letter-spacing:-0.5px;} #option_change_layer .info .price * {font-size:1.429rem; font-weight:700; letter-spacing:-0.5px;} #option_change_layer .info .pickup_shop {margin:1.286rem 0 1.571rem;} #option_change_layer .info .pickup_shop input {width:100%; height:3.571rem; margin-bottom:8px; padding:0 20px; border:0; border-radius:0.286rem; background:#F9F9F9; color:#ABABAB; font-size:1.143rem;} #option_change_layer .info .pickup_shop p {font-size:0.929rem;} #option_change_layer .info .list_opt {margin:0.714rem 0 0;} #option_change_layer .info select {width:100%; height:3.214rem; margin:0 0 0.714rem;} #option_change_layer .info .list {width:100%; margin:1px 0 1rem; border-width:1px 0;} #option_change_layer .info .list.set_table {margin-top:-1px;} #option_change_layer .info .list > tbody > tr > th {padding:0.429rem 0; color:#333; font-size:1.071rem; font-weight:normal; text-align:left; vertical-align:middle;} #option_change_layer .info .list > tbody > tr > td {padding:0.429rem 0; color:#333; text-align:left; vertical-align:middle;} #option_change_layer .info .list > tbody > tr > td .box_qty {width:9.286rem; height:2.857rem;} #option_change_layer .info .list > tbody > tr > td .box_qty .form_input {width:9.286rem; height:2.857rem;} #option_change_layer .info .list > tbody > tr > td .box_qty a {width:3.071rem; height:2.857rem; background-size:0.929rem;} #option_change_layer .info .total_prc {position:relative; padding:31px 0; border-top:0.143rem solid #F6F6F6; font-size:1.286rem; font-weight:500;} #option_change_layer .info .total_prc span {position:absolute; top:50%; right:0; margin-top:-0.893rem; color:#000; font-family:'Pretendard',sans-serif; font-size:1.286rem; font-weight:600;} #option_change_layer .info .total_prc span .sell_prc_str_total {color:inherit; font-family:'Pretendard',sans-serif; font-size:1.286rem; font-weight:600;} /* 장바구니 개별상품 쿠폰적용 */ #cart .cart_prc > .after {display:none;} #cart .cart_prc.is_sale > .before {text-decoration:line-through;} #cart .cart_prc.is_sale > .before {display:none;} #cart .cart_prc.is_sale > .after {display:inline-block;} /* 주문서(/shop/order.php) */ #order {padding-bottom:7.571rem;} #order .form_input {height:3.571rem; padding:0 1.071rem; border-radius:4px; border-color:#e9e9e9; color:#333; letter-spacing:-0.14px;} #order .form_input:read-only{background:#F3F3F3;} #order .address_area .form_input {background:#F3F3F3;} #order textarea.form_input {height:10.500rem; padding-top:1.429rem;} #order .form_input::placeholder {color:#999; letter-spacing:-0.14px;} #order form > .price {padding:1.286rem 6.25% 0.786rem; border-bottom:0.714rem solid #F9F9F9; font-size:0; letter-spacing:-0.18px;} #order form > .price span {display:inline-block; width:30%; font-weight:700; font-size:1.286rem;} #order form > .price strong {display:inline-block; width:70%; font-size:1.286rem; text-align:right; letter-spacing:-0.45px;} #order .border {padding-bottom:1.786rem; border-bottom:0.714rem solid #F9F9F9;} #order h3.title {position:relative; padding:1.643rem 6.25% 0; font-size:1.429rem; letter-spacing:-0.2px;} #order h3.title:after {position:absolute; right:6.25%; bottom:0.286rem; width:1.286rem; height:1.286rem; background:url('/_skin/bona/img/mypage/btn_up.png')no-repeat right center/1.286rem; content:'';} #order h3.title.active:after {background:url('/_skin/bona/img/mypage/btn_down.png')no-repeat right center/1.286rem;} #order h3.title + div {margin-top:1.214rem;} #order .list_msg {/*position:relative;*/ display:flex; justify-content:space-between; align-items:center; margin:0 0 0.571rem; padding:0 0 0 1.643rem; background:url('/_skin/bona/img/shop/icon_info.png')no-repeat left center/1.357rem; color:#999999;} /* 20230824 수정 */ @media only screen and (max-width:440px) { #order .list_msg {align-items:flex-start; background:url('/_skin/bona/img/shop/icon_info.png')no-repeat left top/1.357rem;} } #order .funding_msg {padding-left:1.643rem; color:#999999; line-height:1.429rem;} #order .list_msg .box_btn {/*position:absolute; top:-8px; right:0; */ margin-left:10px; vertical-align:middle;} /* 20230824 수정 */ #order .list_msg .box_btn * {width:7.286rem; height:2.214rem; padding:0; border:1px solid #DDDDDD; background:#fff; color:#333 !Important; line-height:2.214rem;} #order .box_hidden {display:none;} #order .part_guest .scroll {overflow-x:hidden; overflow-y:scroll; position:relative; width:100%; height:160px; border:1px solid #d9d9d9; border-width:1px 0; background:#fff; -webkit-overflow-scrolling:touch;} #order .part_guest .scroll iframe {position:absolute; top:0; left:0; width:100%; height:100%;} #order .part_guest .agree_guest {padding:15px;} #order .part_prd {padding:0 6.25%;} #order .part_prd .msg {padding:10px 15px; color:#888; font-size:0.917rem;} #order .part_gift .tbl_col thead {display:none;} #order .part_discount > div {padding:1.357rem 0 0;} #order .part_discount > div:first-child {padding-top:0;} #order .part_discount > div h4 {position:relative; padding-bottom:0.929rem; font-size:1.143rem; text-align:left; letter-spacing:-0.16px;} #order .part_discount > div h4 > span {position:absolute; top:0.143rem; right:0; color:#333; font-weight:normal;} #order .part_discount > div h4 span strong {display:inline-block; color:#FD5000; font-weight:600;} #order .part_discount > div h4 span strong span {color:#FD5000; font-weight:400;} #order .part_discount > div .msg {padding-top:5px; color:#888; font-size:0.917rem;} #order .part_discount > div.coupon .name {display:block; position:relative; z-index:0; padding:0 2.857rem; font-size:1.071rem; font-weight:600; letter-spacing:-0.15px;} #order .part_discount > div.coupon .name input {position:absolute; top:0; left:1.143rem;} #order .part_discount > div.coupon .list > li {position:relative; margin-bottom:0.714rem; padding:1.286rem 0; border:1px solid #E9E9E9; border-radius:4px; cursor:pointer;} #order .part_discount > div.coupon .list > li:after {position:absolute; top:0; left:0; width:100%; height:100%; content:'';} #order .part_discount > div.coupon .list > li.on {border:2px solid #FD5000;} #order .part_discount > div.coupon .list > li > ul {padding:0.143rem 2.857rem;} #order .part_discount > div.coupon .list > li > ul > li {color:#999999; font-size:0.929rem;} #order .part_discount > div.coupon .list > li > ul > li span {color:#999999; font-size:0.929rem;} #order .part_discount > div.coupon .list > li > ul > li.percent {margin-bottom:0.143rem; color:#333; letter-spacing:-0.14px;} #order .part_discount > div.coupon .list > li > ul > li.percent span {color:#6F8A6B; font-weight:600; letter-spacing:-0.14px;} #order .part_discount > div.coupon .list > li > ul > li br {display:none;} #order .part_discount > div.coupon.type2 .box_btn {display:block;} #order .part_discount > div.coupon.type2 .box_btn * {display:block; width:100%; height:3.571rem; padding:0; border:1px solid #707070; border-radius:4px; background:#fff; color:#333 !important; font-size:1.071rem; font-weight:600; line-height:3.571rem;} #order .part_discount > div.offcoupon #off_cpn_div1 {position:relative;} #order .part_discount > div.offcoupon #off_cpn_div1 .box_btn {position:absolute; top:0; right:0; width:4.571rem; height:3.571rem;} #order .part_discount > div.offcoupon #off_cpn_div1 .box_btn * {width:4.571rem; height:3.571rem; padding:0; border:0; background:none; color:#FD5000 !important; font-weight:600; line-height:3.571rem;} #order .part_discount > div.offcoupon #off_cpn_div1 .box_btn *:after {position:absolute; top:0.857rem; left:0; width:1px; height:26px; background:#E9E9E9; content:'';} #order .part_discount > div.offcoupon .offbtn {padding-top:10px;} #order .part_discount > div.offcoupon #off_cpn_div2, #order .part_discount > div.offcoupon #off_cpn_img2 {display:none;} #order .part_delivery .country {padding-bottom:10px;} #order .part_delivery .country:after {display:block; clear:both; content:'';} #order .part_delivery .country label {display:inline-block; float:left; width:50%; padding:10px; border:1px solid #dcdcdc; text-align:center;} #order .part_delivery .country label:last-child {border-left:0;} #order .part_delivery .select_place select, #order .part_delivery .select_country select {width:100%;} #order .part_delivery .tel_area {position:relative; padding-left:90px;} #order .part_delivery .tel_area select {position:absolute; left:0; top:0; width:80px;} #order .part_delivery .address_area > div:first-child {padding-top:0;} #order .part_delivery .address_area .code {overflow:hidden; height:0; margin:0; position:relative;} #order .part_delivery .address_area > div {margin-bottom:0.714rem;} #order .part_delivery .address_area .box_btn * {height:3.571rem; padding:0; border:1px solid #707070; border-radius:4px; background:#fff; color:#333 !important; font-size:1.071rem; font-weight:600; line-height:3.571rem;} #order .part_delivery .addfd > li {padding-top:10px;} #order .part_delivery .addfd > li:first-child {padding-top:0;} #order .pay_sbs:after {display:block; clear:both; content:'';} #order .pay_sbs > div {float:left; width:50%; margin-left:-1px;} #order .pay_sbs > div > input {display:none;} #order .pay_sbs > div > label {display:block; position:relative; padding:10px 5px; border:1px solid #dcdcdc; color:#888; text-align:center; cursor:pointer;} #order .pay_sbs > div > label:before {display:inline-block; width:9px; height:8px; margin-right:5px; background:url('/_skin/bona/img/common/bullet_check.png') no-repeat center; content:'';} #order .pay_sbs > div > input:checked + label {z-index:2; border-color:#676767; background-color:#fff; color:#333;} #order .part_method {font-size:0;} #order .part_method > div {display:inline-block; position:relative; /*width:calc(50% - 0.357rem);*/ width:100%; height:3.571rem; margin:0 0.357rem 0.714em 0; text-align:center; line-height:3.571rem;} /*20230823 버튼가로값수정 */ #order .part_method > div:nth-child(2n) {margin:0 0 0.714rem 0.357rem;} #order .part_method > div:nth-child(3) {margin-bottom:0;} #order .part_method > div:first-child label {color:#FD5000; font-weight:600;} #order .part_method > div label {position:absolute; top:0; left:0; width:100%; height:3.571rem; line-height:3.571rem; cursor:pointer;} #order .part_method > div label input[type=radio] {position:absolute; top:0; left:0; width:100%; height:3.571rem; border:1px solid #E9E9E9; border-radius:4px; background:none; color:#333; font-size:1.071rem; letter-spacing:-0.15px; cursor:pointer;} #order .part_method > div label input[type=radio]:checked {border:2px solid #FD5000; color:#FD5000;} // 반드시 수정 //#order .part_method > div .msg_pay {display:none !important; padding:0 !important; color:#999 !important;} #order .part_method > div .msg_pay {margin-top:50px;} #order .border.pay_border {padding-bottom:13.786rem;} #order .part_method > div .bank_name {display:none;} #order .part_method > div #cash_reg {padding:5px 0 !important;} #order .part_method > div #cash_reg span {color:#999 !important;} #order .part_method > div select {width:100%; margin-bottom:5px;} #order .reconfirm {padding:1.214rem 6.25% 0; cursor:pointer;} #order .reconfirm label {font-size:1.143rem; font-weight:700; text-align:left; letter-spacing:-0.16px;} #order #order2 {display:block !important; position:fixed; bottom:0; left:50%; width:640px; z-index: 10000;} #order #order2 .box_btn > * {position:absolute; bottom:0; left:0; height:4.286rem; background:none; border-radius:0; line-height:4.286rem;} #order #order2 .box_btn > span {z-index:-1; background:#FD5000; line-height:4.286rem;} #order #order2 .box_btn > span span {z-index:-1; background:#FD5000; color:#fff; font-size:1.071rem; font-weight:600; line-height:4.286rem;} #order #order2 .paytype_gr1 {padding-bottom:23px; font-size:1.333rem; font-weight:bold;} #order #order2 .paytype_gr1 strong, #order #order2 .paytype_gr1 strong * {font-size:inherit;} #order #order2 .msg {padding-bottom:23px; color:#888;} /* 주문완료(/shop/order_finish.php) */ #orderfin {margin-bottom:8.571rem;} #orderfin.add .list_wrap .company_info span {display:none;} #orderfin.add .list_wrap .company_info span.map {display:none;} #orderfin h3 {padding-bottom:0.786rem; font-size:1.429rem;} #orderfin h3 .length {display:inline-block; width:1.429rem; height:1.429rem; margin-top:0.286rem; border-radius:50%; background:#FD5000; color:#fff; font-size:0.929rem; font-weight:700; letter-spacing:-0.13px; text-align:center; line-height:1.429rem; vertical-align:top;} #orderfin .order_table {padding-top:0.929rem;} #orderfin .list_wrap .company_info span {display:none;} #orderfin .prd_msg {margin-top:15px; border-bottom:0.714rem solid #F9F9F9;} #orderfin .prd_table {padding-top:1.643rem; border-bottom:0.714rem solid #F9F9F9;} #orderfin .prd_table.type2 {margin-top:1.071rem; border-top:0.714rem solid #F9F9F9; border-bottom:0;} #orderfin .prd_table .list_wrap {margin-top:0.429rem;} #orderfin .order_table .box {padding-bottom:0.857rem; border-bottom:1px dashed #D3D3D3;} #orderfin .order_table.type2 .box {padding-bottom:0.857rem; border-bottom:0;} #orderfin .info {padding-bottom:15px;} #orderfin .info .bank {padding:1.571rem 0 0.357rem; font-size:1.071rem; letter-spacing:-0.15px;} #orderfin .info .bank strong {color:#FD5000; font-size:1.071rem; font-weight:600; letter-spacing:-0.15px;} #orderfin .info .email {font-size:1.071rem; letter-spacing:-0.15px;} #orderfin .info .email strong {color:#6F8A6B; font-size:1.071rem; font-weight:600; text-decoration:underline; letter-spacing:-0.15px;} #orderfin .title_gift {padding-top:10px;} #orderfin .btn_col {margin:1.786rem 0 6.000rem;} #orderfin .btn_col span a {height:3.571rem; padding:0; border-radius:4px; font-size:1.071rem; font-weight:600; line-height:3.571rem;} /* 상품검색(/shop/search_result.php) */ #search_result {margin-bottom:50px;} #search_result .sort {position:relative;} #search_result .sort p {padding:1.714rem 0 0.857rem; color:#ABABAB; font-size:1rem;} #search_result .sort p span {color:#EB3B16; font-size:1rem; font-weight:600;} #search_result .sort select {position:absolute; top:1.214rem; right:0; padding-right:2.214rem; border:0; background:url('/_skin/bona/img/shop/select_down_black.png')no-repeat right center/0.786rem; color:#ABABAB; font-size:1rem;} #search_result .swiper-container.middle {margin:10px 0;} #search_result .swiper-container.middle .swiper-slide {display:inline-block; width:auto; padding-right:30px;} #search_result .swiper-container.middle .swiper-slide a {color:#333; font-size:1.143rem;} #search_result .swiper-container.middle .swiper-slide.on a {color:#ABABAB; font-size:1.143rem;} #search_result .swiper-container.small {position:relative; height:44px; padding-right:45px; background:#fafafa;} #search_result .swiper-container.small .swiper-slide {display:inline-block; width:auto; height:2.714rem; margin-right:2.5px; padding:0 1.286rem; color:#ABABAB; font-size:1.143rem; line-height:2.714rem; letter-spacing:-0.16px; text-align:center;} #search_result .swiper-container.small .swiper-slide a {display:inline-block; width:auto; height:2.714rem; border-radius:2.714rem; background:#F8F8F8; color:#111; font-size:1.071rem; line-height:2.786rem; letter-spacing:-0.16px; text-align:center; cursor:pointer;} #search_result .swiper-container.small .swiper-slide.on {position:relative; z-index:10; color:#fff; font-weight:700;} #search_result .swiper-container.small .swiper-slide.on a {position:relative; z-index:10; background:#FD5000; color:#fff; font-weight:700;} #search_result .research {position:relative; height:44px; padding-right:45px; background:#fafafa;} #search_result .research:after {display:inline-block; position:absolute; right:45px; top:13px; width:1px; height:18px; background:#d5d5d5; content:'';} #search_result .research .form_input.search {display:block; height:44px; border-color:#fafafa; background:transparent;} #search_result .research .btn {position:absolute; right:15px; top:13px; width:18px; height:18px;} #search_result .check {display:inline-block; padding:15px 15px 0 0;} #search_result .rank {background-color:#f1f1f1;} #search_result .rank > h3 {padding:5px; border:1px solid #dcdcdc; background:#fff; color:#666; text-align:center;} #search_result .rank > h3:after {display:inline-block; width:0; height:0; margin-left:5px; border-left:5px solid transparent; border-right:5px solid transparent; border-top:5px solid #000; content:'';} #search_result .rank > ol {display:none;} #search_result .rank > ol > li {float:left; overflow:hidden; width:50%; padding:5px; text-align:left; text-overflow:ellipsis; white-space:nowrap;} #search_result .rank > ol > li > span {display:inline-block; width:18px; height:18px; border-radius:50%; background:#fff; color:#000; text-align:center; font-weight:bold; line-height:18px;} #search_result .rank:after {display:block; clear:both; content:'';} #search_result .result_cate {margin-top:10px;} #search_result .result_cate:after {display:block; clear:both; content:'';} #search_result .result_cate > h3 {padding:5px;} #search_result .result_cate > ul > li {position:relative; float:left; width:33.33%; margin:-1px 0 0 -1px; border:1px solid #dcdcdc; font-size:0.917rem;} #search_result .result_cate > ul > li a {display:block; overflow:hidden; padding:10px 20px 10px 10px; font-size:inherit; text-overflow:ellipsis; white-space:nowrap;} #search_result .result_cate > ul > li span {position:absolute; right:10px; top:10px; font-size:inherit;} #search_result .prd_normal {margin-top:15px;} /* 상품문의 & 상품후기 - 상품정보(/shop/product_review_list.php & /shop/product_qna_list.php) */ #qnarev_list_all .photo_sort {position:relative; margin-bottom:10px;} #qnarev_list_all .photo_sort .check {position:absolute; top:-2px; left:0;} #qnarev_list_all .photo_sort .sort {text-align:right; font-size:0;} #qnarev_list_all .photo_sort .sort li {display:inline-block;} #qnarev_list_all .photo_sort .sort li:after {display:inline-block; width:1px; height:14px; margin:2px 10px 0 10px; background-color:#e5e5e5; vertical-align:top; content:'';} #qnarev_list_all .photo_sort .sort li:last-child:after {display:none;} #qnarev_list_all .photo_sort .sort li a {color:#666;} #qnarev_list_all .photo_sort .sort li a.selected {padding-left:13px; background:url('/_skin/bona/img/common/bullet_check.png') no-repeat left center; color:#333; font-weight:bold;} #qnarev_list_all .board_search {clear:both; margin-bottom:15px; padding:7px 0; border:1px solid #dcdcdc;} #qnarev_list_all .board_search form {position:relative; padding:0 38px 0 75px; text-align:center;} #qnarev_list_all .board_search select {position:Absolute; lefT:0; top:0; border:0; width:70px; height:3.571rem;} #qnarev_list_all .board_search input.form_input.search {display:block; border-width:0 1px;} #qnarev_list_all .board_search .btn_search {position:absolute; right:0; top:0; display:inline-block; width:38px; height:3.571rem;; border:0; background:url('/_skin/bona/img/common/icon_search.png') no-repeat center/18px; vertical-align:top; text-indent:-9999px; cursor:pointer;} #qnarev_list_all > .box_btn {margin-bottom:15px;} #qnarev_list_all > .box_btn.more {margin:15px 0 0 0;} /* 상품문의 & 상품후기 & 마이페이지 상품문의 & 마이페이지 상품후기 - 상품정보(/shop/product_review.php & /shop/product_qna.php) */ .qnarev_list > .prd {overflow:hidden; position:relative; padding-bottom:15px;} .qnarev_list > .prd .img {display:inline-block; width:128px; vertical-align:top;} .qnarev_list > .prd .img img {width:128px; height:auto;} .qnarev_list > .prd .info {display:inline-block; width:calc(100% - 140px); padding-left:10px; text-align:left; vertical-align:top;} .qnarev_list > .prd .info .name {padding:20px 0 10px; font-weight:bold;} .qnarev_list > .prd .info .name img {padding-right:5px; vertical-align:middle;} .qnarev_list > .prd .info ul li {color:#666;} .qnarev_list > .prd .info ul li .nprice {text-decoration:line-through;} .qnarev_list > .prd .btn_related {clear:both; padding-top:15px;} .qnarev_list > .btn_col {padding-top:15px;} .list_qnarev {border-top:1px solid #333; margin-bottom:2.143rem;} .list_qnarev > li {padding:10px 0; border-bottom:1px solid #F7F7F7;} .list_qnarev > li:first-child {border-top:0;} .list_qnarev > li:after {display:block; clear:both; content:'';} .list_qnarev > li > .prdimg {display:inline-block; position:relative; overflow:hidden; width:110px; height:auto; line-height:110px;} .list_qnarev > li > .prdimg img {width:110px; height:auto;} .list_qnarev > li > .subject {padding:1.286rem 0 1.429rem; vertical-align:top;} .list_qnarev > li > .subject.prd {display:inline-block; width:calc(100% - 120px); padding-left:10px;} .list_qnarev > li > .subject > p {overflow:hidden; padding-top:5px; font-size:1.071rem; text-overflow:ellipsis; white-space:nowrap;} .list_qnarev > li > .subject > p.title {margin-bottom:0.286rem;} .list_qnarev > li > .subject > p span {font-size:1.071rem; font-weight:600;} .list_qnarev > li > .subject > p span.text {display:inline-block; padding:0 10px; color:#999; font-size:0.929rem; font-weight:400;} .list_qnarev > li > .subject > p span.text:first-child {position:relative; padding-left:0;} .list_qnarev > li > .subject > p span.text:first-child:after {position:absolute; right:0; top:0.214rem; width:1px; height:0.786rem; background:#E3E3E3; content:'';} .list_qnarev > li > .subject > p:first-child {padding-top:0;} .list_qnarev > li > .subject > p.prdname a {color:#666;} .list_qnarev > li > .subject > p.title img {width:auto; height:1.286rem; margin-top:2px; vertical-align:top;} .list_qnarev > li > .subject > p.title .best {display:inline-block; padding:0 3px; background:#f00; color:#fff !important;} .list_qnarev > li > .subject > p.stat {position:relative;} .list_qnarev > li > .subject > p.stat, .list_qnarev > li > .subject > p.stat * {color:#666; font-size:0.917rem;} .list_qnarev > li > .subject > p.stat .reply {position:absolute; top:0; right:0;} .list_qnarev > li > .subject > p.stat img {width:auto; height:0.917rem; margin-top:3px; vertical-align:top;} .list_qnarev > li > .content {display:none; padding:15px; border-top:1px solid #dbdbdb; background:#fafafa;} .list_qnarev > li > .content .question {position:relative; min-height:45px; padding:0 0 15px 43px; border-bottom:1px solid #e1e1e1;} .list_qnarev > li > .content .question:before {display:inline-block; position:absolute; left:0; top:0; width:29px; height:29px; border-radius:50%; background-color:#777474; color:#fff; font-family:'Pretendard',sans-serif; font-size:1.167rem; text-align:center; line-height:29px; content:'Q';} .list_qnarev > li > .content .answer {position:relative; min-height:30px; margin:15px 0; padding-left:43px;} .list_qnarev > li > .content .answer:before {display:inline-block; position:absolute; left:0; top:0; width:29px; height:29px; border-radius:50%; background-color:#ef6363; color:#fff; font-family:'Pretendard',sans-serif; font-size:1.167rem; text-align:center; line-height:29px; content:'A';} .list_qnarev > li > .content .question img, .list_qnarev > li > .content .answer img {max-width:100%; height:auto;} .list_qnarev > li > .content .btn {padding-top:10px; text-align:left;} .list_qnarev > li > .content .comment {padding-top:10px;} /* 상품문의, 상품후기 - 비밀번호 확인 */ .pwbox_popup {position:fixed; left:0; top:50%; z-index:100; width:100%; margin-top:-100px; padding:0 20px;} #pwbox {padding:20px; border:1px solid #e0e0e0; background:#fafafa; text-align:center !important;} #pwbox h3 {padding-bottom:15px;} #pwbox p {margin-bottom:10px; color:#888;} #pwbox .form_input {margin-bottom:10px;} /* 최근 본 상품 */ #click_prd {margin-top:20px;} /* 상품문의 & 상품후기 - 쓰기 */ .qnarev_write_popup {position:fixed; left:50%; top:0; z-index:100; width:640px; height:100%;} .qnarev_write_popup > .close {position:absolute; top:10px; right:0; width:32px; height:32px; text-indent:-9999px;} .qnarev_write_popup > .close:before {position:absolute; left:0; top:16px; width:20px; height:2px; background-color:#b7b7b7; -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); transform:rotate(-45deg); content:'';} .qnarev_write_popup > .close:after {position:absolute; left:0; top:16px; width:20px; height:2px; background-color:#b7b7b7; -ms-transform:rotate(45deg); -webkit-transform:rotate(45deg); transform:rotate(45deg); content:'';} .qnarev_write_popup .qnarev_write {padding:15px;} .qnarev_write {overflow:auto; width:100%; height:100%; margin:0 auto; background:#fff; text-align:center;} .qnarev_write form {display:inline-block; width:100%; text-align:left;} .qnarev_write fieldset > legend {display:block; width:100%; margin-bottom:25px; padding-bottom:15px; border-bottom:1px solid #000; font-size:1.167rem; font-weight:bold;} .qnarev_write fieldset > div {position:relative; margin-bottom:10px;} .qnarev_write fieldset > div:last-child {margin-bottom:0;} .qnarev_write fieldset > div > label {display:none;} .qnarev_write fieldset > div.grade {margin-bottom:20px; border-bottom:1px solid #dcdcdc; padding-bottom:25px; text-align:center;} .qnarev_write fieldset > div.grade > .msg {padding-bottom:15px; font-size:1.083rem; font-weight:bold;} .qnarev_write fieldset > div.name {position:relative; min-height:20px; padding-right:100px; font-weight:bold;} .qnarev_write fieldset > div.name .form_input {float:left; width:49%;} .qnarev_write fieldset > div.name .form_input.pw {float:right;} .qnarev_write fieldset > div.name .check {position:absolute; right:0; top:8px;} .qnarev_write fieldset > div.name.nopd {padding-right:0;} .qnarev_write fieldset > div.name:after {display:block; clear:both; content:'';} .qnarev_write fieldset > div.contents > textarea {height:140px;} .qnarev_write fieldset > div.msg_milage {margin-top:-15px; padding:10px; border:1px solid #cbd5de; background-color:#e6f0f9; color:#666; text-align:center;} .qnarev_write fieldset > div.msg_milage:before {position:absolute; left:10px; top:-8px; width:15px; height:15px; border:1px solid #cbd5de; border-width:1px 0 0 1px; background-color:#e6f0f9; -webkit-transform:rotate(45deg); transform:rotate(45deg); content:'';} .qnarev_write fieldset > div .file_del {padding-top:5px;} .qnarev_write fieldset > div #preview_attach_files {font-size:0;} .qnarev_write fieldset > div #preview_attach_files > li {display:inline-block; padding:0 5px;} .qnarev_write fieldset > div #preview_attach_files > li:first-child {padding-left:0;} .qnarev_write fieldset > div #preview_attach_files > li img {width:73px; height:73px;} .qnarev_write fieldset select {width:100%; height:3.571rem;} .qnarev_write .btn {padding:20px 0;} /* 상품문의 & 상품후기 - 수정 */ #qnarevmod .modi_pwd, #qnarevmod .modi_cnt {display:none;} /* 상품후기 - 리스트 */ .total_review_list {display:block; font-size:0;} .total_review_list > li {display:inline-block; width:50%; margin-bottom:15px; padding-right:1.5625%; vertical-align:top;} .total_review_list > li:nth-child(2n) {padding-right:0; padding-left:1.5625%;} .total_review_list .box {border:1px solid #dcdcdc;} .total_review_list .box .img_wrap {overflow:hidden; position:relative; height:252px; cursor:pointer;} .total_review_list .box .img_wrap img {position:absolute; top:50%; left:0; width:100%; height:auto; -ms-transform:translate(0,-50%); -webkit-transform:translate(0,-50%);} .total_review_list .box .info_wrap {padding:15px 10px 0;} .total_review_list .box .info_wrap .title {overflow:hidden; margin-bottom:5px; font-weight:700; word-break:break-all; word-wrap:break-word; white-space:nowrap; text-overflow:ellipsis;} .total_review_list .box .info_wrap .title img {width:auto; height:10px; vertical-align:middle;} .total_review_list .box .info_wrap .content {overflow:hidden; height:30px; margin-bottom:15px; color:#666; font-size:0.917rem; word-break:break-all; word-wrap:break-word;} .total_review_list .box .info_wrap .date {color:#888; font-size:0.917rem;} .total_review_list .box .info_wrap .prd_info {margin-top:15px; padding:12px 0; border-top:1px solid #eee; font-size:0;} .total_review_list .box .info_wrap .prd_info .img {display:inline-block; overflow:hidden; position:relative; width:40px; height:40px; vertical-align:middle;} .total_review_list .box .info_wrap .prd_info .img img {position:absolute; top:50%; left:0; width:100%; height:auto; -ms-transform:translate(0,-50%); -webkit-transform:translate(0,-50%);} .total_review_list .box .info_wrap .prd_info .name_star {display:inline-block; width:calc(100% - 40px); padding-left:7px; vertical-align:middle;} .total_review_list .box .info_wrap .prd_info .name_star .name {overflow:hidden; margin-bottom:4px; word-break:break-all; word-wrap:break-word; white-space:nowrap; text-overflow:ellipsis;} .total_review_list .box .info_wrap .prd_info .name_star .name a {color:#666; font-size:0.917rem;} .total_review_list .box .info_wrap .prd_info .name_star .star .grade {font-weight:700;} /* 상품후기 - 열람 레이어 */ #revWriteAjaxDiv {opacity:1 !important;} .layer_review_list {overflow:auto; position:fixed; left:50%; top:0; z-index:100; width:640px; height:100%; padding-top:61px; background-color:#fff;} .layer_review_list.upfile_cnt0 > .img {display:none !important;} .layer_review_list > .img {width:100%; background-color:#f1f2f3;} .layer_review_list > .img .box {display:flex; width:100vw; height:40vh; align-items:center; justify-content:center;} .layer_review_list > .img > .add_slide img {max-width:100%; max-height:100%;} .layer_review_list > .img > .add_slide .slick-arrow {position:absolute; top:50%; z-index:10; width:40px; height:40px; margin:-20px 15px 0 15px; border-radius:50%; background-color:rgba(0,0,0,0.2);} .layer_review_list > .img > .add_slide .slick-arrow.slick-prev {left:0;} .layer_review_list > .img > .add_slide .slick-arrow.slick-prev:before {position:absolute; left:50%; top:50%; width:12px; height:2px; margin:-5px 0 0 -6px; background-color:#fff; -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); transform:rotate(-45deg); content:'';} .layer_review_list > .img > .add_slide .slick-arrow.slick-prev:after {position:absolute; left:50%; top:50%; width:12px; height:2px; margin:3px 0 0 -6px; background-color:#fff; -ms-transform:rotate(45deg); -webkit-transform:rotate(45deg); transform:rotate(45deg); content:'';} .layer_review_list > .img > .add_slide .slick-arrow.slick-next {right:0;} .layer_review_list > .img > .add_slide .slick-arrow.slick-next:before {position:absolute; left:50%; top:50%; width:12px; height:2px; margin:-5px 0 0 -6px; background-color:#fff; -ms-transform:rotate(45deg); -webkit-transform:rotate(45deg); transform:rotate(45deg); content:'';} .layer_review_list > .img > .add_slide .slick-arrow.slick-next:after {position:absolute; left:50%; top:50%; width:12px; height:2px; margin:3px 0 0 -6px; background-color:#fff; -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); transform:rotate(-45deg); content:'';} .layer_review_list > .img > .add_slide .slick-dots {position:absolute; left:0; bottom:20px; z-index:10;} .layer_review_list > .info {width:100%; padding:15px; background-color:#fff;} .layer_review_list > .info > .board {position:relative; margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid #eee;} .layer_review_list > .info > .board > .grade > .score {font-weight:bold;} .layer_review_list > .info > .board > .name {margin-top:10px; color:#888;} .layer_review_list > .info > .board > .subject {margin-top:20px; color:#333; font-size:1.167rem; font-weight:bold;} .layer_review_list > .info > .board > .content {margin-top:10px; color:#666; line-height:1.6; word-break:break-all;} .layer_review_list > .info > .board > .recommend {margin-top:20px; color:#888; line-height:24px;} .layer_review_list > .info > .board > .recommend > span {float:right;} .layer_review_list > .info > .board > .recommend > span > a {display:inline-block; min-width:60px; min-height:24px; padding:0 10px 0 30px; border:1px solid #dcdcdc; border-radius:20px; background-repeat:no-repeat; background-position:7px center; background-color:#fff; color:#333; text-align:right; line-height:24px; cursor:pointer;} .layer_review_list > .info > .board > .recommend > span > a.yes {background-image:url('/_skin/bona/img/shop/recommend_yes.png');} .layer_review_list > .info > .board > .recommend > span > a.no {background-image:url('/_skin/bona/img/shop/recommend_no.png');} .layer_review_list > .info > .board > .recommend > span > a:hover {background-color:#f1f2f3;} .layer_review_list > .info > .board > .btn {position:absolute; right:0; top:0; font-size:0;} .layer_review_list > .info > .board > .btn > a {display:inline-block; margin-left:-1px; padding:4px 8px; border:1px solid #dcdcdc; background-color:#fff; color:#888;} .layer_review_list > .info > .board > .btn > a:hover {background-color:#f1f2f3;} .layer_review_list > .info > .comment > .guest {padding:15px 20px; background-color:#fafafa; color:#666;} .layer_review_list > .info > .comment > .guest > a {float:right; color:#333; font-size:1.083rem; font-weight:bold; text-decoration:underline;} .layer_review_list > .info > .comment > form .write {position:relative; padding-right:56px; border:1px solid #dcdcdc; background-color:#fff; text-align:left;} .layer_review_list > .info > .comment > form .write textarea.form_input {min-height:40px; border:0;} .layer_review_list > .info > .comment > form .write .btn_comment {display:inline-block; position:absolute; right:0; top:0; width:56px; height:100%; text-align:center; border:0; background-color:#fff; font-weight:bold; line-height:100%; cursor:pointer;} .layer_review_list > .info > .comment > form .write:after {display:inline-block; position:absolute; right:56px; top:50%; width:1px; height:20px; margin-top:-10px; background-color:#dcdcdc; content:'';} .layer_review_list > .info > .comment > .list {position:relative; margin-top:20px;} .layer_review_list > .info > .comment > .list:before {position:absolute; left:20px; top:-6px; width:10px; height:10px; border:1px solid #dcdcdc; border-width:1px 1px 0 0; background-color:#fff; -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); transform:rotate(-45deg); content:'';} .layer_review_list > .info > .comment > .list > li {margin-top:-1px; padding:10px 15px; border:1px solid #dcdcdc;} .layer_review_list > .info > .comment > .list > li > .date {display:block; position:relative; height:0; top:-16px; color:#888; text-align:right;} .layer_review_list > .info > .comment > .list > li > .date img {width:10px; height:10px;vertical-align:middle;} .layer_review_list > .info > .comment > .list > li > .content {padding-top:5px; color:#666; line-height:1.6; word-break:break-all;} .layer_review_list > .move {position:absolute; top:50%; width:34px; height:34px; margin:-17px 12px 0 12px; text-indent:-9999px; cursor:pointer;} .layer_review_list > .move.prev {left:-60px;} .layer_review_list > .move.prev:before {position:absolute; left:50%; top:50%; width:25px; height:4px; margin:-9px 0 0 -13px; background-color:#fff; -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); transform:rotate(-45deg); content:'';} .layer_review_list > .move.prev:after {position:absolute; left:50%; top:50%; width:25px; height:4px; margin:7px 0 0 -13px; background-color:#fff; -ms-transform:rotate(45deg); -webkit-transform:rotate(45deg); transform:rotate(45deg); content:'';} .layer_review_list > .move.next {right:-60px;} .layer_review_list > .move.next:before {position:absolute; left:50%; top:50%; width:25px; height:4px; margin:-9px 0 0 -13px; background-color:#fff; -ms-transform:rotate(45deg); -webkit-transform:rotate(45deg); transform:rotate(45deg); content:'';} .layer_review_list > .move.next:after {position:absolute; left:50%; top:50%; width:25px; height:4px; margin:7px 0 0 -13px; background-color:#fff; -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); transform:rotate(-45deg); content:'';} .layer_review_list > .move.end:before, .layer_review_list > .move.end:after {background-color:#818181;} .layer_review_list > .close {position:fixed; top:10px; left:calc(50% + 600px); z-index:101; width:30px; height:40px; text-indent:-9999px;} .layer_review_list > .close:before {position:absolute; left:5px; top:20px; width:20px; height:2px; background-color:#b7b7b7; -ms-transform:rotate(-45deg); -webkit-transform:rotate(-45deg); transform:rotate(-45deg); content:'';} .layer_review_list > .close:after {position:absolute; left:5px; top:20px; width:20px; height:2px; background-color:#b7b7b7; -ms-transform:rotate(45deg); -webkit-transform:rotate(45deg); transform:rotate(45deg); content:'';} .layer_review_list > .prd {position:fixed; left:50%; top:0; z-index:101; width:640px; padding:15px; border-bottom:1px solid #eee; background-color:#fff;} .layer_review_list > .prd:after {display:block; clear:both; content:'';} .layer_review_list > .prd > h2 {float:right; width:calc(100% - 50px); padding-top:5px;} .layer_review_list > .prd > .img {overflow:hidden; float:left; position:relative; width:30px; height:30px; margin-right:20px;} .layer_review_list > .prd > .img img {position:absolute; top:50%; left:50%; width:30px; height:auto; transform:translate(-50%, -50%);} /* 설문조사(/shop/poll_list.php) */ #poll > .subject {padding:15px 30px; border:1px solid #e0e0e0; border-width:1px 0; text-align:center;} #poll > .box {padding:15px; border-bottom:1px solid #e0e0e0; background:#fbfbfb;} #poll > .box .vote {margin-top:15px; paDding:15px; border:1px solid #e0e0e0; background:#fff;} #poll > .box .vote > ul > li {padding:5px 0;} #poll > .box .vote > ul > li .graph {margin:3px 0; height:5px; background:#b1b1b1;} #poll > .btn {margin:10px 0 20px 0; text-align:right;} #poll .commentdel {padding:20px 0; border:1px solid #e0e0e0; border-width:0 1px; background:#fff; text-align:center;} #poll .commentdel .msg {padding-top:5px;} #poll > .list {border-top:1px solid #dbdbdb;} #poll > .list li {padding:10px 0; border-bottom:1px solid #dbdbdb;} #poll > .list li .no {float:left; width:50px; text-align:center;} #poll > .list li .subject {padding-left:50px; text-align:left;} #poll > .list li .subject .title {overflow:hidden; white-space:nowrap; text-overflow:ellipsis;} #poll > .list li .subject .stat {padding:5px 0; font-size:0.917rem;} #poll > .list li .subject .stat * {font-size:0.917rem;} /* 개별상품쿠폰 레이어 */ #prdCouponArea {max-width:640px; width:100%; top:50% !important; margin-left:0 !important; padding:0 20px;} #pop_coupon2 {position:relative; width:100%; padding:15px; border:1px solid #d9d9d9; background:#fff;} #pop_coupon2 h2 {padding-bottom:10px; border-bottom:1px solid #dbdbdb; color:#000; font-size:1.167rem;} #pop_coupon2 .box {overflow:auto; max-height:300px; margin:-1px 0;} #pop_coupon2 .box > .list > li {position:relative; border-bottom:1px solid #dbdbdb;} #pop_coupon2 .box > .list > li > .img {display:table-cell; width:60px; margin-right:10px;} #pop_coupon2 .box > .list > li > .img img {width:60px; height:auto;} #pop_coupon2 .box > .list > li > .info {display:table-cell; padding-left:10px; vertical-align:middle;} #pop_coupon2 .box > .list > li > .select {border-top:1px solid #dbdbdb;} #pop_coupon2 .box .usable_cpn {padding:10px 0; text-align:left;} #pop_coupon2 .box .usable_cpn > li > label {display:block; position:relative; padding:5px 85px 5px 25px;} #pop_coupon2 .box .usable_cpn > li > label .check {position:absolute; left:0; top:8px;} #pop_coupon2 .box .usable_cpn > li > label .overlap {color:#df7e7e;} #pop_coupon2 .box .usable_cpn > li > label .expiry {position:absolute; right:0; top:3px;} #pop_coupon2 .btn {padding-top:15px; border-top:1px solid #dbdbdb; text-align:center;} #pop_coupon2 .close {display:inline-block; position:absolute; right:15px; top:10px; width:21px; height:21px; background:url('/_skin/bona/img/button/close.png') no-repeat center / 16px; text-indent:-9999px; cursor:pointer;} /* 재입고 알림 신청 레이어 */ #notify_restock {top:50% !important; width:100%; padding:15px; border:1px solid #d9d9d9; background-color:#fff;} #notify_restock .close {display:inline-block; position:absolute; right:15px; top:10px; width:21px; height:21px; background:url('/_skin/bona/img/button/close.png') no-repeat center / 16px; text-indent:-9999px; cursor:pointer;} #notify_restock h2 {padding-bottom:10px; border-bottom:1px solid #dbdbdb; color:#000; font-size:1.167rem;} #notify_restock .tbl_row {margin-top:-1px;} #notify_restock .tbl_row .opt th, #notify_restock .tbl_row .opt td {padding-top:8px; padding-bottom:8px; border-bottom:0;} #notify_restock .tbl_row .phone th, #notify_restock .tbl_row .phone td {border-top:1px solid #e0e0e0;} #notify_restock .agree {display:inline-block; margin-top:10px; cursor:pointer;} #notify_restock .btn {padding-top:20px; text-align:center;} /* 프로모션 기획전(/shop/promotion.php) */ .speical_group {margin:0;}/* {margin:1px 1px 0 0;} 20230905 수정 */ .speical_group > .menu {margin-bottom:20px; font-size:0;} .speical_group > .menu > li {display:inline-block; width:50%;} .speical_group > .menu > li > a {display:block; overflow:hidden; margin:-1px -1px 0 0; padding:10px; border:1px solid #d2d2d2; color:#666; text-align:center; text-overflow:ellipsis; word-wrap:break-word; white-space:nowrap;} .speical_group > .menu > li > a:hover, .speical_group > .menu > li > a.active {position:relative; z-index:2; border:1px solid #535353; color:#333; font-weight:bold;} .speical_group > .intro > .title {position:relative; padding:15px 0; border-bottom:1px solid #d2d2d2;} .speical_group > .intro > .title > h3 {padding-bottom:5px; font-size:1.167rem; font-weight:bold;} .speical_group > .intro > .title > span {color:#666; font-size:1rem;} .speical_group > .intro > .summary {padding:0; border-bottom:1px solid #d2d2d2;} /* 20230803 - 패딩수정 15px */ .speical_group > .intro > .summary img {max-width:100%;} /* .speical_group > .box {border-bottom:1px solid #d2d2d2; text-align:center;} .speical_group > .box > h4 {padding:20px 0 15px; font-size:1.333rem;} .speical_group > .box > .img {padding-bottom:30px;} .speical_group > .box > .img img {max-width:100%;} */ .speical_group > .box {margin:0 6.25%; border-bottom:1px solid #d2d2d2; text-align:center;}/* 20230911 - 수정 */ .speical_group > .box:last-child {border-bottom:0;}/* 20230911 - 추가 */ .speical_group > .box > h4 {padding:20px 0 15px; font-size:1.333rem;} .speical_group > .box > .img {padding-bottom:0;} /* 230803 - 패딩수정 305px */ .speical_group > .box > .img img {max-width:100%;} /* 정기배송 레이어 */ .layer_sbs {position:fixed; top:0; left:0; z-index:100; overflow:auto; width:100%; height:100%; padding:0 4.17% 80px; background-color:#fff;} .layer_sbs .delivery_info > h2.title {height:51px; border-bottom:1px solid #535353; font-size:1.250rem; font-weight:bold; text-align:left; line-height:50px;} .layer_sbs .delivery_info > h2.title.first {margin:0 -4.17%; padding:0 4.17%;} .layer_sbs .delivery_info .fld_info {padding:10px 0 15px;} .layer_sbs .delivery_info .fld_info > li {padding:20px 0; border-bottom:1px solid #e0e0e0;} .layer_sbs .delivery_info .fld_info > li .fld_title {padding-bottom:10px; color:#666; font-size:1.083rem;} .layer_sbs .delivery_info .fld_info > li .calendar + .calendar {padding-top:5px;} .layer_sbs .delivery_info .fld_info > li .calendar .text {display:inline-block; width:100px; vertical-align:middle;} .layer_sbs .delivery_info .fld_info > li .calendar > p {display:inline-block; vertical-align:middle;} .layer_sbs .delivery_info .fld_info > li .calendar > p .date_text {display:inline-block; width:110px; height:33px; margin-right:5px; padding:0 0 0 18px; background:url('/_skin/bona/img/shop/layer_sbs_calendar.png') no-repeat left 10px center/13px; text-align:center; vertical-align:middle;} .layer_sbs .delivery_info .fld_info > li .calendar > p span.date_text {line-height:32px;} .layer_sbs .delivery_info .fld_info > li .calendar > p .day {display:inline-block; color:#666; font-size:0.917rem; vertical-align:middle;} .layer_sbs .delivery_info .tbl_order {border-bottom:1px solid #dcdcdc;} .layer_sbs .delivery_info .tbl_order tr th {color:#666;} .layer_sbs .delivery_info .tbl_order tr:first-child th, .layer_sbs .delivery_info .tbl_order tr:first-child td {padding-top:20px;} .layer_sbs .delivery_info .tbl_order tr:last-child th, .layer_sbs .delivery_info .tbl_order tr:last-child td {padding-bottom:20px;} .layer_sbs .delivery_info .tbl_order tr td.prd_info {padding-bottom:10px; font-size:0; text-align:left;} .layer_sbs .delivery_info .tbl_order tr td.prd_info .prd {display:inline-block; width:77px; vertical-align:middle;} .layer_sbs .delivery_info .tbl_order tr td.prd_info .prd img {width:100%; height:auto;} .layer_sbs .delivery_info .tbl_order tr td.prd_info .info {display:inline-block; width:calc(100% - 77px); padding-left:15px; vertical-align:middle;} .layer_sbs .delivery_info .tbl_order tr td.prd_info .info strong {font-size:1.083rem;} .layer_sbs .delivery_info .tbl_order tr td.prd_info .info .opt {padding-top:5px; color:#888;} .layer_sbs .delivery_info .total_prc {position:relative; padding:21px 0; border-bottom:1px solid #dcdcdc} .layer_sbs .delivery_info .total_prc > span {color:#666; font-size:0.917rem;} .layer_sbs .delivery_info .total_prc > p {position:absolute; top:50%; right:0; margin-top:-10px; font-size:1.250rem; font-weight:bold;} .layer_sbs .delivery_info .total_prc > p * {font-size:1.250rem; font-weight:bold;} .layer_sbs .sbs_info {padding-top:35px;} .layer_sbs .sbs_info .last_chk {padding:20px 20px 10px; background:#f4f4f4;} .layer_sbs .sbs_info .last_chk .icon_title {padding-bottom:15px; border-bottom:1px solid #e0e0e0; text-align:center;} .layer_sbs .sbs_info .last_chk .icon_title span {display:inline-block; padding:2px 0 2px 32px; background:url('/_skin/bona/img/shop/layer_sbs_title_icon.png') no-repeat left center/22px; color:#000; font-size:1.167rem; font-weight:bold;} .layer_sbs .sbs_info .last_chk .chk_list {padding:15px 0;} .layer_sbs .sbs_info .last_chk .chk_list > li {padding:3px 0;} .layer_sbs .sbs_info .last_chk .chk_list > li > span {display:inline-block; width:75px; vertical-align:middle;} .layer_sbs .sbs_info .last_chk .chk_list > li > strong {font-weight:400;} .layer_sbs .sbs_info .last_chk .chk_list > li > strong.point_color {color:#4192f2; font-weight:700;} .layer_sbs .sbs_info .btn {margin-top:25px;} .layer_sbs .sbs_info .btn:after {display:block; clear:both; content:'';} .layer_sbs .sbs_info .btn > span {float:left; width:49%;} .layer_sbs .sbs_info .btn > span:nth-child(2) {float:right;} .layer_sbs > .close {display:inline-block; position:absolute; right:0; top:0; width:45px; height:50px; background:url('/_skin/bona/img/shop/layer_sbs_close.png') no-repeat center/14px; text-indent:-9999px; cursor:pointer;} /*-----------------------------------------------------------------*/ /* 4-3. 회원 /*-----------------------------------------------------------------*/ /* 로그인 & 아이디 비밀번호 찾기 & 비밀번호 변경 */ .box_member {width:100%; padding:0 6.25%;} .box_member .tab_member {padding:23px 0 18px; font-size:0; text-align:center;} .box_member .tab_member > li {display:inline-block; padding:0 5px;} .box_member .tab_member > li a {display:inline-block; padding:5px; font-size:1.167rem; letter-spacing:-0.03rem; cursor:pointer; opacity:.5;} .box_member .tab_member > li a.active {opacity:1;} .box_member fieldset {position:relative;} .box_member fieldset legend {padding:25px 0; font-weight:bold;} .box_member fieldset .fld {position:relative; margin-bottom:0.714rem; font-size:0;} .box_member fieldset .fld label {position:absolute; top:50%; left:1.429rem; color:#C7C7C7; font-size:1.071rem; transform:translateY(-50%); cursor:auto; transition:all .3s ease;} .box_member fieldset .fld.active label {display:inline-block; top:0; background:#fff; color:#333; font-size:0.75rem; line-height:10px;} .box_member fieldset .fld .show_icon {display:none; position:absolute; top:0; right:0; width:42px; height:40px; background:url('/_skin/bona/img/member/icon_pwd.png') no-repeat center/20px; cursor:pointer;} .box_member fieldset .fld .show_icon:after {position:absolute; top:50%; left:0; width:1px; height:20px; margin-top:-10px; background:#e7e7e7; content:'';} .box_member fieldset .fld .show_icon.active {background-image:url('/_skin/bona/img/member/icon_pwd_active.png');} .box_member fieldset .savessl {overflow:hidden; padding:0.500rem 0 1.929rem; font-size:0;} .box_member fieldset .savessl label {margin-right:0.714rem; color:#333; font-size:1.071rem; vertical-align:middle;} .box_member fieldset .savessl a {float:right; color:#333; font-size:1.071rem; text-decoration:underline;} .box_member fieldset .select {float:right; margin-top:-40px;} .box_member fieldset .box_btn * {height:3.571rem; padding:0; border-radius:4px; border:1px solid #FD5000; background:#FD5000; color:#fff !important; font-size:1.071rem; line-height:3.571rem;} /* 로그인 & 아이디 비밀번호 찾기 & 비밀번호 변경 - 인풋 기본 스타일 */ .box_member .form_input.member {height:3.571rem; padding:0 10px; border-color:#F6F6F6; background:#F6F6F6;} .box_member .form_input.member:focus {border-color:#333;} .box_member .form_input.member.number_first {width:24%;} .box_member .form_input.member.number {width:25%; margin-left:1%;} .box_member .form_input.member.number_last {margin-left:1%; width:23%; border-radius:4px; background:#888; color:#fff;cursor:pointer;} .box_member .form_input.member.number_last:focus {background:#fd5000; border-color:#fd5000;} .box_member .form_input.member.num_first {width:32%;} .box_member .form_input.member.num {width:33%; margin-left:1%;} .box_member .find_id_item_2, .box_member .menual, .box_member .find_pw_item_2, .box_member .find_pw_item_3 {display:none;} /* 20230828 비밀번호 찾기 인증버튼 추가 */ .box_member .find_pw_item_3 {position:relative;} .box_member .auth_btn {position:absolute; top:50%; right:1.429rem; transform:translate(0,-50%); padding:4px 16px; border-radius:4px; background:#888; color:#fff; cursor:pointer;} .box_member .form_input:focus + a {position:absolute; top:50%; right:1.429rem; transform:translate(0,-50%); padding:4px 16px; border-radius:4px; background:#fd5000; color:#fff; cursor:pointer;} /* 회원가입 타입 */ .member_type {padding:3.143rem 9.375% 0;} .member_type .join_msg {margin-bottom:1.643rem;} .member_type .join_msg p {margin-bottom:0.643rem; font-size:2.000rem; line-height:2.429rem;} .member_type .join_msg p strong {color:#FD5000; font-size:2.000rem;} .member_type .join_msg span {color:#999; font-size:1.071rem; letter-spacing:-0.15px;} .member_type .email {margin-bottom:1.571rem;} .member_type .email a {display:block; height:3.571rem; border:1px solid #707070; border-radius:4px; text-align:center;} .member_type .email a span {display:inline-block; height:3.571rem; padding-left:2.357rem; background:url('/_skin/bona/img/member/type_email.png')no-repeat left center/1.429rem; font-size:1.071rem; font-weight:600; line-height:3.571rem;} .member_type .simple p {margin-bottom:0.143rem; font-size:1.214rem; font-weight:700;} .member_type .simple a {display:block; width:100%; margin-top:0.714rem; border-radius:4px; background-repeat:no-repeat; background-size:17px; color:#191919; font-size:1.167rem; text-align:center; letter-spacing:-0.03rem; line-height:39px;} .member_type .simple a span {display:inline-block; width:10.071rem; height:3.571rem; padding-left:2.357rem; background-repeat:no-repeat; background-position:left 0 center; color:#fff; font-size:1.071rem; font-weight:600; text-align:center; line-height:3.571rem;} .member_type .simple a.naver {background:#2DB400;} .member_type .simple a.naver span {background-image:url('/_skin/bona/img/member/type_naver.png'); background-size:1.429rem;} .member_type .simple a.kakao {background:#FAE100;} .member_type .simple a.kakao span {background-image:url('/_skin/bona/img/member/type_kakao.png'); background-size:1.571rem; color:#2A1617;} .member_type .simple a.apple {background:#111111;} .member_type .simple a.apple span {background-image:url('/_skin/bona/img/member/type_apple.png'); background-size:1.143rem;} .member_type .msg {padding-top:1.714rem; color:#999; letter-spacing:-0.14px;} /* 로그인(/member/login.php) */ #login {padding:1.500rem 6.25% 19.286rem;} #login .msg {margin-bottom:1.929rem; font-size:2.000rem;} #login .msg strong {font-size:2.000rem;} #login .msg span {display:block; color:#999; font-size:1.071rem;} #login .adult_msg {margin-top:32px; padding:55px 0 35px; border-bottom:1px solid #e6e6e6; background:url('/_skin/bona/img/member/adult_warning.png') no-repeat top center/40px; color:#000; font-size:0.917rem; text-align:center; line-height:18px; letter-spacing:-0.08rem; word-break:keep-all;} #login .adult_msg strong {color:inherit; font-size:inherit;} #login .guest_order {margin-top:10px;} #login #member_ssl {opacity:0; width:0; height:0;} #login .member_ssl {opacity:0; width:0; height:0; margin:0; font-size:0;} #login .fail {position:relative; margin-bottom:20px; padding:18px 10px; border-radius:10px; background:#fae4e8; color:#d53838; text-align:center;} #login .fail:after {position:absolute; left:50%; bottom:-6px; width:0; height:0; margin-left:-8px; border-left:8px solid transparent; border-right:8px solid transparent; border-top:6px solid #fae4e8; content:'';} #login .joinfind {padding:25px 0; font-size:0; text-align:center;} #login .joinfind li {display:inline-block; padding:0 10px;} #login .joinfind li a {letter-spacing:-0.03rem;} #login .simple {margin-bottom:4.214rem; padding-top:3.286rem; font-size:0; text-align:center;} #login .simple h3 {margin-bottom:1.286rem; font-size:1.286rem; font-weight:600;} #login .simple a {display:inline-block; width:3.571rem; height:3.571rem; margin:0 8px; border-radius:50%; background-color:#fff; background-repeat:no-repeat; background-position:center; background-size:3.571rem; color:#191919; font-size:1.167rem; letter-spacing:-0.03rem; line-height:39px;} #login .simple a.naver {background-image:url('/_skin/bona/img/member/icon_sns_naver.png');} #login .simple a.kakao {background-image:url('/_skin/bona/img/member/icon_sns_kakao.png');} #login .simple a.apple {background-image:url('/_skin/bona/img/member/icon_sns_apple.png');} #login .join p {margin-bottom:1.214rem; font-size:1.214rem; text-align:center;} #login .join p strong {font-size:1.214rem;} #login .join a {display:block; height:3.571rem; border:1px solid #707070; border-radius:4px; font-size:1.071rem; font-weight:600; text-align:center; line-height:3.571rem;} #login .adult_certify {padding-top:30px; border-top:1px solid #e6e6e6; text-align:center;} #login .adult_certify h5 {padding-bottom:10px; color:#000; font-size:1.167rem; font-weight:400;} #login .adult_certify p {padding-bottom:10px; color:#888; font-size:0.917rem; letter-spacing:-0.08rem; word-break:keep-all;} #login .adult_certify > a {display:block; height:40px; margin-top:8px; border-radius:6px; background:#aaa9a9;} #login .adult_certify > a span {display:inline-block; height:40px; padding-left:21px; background:no-repeat left center/12px 18px; color:#fff; line-height:40px; letter-spacing:-0.08rem;} #login .adult_certify > a.ipincheckplususe span {background-image:url('/_skin/bona/img/member/adult_phone.png');} #login .adult_certify > a.ipinuse span {background-image:url('/_skin/bona/img/member/adult_ipin.png');} /* 아이디/비밀번호 찾기 레이어 */ .pop_find_id {position:fixed; left:50%; top:100px; z-index:1001; width:98%; border:1px solid #dcdcdc; margin-left:-49%; background-color:#fff;} .pop_find_id h1 {height:49px; padding:0 10px; background-color:#676767; color:#fff; font-size:16px; font-weight:normal; line-height:49px;} .pop_find_id > .box {padding:15px;} .pop_find_id > .box > h2 {color:#333; font-size:20px; font-weight:normal;} .pop_find_id > .box > .msg {padding-top:15px;} .pop_find_id > .box > .input {position:relative; height:50px; margin-top:15px; padding-right:113px; background-color:#f5f5f5;} .pop_find_id > .box > .input:after {position:absolute; right:113px; top:50%; width:1px; height:22px; margin-top:-11px; background-color:#dbdbdb; content:'';} .pop_find_id > .box > .input > .input_number {width:100%; height:50px; padding:0 10px; border:0; background-color:transparent;} .pop_find_id > .box > .input > .btn {position:absolute; right:0; top:0; width:113px; height:50px; border:0; background-color:#f5f5f5; font-weight:bold; cursor:pointer;} .pop_find_id > .box > .form_input {height:50px; margin-top:5px;} .pop_find_id > .box > .box_btn {margin-top:10px;} .pop_find_id > .box > .pop_id_list {padding-top:15px;} .pop_find_id > .box > .pop_id_list .list {overflow:auto; max-height:100px; margin-top:15px; padding:5px 0; border:1px solid #d2d2d2; border-width:1px 0; background-color:#f5f5f5;} .pop_find_id > .box > .pop_id_list .list li {position:relative; padding:5px; text-align:left;} .pop_find_id > .box > .pop_id_list .btn {padding-top:15px; text-align:center;} .pop_find_id > .box > .close {display:inline-block; position:absolute; right:14px; top:14px; width:16px; height:16px; background:url('/_skin/bona/img/button/close.png') no-repeat center; text-indent:-9999px; cursor:pointer;} /* 비밀번호 변경 */ #modify_pwd .modify_id {padding-bottom:20px; font-size:1.167rem; font-weight:bold;} #modify_pwd .msg_chgpw {border:1px dashed #000; margin-bottom:10px; padding:10px; text-align:left;} /* 회원가입 약관동의(/member/join_step1.php) */ #join_agree {padding:1.000rem 6.25% 0; text-align:center;} #join_agree .all_chk {margin-bottom:0.643rem; text-align:left;} #join_agree .all_chk .check label {font-size:1.286rem; font-weight:600; letter-spacing:-0.18px;} #join_agree .all_chk .msg {padding:0 10px; color:#666; font-size:0.833rem; letter-spacing:-0.03rem; line-height:18px;} #join_agree .box {padding:1.214rem 0; border:1px solid #E9E9E9; border-width:1px 0;} #join_agree .check {position:relative; padding:3.5px 0; text-align:left;} #join_agree .check p label {font-size:1.071rem; letter-spacing:-0.15px;} #join_agree .check a {position:absolute; top:0.214rem; right:0; font-size:1.071rem; text-decoration:underline; letter-spacing:-0.15px;} #join_agree .tbl_row {margin-bottom:20px; border-top:1px solid #333;} #join_agree .member_type {height:0; opacity:0; padding:0;} #join_agree .member_type label {margin:0 10px;} #join_agree .btn {padding-top:1.143rem; text-align:center;} #join_agree .btn > * {width:100%;} #join_agree .btn * * {width:100%; height:3.571rem; padding:0; border:0; background:#FD5000; font-size:1.071rem; font-weight:600; text-align:center; line-height:3.571rem;} #join_agree .simple {padding-top:25px; border-top:1px solid #e0e0e0; text-align:center;} #join_agree .simple p {padding-bottom:15px; font-size:1.333rem; letter-spacing:-0.02rem;} #join_agree .simple a {display:block; width:100%; height:40px; margin-top:10px; border:1px solid #000; border-radius:6px; background-color:#fff; background-repeat:no-repeat; background-position:left 15px center; background-size:17px; color:#191919; font-size:1.167rem; letter-spacing:-0.03rem; line-height:39px;} #join_agree .simple a.naver {background-image:url('/_skin/bona/img/member/icon_naver.png');} #join_agree .simple a.facebook {background-image:url('/_skin/bona/img/member/icon_facebook.png');} #join_agree .simple a.kakao {background-image:url('/_skin/bona/img/member/icon_kakao.png');} #join_agree .simple a.payco {background-image:url('/_skin/bona/img/member/icon_payco.png');} #join_agree .simple a.wemake {background-image:url('/_skin/bona/img/member/icon_wemake.png');} #join_agree .simple a.apple {background-image:url('/_skin/bona/img/member/icon_apple.png');} /* 회원가입 정보입력(/member/join_frm.php) */ #join_input {padding:0.143rem 6.25% 8.214rem;} #join_input fieldset {margin-top:10px; background-color:#fff;} #join_input fieldset:nth-of-type(1) {margin-top:0;} #join_input fieldset .form_input.invalid {border-color:#c41c1b; background-color:#fff5f6;} #join_input fieldset legend {display:block; float:left; position:relative; width:100%; color:#333; font-size:1.167rem;} #join_input fieldset legend > span {position:absolute; right:15px; top:10px; color:#666;} #join_input fieldset legend > span > strong {color:#cc3a3a;} #join_input fieldset > .box {} #join_input fieldset > .box:nth-of-type(1) {border-top:0;} #join_input fieldset > .box > div {width:100%; padding:0.500rem 0;} #join_input fieldset > .box > div > label {display:block; padding:0.714rem 0 0.929rem; color:#333; font-size:1.143rem; font-weight:600; text-align:left; vertical-align:middle;} #join_input fieldset > .box > div > label span {font-size:1.143rem; font-weight:400; text-align:left; vertical-align:middle;} #join_input fieldset > .box > div > .input_area {position:relative; vertical-align:middle;} #join_input fieldset > .box > div > .input_area label {margin-right:10px;} #join_input fieldset > .box > div > .input_area input {border-radius:4px; vertical-align:top; letter-spacing:-0.14px;} #join_input fieldset > .box > div > .input_area input::placeholder {color:#999999; letter-spacing:-0.14px;} #join_input fieldset > .box > div > .input_area input[readonly] {background:#F3F3F3; color:#ABABAB;} #join_input fieldset > .box > div > .msg > p {margin:5px 0; padding-left:15px; background:url('/_skin/bona/img/common/bullet_msg.png') no-repeat left 1px; color:#888;} #join_input fieldset > .box > div > .msg > p.warning {background-image:url('/_skin/bona/img/common/bullet_msg_warning.png'); color:#c41c1c;} #join_input fieldset > .box > div.birth > .input_area, #join_input fieldset > .box > div.addr > .input_area {font-size:0;} #join_input fieldset > .box > div.birth select {width:33%; height:3.571rem; margin-left:-1px; font-size:1rem;} #join_input fieldset > .box > div.birth select:nth-of-type(1) {width:34%; margin-left:0; border-radius:4px 0 0 4px;} #join_input fieldset > .box > div.addr {position:relative;} #join_input fieldset > .box > div.addr .radio_chg {margin-bottom:10px;} #join_input fieldset > .box > div.addr .form_input:nth-of-type(1) {opacity:0; height:0; margin-right:0; padding:0;} #join_input fieldset > .box > div.addr .form_input:nth-of-type(2) {margin:0 0 0.714rem;} #join_input fieldset > .box > div.addr .box_btn {position:absolute; top:0.143rem; right:0;} #join_input fieldset > .box > div.addr .box_btn * {position:relative; width:6.000rem; height:3.571rem; padding:0; border:0; background:none; color:#FD5000 !important; font-weight:600; line-height:3.571rem;} #join_input fieldset > .box > div.addr .box_btn *:after {position:absolute; left:0; top:0.857rem; width:1px; height:1.857rem; background:#E9E9E9; line-height; content:'';} #join_input fieldset > .box > div.addr_country .form_input:nth-of-type(3) {margin-bottom:0.714rem; border-radius:0 4px 4px 0;} #join_input fieldset > .box > div.addfld .form_input {width:100%;} #join_input fieldset > .box > div.addfld select {width:26% !important;} #join_input fieldset > .box > div.sns .integrate {font-size:0;} #join_input fieldset > .box > div.sns .integrate > li {display:inline-block; width:33.33%; margin-top:23px; text-align:center; vertical-align:top;} #join_input fieldset > .box > div.sns .integrate > li .name {padding:30px 0 5px; background:no-repeat top center/25px; font-size:0.917rem;} #join_input fieldset > .box > div.sns .integrate > li .name.nameKA {background-image:url('/_skin/bona/img/member/integrate_kakao.png');} #join_input fieldset > .box > div.sns .integrate > li .name.nameNA {background-image:url('/_skin/bona/img/member/integrate_naver.png');} #join_input fieldset > .box > div.sns .integrate > li .name.nameFB {background-image:url('/_skin/bona/img/member/integrate_facebook.png');} #join_input fieldset > .box > div.sns .integrate > li .name.namePC {background-image:url('/_skin/bona/img/member/integrate_payco.png');} #join_input fieldset > .box > div.sns .integrate > li .name.nameWN {background-image:url('/_skin/bona/img/member/integrate_wemake.png');} #join_input fieldset > .box > div.sns .integrate > li .name.nameAP {background-image:url('/_skin/bona/img/member/integrate_apple.png');} #join_input fieldset > .box > div.sns .integrate > li .box_btn a {min-width:45px; font-size:0.875rem;} #join_input fieldset > .box > div.sns .integrate > li .state {padding-top:5px;} #join_input fieldset > .box > div.sns .integrate > li .state span {display:inline-block; padding-left:17px; background:url('/_skin/bona/img/member/integrate_state.png') no-repeat left center/12.5px; color:#888; font-size:0.917rem;} #join_input fieldset > .box > div.sns .integrate > li .state.connect span {background-image:url('/_skin/bona/img/member/integrate_state_connect.png'); color:#fe0100;} /* 회원가입 정보입력 - SNS */ #join_input.api {margin-top:20px;} #join_input.api fieldset > .box > div > .email_area .form_input {margin-right:10px;} #join_input.api fieldset > .box > div > .email_area .box_btn {position:absolute; top:0; right:0;} #join_input.api fieldset > .box > div > .email_area .box_btn * {position:relative; width:6.000rem; height:3.571rem; padding:0; border:0; background:none; color:#FD5000 !important; font-weight:600; line-height:3.571rem;} #join_input.api fieldset > .box > div > .email_area .box_btn *:after {position:absolute; left:0; top:0.857rem; width:1px; height:1.857rem; background:#E9E9E9; line-height; content:'';} #join_input.api fieldset > .box > div > .input_area .api_agree {display:none; padding-top:10px;} /* 회원가입 정보입력 - dummy */ #join_input .dummy {position:absolute; left:0; top:0; width:0; height:0; font-size:0; line-height:0; opacity:0;} /* 회원가입 정보입력 - 기업회원추가입력 */ #join_input fieldset > .box > div.licensee_num .form_input {width:32%;} #join_input fieldset > .box > div.licensee_num .form_input.second {margin:0 2%;} /* 회원가입 정보입력 - 버튼 */ #join_input .btn {margin:1.643rem 0 0; text-align:center;} #join_input .btn * {padding:0; height:3.571rem; border-radius:4px; font-size:1.071rem; font-weight:600; line-height:3.571rem;} /* 비밀번호 안전도 */ #join_input .password_security_lev {display:inline-block; position:relative; margin-top:10px; padding:15px 10px; border:1px solid #bfbfbf; background-color:#fff; color:#333; font-weight:bold; text-align:left;} #join_input .password_security_lev:before {position:absolute; left:7px; top:-5px; width:8px; height:8px; border:1px solid #bfbfbf; border-width:1px 1px 0 0; background-color:#fff; -webkit-transform:rotate(-45deg); transform:rotate(-45deg); content:'';} #join_input .password_security_lev > span {display:inline-block; position:relative; width:72px; height:4px; margin-top:7px; background-color:#e5e5e5; vertical-align:top;} #join_input .password_security_lev > span:before {display:inline-block; position:absolute; left:0; top:0; height:4px; content:'';} #join_input .password_security_lev > span:after{display:inline-block; position:absolute; left:0; top:0; width:inherit; height:inherit; background:url('/_skin/bona/img/member/safebar.gif') no-repeat center; content:'';} #join_input .password_security_lev > p {color:#888; font-size:11px; font-weight:normal; line-height:1.8;} #join_input .password_security_lev.password_security_1 > strong {color:#e60012;} #join_input .password_security_lev.password_security_1 > span:before {width:22px; background-color:#e60012;} #join_input .password_security_lev.password_security_2 > strong {color:#e7853c;} #join_input .password_security_lev.password_security_2 > span:before {width:47px; background-color:#e7853c;} #join_input .password_security_lev.password_security_3 > strong {color:#32b16c;} #join_input .password_security_lev.password_security_3 > span:before {width:72px; background-color:#32b16c;} /* 회원가입완료(/member/join_step3.php) */ #join_finish .finish {padding-bottom:2.000rem; border:0;} #join_finish .box {padding:0; color:#888; text-align:center; line-height:2;} #join_finish .box > .agree {padding:2.000rem 0 1.929rem; border-radius:6px; color:#999999; background-color:#F6F6F6; letter-spacing:-0.14px;} #join_finish .box > .agree > span {display:block; margin-bottom:0.357rem; font-size:1.143rem; font-weight:700; letter-spacing:-0.16px;} #join_finish .box strong {font-size:1.167rem;} #join_finish .box .document > a {display:inline-block; padding:20px 10px; font-weight:bold; text-decoration:underline;} #join_finish .btn {margin-top:2.143rem; text-align:center;} #join_finish .btn .box_btn * {padding:0; border-radius:4px; height:3.571rem; font-size:1.071rem; font-weight:600; line-height:3.571rem;} /* 정보수정(/member/edit_step1.php), 정보수정완료(/member/edit_step3.php) */ .edit_info .box {text-align:left;} .edit_info .box > .msg {color:#666;} .edit_info .box > .agree {margin:20px auto 0; padding:15px; color:#666; background-color:#f0f0f0; text-align:center;} .edit_info .box > .agree > span {display:block;} .edit_info .form_input {margin-top:15px;} .edit_info .btn {padding-top:15px; text-align:center;} .edit_info2 .box {text-align:left;} .edit_info2 .box > .msg {color:#666;} .edit_info2 .box > .agree {margin:20px auto 0; padding:15px; color:#666; background-color:#f0f0f0; text-align:center;} .edit_info2 .box > .agree > span {display:block;} .edit_info2 label {display:block; margin-bottom:15px;} .edit_info2 .form_input {margin-bottom:15px;} .edit_info2 .btn {padding-top:15px; text-align:center;} /* 우편번호 레이어 */ .layer_zip_addr_list {width:100%;} .layer_zip_addr_list .title {position:relative; padding:20px; background:#676767;} .layer_zip_addr_list .title h1 {color:#000; font-size:1.4rem; font-weight:bold; text-align:left;} .layer_zip_addr_list .title .btn {position:absolute; right:15px; top:15px; padding:0 10px;} .layer_zip_addr_list .title .close {display:block; position:relative; z-index:10; width:2px; height:25px; background:#b7b7b7; transform:rotate(45deg);} .layer_zip_addr_list .title .close:after {position:absolute; z-index:20; top:11px; left:-11px; width:25px; height:2px; background:#b7b7b7; content:"";} .layer_zip_addr_list table {table-layout:fixed;} .layer_zip_addr_list caption {display:none;} .layer_zip_addr_list thead th {display:none; padding:10px 0; text-align:center;} .layer_zip_addr_list tbody th {height:34px; padding:10px 0; border-top:1px solid #ddd; color:#000; text-align:center; vertical-align:middle;} .layer_zip_addr_list tbody td {height:34px; padding:10px; border-top:1px solid #ddd; color:#666; text-align:left; vertical-align:middle;} .layer_zip_addr_list tbody td * {color:#666;} .layer_zip_addr_list tbody tr:last-child th, .layer_zip_addr_list tbody tr:last-child td {border-bottom:1px solid #ddd;} .layer_zip_paging * {vertical-align:middle;} .layer_zip_paging {margin:10px 0 20px; text-align:center;} .layer_zip_paging li {display:inline; padding:0 2px; color:#9e9e9e; vertical-align:middle;} .layer_zip_paging li strong {display:inline-block; width:28px; height:28px; border:1px solid #676767; background:#676767; color:#fff; line-height:30px;} .layer_zip_paging li a {display:inline-block; width:28px; height:28px; border:1px solid #ccc; background:#fff; color:#6e6e6e; line-height:30px;} /*-----------------------------------------------------------------*/ /* 4-4. 마이페이지 /*-----------------------------------------------------------------*/ /* 마이페이지 공통 박스 */ .box_mp {margin-bottom:15px; padding:15px; border-radius:8px; background:#f8f8f8; text-align:center; line-height:35px;} /* 20230911 보더추가 */ .box_mp:after {display:block; clear:both; content:'';} .box_mp .have {color:#666;} .box_mp .have span {display:block; padding-top:5px; color:#333; font-family:'Pretendard',sans-serif; font-size:2rem; font-weight:bold;} /* 마이페이지 공통 리스트 */ .list_common {padding-bottom:15px;} .list_common > li {padding:15px; border:1px solid #dbdbdb; border-width:0 0 1px 0;} .list_common > li:first-child {border-top:1px solid #dbdbdb;} .list_common > li:after {display:block; clear:both; content:'';} .list_common > li .left_area {float:left; width:85px; color:#888; text-align:left;} .list_common > li .right_area {margin-left:85px; color:#666; text-align:left;} .list_common > li .right_area * {color:inherit;} .list_common > li .right_area > p, .list_common > li .right_area > div {padding-top:5px;} .list_common > li .right_area > p:first-child, .list_common > li .right_area > div:first-child {padding-top:0;} /* 20230911 마이페이지 쿠폰 리스트 추가 */ .list_coupon {padding-bottom:15px;} .list_coupon > li {margin-bottom:15px;} .list_coupon > li.stay {padding:15px; border:1px solid #fd5000; border:1px solid #fd5000; border-radius:8px;} .list_coupon > li.stay:after {display:block; clear:both; content:'';} .list_coupon > li.stay .left_area {float:left; width:128px; color:#888; text-align:left;} .list_coupon > li.stay .left_area .point {font-size:1.8rem; font-weight:700; color:#fd5000;} .list_coupon > li.stay .right_area {margin-left:128px; color:#666; text-align:left;} .list_coupon > li.stay .right_area * {color:inherit;} .list_coupon > li.stay .right_area > p, .list_coupon > li.stay .right_area > div {padding-top:5px;} .list_coupon > li.stay .right_area > p:first-child, .list_coupon > li.stay .right_area > div:first-child {padding-top:0;} .list_coupon > li.stay .right_area > p .point {font-weight:700; color:#fd5000;} .list_coupon > li.use {padding:15px; border:1px solid #dbdbdb; border:1px solid #dbdbdb; border-radius:8px;} .list_coupon > li.use:after {display:block; clear:both; content:'';} .list_coupon > li.use .left_area {float:left; width:128px; color:#dbdbdb; text-align:left;} .list_coupon > li.use .left_area .point {font-size:1.8rem; font-weight:700; color:#dbdbdb;} .list_coupon > li.use .right_area {margin-left:128px; color:#dbdbdb; text-align:left;} .list_coupon > li.use .right_area * {color:inherit;} .list_coupon > li.use .right_area > p, .list_coupon > li.use .right_area > div {padding-top:5px;} .list_coupon > li.use .right_area > p:first-child, .list_coupon > li.use .right_area > div:first-child {padding-top:0;} .list_coupon > li.use .right_area > p .point {font-weight:700; color:#dbdbdb;} .list_coupon > li.use .right_area > p .point a {font-weight:700; color:#fd5000; text-decoration:underline;} /* 마이페이지 공통 리스트 - 쿠폰,소셜쿠폰 */ .list_common .left_area .point {font-size:1.333rem;} /* 마이페이지 공통 리스트 - 관심상품, 관련상품 */ .list_common.prd > li {padding-left:0;} .list_common.prd .left_area {width:130px;} .list_common.prd .left_area .check {float:left; margin-right:10px;} .list_common.prd .left_area img {width:80px; height:auto;} .list_common.prd .right_area {margin-left:130px;} .list_common.prd .right_area select {width:100%;} /* 마이페이지 공통 리스트 - 주문조회 */ .list_common.orderlist .left_area {width:130px;} .list_common.orderlist .right_area {margin-left:130px;} /* 마이페이지 메인(/mypage/mypage.php) */ .my_info.bg {background:#FD5000;} .my_info .my_member {position:relative; padding:30px 6.25% 42px; font-size:0;} .my_info .my_member .img {display:inline-block; position:relative; width:7.143rem; height:7.143rem; vertical-align:middle;} .my_info .my_member .img .test_icon {display:inline-block; width:7.143rem; height:7.143rem; border-radius:50%; background:#999;} .my_info .my_member .img a img {display:inline-block; position:absolute; bottom:2px; right:3px; width:1.714rem; height:1.714rem;} .my_info .my_member .img.on {background:none;} .my_info .my_member .img img {width:100%; height:auto;} .my_info .my_member .member_info {display:inline-block; width:calc(100% - 9.286rem); padding:0 2.143rem; vertical-align:middle;} .my_info .my_member .member_info .name {margin-bottom:0.500rem; color:#fff; font-size:2.000rem;} .my_info .my_member .member_info .name strong {color:#fff; font-size:2.000rem; font-weight:600;} .my_info .my_member .member_info .rank {color:#fff; font-size:1.083rem;} .my_info .my_member .member_info .rank a {color:#fff; font-size:1.083rem; text-decoration:underline;} .my_info .my_member .member_info .ref_code {color:#fff; font-size:1.083rem; margin-top:5px;} .my_info .my_member .member_info .ref_code a {color:#fff; font-size:1.083rem;} .my_info .my_member .member_info .benefit {display:inline-block; position:absolute; top:33%; right:7.03125%;} .my_info .my_member .member_info .benefit a {padding:8px 12px; border-radius:2.000rem; background:#FE9666; color:#fff; font-size:1rem;} .my_info .my_member .member_info .logout {position:absolute; top:-42px; right:6.25%;} .my_info .my_member .member_info .logout a {display:block; height:1.286rem; padding-left:1.786rem; background:url('/_skin/bona/img/common/icon_join.png')no-repeat left center/1.5rem; color:#fff; font-size:1rem; line-height:1.286rem;} .my_info .msg {margin-top:5px; padding:0 5.55% 20px 5.55%;} .my_info .msg p {color:#888; font-size:0.917rem;} .my_info .menu ul {display:flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; width:100%; margin-bottom:26px; padding:7px 0; border:1px solid #DFDFDF; border-width:1px 0;} .my_info .menu ul li {display:block; position:relative; width:25%; margin:15px 0; color:#666; text-align:center;} .my_info .menu ul li p {color:#888;} .my_info .menu ul li a {display:block;} .my_info .menu ul li span {display:inline-block; margin-top:7px; font-size:1.583rem; font-weight:bold; line-height:100%;} .my_info .info {width:88.9%; margin:0 auto 15px; padding:13px 20px; border-radius:5px; background:#F5F5F5;} .my_info .info .name {display:inline-block; margin-bottom:11px; font-size:1.083rem; letter-spacing:-0.65px;} .my_info .info .tel {display:inline-block; color:#888; font-weight:400; letter-spacing:-0.6px;} .my_info .info ul {font-size:0;} .my_info .info ul li {display:inline-block; min-width:36%; margin-bottom:4px; color:#888;} .my_info .info ul li strong {color:#000; font-weight:500;} .mu_sheet {padding:2.500rem 0 0; border-radius:20px 20px 0px 0px; background:#fff;} .mu_sheet.type2 {padding:2.500rem 6.25% 4.786rem; font-size:0;} .mu_sheet .menu {padding:0 6.25% 2.857rem;} .mu_sheet .menu ul {display:flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; width:100%; margin-bottom:0; padding:7px 0; border-radius:10px; background:#F8F8F8; border-width:1px 0;} .mu_sheet .menu ul li {display:block; position:relative; width:50%; margin:0.786rem 0 0.857rem; padding:0 30px; color:#666; text-align:center;} .mu_sheet .menu ul li:first-child:after {position:absolute; right:0; top:0; width:1px; height:1.429rem; background:#DBDBDB; content:'';} .mu_sheet .menu ul li p {display:inline-block; width:50%; padding-left:1.786rem; color:#888; text-align:left; line-height:1.429rem;} .mu_sheet .menu ul li.milage p {background:url('/_skin/bona/img/mypage/icon_mileage.png')no-repeat left center/1.357rem;} .mu_sheet .menu ul li.coupon p {background:url('/_skin/bona/img/mypage/icon_coupon.png')no-repeat left center/1.429rem;} .mu_sheet .menu ul li a {display:block; text-align:right;} .mu_sheet .menu ul li a > span {display:inline-block; width:50%; font-size:1.143rem; font-weight:bold; line-height:100%;} .mu_sheet .menu ul li a > span span {font-size:1.143rem; font-weight:400;} .mu_sheet .box {margin:0; padding:0; border-radius:6px; /* background:#F6F6F6; */ font-size:0;} .mu_sheet .box > div {display:inline-block; padding-bottom:2.500rem; vertical-align:top;} .mu_sheet .box h3 {padding:1.643rem 0 0.500rem; font-size:1.286rem;} .mu_sheet .box h3 span {color:#999; font-weight:400;} .mu_sheet .box > div ul li {position:relative; margin-bottom:5px; font-weight:500;} .mu_sheet .box > div ul li span {display:inline-block; width:8.429rem; padding-right:10px; color:#999;} .mu_sheet .box .left {width:100%; padding:0 2.143rem 1.429rem; margin-bottom:0.714rem; border-radius:10px; background:#F6F6F6;} .mu_sheet .box .left ul li {min-height:1.200rem; padding-left:8.429rem;} .mu_sheet .box .left ul li span {position:absolute; top:0; left:0;} .mu_sheet .box .right {display:inline-block; width:100%; margin-bottom:0.714rem; padding:0 2.143rem 1.429rem; border-radius:10px; background:#F6F6F6;} .mu_sheet .box .right ul.top {padding-bottom:10px; font-size:0;} .mu_sheet .box .right ul.top li:first-child {margin-left:0;} .mu_sheet .box .right ul.top li {display:inline-block; width:33.33%; font-weight:500; text-align:left;} .mu_sheet .box .right.col2 ul.top li {width:50%;} .mu_sheet .box .right ul.top li:last-child {margin:0;} .mu_sheet .box .right ul.top li span {display:block; width:100%; color:#999; font-size:1.071rem;} .mu_sheet .box .right ul.top li strong {font-size:1.714rem;} .mu_sheet .box .right ul.bottom {padding-top:20px; border-top:1px solid #444; font-size:0;} .mu_sheet .box .right ul.bottom li {display:inline-block; position:relative; width:50%; padding:0 20px; text-align:right;} .mu_sheet .box .right ul.bottom li span {position:absolute; top:0; left:0; text-align:left;} .mu_sheet .box.type2 {position:relative; padding:0 2.143rem 0.929rem; border-radius:10px; background:#F6F6F6;} .mu_sheet .box.type2.col2 {display:inline-block; width:calc(50% - 0.357rem); padding:0 2.143rem;} .mu_sheet .box.type2.col2.first {margin-right:0.714rem;} .mu_sheet .box.type2.col2 p {padding:1.429em 0;} .mu_sheet .box.type2 p {position:relative; padding:0.429rem 0; font-size:1.071rem; font-weight:500;} .mu_sheet .box.type2 p.strong {font-weight:700;} .mu_sheet .box.type2 p > span {display:inline-block; position:absolute; top:50%; right:0; margin-top:-0.714rem;} .mu_sheet .box.type2 p.strong > span {display:inline-block; position:absolute; top:50%; right:0; margin-top:-0.714rem;} .mu_sheet .box.type2 p.strong.color > span {color:#FD5000;} .mu_sheet .box.type2 p > span > span {display:inline-block; height:2.214rem; font-size:1.071rem;} .mu_sheet .box.type2 p > span strong {display:inline-block; height:2.214rem; font-size:1.857rem;} .mu_sheet .box.type2.col2 p > span {margin-top:-0.643rem;} .mu_sheet .box.type2.col2 p > span strong {font-size:1.071rem;} .mu_sheet .box.type2.total p > span span {color:#FD5000;} .mu_sheet .box.type2.total p > span strong {color:#FD5000;} .my_menu {display:inline-block; width:100%; background:#fff;} .my_menu dl {margin-bottom:3.286rem; padding-top:0.5rem;} .my_menu dl dt {display:block; padding:0 6.25% 1.357rem; border-bottom:1px solid #E8E8E8; font-size:1.429rem; font-weight:700; letter-spacing:-0.8px;} .my_menu dl dd a {display:block; height:4.357rem; padding:0 6.25% 0; border-bottom:1px solid #E8E8E8; background:url('/_skin/bona/img/mypage/btn_next.png')no-repeat right 6.25% center/1.143rem; color:#000; font-size:1.143rem; font-weight:400; letter-spacing:-0.7px; line-height:4.357rem;} .my_menu dl:last-child {margin-bottom:120px;} /* 수정 230803 - 하단여백수정 */ /* 2024.03.06 알림설정 추가 */ .my_menu .noti_check {display: flex; justify-content: space-between; align-items: center;} .my_menu.noti_set dl dd span {display: flex; justify-content: space-between; align-items: center; height:4.357rem; padding:0 6.25% 0; border-bottom: 1px solid #F5F5F5; color:#000; font-size:1.143rem; font-weight:400; letter-spacing:-0.7px; line-height:4.357rem;} .toggleBG{background: #D9D9D9; width: 39px; height: 20px; border: 1px solid #D9D9D9; border-radius: 15px;} .toggleFG{background: #FFFFFF; width: 16px; height: 16px; border: 1px; border-radius: 15px; position: relative; left: 0px; top: 1px;} /* 2024.03.06 알림함 목록 */ .noti_list_box {background-color: #f5f5f5;} .noti_list_box .noti_list {padding: 2% 4%;} .noti_list_box .noti_list li { margin: 10px 0 -10px 0; background-color: #fff; padding: 27px 29px; justify-content: center; align-items: center;border-radius: 8px; } .noti_list_box .noti_list .tag-drink { color: #333; display: inline-block; font-size: 1.14rem; font-weight: 600; padding: 4px 7px; line-height:1.14rem; justify-content: center; align-items: center; gap: 10px;border-radius: 4px; background: #F3F3F3; } .noti_list_box .noti_list .notice .name {margin: 0;} .noti_list_box .noti_list .notice .name .noti-emp{color: #FD5000; font-weight: 600; display: block;} .noti_list_box .noti_list .notice .info {display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 1.14rem;} .noti_list_box .noti-info {color: #666; text-align: center; font-size: .85rem; line-height: normal;padding: 3rem 0;} .noti_msg {border-bottom: 1px solid #F5F5F5;} .noti_msg .noti_date {color: #666; font-size: .85rem;margin-top:1rem ;} .noti_msg_detail {margin: 0; margin-top: 0;} .noti_msg_detail p {margin-bottom: 2rem;} .wrap_inner3 { background-color: #F5F5F5;} .wrap_inner3 > div {padding: 6.25%; background: #fff; margin-top: 20px;} .wrap_inner3 > div:first-child {padding: 6.25%; background: #fff; margin-top: 0px; border-top:20px solid #f5f5f5;} .wrap_inner3 h3 {font-size: 1.286rem;} .wrap_inner3.noti_wrap > div {margin-top: 0;} .wrap_inner3.wrap_setting {padding: 6.25% 0;} #mypage {background:#FD5000;} #mypage h3 {padding:10px 0; font-size:1.250rem; text-align:left;} #mypage h3 + .title_count {margin:-28px 0 16px; text-align:right;} #mypage .prd_latest {padding-top:5px;} #mypage .list {width:100%; margin:0 auto 7px; border-bottom:1px solid #dbdbdb;} #mypage .list .no {padding:9px 5px 8px; border-top:1px solid #DFDFDF; background:#f5f5f5; color:#333; font-size:1.167rem;} #mypage .list .no a {border-bottom:1px solid #000; color:#333; font-weight:500;} #mypage .list .no span {display:inline-block; float:right; margin-top:2px; color:#888;} #mypage .list .info {padding:11px 0 0;} #mypage .list .info p.name {margin-bottom:7px;} #mypage .list .info p.name * {font-size:1.083rem; letter-spacing:-0.325px;} #mypage .list .info .price {margin-bottom:14px; font-size:0;} #mypage .list .info .price p {display:inline-block; font-size:1.083rem;} #mypage .list .info .price p.before {color:#888; text-decoration:line-through;} #mypage .list .info .price p.after {margin-left:5px;} #mypage .list .info .bottom {position:relative; padding:20px 0; border-top:1px dashed #999;} #mypage .list .info .bottom .p_color {font-size:1.083rem;} #mypage .list .info .set_label {display:inline-block; padding:0 6px; border:1px solid #d53838; border-radius:17px; color:#d53838; font-size:0.917rem; text-align:center; vertical-align:middle;} #mypage .list .info .btn {position:absolute; top:0; right:0; width:50%; padding:10px 0;} #mypage .search .box_btn {padding:0 5.55%;} #mypage .search .box_btn * {height:45px; padding:0; font-size:1.167rem; line-height:45px; letter-spacing:-0.7px;} #mypage .latest {margin-left:-10px; font-size:0;} #mypage .latest li {float:left; width:20%; padding:0 0 10px 10px; text-align:center;} #mypage .latest li img {width:100%; height:auto;} #mypage .mypage_wrap {border-radius:20px 20px 0px 0px; background:#fff;} #mypage .mypage_wrap > .menu {padding-bottom:2.500rem; background:#fff; font-size:0; text-align:center;} #mypage .mypage_wrap > .menu li {display:inline-block; margin:0 2.143rem;} #mypage .mypage_wrap > .menu li.order a {background:url('/_skin/bona/img/mypage/icon_orderlist.png')no-repeat center top 0.071rem/2.071rem;} #mypage .mypage_wrap > .menu li.wish a {background:url('/_skin/bona/img/mypage/icon_like.png')no-repeat center top 0.286rem/2.071rem;} #mypage .mypage_wrap > .menu li.ref a {background:url('/_skin/bona/img/mypage/icon_recently.png')no-repeat center top 2px/2.071rem;} #mypage .mypage_wrap > .menu li.funding a {background:url('/_skin/bona/img/mypage/icon_funding.png')no-repeat center top 0/2.929rem;} #mypage .mypage_wrap > .menu li a {display:inline-block; width:5.714rem; height:4.429rem; padding:2.786rem 0 0; font-size:1.143rem; font-weight:600;} /* #mypage .my_info {background:#f8f8f8;} #mypage .my_info ul {display:flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; width:100%; padding:15px 0;} #mypage .my_info ul li {display:block; position:relative; width:33%; margin:15px 0; color:#666; text-align:center;} #mypage .my_info ul li:after {position:absolute; left:0; top:0; width:1px; height:100%; background:#e5e5e5; content:'';} #mypage .my_info ul li:nth-child(3n+1):after {display:none;} #mypage .my_info ul li a {display:block;} #mypage .my_info ul li span {display:block; margin-top:10px; font-size:1.250rem; font-weight:bold; line-height:100%;} #mypage h3 {padding:10px 0; font-size:1.250rem; text-align:left;} #mypage h3 + .title_count { margin:-28px 0 16px; text-align:right;} #mypage .prd_latest {padding-top:5px;} #mypage .list {margin:0 -15px; border-bottom:1px solid #dbdbdb;} #mypage .list .no {padding:10px 15px; background:#e9e9e9; color:#333; font-size:1.167rem;} #mypage .list .no a {color:#333; font-size:1.167rem; font-weight:bold;} #mypage .list .no span {float:right; color:#888;} #mypage .list .info {padding:15px;} #mypage .list .info p + p {padding-top:3px;} #mypage .list .info .set_label {display:inline-block; padding:0 6px; border:1px solid #d53838; border-radius:17px; color:#d53838; font-size:0.917rem; text-align:center; vertical-align:middle;} #mypage .latest {margin-left:-10px; font-size:0;} #mypage .latest li {float:left; width:20%; padding:0 0 10px 10px; text-align:center;} #mypage .latest li img {width:100%; height:auto;} */ /* 카메라 인증 */ main {width:100%; height:100%; text-align:center;} main > div {float:left; width:1%; height:98%;} main > div:first-child {width:49%;} main > div:last-child {background-color:#D3D3D3; width:49%;} div#output {background-color:#BDBEBD;} div#frame {border:2px solid #005666; background-color:#FFFFFF; margin-left:10px; margin-right:10px; padding-left:8px; padding-right:8px; padding-top:8px; padding-bottom:8px;} div#outputLayer {text-align:left;} canvas {width:50%;} div#frame {opacity:0; visibility:hidden; position:fixed; top:0; left:0; z-index:66; width:100%; height:100vh; margin:0; padding:0;} div#frame.on {opacity:1; visibility:visible;} div#frame .close a {display:inline-block; position:fixed; top:30px; right:30px; z-index:80; width:30px; height:30px; background:url('/_skin/bona/img/common/hd_close.png')no-repeat center/30px;} canvas {position:fixed; top:0; left:0; z-index:66; width:100%; height:100vh;} /* 판매자 동의 */ #step1_layer {position:fixed; top:0; left:0; z-index:55; width:100%; height:100vh; background:rgba(0,0,0,0.5);} #step1_layer h3 {margin-bottom:20px; font-size:1.429rem; font-weight:700; letter-spacing:-0.18px; text-align:center;} #step1_layer .msg {margin-bottom:20px; font-size:1.071rem; line-height:23px;} #step1_layer .join_agree_wrap {position:absolute; top:50%; left:50%; width:640px; padding:1.000rem 20px 0; transform:translate(0 ,-50%);} #step1_layer .join_agree {width:100%; padding:40px 30px; border-radius:20px; background:#fff; background:#fff;} #step1_layer .join_agree .all_chk {margin-bottom:0.643rem; text-align:left;} #step1_layer .join_agree .all_chk .check label {font-size:1.286rem; font-weight:600; letter-spacing:-0.18px;} #step1_layer .join_agree .all_chk .msg {padding:0 10px; color:#666; font-size:0.833rem; letter-spacing:-0.03rem; line-height:18px;} #step1_layer .join_agree .box {margin-bottom:20px; padding:1.214rem 0; border:1px solid #E9E9E9; border-width:1px 0;} #step1_layer .join_agree .check {position:relative; padding:3.5px 0; text-align:left;} #step1_layer .join_agree .check p label {font-size:1.071rem; letter-spacing:-0.15px;} #step1_layer .join_agree .check a {position:absolute; top:0.214rem; right:0; font-size:1.071rem; text-decoration:underline; letter-spacing:-0.15px;} #step1_layer .join_agree .tbl_row {margin-bottom:20px; border-top:1px solid #333;} #step1_layer .close {width:40px; height:40px; margin:0 auto 30px; background:url('/_skin/bona/img/common/icon_close.png')no-repeat center; color:#fff; color:#fff; cursor:pointer;} /* 매출정산 */ .sales_detail {padding-bottom:3.214rem;} .sales_detail h3 {padding-bottom:0.714rem; font-size:1.429rem;} .sales_detail h3 span {color:#999999; font-size:1.071rem; font-weight:400; letter-spacing:-0.15px;} .sales_detail .card {margin-bottom:1.571rem; padding:0 6.25% 1.714rem; border-bottom:0.714rem solid #F9F9F9; font-size:0;} .sales_detail .box {margin:0; padding:0; border-radius:6px; font-size:0;} .sales_detail .box > div {display:inline-block; padding-bottom:2.500rem; vertical-align:top;} .sales_detail .box > div h3 {padding:1.643rem 0 0.500rem; font-size:1.286rem;} .sales_detail .box > div ul li {position:relative; margin-bottom:5px; font-weight:500;} .sales_detail .box > div ul li span {display:inline-block; width:8.429rem; padding-right:10px; color:#999;} .sales_detail .box .left {width:100%; height:12.500rem; padding:0 2.143rem; margin-bottom:0.714rem; border-radius:10px; background:#F6F6F6;} .sales_detail .box .left ul li {min-height:1.200rem; padding-left:8.429rem;} .sales_detail .box .left ul li span {position:absolute; top:0; left:0;} .sales_detail .box .right {display:inline-block; width:100%; height:9.643rem; padding:0 0.714rem 0 3.857em; border-radius:10px; background:#F6F6F6;} .sales_detail .box .right ul {font-size:0;} .sales_detail .box .right ul li:first-child {margin-left:0;} .sales_detail .box .right ul li {display:inline-block; width:33.33%; font-weight:500;} .sales_detail .box .right ul li:last-child {margin:0;} .sales_detail .box .right ul li span {display:block; width:100%; color:#999; font-size:1.071rem;} .sales_detail .box .right ul li strong {font-size:1.714rem;} .sales_detail .box.type2 {position:relative; margin-top:0.714rem; padding:0.929rem 2.143rem; border-radius:10px; background:#F6F6F6;} .sales_detail .box.type2.col2 {display:inline-block; width:calc(50% - 0.357rem); padding:0 2.143rem;} .sales_detail .box.type2.col2.first {margin-right:0.714rem;} .sales_detail .box.type2.col2 p {padding:1.429em 0;} .sales_detail .box.type2 p {position:relative; padding:0.429rem 0; font-size:1.071rem; font-weight:500;} .sales_detail .box.type2 p.strong {font-weight:700;} .sales_detail .box.type2 p > span {display:inline-block; position:absolute; top:50%; right:2.143rem; margin-top:-0.714rem;} .sales_detail .box.type2 p.strong > span {display:inline-block; position:absolute; top:50%; right:2.143rem; margin-top:-0.714rem;} .sales_detail .box.type2 p.strong.color > span {color:#FD5000;} .sales_detail .box.type2 p > span > span {display:inline-block; height:2.214rem; font-size:1.071rem; vertical-align:top;} .sales_detail .box.type2 p > span strong {display:inline-block; height:2.214rem; font-size:1.857rem;} .sales_detail .box.type2.col2 p > span {margin-top:-0.643rem;} .sales_detail .box.type2.col2 p > span strong {font-size:1.071rem;} .sales_detail .box.type2.total p > span span {color:#FD5000;} .sales_detail .box.type2.total p > span strong {color:#FD5000;} .sales_detail .list > li {margin-bottom:0.286rem; border-top:1px solid #E9E9E9;} .sales_detail .list .info {padding:1.286rem 0 1.357rem;} .sales_detail .list .info p {color:#FD5000; font-size:1.143rem; font-weight:700; letter-spacing:-0.16px;} .sales_detail .list .info li {display:inline-block; position:relative; width:100%; min-height:1.357rem; margin:0.357rem 0; padding-left:10rem; font-size:1.071rem; letter-spacing:-0.15px;} .sales_detail .list .info li strong {font-size:1.071rem; letter-spacing:-0.15px;} .sales_detail .list .info li span {display:inline-block; position:absolute; top:0; left:0; width:10rem; font-size:1.071rem; font-weight:600; letter-spacing:-0.15px;} .sales_detail .wrap_list {padding:0 6.25%;} /* 주문내역조회(/mypage/order_list.php) */ #order_list {margin-bottom:5.714rem;} #order_list > .search {display:block; font-size:0; text-align:left;} #order_list > .search .date {margin-bottom:0.714rem; padding:0 6.25%; font-size:0; vertical-align:top;} #order_list.none > .search .date {display:none;} #order_list > .search .date .swiper-slide {display:inline-block; width:auto; height:2.714rem; border-radius:2.714rem; background:#F6F6F6; text-align:left;} #order_list > .search .date .swiper-slide * {display:inline-block; padding:0 1.429rem; color:#111; font-size:1.071rem; letter-spacing:-0.7px; line-height:2.714rem;} #order_list > .search .date .swiper-slide.on {background:#FD5000;} #order_list > .search .date .swiper-slide.on * {color:#fff; font-weight:600;} #order_list > .search .date:after {display:block; clear:both; content:'';} #order_list > .search .select {display:inline-block;} #order_list > .search .select select {width:140px; height:3.286rem; margin-right:10px; border-radius:4px; vertical-align:top;} #order_list > .search .data_wrap {display:inline-block; width:calc(100% - 151px); font-size:0; vertical-align:top;} #order_list.sell > .search .data_wrap {margin-bottom:1rem;} #order_list > .search .date_input {display:inline-block; width:calc(100% - 6.429rem); text-align:left;} #order_list.sell > .search .date_input {width:100%;} #order_list > .search .date_input div {position:relative; line-height:3.286rem; text-align:left; vertical-align:top;} #order_list > .search .date_input div > .form_input {display:inline-block; width:47%; height:3.286rem; border-color:#DFDFDF; border-radius:4px; line-height:3.286rem;} #order_list > .search .date_input div > .form_input:nth-child(2) {position:absolute; top:0; right:0%;} #order_list > .search .date_input div:after {position:absolute; top:1.643rem; left:50%; width:0.571rem; height:0.071rem; margin-left:-0.286rem; background:#000; content:'';} #order_list > .search .box {padding:0 6.25% 1.714rem; border-bottom:0.714rem solid #F9F9F9; font-size:0;} #order_list .list {} #order_list .list > li {margin-bottom:0.286rem; border-bottom:1px solid #E9E9E9;} #order_list .list > li:last-child {border-bottom:0;} #order_list .list .no {overflow:hidden; position:relative; height:3.571rem; border-bottom:1px dashed #C7C7C7; color:#333; font-size:1.143rem; line-height:3.571rem; letter-spacing:-0.16px;} #order_list .list .no a {display:inline-block; padding:1.000rem 0; color:#333; font-size:1.143rem; font-weight:700; letter-spacing:-0.16px;} #order_list .list .no span {display:inline-block; margin-left:0.571rem; color:#999; letter-spacing:-0.14px;} #order_list .list .no .real {margin:0;} #order_list .list .no .link {position:absolute; top:1.286rem; right:0;} #order_list .list .no .link a {display:inline-block; margin-left:0.571rem; padding:0 1.071rem 0 0; background:url('/_skin/bona/img/shop/btn_next.png')no-repeat right top 0.143rem/1rem; color:#999; font-size:1rem; font-weight:400; letter-spacing:-0.14px;} #order_list .list .info {padding:1.286rem 0 1.357rem;} #order_list .list .info p {margin-bottom:0.643rem; color:#FD5000; font-size:1.143rem; font-weight:700; letter-spacing:-0.16px;} #order_list .list .info li {display:inline-block; position:relative; width:100%; min-height:1.357rem; margin:0.357rem 0; padding-left:10rem; font-size:1.071rem; letter-spacing:-0.15px;} #order_list .list .info li strong {font-size:1.071rem; letter-spacing:-0.15px;} #order_list .list .info li span {display:inline-block; position:absolute; top:0; left:0; width:10rem; font-size:1.071rem; font-weight:600; letter-spacing:-0.15px;} #order_list .list .info .set_label {display:inline-block; padding:0 6px; border:1px solid #d53838; border-radius:17px; color:#d53838; font-size:0.917rem; text-align:center; vertical-align:middle;} #order_list .list .info .btn {position:absolute; top:0; right:0; width:50%; padding:10px 0;} #order_list.sell .search .box_btn {width:47%; padding:0 0;} #order_list .search .box_btn.replay {margin-left:6%;} #order_list .search .box_btn input {display:block; height:3.286rem; margin-left:1.143rem; padding:0 0 0 1.643rem; border:0; background:url('/_skin/bona/img/common/hd_search.png')no-repeat left center/1.429rem; color:#333 !important; font-size:1.071rem; font-weight:600; line-height:3.286rem; letter-spacing:-0.7px;} #order_list.sell .search .box_btn input {display:block; width:100%; height:3.286rem; margin-left:0; padding:0; border-radius:0; border-radius:4px; background:#FD5000; color:#fff !important; font-weight:400; line-height:3.286rem; letter-spacing:-0.7px;} #order_list .search .box_btn a {display:block; height:3.286rem; padding:0; font-size:1.071rem; line-height:3.286rem;} /* 주문상세조회(/mypage/order_detail.php) */ #order_detail .order_no {padding:1.286rem 6.25% 0.786rem; border-bottom:0.714rem solid #F9F9F9; font-size:1.286rem; font-weight:600; text-align:left; letter-spacing:-0.18px;} #order_detail .border {border-bottom:0.714rem solid #F9F9F9;} #order_detail .border .wrap_inner2 {padding:0.143rem 6.25% 1.286rem;} #order_detail .stat_img {padding:10px 0;} #order_detail .stat_img li {float:left; width:20%; padding:0 2px;} #order_detail .stat_img li img {width:100%; height:auto;} #order_detail .stat_img:after {display:block; clear:both; content:'';} #order_detail h3.title {position:relative; padding:1.643rem 6.25% 0.857rem; font-size:1.429rem;} #order_detail h3.title:after {position:absolute; right:6.25%; bottom:0.857rem; width:1.286rem; height:1.286rem; background:url('/_skin/bona/img/mypage/btn_up.png')no-repeat right center/1.286rem; content:'';} #order_detail h3.title.active:after {background:url('/_skin/bona/img/mypage/btn_down.png')no-repeat right center/1.286rem;} #order_detail .tab {margin-top:0.214rem; font-size:0;} #order_detail .tab li {display:inline-block; width:calc(50% - 5px); text-align:center;} #order_detail .tab li a {display:block; height:3.571rem; margin-bottom:0.714rem; border:1px solid #E9E9E9; border-radius:4px; font-size:1.071rem; line-height:3.571rem; letter-spacing:-0.15px;} #order_detail .tab li:nth-child(2n-1) a {margin-right:0.357rem;} #order_detail .tab li:nth-child(2n) a {margin-left:0.357rem;} #order_detail .tab li:nth-child(n+3) a {margin-bottom:0;} #order_detail .tab:after {display:block; clear:both; content:'';} #order_detail .back_list {padding:1.286rem 6.25% 7.143rem;} #order_detail .back_list .box_btn a {height:3.571rem; padding:0; border:1px solid #FD5000; border-radius:4px; background:#FD5000; font-size:1.071rem; font-weight:600; line-height:3.571rem;} /* 주문상세조회(/mypage/order_detail.php) - 정기배송주문상세조회 */ #order_detail > .wrap_inner > h4.title {margin-top:15px; padding:15px 0; border-top:1px solid #e0e0e0; font-size:1.083rem} #order_detail > .wrap_inner > h4:first-child {margin-top:0; padding-top:0; border-top:0;} #order_detail > .wrap_inner > .chgdelivery {position:relative; top:-35px; height:0; text-align:right;} #order_detail > .wrap_inner > .btn {margin-top:20px;} #order_detail > .wrap_inner > .btn > .box_btn {margin-top:5px;} #order_detail > .wrap_inner > .btn > .box_btn:first-child {margin-top:0;} #order_detail > .wrap_inner > .btn > .box_btn form {padding:0;} #order_detail > .wrap_inner > .btn > .box_btn form input {display:block; width:100%; padding:9.5px 16px; border:none; color:inherit; font:inherit; cursor:pointer;} #order_detail .sbs_schedule .msg {padding-bottom:10px;} /* 주문상세조회(/mypage/order_detail.php) - 결제수단변경 레이어 */ .chg_paytype {overflow:auto; position:fixed; left:5vw; top:5vh; z-index:100; width:90vw; height:90vh; padding:15px 15px 25px 15px; background-color:#fff;} .chg_paytype h2 {padding-bottom:10px; border-bottom:1px solid #535353; font-size:1.25rem; font-weight:bold;} .chg_paytype h3 {padding:20px 0 10px; font-size:1rem; font-weight:bold;} .chg_paytype .explain {padding:10px 0; border-bottom:1px solid #dcdcdc;} .chg_paytype .explain > li {margin:5px 0; padding-left:25px; background:url('http://sw.wisaweb.co.kr/wm_engine_SW/_manage/image/common/icon_info.png') no-repeat left top/15px; color:#888; font-size:0.917rem;} .chg_paytype .sum {text-align:left;} .chg_paytype .select {text-align:left;} .chg_paytype .select > .type {padding:15px; background-color:#f5f5f5;} .chg_paytype .select > .type > li {padding:5px 0;} .chg_paytype .select > .type > li > label {color:#666;} .chg_paytype .select > .msg {margin-top:10px; padding:15px; border:1px solid #e5e5e5;} .chg_paytype .select > .msg > li {color:#888; letter-spacing:-1px;} .chg_paytype .select > .btn {padding-top:5px;} .chg_paytype .select > .btn > span {margin-top:5px;} .chg_paytype .sum > table {table-layout:fixed; width:100%; margin:0 auto; border-top:1px solid #e0e0e0;} .chg_paytype .sum > table th {padding:10px 15px; border:1px solid #e0e0e0; border-width:0 1px 1px 0; font-weight:normal; text-align:left; vertical-align:middle;} .chg_paytype .sum > table td {padding:10px 15px; border-bottom:1px solid #e0e0e0; text-align:left; vertical-align:middle;} .chg_paytype .sum > table td .price {font-family:'Pretendard',sans-serif; font-size:1.333rem;} .chg_paytype .close {display:block; position:absolute; right:20px; top:15px; width:20px; height:20px; text-indent:-9999px;} .chg_paytype .close:before {position:absolute; right:0px; top:10px; width:20px; height:1px; background-color:#000; transform:rotate(45deg); content:'';} .chg_paytype .close:after {position:absolute; right:0px; top:10px; width:20px; height:1px; background-color:#000; transform:rotate(-45deg); content:'';} /* 정기배송주문 배송지변경 */ .sbs_address {width:100%; padding:15px;} .sbs_address > table > caption {font-size:1.333rem; font-weight:bold;} .sbs_address > .btn {padding-top:20px; text-align:center;} .sbs_address .address_area > div {padding-top:10px;} .sbs_address .address_area .code {position:relative; padding-right:110px;} .sbs_address .address_area .code .box_btn {position:absolute; right:0; bottom:0;} /* 쿠폰(/mypage/coupon_down_list.php) */ #coupon h3.title {padding:25px 0 15px;} #coupon h3.title:first-child {padding-top:0;} /* 소셜쿠폰(/mypage/sccoupon.php) */ #sccoupon .box_mp .form_input {margin-top:10px;} /* 관심상품(/mypage/wish_list.php) */ #wish_list .count {padding-bottom:10px;} #wish_list .count strong {font:inherit;} #wish_list .btn {margin-bottom:10px;} /* 1:1문의 내역(/mypage/counsel_list.php & /mypage/order_detail.php) */ #counsel .box_btn {margin-bottom:15px;} .list_counsel {border:1px solid #dbdbdb; margin-bottom:15px;} .list_counsel > li {border-top:1px solid #dbdbdb;} .list_counsel > li:first-child {border-top:0;} .list_counsel > li .subject {padding:15px;} .list_counsel > li .subject > p {padding-top:5px;} .list_counsel > li .subject > p > img {width:auto; height:10px; vertical-align:middle;} .list_counsel > li .subject > p:first-child {padding-top:0;} .list_counsel > li .subject > p.stat, .list_counsel > li .subject > p.stat * {color:#666; font-size:0.917rem;} .list_counsel > li .content {display:none; padding:15px; border-top:1px solid #dbdbdb; background:#fafafa;} .list_counsel > li .content .question {position:relative; min-height:45px; padding:0 0 15px 43px; border-bottom:1px solid #e1e1e1;} .list_counsel > li .content .question:before {display:inline-block; position:absolute; left:0; top:0; width:29px; height:29px; border-radius:50%; background-color:#777474; color:#fff; font-family:'Pretendard',sans-serif; font-size:1.167rem; text-align:center; line-height:29px; content:'Q';} .list_counsel > li .content .question img {max-width:100%; height:auto;} .list_counsel > li .content .answer {position:relative; min-height:30px; margin-top:15px; padding-left:43px;} .list_counsel > li .content .answer:before {display:inline-block; position:absolute; left:0; top:0; width:29px; height:29px; border-radius:50%; background-color:#ef6363; color:#fff; font-family:'Pretendard',sans-serif; font-size:1.167rem; text-align:center; line-height:29px; content:'A';} /* 1:1문의 글쓰기(/mypage/counsel_step1.php) */ #counsel_write {padding-bottom:10.786rem; background:#F8F8F8;} #counsel_write .list_cart {padding-top:1.429rem;} #counsel_write .btn {margin-top:15px;} #counsel_write .all_chk {position:relative; padding-bottom:15px; border-bottom:1px solid #E3E3E3;} #counsel_write .msg_delivery.head_office {height:1.071rem; margin:1.571rem 0 0.071rem; padding:0; font-size:0;} #counsel_write .msg_delivery.check input[type=checkbox] {position:static;} #counsel_write .msg_delivery strong {display:inline-block; padding-left:0.357rem;} #counsel_write .company_info {margin-bottom:0.714rem; padding-left:2.143rem; color:#999;} #counsel_write .list_cart.cart > li:last-child {border-bottom:0;} #counsel_write .list_cart > li > .box .info .bottom .total.list_total {position:static !important;} /* 1:1문의 완료(/mypage/counsel_step2.php) */ #counsel_fin .box {padding:15px; border:1px solid #dedede; color:#888; font-size:1.167rem; text-align:center;} #counsel_fin .box strong {font-size:inherit;} #counsel_fin .btn {margin-top:15px; text-align:center;} /* 출석체크(/mypage/attend_list.php) */ #attend .date {padding:25px 0; text-align:center; vertical-align:top;} #attend .date a {display:inline-block; width:18px; height:18px; border:1px solid #dbdbdb; background-repeat:no-repeat; background-position:center;} #attend .date a.prev {background-image:url('/_skin/bona/img/common/bullet_arrow_prev.png');} #attend .date a.next {background-image:url('/_skin/bona/img/common/bullet_arrow_next.png');} #attend .date strong {padding:0 5px; color:#040404; font-family:'Pretendard',sans-serif; font-size:1.667rem; line-height:20px; text-align:center; vertical-align:top;} #attend #calendar table {width:100%;} #attend #calendar table thead th {padding:10px 0; border:1px solid #dbdbdb; background:#fbfbfb; color:#666; font-family:'Pretendard',sans-serif; font-weight:normal; text-align:center;} #attend #calendar table thead th.sun {border-left:0; color:#d53838;} #attend #calendar table thead th.sat {border-right:0; color:#7cb4d1;} #attend #calendar table tbody td {height:50px; padding:5px; border:1px solid #dbdbdb; color:#040404; text-align:left; vertical-align:top;} #attend #calendar table tbody td:first-child {border-left:0;} #attend #calendar table tbody td:last-child {border-right:0;} #attend #calendar .attenY {background:url('/_skin/bona/img/mypage/attend_ok.png') no-repeat center/18px;} #attend #calendar .attenR {background:url('/_skin/bona/img/mypage/attend_today.png') no-repeat center/18px #fbf9ed; font-weight:bold; text-decoration:underline;} #attend .info {background:#fbfbfb; text-align:center;} #attend .info .explain {padding:15px; border-bottom:1px solid #dbdbdb;} #attend .info .sum {padding:15px; border-bottom:1px solid #e0e0e0;} #attend .info .sum:after {display:block; clear:both; content:'';} #attend .info .sum span {float:left;} #attend .info .sum strong {float:right;} /* 회원탈퇴(/mypage/withdraw_step1.php), 회원탈퇴완료(/mypage/withdraw_step2.php) */ .withdraw .box {text-align:left;} .withdraw .msg {margin-bottom:10px; color:#666;} .withdraw .frame textarea {height:150px; margin-top:10px;} .withdraw .btn {padding-top:15px; text-align:center;} /*-----------------------------------------------------------------*/ /* 4-5. 추가페이지 /*-----------------------------------------------------------------*/ /* 이용약관(/content/content.php?cont=uselaw) #uselaw .tab {margin-bottom:20px; text-align:center;} #uselaw .tab li {display:inline;} #uselaw .tab li a {padding:0 15px;} #uselaw .tab li a:hover {text-decoration:underline;} #uselaw .name {margin-bottom:2rem; font-size:1.5rem; font-weight:bold;} #uselaw > ol > li > dl > dt {padding:30px 0 10px; font-weight:bold;} #uselaw > ol > li:nth-of-type(1) > dl > dt {padding-top:0;} #uselaw > ol > li > dl > dd {padding-left:10px; color:#666;} #uselaw > ol > li > dl > dd > ul, #uselaw > ol > li > dl > dd > ol {padding-left:10px; color:#666;} */ /* 개인정보취급방침(/content/content.php?cont=privacy) #privacy .tab {margin-bottom:20px; text-align:center;} #privacy .tab li {display:inline;} #privacy .tab li a {padding:0 15px;} #privacy .tab li a:hover {text-decoration:underline;} #privacy > ul > li > dl > dt {padding:30px 0 10px; font-weight:bold;} #privacy > ul > li > dl > dd {padding-left:10px; color:#666;} #privacy > ul > li > dl > dd > ul, #privacy > ul > li > dl > dd > ol {padding-left:10px; color:#666;} */ /* 이용안내(/content/content.php?cont=guide) #guide .tab {text-align:center;} #guide .tab li {display:inline;} #guide .tab li a {padding:0 15px;} #guide .tab li a:hover {text-decoration:underline;} #guide > dl > dt {padding:30px 0 10px; font-weight:bold;} #guide > dl > dd {padding-left:10px; color:#666;} #guide > dl > dd > ul, #guide > dl > dd > ol {padding-left:10px; color:#666;} */ /* 회사소개(/content/content.php?cont=company) #company {margin-bottom:11.429rem; text-align:left;} #company .visual {width:100%; margin-bottom:3.429rem;} #company .visual img {width:100%;} #company .inner {padding:0 7.81%;} #company .brand .img img {width:100%;} #company .brand p {margin-bottom:2.357rem; padding:1.214rem 0; color:#999; font-size:1.143rem; line-height:1.714rem; letter-spacing:-0.025rem;} #company .story .step {margin-bottom:5.214rem;} #company .story .img {margin:0.357rem 0 6.214rem;} #company .story .img img {width:100%;} #company .story h3 {margin-bottom:0.857rem; color:#333; font-size:1.857rem; letter-spacing:-0.025rem;} #company .story p {color:#999; font-size:1.143rem; line-height:1.786rem; letter-spacing:-0.025rem;} #company .story p strong {display:block; margin-bottom:0.714rem; color:#fc5000; font-size:1.429rem; letter-spacing:-0.025rem;} #company .bottom_banner img {width:100%;} */ /* 고객센터(/content/customer.php) */ #customer .search_faq {margin-bottom:30px; padding:15px; background:#f5f5f5; text-align:center;} #customer .search_faq > h3 {padding-bottom:10px; font-size:1.2rem; font-weight:normal;} #customer .search_faq > form {position:relative; background:#fff;} #customer .search_faq > form > .form_input {padding-right:40px;} #customer .search_faq > form > .btn {display:block; position:absolute; right:0; top:0; width:34px; height:34px; border:0; background:url('http://m.kdhtest41.mywisa.com/_skin/m_sw_kor/img/common/icon_search.png') no-repeat center/18px; text-indent:-9999px;} #customer .search_faq > form:after {display:inline-block; position:absolute; right:34px; top:50%; width:1px; height:16px; margin-top:-8px; background:#e0e0e0; content:'';} #customer .search_faq > ul {border-top:1px solid #c3c3c3;} #customer .search_faq > ul:after {display:block; clear:both; content:'';} #customer .search_faq > ul > li {float:left; width:33.3%; border:1px solid #c3c3c3; border-width:0 1px 1px 0;} #customer .search_faq > ul > li > a {display:block; padding:10px 0;} #customer .search_faq > ul > li:nth-child(3n) {border-right:0;} #customer .latest {margin-bottom:30px;} #customer .latest > h3 {position:relative; padding-bottom:15px; color:#333; font-size:1.167rem; font-weight:normal;} #customer .latest > ul {border-top:1px solid #e0e0e0;} #customer .latest > h3 .more {display:block; position:absolute; right:0; top:-4px; width:25px; height:25px; border:1px solid #c3c3c3; text-indent:-9999px;} #customer .latest > h3 .more:before {position:absolute; left:50%; top:50%; width:13px; height:1px; margin:-1px 0 0 -6px; background:#666; content:'';} #customer .latest > h3 .more:after {position:absolute; left:50%; top:50%; width:1px; height:13px; margin:-7px 0 0 0; background:#666; content:'';} #customer .latest.faq > ul > li > div {position:relative; padding:15px 15px 15px 50px; border-bottom:1px solid #e0e0e0;} #customer .latest.faq > ul > li > div > .icon {display:inline-block; position:absolute; left:15px; top:11px; width:24px; height:24px; margin-right:5px; border-radius:50%; background:#777474; color:#fff; font-family:'Pretendard',sans-serif; text-align:center; line-height:24px;} #customer .latest.faq > ul > li > div.answer {display:none; background:#f5f5f5;} #customer .latest.faq > ul > li > div.answer > .icon {background:#ef6363;} #customer .latest.notice > ul > li {overflow:hidden; position:relative; padding:15px 90px 15px 15px; border-bottom:1px solid #e0e0e0; line-height:24px; text-overflow:ellipsis; white-space:nowrap;} #customer .latest.notice > ul > li > span {position:absolute; right:15px; top:19px;} #customer .info {border:1px solid #dcdcdc;} #customer .info > .box {position:relative; padding:15px; background-repeat:no-repeat; background-position:30px center; background-size:27px;} #customer .info > .box:last-child {border-top:1px solid #dcdcdc;} #customer .info > .box > .title {padding-bottom:10px; font-size:1.333rem; font-weight:bold;} /*-----------------------------------------------------------------*/ /* 5. ETC /*-----------------------------------------------------------------*/ /* 댓글 - 리스트(게시판, 상품리뷰) */ .list_comment {position:relative; background:#fff; text-align:left;} .list_comment > ul {border:1px solid #e5e5e5; border-top:0;} .list_comment > ul > li {clear:both; overflow:hidden; padding:10px; border-top:1px solid #e5e5e5; color:#474645; word-break:break-all; word-wrap:break-word;} .list_comment > ul > li .name {float:left; width:60%;} .list_comment > ul > li .name a {color:inherit; font-size:inherit;} .list_comment > ul > li .date {float:right; width:40%; text-align:right;} .list_comment > ul > li .date span {padding-right:5px; color:#888;} .list_comment > ul > li .date img {margin-top:3px; width:9px; height:9px;} .list_comment > ul > li .content {clear:both; padding-top:5px;} .list_comment > ul > li .my_comment{color:#FD5000;} /* 댓글 - 쓰기(게시판, 상품리뷰) */ .write_comment {overflow:hidden; margin-top:-1px; padding:10px; border:1px solid #e5e5e5; background:#fff;} .write_comment .user {overflow:auto; padding-bottom:10px; text-align:left;} .write_comment .user span {float:left; width:50%;} .write_comment .user span.name {padding-right:5px;} .write_comment .user span.pw {padding-left:5px;} .write_comment .inputbox {position:relative; padding-right:70px; border:1px solid #e2e2e2; background:#fafafa; font-size:0; text-align:left;} .write_comment .inputbox textarea.form_input {height:50px; border:0; border-right:1px solid #e2e2e2;} .write_comment .inputbox .btn_comment {display:inline-block; position:absolute; right:0; top:0; width:70px; height:100%; text-align:center; border:0; background:#fafafa; font-weight:bold; line-height:100%;} /* 게시판 - 상품연동 - 검색 */ #product_search_frm {width:100% !important; background:#fff;} #product_search_frm .frame {min-height:350px; margin:10px;} #product_search_frm .frame .search {display:flex; display:-webkit-flex; width:100%; padding-bottom:10px;} #product_search_frm .frame .btn {padding:20px 0 5px 0; text-align:center;} /* 게시판 - 상품연동 - 쓰기 */ .related_prd_write {padding:10px 0;} .related_prd_write .swiper-wrapper {margin:10px 0; padding-bottom:30px;} /* 게시판 - 상품연동 - 열람 */ .related_prd_view {border-bottom:1px solid #e0e0e0;} .related_prd_view h3.title {padding:30px 0 15px; font-size:1.167rem; text-align:center;} .related_prd_view .swiper-wrapper {padding-bottom:30px;} .related_prd_view .prd_basic .box .summary {display:none;} /* 관리자 - 인용구 */ blockquote.se2_quote1 {_zoom:1; margin:0 15px 30px 20px; padding:0 8px; border-left:2px solid #ccc; color:#888;} blockquote.se2_quote1 * {color:inherit;} blockquote.se2_quote2 {_zoom:1; margin:0 0 30px 13px; padding:0 8px 0 16px; background:url(http://static.se2.naver.com/static/img/bg_quote2.gif) 0 3px no-repeat; color:#888;} blockquote.se2_quote2 * {color:inherit;} blockquote.se2_quote3 {_zoom:1; margin:0 0 30px 0; padding:10px; border:1px dashed #ccc; color:#888;} blockquote.se2_quote3 * {color:inherit;} blockquote.se2_quote4 {_zoom:1; margin:0 0 30px 0; padding:10px; border:1px dashed #66b246; color:#888;} blockquote.se2_quote4 * {color:inherit;} blockquote.se2_quote5 {_zoom:1; margin:0 0 30px 0; padding:10px; border:1px dashed #ccc; background:url(http://static.se2.naver.com/static/img/bg_b1.png) repeat; _background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://static.se2.naver.com/static/img/bg_b1.png',sizingMethod='scale'); color:#888;} blockquote.se2_quote5 * {color:inherit;} blockquote.se2_quote6 {_zoom:1; margin:0 0 30px 0; padding:10px ;border:1px solid #e5e5e5; color:#888;} blockquote.se2_quote6 * {color:inherit;} blockquote.se2_quote7 {_zoom:1; margin:0 0 30px 0; padding:10px; border:1px solid #66b246; color:#888;} blockquote.se2_quote7 * {color:inherit;} blockquote.se2_quote8 {_zoom:1; margin:0 0 30px 0; padding:10px; border:1px solid #e5e5e5; background:url(http://static.se2.naver.com/static/img/bg_b1.png) repeat; _background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://static.se2.naver.com/static/img/bg_b1.png',sizingMethod='scale'); color:#888;} blockquote.se2_quote8 * {color:inherit;} blockquote.se2_quote9 {_zoom:1; margin:0 0 30px 0; padding:10px; border:2px solid #e5e5e5; color:#888;} blockquote.se2_quote9 * {color:inherit;} blockquote.se2_quote10 {_zoom:1; margin:0 0 30px 0; padding:10px; border:2px solid #e5e5e5; background:url(http://static.se2.naver.com/static/img/bg_b1.png) repeat; _background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://static.se2.naver.com/static/img/bg_b1.png',sizingMethod='scale'); color:#888;} blockquote.se2_quote10 * {color:inherit;} /* 관리자 - 에디터 폰트 스타일 */ b, b *, u, u *, i, i *, strike, strike * {color:inherit; font-size:inherit;} @media only screen and (max-width:1239px) { #qdMain {margin-left:-320px;} #prdCouponArea {left:50% !important; margin-left:-320px !important;} .box_search {display:none; top:0; left:50%; z-index:100; margin-left:-320px; padding-top:2.143rem; background:#EFECEA;} .box_search h1 {display:block; width:18.786rem; margin:0 auto 1.714rem;} .box_search h1 img {width:100%;} .box_search .keyword {margin:0 auto;} .box_search form .box {margin:0 auto 2.500rem;} .box_search .close {display:inline-block;} .box_search .close a {display:inline-block; width:100%; height:100%;} header .gnb .home_addr {right:12.9375%;} /* 20231020 여백수정 right:10.9375%; */ header .gnb .m_search {display:inline-block !important;} header .gnb .m_search a {width:100%; height:30px;} /* 2024.03.05 모바일기기에서 메인만 알림 출력 */ header.main .gnb .bell {display:inline-block !important; right: 31.5%;} header.main .gnb .bell a {width:100%; height:30px;} header.main .gnb .bellx {display:inline-block !important; right: 31.5%;} header.main .gnb .bellx a {width:100%; height:30px;} header .gnb .gnb_wrap {max-width:640px; left:50%; margin-left:-320px;} header .bigsection {margin-left:-320px;} #big_section .title {margin-left:-320px;} #map_api {margin-left:-320px;} #map_api2 {margin-left:-320px;} #dimmed {max-width:100%; left:0; margin-left:0;} body {overflow-x:hidden; width:100%; background:#EFECEA;} .total_wrap {margin-left:-320px;} #main .swiper_visual {margin-left:-320px;} .search {display:none;} .bottom_nav {margin-left:-320px;} header {left:50%; margin-left:-320px;} header .gnb.fixed {margin-left:-320px;} .btn_scroll {right:auto; left:50%; margin-left:250px; bottom:78px; z-index:60;} .btn_scroll a.up {background:url('/_skin/bona/img/common/m_btn_scroll_top.png')no-repeat center/3.929rem;} #cart .btn_bottom2 {margin-left:-320px;} #detail .share {margin-left:-320px;} #detail .card_view {width:640px; left:50%; margin-left:-320px;} #detail .card_view img {left:50%; margin-left:0;} #detail .info .buy_info .buy_info_wrap {margin-left:-320px;} #detail .info .fake_btn {margin-left:-320px;;} #detail .info .buy_info {margin-left:-320px;} #order #order2 {margin-left:-320px;} #juso_api_layer {margin-left:-320px;} .qnarev_write_popup {margin-left:-320px;} .layer_review_list > .prd {margin-left:-320px;} .layer_review_list {margin-left:-320px;} .layer_review_list > .close {margin-left:-320px;} #mapwrap {margin-left:-320px;} #mapwrap .top_btn {margin-left:-320px;} #mapwrap .bottom_btn {margin-left:-320px;} #mapwrap #pickup_addr_list {margin-left:-320px;} #mapwrap #pickup_addr_list .pickup_wrap {margin-left:-320px;} #mapwrap #pickup_addr_list .pickup_bg {margin-left:-320px;} .map_bg {margin-left:-320px;} #detail .info .buy_info .buy_bg {margin-left:-320px;} .pickup_info {margin-left:-320px;} .pickup_info .pick_button {margin-left:-320px;} #step1_layer .join_agree_wrap {margin-left:-320px;} #qdBackground {margin-left:-320px; !important;} #option_change_layer {margin-left:-320px;} #option_change_layer .cart_change_option {margin-left:-320px;} .pbig_section .btn_bottom2 {margin-left:-320px;} } @media only screen and (max-width:640px) { html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {font-size:12px; line-height:1.4;} body {min-width:360px; background:none;} #qdMain {left:0 !important; margin-left:0;} .prd_basic.col_list > li .box .img {display:inline-block; width:30%; vertical-align:top;} /* 20230830 수정 */ .prd_basic .box .price {padding:1.143rem 0 0; font-size:0;} /* 20230830 추가수정 */ .prd_basic .box .icon {padding-top:0;} /* 20230830 추가수정 */ .prd_basic.col_list > li .box .info {display:inline-block; width:70%; padding-left:20px; text-align:left; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; vertical-align:middle;} #layer {top:0 !important; left:0 !important; max-width:640px; width:100% !important; height:100vh !important;} .subtitle {width:34%;} #map_api {max-width:100%; left:0; margin-left:0;} #map_api2 {left:0; margin-left:0;} #dimmed {left:0;} .total_wrap {overflow-x:hidden; left:0; max-width:100%; min-width:360px; width:100%; margin:0 auto; margin-left:0;} .total_wrap > .wrap {padding-left:0;} #prdCouponArea {left:0 !important; margin-left:0 !important;} #juso_api_layer {margin-left:0 !important; left:0 !important; width:100% !important;} .box_search {left:0; z-index:100; width:100%; margin-left:0;;} .box_search .keyword {width:100%;} header .gnb .gnb_wrap {max-width:100%; left:0%; margin-left:0;} header {max-width:100%; left:0 !important; margin-left:0;} header .gnb {width:100%;} header .gnb.fixed {left:0; max-width:100%; margin-left:0;} .bottom_nav {left:0; margin-left:0;} header .gnb .gnb_wrap {max-width:100%;} header .gnb .home_addr {max-width:6.643rem;} header .bigsection {margin-left:0px; left:0;} header .title h2 {left:50%; max-width:33%; margin-left:-150px;} footer .menu li {margin-right:0.583rem;} header .title ul {width:100%;} header.main .gnb .bell {background-size:1.333rem auto !important;} header.main .gnb .bellx {background-size:1.333rem auto !important;} .btn_scroll {right:10px; left:auto; margin:0; bottom:78px; z-index:60;} #main .swiper_visual {width:100%; left:0; margin-left:0;} #main .content .link {padding:0 3%;} #main .main_pickup ul li .text {padding:0 0 0 1.423rem;} #main .main_pickup ul li .text .km {position:static; margin-top:7px;} #main .main_pickup ul li .text p {-webkit-line-clamp:2;} #main .timesale h2 {margin-bottom:-18px;} #main .timesale .prd_basic .box .img .percent {right:-18px; width:60px; background-size:60px;} #main .timesale .swiper-container {padding:10px;} #main .timesale .prd_basic .box .box_timer * {font-size:20px !important;} #main .main_pickup .swiper-slide {padding:30px 1.857rem 0;} .list_cart > li > .box {display:inline-block; width:calc(100% - 1.917rem);} .mu_sheet .menu ul li:first-child:after {top:50%; margin-top:-0.714rem;} .mu_sheet .menu ul li a {text-align:center;} .mu_sheet .menu ul li p {width:auto; margin-bottom:0.571rem; text-align:center;} .mu_sheet .menu ul li a > span {width:100%; text-align:center;} #mypage .mypage_wrap > .menu li {margin:0;} #cart .btn_bottom2 {left:0; width:100%; margin:0;} #detail .info .fake_btn {width:100%; left:0; margin-left:0;} #detail .card_view {width:100%; left:0; margin-left:0;} #detail .card_view img {left:50%; margin-left:0;} #detail .info .buy_info {left:0; margin-left:0;} #detail .info .buy_info .buy_info_wrap {left:0; width:100%; margin-left:0;} #detail .detail_qnarev > .summary > div {width:100%;} #detail .detail_qnarev > .summary > div.grade {margin-bottom:1.071rem;} #detail .info .detail_gift ul li .box .name {width:100%;} #detail .info .detail_gift ul li .box .box_qty2 {margin:10px 10px 0;} #detail .info .buy_info .multi_opt .selected_list > li .prd {padding-right:0;} #order #order2 {left:0; width:100%; margin-left:0;} #shop_edit .line .box .select_wrap {width:calc(100% - 3.786rem);} #shop_edit .line .box .select {min-width:auto;} .qnarev_write_popup {left:0; width:100%; margin-left:0;} .layer_review_list > .prd {width:100%; left:0; margin-left:0;} .layer_review_list {width:100%; left:0; margin-left:0;} .layer_review_list > .close {left:auto; right:15px; margin-left:0;} #mapwrap {left:0; margin-left:0;} #mapwrap .shop_info {width:calc(100% - 2.5rem); margin:0 1.250rem;} #mapwrap .bottom_btn {left:auto; right:1.25rem;} #mapwrap .top_btn {left:auto; right:1.25rem;} #mapwrap #pickup_addr_list {left:0; margin:0; width:100%;} #mapwrap #pickup_addr_list .pickup_wrap {left:0; margin:0; width:100%;} #mapwrap #pickup_addr_list .pickup_wrap ul {width:100%; margin:0;} #mapwrap #pickup_addr_list .pickup_bg {width:100%; margin-left:0; left:0;} .map_bg {left:0; margin:0;} #detail .info .buy_info .buy_bg {left:0; margin:0;} #step1_layer .join_agree_wrap {left:0; width:100%; margin:0;} .pickup_info {left:0 !important; margin-left:0px;} .pickup_info .pick_button {left:0 !important; width:100% !important; margin-left:0px;} .qdBackground {left:0 !important; margin-left:0; !important;} #option_change_layer {left:0; width:100%; margin-left:0;} #option_change_layer .cart_change_option {left:0; width:100%; margin-left:0;} #order_list > .search .select {width:100%; margin-bottom:10px;} #order_list > .search .select select {width:100%;} #order_list > .search .data_wrap {width:100%;} } @media only screen and (max-width:640px) { .total_wrap {max-width:100%; margin:0 auto;} .total_wrap > .wrap {padding-left:0;} } @media only screen and (max-width:639px) { #detail_pop .box_qty .form_input {height:2.143rem;} #detail_pop #detail .info .buy_info .close {padding:1rem 0;} #detail_pop #detail .info .buy_info .close span {width:3.857rem;} #detail_pop #detail .prd_info h2 .kr {font-size:1.542rem;} #detail_pop #detail .prd_info > .price .consumer {font-size:1.071rem;} #detail_pop #detail .prd_info > .price .percent {font-size:1.571rem;} #detail_pop #detail .prd_info > .price .sell, #detail_pop #detail .prd_info > .price .sell * {font-size:1.571rem;} #detail_pop #detail .prd_info > .price .card_info {height:1.357rem; padding-left:1.571rem; background-size:1.429rem; font-size:1rem;} #detail_pop #detail .info_grade .grade .icon {width:5.643rem; height:1.071rem;} #detail_pop #detail .info_grade .total {font-size:1rem;} #detail_pop #detail .info .buy_info .list > tbody > tr > th {font-size:1.071rem;} #detail_pop #detail .info .buy_info .list > tbody > tr > td .box_qty .form_input {width:9.286rem;height:2.857rem;} #detail_pop #detail .info .buy_info .list > tbody > tr > td .box_qty a {width:3.071rem; height:2.857rem;} #detail_pop #detail .info .buy_info .list > tbody > tr > td input[type=text], #detail_pop #detail .info .buy_info .list > tbody > tr > td select {height:2.857rem; font-size:1rem;} #detail_pop #detail .info .buy_info .multi_opt .selected_list > li .name {font-size:1rem;} #detail_pop #detail .info .buy_info .multi_opt .selected_list > li .prd {font-size:1rem;} #detail_pop #detail .info .buy_info .multi_opt .selected_list > li .prd * {font-size:1rem;} #detail_pop #detail .info .buy_info .box_btn > * {height:3.571rem; font-size:1.071rem; line-height:3.571rem;} #detail_pop #detail .info .buy_info .multi_opt .opt_total .title {font-size:1.286rem;} #detail_pop #detail .info .buy_info .multi_opt .opt_total strong, #detail_pop #detail .info .buy_info .multi_opt .opt_total strong * {font-size:1.286rem;} #detail_pop #detail .info .fake_btn {height:5rem;} #detail_pop #detail .info .fake_btn .radius a {width:3.571rem; height:3.571rem; background-size:3.571rem; font-size:1.333rem; line-height:3.571rem;} #detail_pop #detail .info .fake_btn .radius {width:3.571rem; height:3.571rem; background-size:3.571rem} #detail_pop #detail .info .fake_btn .buy {width:calc(100% - 7.857rem); height:3.571rem; padding-left:1.429rem;} #detail_pop #detail .info .fake_btn .buy * {height:3.571rem; font-size:1.143rem; line-height:3.571rem;} #detail .info_grade .grade .icon > i {background-size:68px 13px;} } @media only screen and (max-width:440px) { #main .content .link li a {font-size:1.1rem;} #detail .pickup_time {padding:0 2.429rem; background-position:left 0.571rem center; line-height: initial; padding: 10px 40px 10px 40px; height: auto;} #map_api2 .step2 .point li {display:inline-block; width:33.33%;} #map_api2 .step2 .point li label {display:inline-block; width:100%;} .list_cart > li > .box .info .bottom .total.list_total {position:static !important; margin-top:0.571rem;} #cart .pickup_time {padding:0 2.429rem; background-position:left 0.571rem center;} } /* 이용안내 */ .guide_wrap {padding:4.68% 6.25%;} .guide_wrap .box_01 {margin-bottom:2.857rem; width:100%;} .guide_wrap .box_01 .tl {margin-bottom:1.143rem; font-size:1.143rem; font-weight:700; line-height:1.857rem; color:#333;} .guide_wrap .box_01 .stl {margin-bottom:1.143rem; font-size:1.071rem; font-weight:600; line-height:1.786rem; color:#333;} .guide_wrap .box_01 .txt {font-size:1rem; font-weight:400; line-height:1.714rem;} .guide_wrap .box_01 .txt .line {display:flex; gap:0.571rem; margin-bottom:0.571rem; font-size:1rem; font-weight:400; line-height:1.714rem;} .guide_wrap .box_01 .txt .line .blit {width:0.8rem; line-height:inherit;} .guide_wrap .box_01 .txt .line .add {display:flex; flex-direction:column;} .guide_wrap .box_01 .mt16 {margin-top:1.143rem;} .guide_wrap .box_01 .mb16 {margin-bottom:1.143rem;} .guide_wrap .box_01 .mt8 {margin-top:0.571rem;} .guide_wrap .box_01 .mb8 {margin-bottom:0.571rem;} /* 이용약관 */ .terms_wrap {padding:4.68% 6.25%;} .terms_wrap .box_01 {margin-bottom:2.857rem; width:100%;} .terms_wrap .box_01 .tit {margin-bottom:1.143rem; font-size:1.429rem; font-weight:700; line-height:2.143rem; color:#333;} .terms_wrap .box_01 .tl {margin-bottom:1.143rem; font-size:1.143rem; font-weight:700; line-height:1.857rem; color:#333;} .terms_wrap .box_01 .stl {margin-bottom:1.143rem; font-size:1.071rem; font-weight:600; line-height:1.786rem; color:#333;} .terms_wrap .box_01 .txt {font-size:1rem; font-weight:400; line-height:1.714rem;} .terms_wrap .box_01 .txt .line {display:flex; gap:0.571rem; margin-bottom:0.571rem; font-size:1rem; font-weight:400; line-height:1.714rem;} .terms_wrap .box_01 .txt .line .blit {width:0.8rem; line-height:inherit;} .terms_wrap .box_01 .txt .line .add {display:flex; flex-direction:column;} .terms_wrap .box_01 .txt .line .add div {display:flex; gap:0.571rem;} .terms_wrap .box_01 .txt .line .add div .blit {width:1.2rem; line-height:inherit;} .terms_wrap .box_01 .mt16 {margin-top:1.143rem;} .terms_wrap .box_01 .mb16 {margin-bottom:1.143rem;} .terms_wrap .box_01 .mt8 {margin-top:0.571rem;} .terms_wrap .box_01 .mb8 {margin-bottom:0.571rem;} /* 개인정보처리방침 */ .policy_wrap {padding:4.68% 6.25%;} .policy_wrap .tab {display:flex; justify-content:center; gap:0.4rem; width:100%;} .policy_wrap .tab a {margin:2rem 1rem 2rem; text-decoration:none; font-size:1.25rem; font-weight:400;} .policy_wrap .tab a.on {font-weight:700;} .policy_wrap .box_01 {margin-bottom:2.857rem; width:100%;} .policy_wrap .box_01 .tl {margin-bottom:1.143rem; font-size:1.143rem; font-weight:700; line-height:1.857rem; color:#333;} .policy_wrap .box_01 .stl {margin-bottom:1.143rem; font-size:1.071rem; font-weight:600; line-height:1.786rem; color:#333;} .policy_wrap .box_01 .table_wrap {} .policy_wrap .box_01 .table_wrap table {border-top:1px solid #e3e3e3;} .policy_wrap .box_01 .table_wrap table th {padding:1.143rem 0; border-bottom:1px solid #e3e3e3; font-size:1.071rem; font-weight:600; line-height:1.786rem; color:#333;} .policy_wrap .box_01 .table_wrap table td {padding:1.143rem 0; border-bottom:1px solid #e3e3e3; font-size:1rem; font-weight:400; line-height:1.714rem; color:#333; word-break:keep-all;} .policy_wrap .box_01 .table_wrap table td p {color:#333; word-break:keep-all;} .policy_wrap .box_01 .txt {font-size:1rem; font-weight:400; line-height:1.714rem;} .policy_wrap .box_01 .txt .line {display:flex; gap:0.571rem; margin-bottom:0.571rem; font-size:1rem; font-weight:400; line-height:1.714rem;} .policy_wrap .box_01 .txt .line .blit {width:0.8rem; line-height:inherit;} .policy_wrap .box_01 .txt .line .add {display:flex; flex-direction:column;} .policy_wrap .box_01 .txt .line .add div {display:flex; gap:0.571rem;} .policy_wrap .box_01 .txt .line .add div .blit {width:0.8rem; line-height:inherit;} .policy_wrap .box_01 .mt16 {margin-top:1.143rem;} .policy_wrap .box_01 .mb16 {margin-bottom:1.143rem;} .policy_wrap .box_01 .mt8 {margin-top:0.571rem;} .policy_wrap .box_01 .mb8 {margin-bottom:0.571rem;} .policy_wrap .box_01 .pdl16 {padding:0 0 0 1.143rem;} .policy_wrap .box_01 .pdl32 {padding:0 0 0 2.286rem;} /* 위치정보처리방침 */ .location_wrap {padding:4.68% 6.25%;} .location_wrap .tab {display:flex; justify-content:center; gap:0.4rem; width:100%;} .location_wrap .tab a {margin:2rem 1rem 2rem; text-decoration:none; font-size:1.259rem; font-weight:400;} .location_wrap .tab a.on {font-weight:700;} .location_wrap .box_01 {margin-bottom:2.857rem; width:100%;} .location_wrap .box_01 .tl {margin-bottom:1.143rem; font-size:1.143rem; font-weight:700; line-height:1.857rem; color:#333;} .location_wrap .box_01 .stl {margin-bottom:1.143rem; font-size:1.071rem; font-weight:600; line-height:1.786rem; color:#333;} .location_wrap .box_01 .table_wrap {} .location_wrap .box_01 .table_wrap table {width:100%; border-top:1px solid #e3e3e3;} .location_wrap .box_01 .table_wrap table th {padding:1.143rem 0; border-bottom:1px solid #e3e3e3; font-size:1.071rem; font-weight:600; line-height:1.786rem; color:#333; text-align:center;} .location_wrap .box_01 .table_wrap table td {padding:1.143rem 0; border-bottom:1px solid #e3e3e3; font-size:1rem; font-weight:400; line-height:1.714rem; color:#333; text-align:center; word-break:keep-all;} .location_wrap .box_01 .txt {font-size:1rem; font-weight:400; line-height:1.714rem;} .location_wrap .box_01 .txt .line {display:flex; gap:0.571rem; margin-bottom:0.571rem; font-size:1rem; font-weight:400; line-height:1.714rem;} .location_wrap .box_01 .txt .line .blit {width:0.8rem; line-height:inherit;} .location_wrap .box_01 .txt .line .add {display:flex; flex-direction:column;} .location_wrap .box_01 .txt .line .add div {display:flex; gap:0.571rem;} .location_wrap .box_01 .txt .line .add div .blit {width:0.8rem; line-height:inherit;} .location_wrap .box_01 .mt16 {margin-top:1.143rem;} .location_wrap .box_01 .mb16 {margin-bottom:1.143rem;} .location_wrap .box_01 .mt8 {margin-top:0.571rem;} .location_wrap .box_01 .mb8 {margin-bottom:0.571rem;} .location_wrap .box_01 .pdl16 {padding:0 0 0 1.143rem;} .location_wrap .box_01 .pdl32 {padding:0 0 0 2.286rem;} /* 푸터메뉴 */ footer .menu {display:flex; flex-direction:row; flex-wrap:wrap; justify-content:space-between; gap:16px; padding:16px 0;} @media (max-width:640px) { footer .menu {justify-content:flex-start; gap:16px 0;} footer .menu div {width:33%; box-sizing:border-box; text-align:left;} } /* 브랜드 소개 */ .brand {width:100%;} .brand .logo {display:flex; flex-direction:column; align-items:center; gap:8px; margin:80px 0;} .brand .logo p {font-size:24px; font-weight:700;} .brand .logo .logo {width:205px;} .brand .brandstory {padding:40px; width:100%; border-radius:32px; background:#fd5500; box-sizing:border-box;} .brand .brandstory .tl {margin-bottom:40px; font-size:48px; font-weight:700; color:#fff; text-align:center;} .brand .brandstory .box {margin-bottom:80px; width:100%;} .brand .brandstory .box img {width:100%;} .brand .brandstory .box .tit {margin:40px 0 16px 0; font-size:24px; font-weight:700; color:#fff; text-align:center;} .brand .brandstory .box .txt {font-size:16px; font-weight:400; line-height:26px; color:#fff; text-align:center;} .brand .weare {margin-top:80px; padding:0 40px; width:100%; box-sizing:border-box; text-align:center;} .brand .weare .rec {margin-bottom:80px; width:100%;} .brand .weare .rec:last-child {margin-bottom:120px;} .brand .weare .rec .step {font-size:24px; font-weight:700; color:#ababab; text-align:center;} .brand .weare .rec .word {margin:0 0 0 0; font-size:64px; font-weight:800; color:#fd5000; text-align:center;} .brand .weare .rec .tit {margin:40px 0 16px 0; font-size:24px; font-weight:700; color:#333; text-align:center;} .brand .weare .rec .txt {font-size:16px; font-weight:400; line-height:26px; color:#888; text-align:center;} .brand .meet_app {padding:0 40px; width:100%; box-sizing:border-box; text-align:center;} .brand .meet_app .symbol {width:96px;} .brand .meet_app .stl {margin:16px 0 4px 0; font-size:24px; color:#888;} .brand .meet_app .logo_kr {width:64px;} .brand .meet_app .txt {margin-top:24px; font-size:24px; font-weight:400; color:#333; text-align:center;} .brand .meet_app .txt strong {font-size:24px; font-weight:700; color:#fd5000;} .brand .meet_app .phone {display:flex; align-items:center; justify-content:center; margin:80px auto; width:375px; height:812px; border-radius:32px; background:#fd5000;} .brand .meet_app .phone .ci_wh {width:120px;} .brand .meet_app .btn_area {display:none; margin-bottom:120px;} @media (max-width:1024px) { .brand {width:100%;} .brand .meet_app .btn_area {display:flex; flex-direction:row; justify-content:space-between; gap:16px; margin-bottom:120px; padding:0 40px; width:100%; box-sizing:border-box;} .brand .meet_app .btn_area a {display:block; padding:20px 0; width:100%; border:2px solid #111111; border-radius:8px; font-size:16px; font-weight:700; color:#111;} .hide1024 {display:none;} } @media (max-width:430px) { .brand .logo {margin:40px 0;} .brand .brandstory .tl {margin-bottom:20px;} .brand .brandstory .box .tit {margin:16px 0 16px 0;} .brand .brandstory .box {margin-bottom:40px;} .brand .brandstory .box:last-child {margin-bottom:0;} .brand .weare .rec {margin-bottom:40px;} .brand .weare .rec .step {font-size:16px;} .brand .weare .rec .word {font-size:48px;} .brand .weare .rec .tit {margin:24px 0 16px 0;} .brand .weare .rec:last-child {margin-bottom:80px;} .brand .meet_app .phone {margin:40px 0; width:100%;} .brand .meet_app .btn_area {margin-bottom:40px; padding:0;} .hide430 {display:none;} } /* 소매입점사 메인 - 헤어 아이콘 변경 */ .sell_store .header {display:flex; justify-content:flex-end; gap:8px; padding:1.286rem 2.857rem 1.571rem 2.857rem; width:100%; /* border:1px solid #000; */ background:#fd5000;} .sell_store .header .info_edit{} .sell_store .header .info_edit a {display:inline-block;padding-left:2rem; background:url(/_skin/bona/img/common/icon_infor.png)no-repeat left center/1.5rem; color:#fff; font-size:1rem;} .sell_store .header .logout {} .sell_store .header .logout a {display:inline-block; padding-left:2rem; background:url(/_skin/bona/img/common/logout.png)no-repeat left center/1.5rem; color:#fff; font-size:1rem;} /* 소매입점사 메인 */ .sell_store .member {display:flex; justify-content:space-between; align-items:center; padding:2.143rem; width:100%; background:#fd5000;} .sell_store .member .info {padding-right:1.714rem; width:100%;} .sell_store .member .info .name {margin-bottom:0.571rem; font-size:1.714rem; font-weight:400; color:#fff;} .sell_store .member .info .name strong {font-size:1.714rem; font-weight:700; color:#fff;} .sell_store .member .info .rank {font-size:1.143rem; font-weight:400; color:#fff;} .sell_store .member .info .rank strong {font-size:1.143rem; font-weight:700; color:#fff;} .sell_store .member .img {} .sell_store .member .img img {width:5.714rem; height:5.714rem;} .sell_store .member .img a {display:block; position:relative;} .sell_store .member .img a img {position:absolute; right:0; bottom:0; width:1.714rem; height:1.714rem;} .sell_store .member_info {padding:6.25% 6.25% 4.786rem; background:#f1f1f1;} /* 20230808 - 색상변경 */ .sell_store .member_info .section_01 {display:flex; flex-direction:column; margin-bottom:2.143rem; padding:1.714rem; width:100%; background:#fff; border-radius:1.143rem;} .sell_store .member_info .section_01 .title {padding-bottom:1.143rem; font-size:1.429rem; font-weight:700;} .sell_store .member_info .section_01 .info {font-size:1rem;} .sell_store .member_info .section_01 .info .addr {display:flex; margin-bottom:0.571rem; font-weight:500; font-size:inherit;} .sell_store .member_info .section_01 .info .addr div:first-child {width:4.8rem; font-size:inherit; color:#999;} .sell_store .member_info .section_01 .info .addr div:last-child {width:100%; font-size:inherit; word-break:keep-all;} .sell_store .member_info .section_01 .info .tel {display:flex; margin-bottom:0.571rem; font-weight:500; font-size:inherit;} .sell_store .member_info .section_01 .info .tel div:first-child {width:4.8rem; font-size:inherit; color:#999;} .sell_store .member_info .section_01 .info .tel div:last-child {width:100%; font-size:inherit;} .sell_store .member_info .section_01 .info .state {display:flex; margin-bottom:0.571rem; font-weight:500; font-size:inherit;} .sell_store .member_info .section_01 .info .state div:first-child {width:4.8rem; font-size:inherit; color:#999;} .sell_store .member_info .section_01 .info .state div:last-child {width:100%; font-size:inherit;} .sell_store .member_info .section_01 .info .industry {display:flex; margin-bottom:0.571rem; font-weight:500; font-size:inherit;} .sell_store .member_info .section_01 .info .industry div:first-child {width:4.8rem; font-size:inherit; color:#999;} .sell_store .member_info .section_01 .info .industry div:last-child {width:100%; font-size:inherit;} .sell_store .member_info .section_01 .info .company {display:flex; margin-bottom:0.571rem; font-weight:500; font-size:inherit;} .sell_store .member_info .section_01 .info .company div:first-child {width:4.8rem; font-size:inherit; color:#999;} .sell_store .member_info .section_01 .info .company div:last-child {width:100%; font-size:inherit;} @media (max-width:440px) { .sell_store .member_info .section_01 .info {} .sell_store .member_info .section_01 .info .addr {display:flex; margin-bottom:0.571rem; font-weight:500;} .sell_store .member_info .section_01 .info .addr div:first-child {width:24%;} .sell_store .member_info .section_01 .info .tel {display:flex; margin-bottom:0.571rem; font-weight:500;} .sell_store .member_info .section_01 .info .tel div:first-child {width:24%;} .sell_store .member_info .section_01 .info .state {display:flex; margin-bottom:0.571rem; font-weight:500;} .sell_store .member_info .section_01 .info .state div:first-child {width:24%;} .sell_store .member_info .section_01 .info .industry {display:flex; margin-bottom:0.571rem; font-weight:500;} .sell_store .member_info .section_01 .info .industry div:first-child {width:24%;} .sell_store .member_info .section_01 .info .company {display:flex; margin-bottom:0.571rem; font-weight:500;} .sell_store .member_info .section_01 .info .company div:first-child {width:20%;} } .sell_store .member_info .section_02 {display:flex; flex-direction:column; margin-bottom:2.143rem; padding:1.714rem; width:100%; background:#fff; border-radius:1.143rem;} .sell_store .member_info .section_02 .title {display:flex; justify-content:space-between; align-items:center; padding-bottom:1.143rem; font-size:1.429rem; font-weight:700;} .sell_store .member_info .section_02 .title .sub {font-size:1rem; font-weight:400; color:#999;} .sell_store .member_info .section_02 .area {display:flex; flex-direction:column;} .sell_store .member_info .section_02 .area .big {display:flex; flex-direction:row;} .sell_store .member_info .section_02 .area .big .list {display:flex; flex-direction:column; align-items:center; width:100%; border-right:1px solid #eee;} .sell_store .member_info .section_02 .area .big .list:last-child {border-right:0;} .sell_store .member_info .section_02 .area .big .list .title {font-size:1.143rem; font-weight:500;} .sell_store .member_info .section_02 .area .big .list .count {font-size:1.714rem; font-weight:700; color:#333;} .sell_store .member_info .section_02 .area .big .list .count span {padding-left:0.286rem; font-size:1.429rem; font-weight:700;} .sell_store .member_info .section_02 .area .small {margin-top:1.714rem; border-top:1px solid #eee;} .sell_store .member_info .section_02 .area .small .list {display:flex; justify-content:space-between; align-items:center; padding-top:1.714rem;} .sell_store .member_info .section_02 .area .small .list .title {padding-bottom:0; font-size:1.143rem; font-weight:500;} .sell_store .member_info .section_02 .area .small .list .title span {padding:0 0.286rem; color:#E9E9E9;} .sell_store .member_info .section_02 .area .small .list .count {font-size:1.429rem; font-weight:700; color:#333;} .sell_store .member_info .section_02 .area .small .list .count strong {padding-left:0.286rem; font-size:1.143rem; font-weight:700;} .sell_store .member_info .section_02 .area .small .list .count span {padding:0 0.286rem; color:#E9E9E9;} @media (max-width:440px) { .sell_store .member_info .section_02 .area .big {flex-direction:column;} .sell_store .member_info .section_02 .area .big .list {flex-direction:row; justify-content:space-between; border-right:0; border-bottom:1px solid #eee; padding:1.143rem 0;} .sell_store .member_info .section_02 .area .big .list .title {padding-bottom:0;} .sell_store .member_info .section_02 .area .small {margin-top:0; border-top:0;} .sell_store .member_info .section_02 .area .big .list:last-child {border-bottom:1px solid #ddd;} } .sell_store .member_info .section_03 {display:flex; flex-direction:column; margin-bottom:2.143rem; padding:1.714rem; width:100%; background:#fff; border-radius:1.143rem;} .sell_store .member_info .section_03 .title {display:flex; justify-content:space-between; align-items:center; padding-bottom:1.143rem; font-size:1.429rem; font-weight:700;} .sell_store .member_info .section_03 .title .sub { font-size:1rem; font-weight:400; color:#999;} .sell_store .member_info .section_03 .area {display:flex; flex-direction:row;} .sell_store .member_info .section_03 .area .list {display:flex; flex-direction:column; align-items:center; width:100%; border-right:1px solid #eee;} .sell_store .member_info .section_03 .area .list:last-child {border-right:0;} .sell_store .member_info .section_03 .area .list .title {font-size:1.143rem; font-weight:500;} .sell_store .member_info .section_03 .area .list .count {font-size:1.714rem; font-weight:700; color:#fd5000;} .sell_store .member_info .section_03 .area .list .count span {padding-left:0.286rem; font-size:1.429rem; font-weight:700;} @media (max-width:440px) { .sell_store .member_info .section_03 .area {flex-direction:column;} .sell_store .member_info .section_03 .area .list {flex-direction:row; justify-content:space-between; border-right:0; border-bottom:1px solid #eee;} .sell_store .member_info .section_03 .area .list .title {padding-bottom:0; padding:16px 0;} .sell_store .member_info .section_03 .area .list .count {padding:1.143rem 0;} .sell_store .member_info .section_03 .area .list:last-child {border-bottom:0;} } .sell_store .member_info .section_04 {display:flex; flex-direction:column; margin-bottom:2.143rem; padding:1.714rem; width:100%; background:#fff; border-radius:1.143rem;} .sell_store .member_info .section_04 .title {display:flex; justify-content:space-between; align-items:center; padding-bottom:1.143rem; font-size:1.429rem; font-weight:700;} .sell_store .member_info .section_04 .title .sub {font-size:1rem; font-weight:400; color:#999;} .sell_store .member_info .section_04 .area {border-top:1px solid #eee;} .sell_store .member_info .section_04 .area .list {display:flex; justify-content:space-between; align-items:center; padding:1.143rem 0; border-bottom:1px dotted #ddd;} .sell_store .member_info .section_04 .area .list .title {padding-bottom:0; font-size:inherit; font-weight:500;} .sell_store .member_info .section_04 .area .list .count {font-size:1.429rem; font-weight:700;} .sell_store .member_info .section_04 .area .list .count span {padding-left:0.286rem; font-size:1.143rem; font-weight:500;} .sell_store .member_info .section_04 .area .list:last-child {border-bottom:0;} @media (max-width:440px) { .sell_store .member_info .section_04 .title {align-items:flex-start; flex-direction:column;} } .sell_store .member_info .section_05 {display:flex; flex-direction:column; margin-bottom:2.143rem; padding:1.714rem; width:100%; background:#fff; border-radius:1.143rem;} .sell_store .member_info .section_05 .title {padding-bottom:1.143rem; font-size:1.429rem; font-weight:700;} .sell_store .member_info .section_05 .area {display:flex;} .sell_store .member_info .section_05 .area .list {display:flex; align-items:center; width:100%;} .sell_store .member_info .section_05 .area .list:last-child {padding-right:0;} .sell_store .member_info .section_05 .area .list .icon_01 {display:flex; flex-direction:column; align-items:center; width:100%;} .sell_store .member_info .section_05 .area .list .icon_01 .box {display:flex; align-items:center; justify-content:center; margin-bottom:0.571rem; width:113.5px; height:6.857rem; border:1px solid #eee; border-radius:0.571rem;} .sell_store .member_info .section_05 .area .list .icon_01 .box img {height:2.286rem;} .sell_store .member_info .section_05 .area .list .icon_01 p {font-size:1.143rem; font-weight:500;} .sell_store .member_info .section_05 .area .list .icon_02 {display:flex; flex-direction:column; align-items:center; width:100%;} .sell_store .member_info .section_05 .area .list .icon_02 .box {display:flex; align-items:center; justify-content:center; margin-bottom:0.571rem; width:113.5px; height:6.857rem; border:1px solid #eee; border-radius:0.571rem;} .sell_store .member_info .section_05 .area .list .icon_02 .box img {height:2.5rem;} .sell_store .member_info .section_05 .area .list .icon_02 p {font-size:1.143rem; font-weight:500;} .sell_store .member_info .section_05 .area .list .icon_03 {display:flex; flex-direction:column; align-items:center; width:100%;} .sell_store .member_info .section_05 .area .list .icon_03 .box {display:flex; align-items:center; justify-content:center; margin-bottom:0.571rem; width:113.5px; height:6.857rem; border:1px solid #eee; border-radius:0.571rem;} .sell_store .member_info .section_05 .area .list .icon_03 .box img {height:2.714rem;} .sell_store .member_info .section_05 .area .list .icon_03 p {font-size:1.143rem; font-weight:500;} .sell_store .member_info .section_05 .area .list .icon_04 {display:flex; flex-direction:column; align-items:center; width:100%;} .sell_store .member_info .section_05 .area .list .icon_04 .box {display:flex; align-items:center; justify-content:center; margin-bottom:0.571rem; width:113.5px; height:6.857rem; border:1px solid #eee; border-radius:0.571rem;} .sell_store .member_info .section_05 .area .list .icon_04 .box img {height:2.286rem;} .sell_store .member_info .section_05 .area .list .icon_04 p {font-size:1.143rem; font-weight:500;} @media (max-width:768px) { .sell_store .member_info .section_05 .area .list .icon_02 {display:flex; flex-direction:column; align-items:center; margin-right:1.143rem; width:100%;} } @media (max-width:440px) { .sell_store .member_info .section_05 .area { display:flex; flex-direction:column;} .sell_store .member_info .section_05 .area .list {padding-bottom:1.143rem; width:100%; gap:1rem;} .sell_store .member_info .section_05 .area .list .icon_01 .box, .sell_store .member_info .section_05 .area .list .icon_02 .box, .sell_store .member_info .section_05 .area .list .icon_03 .box, .sell_store .member_info .section_05 .area .list .icon_04 .box {width:100%; height:6.857rem;} .sell_store .member_info .section_05 .area .list .icon_02 {margin-right:0;} } .sell_store .member_info .section_06 {display:flex; flex-direction:column; margin-bottom:2.143rem; padding:1.714rem; width:100%; background:#fff; border-radius:1.143rem;} .sell_store .member_info .section_06 .title {padding-bottom:1.143rem; font-size:1.429rem; font-weight:700;} .sell_store .member_info .section_06 .list {display:flex; justify-content:space-between; align-items:center; gap:1rem;} .sell_store .member_info .section_06 .list .icon_05 {display:flex; justify-content:flex-start; align-items:center; width:100%;} .sell_store .member_info .section_06 .list .icon_05 .box {display:flex; align-items:center; justify-content:center; margin: 0 0.571rem; width:8.429rem; height:8.429rem; border:1px solid #eee; border-radius:0.571rem;} @media (max-width:440px) { .sell_store .member_info .section_06 .list .icon_05 {flex-direction:column;} .sell_store .member_info .section_06 .list .icon_05 .box {margin-right:0; margin: 0 0.571rem; width:100%; height:6.857rem;} } .sell_store .member_info .section_06 .list .icon_05 .box img {height:2.714rem;} .sell_store .member_info .section_06 .list .icon_05 p {font-size:1.143rem; font-weight:500;} .sell_store .member_info .section_06 .list .icon_06 {display:flex; justify-content:flex-start; align-items:center; width:100%;} .sell_store .member_info .section_06 .list .icon_06 .box {display:flex; align-items:center; justify-content:center; margin: 0 0.571rem 0 0; width:8.429rem; height:8.429rem; border:1px solid #eee; border-radius:0.571rem;} .sell_store .member_info .section_06 .list .icon_06 .box img {height:2.714rem;} .sell_store .member_info .section_06 .list .icon_06 p {font-size:1.143rem; font-weight:500;} .sell_store .member_info .section_07 {display:flex; flex-direction:row; justify-content:space-between; align-items:center; margin-bottom:1.143rem; padding:1.714rem; width:100%; background:#fd5000; border-radius:1.143rem;} .sell_store .member_info .section_07 .title {font-size:1.143rem; font-weight:500; color:#fff;} .sell_store .member_info .section_07 .num {font-size:1.143rem; font-weight:500; color:#fff;} .sell_store .member_info .section_07 .num strong {font-size:1.429rem; font-weight:700; color:#fff;} @media (max-width:440px) { .sell_store .member_info .section_06 .list .icon_06 {flex-direction:column;} .sell_store .member_info .section_06 .list .icon_06 .box {margin-right:0; margin: 0 0.571rem 0 0; width:100%; height:6.857rem;} } .sell_store .member_info .section_08 {font-size:1.143rem; font-weight:600; display:flex; justify-content:center; padding:3rem; align-items:center; padding:1.143rem; width:100%; background:#fff; border-radius:1.143rem;} /* 소매입점사 매장정보 */ #shop_info {} #shop_info > .info {padding:1.643rem 6.25% 0.857rem; border-bottom:0.714rem solid #F9F9F9;} #shop_info > .info:first-child {padding:1.286rem 6.25% 0.857rem;} #shop_info > .info h3 {position:relative; margin-bottom:1.214rem; font-size:1.429rem;} #shop_info > .info.detail h3 {margin-bottom:1.429rem;} #shop_info > .info h3 span {display:inline-block; position:absolute; top:-0.071rem; right:0;} #shop_info > .info h3 span a {display:block; width:4.714rem; height:2.214rem; border:1px solid #DDDDDD; border-radius:4px; font-weight:500; text-align:center; line-height:2.214rem;} #shop_info > .info > ul > li {position:relative; min-height:1.500rem; margin-bottom:0.643rem; padding-left:10.000rem; font-size:1.071rem; font-weight:500;} #shop_info > .info > ul > li > span {display:inline-block; position:absolute; top:0; left:0;} #shop_info > .info .line {margin-bottom:2.000rem; padding-bottom:1.071rem; border-bottom:1px dashed #E3E3E3;} #shop_info > .info .line h4 {margin-bottom:1.286rem; font-size:1.214rem;} #shop_info > .info .line .box .list {position:relative; min-height:1.500rem; margin-bottom:0.786rem; padding-left:10rem; font-size:1.071rem;} #shop_info > .info .line .box .list.total {line-height:2.143rem;} #shop_info > .info .line .box .list span {position:absolute; top:0; left:0; font-size:1.071rem; font-weight:600;} #shop_info > .info .line .box .list.total span {top:0.286rem;} #shop_info > .info .line .box img {width:100%; margin-bottom:10px;} #shop_info .btn {padding:1.786rem 6.25% 3.143rem;} #shop_info .btn span {display:block;} #shop_info .btn span a {display:block; height:3.571rem; border-radius:4px; background:#FD5000; color:#fff; font-size:1.071rem; text-align:center; line-height:3.571rem;} /* 소매입점사 매출정산 */ .sales_detail {padding-bottom:3.214rem;} .sales_detail h3 {padding-bottom:0.714rem; font-size:1.429rem;} .sales_detail h3 span {color:#999999; font-size:1.071rem; font-weight:400; letter-spacing:-0.15px;} .sales_detail .card {margin-bottom:1.571rem; padding:0 6.25% 1.714rem; border-bottom:0.714rem solid #F9F9F9; font-size:0;} .sales_detail .box {margin:0; padding:0; border-radius:6px; /* background:#F6F6F6; */ font-size:0;} .sales_detail .box > div {display:inline-block; padding-bottom:2.500rem; vertical-align:top;} .sales_detail .box > div h3 {padding:1.643rem 0 0.500rem; font-size:1.286rem;} .sales_detail .box > div ul li {position:relative; margin-bottom:5px; font-weight:500;} .sales_detail .box > div ul li span {display:inline-block; width:8.429rem; padding-right:10px; color:#999;} .sales_detail .box .left {width:100%; height:12.500rem; padding:0 2.143rem; margin-bottom:0.714rem; border-radius:10px; background:#F6F6F6;} .sales_detail .box .left ul li {min-height:1.200rem; padding-left:8.429rem;} .sales_detail .box .left ul li span {position:absolute; top:0; left:0;} .sales_detail .box .right {display:inline-block; width:100%; height:9.643rem; padding:0 0.714rem 0 3.857em; border-radius:10px; background:#F6F6F6;} .sales_detail .box .right ul {font-size:0;} .sales_detail .box .right ul li:first-child {margin-left:0;} .sales_detail .box .right ul li {display:inline-block; width:33.33%; font-weight:500;} .sales_detail .box .right ul li:last-child {margin:0;} .sales_detail .box .right ul li span {display:block; width:100%; color:#999; font-size:1.071rem;} .sales_detail .box .right ul li strong {font-size:1.714rem;} .sales_detail .box.type2 {position:relative; margin-top:0.714rem; padding:0.929rem 2.143rem; border-radius:10px; background:#F6F6F6;} .sales_detail .box.type2.col2 {display:inline-block; width:calc(50% - 0.357rem); padding:0 2.143rem;} .sales_detail .box.type2.col2.first {margin-right:0.714rem;} .sales_detail .box.type2.col2 p {padding:1.429em 0;} .sales_detail .box.type2 p {position:relative; padding:0.429rem 0; font-size:1.071rem; font-weight:500;} .sales_detail .box.type2 p.strong {font-weight:700;} .sales_detail .box.type2 p > span {display:inline-block; position:absolute; top:50%; right:2.143rem; margin-top:-0.714rem;} .sales_detail .box.type2 p.strong > span {display:inline-block; position:absolute; top:50%; right:2.143rem; margin-top:-0.714rem;} .sales_detail .box.type2 p.strong.color > span {color:#FD5000;} .sales_detail .box.type2 p > span > span {display:inline-block; height:2.214rem; font-size:1.071rem; vertical-align:top;} .sales_detail .box.type2 p > span strong {display:inline-block; height:2.214rem; font-size:1.857rem;} .sales_detail .box.type2.col2 p > span {margin-top:-0.643rem;} .sales_detail .box.type2.col2 p > span strong {font-size:1.071rem;} .sales_detail .box.type2.total p > span span {color:#FD5000;} .sales_detail .box.type2.total p > span strong {color:#FD5000;} .sales_detail .list > li {margin-bottom:0.286rem; border-top:1px solid #E9E9E9;} .sales_detail .list .info {padding:1.286rem 0 1.357rem;} .sales_detail .list .info p {color:#FD5000; font-size:1.143rem; font-weight:700; letter-spacing:-0.16px;} .sales_detail .list .info li {display:inline-block; position:relative; width:100%; min-height:1.357rem; margin:0.357rem 0; padding-left:10rem; font-size:1.071rem; letter-spacing:-0.15px;} .sales_detail .list .info li strong {font-size:1.071rem; letter-spacing:-0.15px;} .sales_detail .list .info li span {display:inline-block; position:absolute; top:0; left:0; width:10rem; font-size:1.071rem; font-weight:600; letter-spacing:-0.15px;} .sales_detail .wrap_list {padding:0 6.25%;} /* 소매입점사 영업시간 리스트 */ #shop_info_time {padding:0 6.25%;} #shop_info_time > .info {padding:1.643rem 0 0.857rem; border-bottom:1px dashed #DCDCDC;} #shop_info_time > .info:first-child {padding:1.286rem 0 0.857rem;} #shop_info_time > .info h3 {position:relative; margin-bottom:1.214rem; font-size:1.429rem;} #shop_info_time > .info.detail h3 {margin-bottom:1.429rem;} #shop_info_time > .info h3 span.small {display:inline-block; position:absolute; top:-0.071rem; right:0;} #shop_info_time > .info h3 span.small a {display:block; width:4.714rem; height:2.143rem; padding:0; border-color:#DDDDDD; border-radius:4px; background:#fff; color:#333 !important; font-size:0.929rem; font-weight:500; text-align:center; line-height:2.143rem;} #shop_info_time > .info > ul > li {position:relative; min-height:1.500rem; margin-bottom:2.857rem; padding:0 0 0 9rem; font-size:1.071rem; font-weight:500;} #shop_info_time > .info > ul > li:last-child {margin-bottom:0;} #shop_info_time > .info > ul > li > span {display:inline-block; position:absolute; top:0; left:0; font-size:1.071rem; font-weight:700;} #shop_info_time > .info > ul > li > .wrap {padding-right:9rem;} #shop_info_time > .info > ul > li .wrap {position:relative; margin-bottom:10px; font-size:1.071rem; line-height:1.786rem;} #shop_info_time > .info > ul > li .wrap > .btn_col {display:inline-block; position:absolute; top:0; right:0; width:5rem; line-height:1.786rem;} #shop_info_time > .info > ul > li .wrap > p {font-weight:700;} #shop_info_time > .info > ul > li .wrap .box_btn > * {padding:0; border:0; background:none; color:#999 !important; font-size:0.929rem;} #shop_info_time .btn span {display:block;} #shop_info_time .btn span a {display:block; height:3.571rem; border-radius:4px; background:#FD5000; color:#fff; font-size:1.071rem; text-align:center; line-height:3.571rem;} #shop_info_time .btn span a {display:block; height:3.571rem; border-radius:4px; background:#FD5000; color:#fff; font-size:1.071rem; text-align:center; line-height:3.571rem;} #shop_info_time .btn.list {margin-top:2.143rem;} /* 소매입점사 영업시간 설정 */ .store_time {padding:0 6.25% 1.786rem;} .store_time input[type=checkbox] {margin-right:4px;} .store_time .table {display:table; width:100%; background:#fff; box-sizing:border-box;} .store_time_wrap h3 {position:relative; padding:1.286rem 6.25% 0; font-size:1.286rem;} .store_time .tr {display:table-row; width:100%; font-size:0;} .store_time .tr > div {display:block; vertical-align:top; padding:0.857rem 0 0; padding-bottom:0; color:#000; font-size:0; vertical-align:middle;} .store_time .tr > .td {margin-bottom:0.357rem; padding:0.500rem 0 0;} .store_time .tr .th {width:100%; padding-left:0; padding-bottom:0; font-size:1.143rem; font-weight:bold; text-align:left;} .store_time .tr .step1 {font-size:0;} .store_time .tr .step1 input {display:none;} .store_time .tr .step1 label {display:inline-block; width:32%; height:3.571rem; border:1px solid #E9E9E9; border-radius:0.286rem; font-size:1.071rem; text-align:center; line-height:3.571rem;} .store_time .tr .step1 label.typeB {margin:0 2%;} .store_time .tr .step1 label.on {border:2px solid #FD5000; color:#FD5000 !important; font-weight:600;} .store_time .tr .td > div {padding-bottom:0.714rem; font-size:0;} .store_time .tr .td > div.text_type {display:inline-block; margin-right:1.429rem; font-size:1.071rem;} .store_time .tr .td > div.text_type input {width:12.857rem; margin-right:0.714rem;} .store_time .tr .td > div.fake_title {width:100%; margin-top:1.286rem; padding-left:0; font-size:1.143rem; font-weight:bold; text-align:left;} .store_time .tr .td > div.fake_title.on {display:none;} .store_time .tr .td.on > div.all {display:inline-block; margin-left:1.286rem; vertical-align:middle;} .store_time .tr .td > div.select select {width:100%;} .store_time .tr .td .before, .store_time .tr .td .after {display:inline-block; width:calc(50% - 0.964rem); font-size:0; vertical-align:middle;} .store_time .tr .td .middle {display:inline-block; width:1.929rem; font-size:1rem; vertical-align:middle; text-align:center;} .store_time .tr .td.on .middle {display:inline-block; width:2.143rem; vertical-align:middle; text-align:center;} .store_time .tr .td .before input, .store_time .tr .td .after input {display:inline-block; width:49.61%; margin-right:4.59%;} .store_time .tr .td .before select, .store_time .tr .td .after select {display:inline-block; width:45.80%;} .store_time .tr .td.on .before, .store_time .tr .td.on .after {display:inline-block; width:calc(50% - 3.571rem);} .store_time .tr .td.on .before select, .store_time .tr .td.on .after select {width:100%;} .store_time .tr .td .box_btn_s {margin-left:10px;} .store_time .tr .td select {height:3.286rem; vertical-align:middle;} .store_time .tr .td select:disabled {border:1px solid #E9E9E9; background:#F0F0F0;} .store_time .tr .td .input {height:3.286rem; padding:0.286rem 1.071rem; margin-right:0; border:1px solid #E9E9E9; background:#fff; color:#999; font-family:'Pretendard',sans-serif; font-size:1rem; transition:all .3s ease; vertical-align:middle;} .store_time .tr .td textarea {border:1px solid #E9E9E9; border-radius:0.286rem;} .store_time .tr .td.day {} .store_time .tr .td.day label {display:inline-block; width:5.000rem; margin-right:0.286rem; margin-bottom:0.357rem} .store_time .tr .td.brake {font-size:0;} .store_time .tr .td.brake input {display:none;} .store_time .tr .td.brake label {display:inline-block; width:32%; height:3.571rem; margin-right:10px; border:1px solid #E9E9E9; border-radius:0.286rem; font-size:1.071rem; text-align:center; line-height:3.571rem;} .store_time .tr .td.brake label.on {border:2px solid #FD5000; color:#FD5000 !important; font-weight:600;} .store_time .tr .td.brake .before, .store_time .tr .td.brake .after {display:inline-block; width:calc(50% - 3.571rem);} .store_time .tr .td.brake .before select, .store_time .tr .td.brake .after select {width:100%;} .store_time .tr .td .date {font-size:0;} .store_time .tr .td .date input {display:none;} .store_time .tr .td .date label {display:inline-block; width:32%; height:3.571rem; margin-right:10px; border:1px solid #E9E9E9; border-radius:0.286rem; font-size:1.071rem; text-align:center; line-height:3.571rem;} .store_time .tr .td .date label.on {border:2px solid #FD5000; color:#FD5000 !important; font-weight:600;} .store_time .tr .td .date .before, .store_time .tr .td .date .after {display:inline-block; width:calc(50% - 3.571rem);} .store_time .tr .td .date .before select, .store_time .tr .td .date .after select {width:100%;} .box_bottom {margin-bottom:30px; text-align:center;} .box_bottom .box_btn {width:87.5%;} .box_bottom .box_btn * {width:100%; height:3.571rem; border-radius:0.286rem;} /* 소매입점사 매뉴얼 */ .manual {width:45.714rem;} .manual img {width:100%;} .manual .tab {display:flex; gap:0.571rem; margin:2.857rem 0 5.714rem; padding:0 2.857rem;} .manual .tab .tab_btn {display:inline-block; padding:0.571rem 1.143rem; border-radius:2.143rem; background:#f8f8f8; font-size:1.429rem; line-height:1.429rem; font-weight:500;} .manual .tab .tab_btn:hover {background:#fd5000; color:#fff;} .manual .title {margin-bottom:2.857rem; padding:0 2.857rem;} .manual .title .num {margin-bottom:2.857rem; font-size:3.429rem; line-height:3.429rem; font-weight:700; color:#fd5000;} .manual .title .tl {margin-bottom:1.143rem; font-size:2.143rem; line-height:2.143rem; font-weight:700;} .manual .title .txt {font-size:1.429rem; line-height:2.143rem; font-weight:400; color:#888; word-break:keep-all;} .manual .txt_area {margin:2.143rem 0 5.714rem 0; padding:0 2.857rem;} .manual .txt_area p {font-size:1.143rem; line-height:1.857rem; font-weight:400; color:#888; word-break:keep-all;} .manual .tit_area {margin-bottom:4.286rem; padding:0 2.857rem;} .manual .tit_area .tl {margin-bottom:2.857rem; font-size:2rem; line-height:2.714rem; font-weight:700;} .manual .tit_area .sub_tl {margin-bottom:2.143rem; font-size:1.714rem; line-height:2.429rem; font-weight:600;} .manual .tit_area .sub_txt {font-size:1.429rem; line-height:2.143rem; font-weight:400; word-break:keep-all;} .manual .tit_area .sub_txt strong {font-size:1.429rem; line-height:2.143rem; font-weight:700; word-break:keep-all;} .manual .tit_area img {margin-top:2.143rem; width:100%;} .manual .tit_area .img {margin-top:2.143rem; margin-bottom:2.143rem; width:100%; text-align:center;} .manual .tit_area .img .box_01 {display:flex; justify-content:center; align-items:center; gap:0.571rem; padding:1.429rem; background:#fd5000; border-radius:0.571rem;} .manual .tit_area .img .box_01 .txt {font-size:1.429rem; line-height:2.143rem; font-weight:400; word-break:keep-all; text-align:left; color:#fff;} .manual .tit_area .img .box_01 .num {font-size:3.429rem; line-height:3.429rem; font-weight:600; word-break:keep-all; color:#fff;} .manual .tit_area .img .box_01 img {margin-top:-3rem; width:5.429rem;} .manual .tit_area .img .arr {display:flex; justify-content:center; margin-bottom:1.143rem;} .manual .tit_area .img .arr img {margin-top:0; width:2.857rem;} .manual .tit_area_01 {margin-bottom:4.286rem; padding:0 2.857rem;} .manual .tit_area_01 .img .box_02 {display:flex; flex-direction:column; justify-content:center; padding:2.857rem 5.143rem; background:#f6f6f6; border-radius:0.571rem;} .manual .tit_area_01 .img .box_02 img {width:68%;} .manual .tit_area_01 .img {margin-top:2.143rem; margin-bottom:2.143rem; width:100%; text-align:center;} .manual .tit_area_01 .img .box_02 .table_01 {display:flex; justify-content:space-around; align-items:center; background:#6f8a6b; padding:0.857rem 0; border-bottom:1px solid #fff; border-radius:0.571rem 0.571rem 0 0;} .manual .tit_area_01 .img .box_02 .table_01 .txt {font-size:1.429rem; line-height:1.429rem; font-weight:500; color:#fff;} .manual .tit_area_01 .img .box_02 .table_01 .num {font-size:1.143rem; line-height:1.143rem; font-weight:500; color:#fff;} .manual .tit_area_01 .img .box_02 .table_01 .minus {display:flex; justify-content:center; align-items:center; width:1.286rem; height:1.286rem; border-radius:1.286rem; background:#7f977b; font-size:1.143rem; line-height:1.143rem; font-weight:500; color:#fff;} .manual .tit_area_01 .img .box_02 .table_02 {display:flex; justify-content:space-evenly; align-items:center; background:#fff; padding:0.857rem 0; border-top:2px solid #6f8a6b;} .manual .tit_area_01 .img .box_02 .table_02 .txt {font-size:1.429rem; line-height:1.429rem; font-weight:500; color:#333;} .manual .tit_area_01 .img .box_02 .table_02 .num {font-size:1.143rem; line-height:1.143rem; font-weight:600; color:#333;} .manual .tit_area_01 .img .box_02 .table_02 .minus {display:flex; justify-content:center; align-items:center; width:1.286rem; height:1.286rem; border-radius:1.286rem; background:#7f977b; font-size:1.143rem; line-height:1.143rem; font-weight:500; color:#fff;} .manual .tit_area_01 .img .box_02 .notice {margin-bottom:2.857rem; padding:1.714rem 0 2.143rem; border-bottom:1px dotted #333; font-size:1.071rem; line-height:1.786rem; font-weight:400; color:#333; text-align:center; word-break:keep-all;} .manual .tit_area_01 .img .box_02 .price {display:flex; flex-direction:column; justify-content:center; align-items:center;} .manual .tit_area_01 .img .box_02 .price .txt {margin-bottom:0.571rem; padding:0.571rem 1.143rem; background:#fd5000; border-radius:1.143rem; font-size:1.143rem; line-height:1.143rem; font-weight:500; color:#fff;} .manual .tit_area_01 .img .box_02 .price .num {font-size:1.286rem; line-height:1.286rem; font-weight:600; color:#333;} .manual .tit_area_01 .img .box_02 .bottom {display:flex; justify-content:space-between;} .manual .process {display:flex; flex-direction:column; gap:1.714rem; margin-bottom:11.429rem; padding:0 2.857rem;} .manual .process .step {display:flex; gap:3.214rem;} .manual .process .step img {margin-left:2rem; width:5.143rem; height:5.143rem;} .manual .process .step .step_txt {width:100%;} .manual .process .step .step_txt .tit {font-size:1.429rem; line-height:2.143rem; font-weight:800;} .manual .process .step .step_txt .txt {font-size:1.429rem; line-height:2.143rem; font-weight:400; word-break:keep-all;} .manual .process .step .box {margin-left:-1.429rem; margin-top:1.714rem; padding:1.143rem; border:2px dotted #333; border-radius:1.143rem;} .manual .process .step .box div {} .manual .process .step .box div p {font-size:1.429rem; line-height:2.143rem; font-weight:700; word-break:keep-all;} .manual .process .step .box div p:last-child {font-size:1.429rem; line-height:2.143rem; font-weight:400; word-break:keep-all;} .manual .process .step .box div.line {margin:1.143rem 0; width:100%; height:1px; background:#333;} @media (max-width:42.857rem) { .manual {width:100%;} .manual img {width:100%;} .manual .tab {margin:2.857rem 0 2.857rem;} .manual .tab .tab_btn {font-size:1.286rem; line-height:1.286rem;} .manual .title .num {margin-bottom:1.429rem; font-size:2.857rem; line-height:2.857rem;} .manual .title .tl {margin-bottom:0.571rem; font-size:1.714rem; line-height:1.714rem;} .manual .title .txt {font-size:1.286rem; line-height:2rem;} .manual .tit_area {margin-bottom:2.857rem;} .manual .tit_area .img .box_01 {padding:1.5rem;} .manual .tit_area .img .arr img {width:1.714rem;} .manual .tit_area .img {margin-top:2.857rem; margin-bottom:0;} .manual .tit_area .tl {margin-bottom:1.429rem; font-size:1.571rem; line-height:2.286rem;} .manual .tit_area .sub_tl {margin-bottom:1.143rem; font-size:1.429rem; line-height:2.143rem;} .manual .tit_area .sub_txt {font-size:1.286rem; line-height:2rem;} .manual .tit_area .img .box_01 .num {font-size:2.571rem; line-height:2.571rem;} .manual .tit_area_01 {margin-bottom:4.286rem; padding:0;} .manual .tit_area_01 .img {margin-top:0.714rem;} .manual .tit_area_01 .img .box_02 {padding:2.857rem;} .manual .process {gap:1.143rem;} .manual .process .step {gap:1.714rem;} .manual .process .step img {margin-left:0; width:4.571rem; height:4.571rem;} .manual .process .step .step_txt .tit {font-size:1.286rem; line-height:2rem;} .manual .process .step .step_txt .txt {font-size:1.286rem; line-height:2rem;} .manual .txt_area {margin:1.143rem 0 2.857rem 0;} .mo {display:none;} .mob {display:block;} } @media (max-width:414px) { .manual .tab .tab_btn {font-size:1.143rem; line-height:1.143rem;} .manual .tit_area .img .box_01 {padding:1.143rem;} .manual .tit_area .img .box_01 .txt {font-size:1.286rem; line-height:2rem;} .manual .tit_area .img .box_01 .num {font-size:2.286rem; line-height:2.286rem;} .sell_store .member_info .section_06 .list .icon_05 .box, .sell_store .member_info .section_06 .list .icon_06 .box { margin-bottom: 0.571rem; } } @media (max-width:412px) { .manual .tab .tab_btn {font-size:1.143rem; line-height:1.143rem;} .manual .process .step img {width:3.429rem; height:3.429rem;} .manual .title .txt, .manual .tit_area .sub_txt, .manual .tit_area .sub_txt strong, .manual .process .step .step_txt .txt {font-size:1.143rem; line-height:1.857rem;} .manual .txt_area p, .manual .process .step .box div p, .manual .process .step .box div p:last-child {font-size:1.286rem; line-height:2rem;} } @media (max-width:390px) { .manual .tab .tab_btn {padding:0.571rem 12px; font-size:1rem; line-height:1rem;} .manual .title .num {font-size:2.571rem; line-height:2.571rem;} .manual .title .tl {font-size:1.571rem; line-height:1.571rem;} .manual .title .txt, .manual .tit_area .sub_txt, .manual .tit_area .sub_txt strong, .manual .process .step .step_txt .txt {font-size:1rem; line-height:1.714rem;} .manual .txt_area p, .manual .process .step .step_txt .tit, .manual .process .step .box div p, .manual .process .step .box div p:last-child {font-size:1.071rem; line-height:1.786rem;} .manual .tit_area_01 .img .box_02 .table_01 .txt {font-size:1.143rem; line-height:1.143rem;} .manual .tit_area .img .box_01 {padding:0.571rem;} .manual .tit_area .img {margin-top:3.571rem;} .manual .tit_area .img .box_01 .txt {font-size:1.143rem; line-height:1.857rem;} .manual .tit_area .img .box_01 .num {font-size:2.143rem; line-height:2.143rem;} } @media (max-width:360px) { .manual .tit_area .img .box_01 .txt {font-size:1rem; line-height:1.714rem;} .manual .tit_area .img .box_01 .num {font-size:2rem; line-height:2rem;} } /* 주류발주 상품목록 */ .sell_goods {padding:2.500rem 6.25% 4.786rem; width:100%; background:#fff;} @media (max-width:414px) { .sell_goods {padding:2.5rem 6.25% 4.786rem;} } .sell_goods .good_01 {display:flex; justify-content:space-between; align-items:center; margin-bottom:2.143rem; padding:2.286rem; width:100%; border-radius:0.571rem; background:#F6F6F6;} @media (max-width:414px) { .sell_goods .good_01 {flex-direction:column; align-items:flex-start;} } .sell_goods .good_01 .title {font-size:1.429rem; font-weight:700;} .sell_goods .good_01 .sub span {font-size:1.143rem; font-weight:400;} .sell_goods .good_01 .sub strong {font-size:1.714rem; font-weight:700; color:#FD5000;} @media (max-width:414px) { .sell_goods .good_01 {flex-direction:column; align-items:flex-start;} } .sell_goods .good_02 {display:flex; justify-content:space-between; align-items:center; margin-bottom:2.143rem; width:100%;} .sell_goods .good_02 div {width:100%;} .sell_goods .good_02 div:first-child {margin-right:1.143rem;} .sell_goods .good_02 div .title {padding-bottom:1.143rem; font-size:1.143rem; font-weight:700;} .sell_goods .good_02 div input {width:100%; height:3.286rem; border-color:#dfdfdf; border-radius:0.286rem; padding:0.286rem 1.071rem; border:1px solid #e9e9e9; color:#666; font-size:1rem; transition:all .3s ease; background:url(/_skin/bona/img/mypage/cal.png)no-repeat right 1.171rem center / 0.786rem;} .sell_goods .good_02 div input#register_date {background-color:#f5f5f5;} .sell_goods .good_02 div input::placeholder {color:#ababab;} .sell_goods .good_03 {padding-bottom:1.143rem; width:100%;} .sell_goods .good_03 .title {padding-bottom:1.143rem; font-size:1.143rem; font-weight:700;} .sell_goods .good_03 .month {display:flex; justify-content:space-between; align-items:center; margin-bottom:1.143rem; width:100%;} .sell_goods .good_03 .month div {margin-right:16px; width:100%; height:3.714rem; border-radius:0.571rem; text-align:center;} @media (max-width:414px) { .sell_goods .good_03 .month div {height:3rem;} } .sell_goods .good_03 .month div:last-child {margin-right:0;} .sell_goods .good_03 .month div.sel_date {border:1px solid #e9e9e9;} .sell_goods .good_03 .month div.sel_date a {display:block; line-height:3.714rem;} .sell_goods .good_03 .month div.on {border:1px solid #fd5000;} .sell_goods .good_03 .month div.on a {display:block; line-height:3.714rem; color:#fd5000;} @media (max-width:414px) { .sell_goods .good_03 .month div.sel_date a {line-height:3rem;} .sell_goods .good_03 .month div.on a {line-height:3rem;} } .sell_goods .good_04 {display:none;} .sell_goods .good_04 .period {display:flex; justify-content:space-between; align-items:center; width:100%; padding-bottom:1.143rem;} .sell_goods .good_04 .period div {width:100%;} .sell_goods .good_04 .period div input {width:100%; height:3.286rem; border-color:#dfdfdf; border-radius:0.286rem; padding:0.286rem 1.071rem; border:1px solid #e9e9e9; background:#fff; color:#666; font-size:1rem; transition:all .3s ease; background:url(/_skin/bona/img/mypage/cal.png)no-repeat right 1.171rem center / 0.786rem;} .sell_goods .good_04 .period div input::placeholder {color:#ababab;} .sell_goods .good_04 .period span {padding:0 0.286rem;} .sell_goods .good_05 {margin-bottom:2.143rem; width:100%;} .sell_goods .good_05 table {width:100%; text-align:center;} .sell_goods .good_05 table #oderListPrint {height:200px;} .sell_goods .good_05 th {padding:1.143rem 0; border-top:1px solid #333; border-bottom:1px dotted #ddd;} .sell_goods .good_05 td {padding:1.143rem 0; border-bottom:1px solid #eee; vertical-align:middle; font-weight:700;} .sell_goods .good_05 td:first-child {padding-left:1.143rem; font-weight:400; text-align:left;} .sell_goods .good_05 .title {padding-bottom:0.571rem; font-weight:600; text-align:left;} .sell_goods .good_05 span {padding :0 0.571rem 0.571rem 0.571rem; font-weight:400; text-align:left; color:#e9e9e9;} .sell_goods .good_05 tfoot {width:100%; background:#f6f6f6;} .sell_goods .good_05 tfoot td {padding:1.143rem; font-weight:700;} @media (max-width:414px) { .sell_goods .good_05 tfoot td {justify-content:flex-start;} .sell_goods .good_05 tfoot td p {justify-content:space-between;} .sell_goods .good_05 tfoot td p strong {padding-left:0.286rem;} } .sell_goods .good_05 tfoot td p {display:flex; justify-content:flex-end;} .sell_goods .good_05 tfoot td p span {padding:0 1.143rem; font-weight:700; color:#333;} .sell_goods .good_05 tfoot td p strong {padding-left:3rem; color:#fd5000;} .sell_goods .btn_01 {margin-bottom:2.143rem; width:100%; height:3.714rem; border:1px solid #9a9a9a; border-radius:0.571rem; font-weight:700; text-align:center;} .sell_goods .btn_01 a {display:block; line-height:3.714rem;} .sell_goods .btn_02 {width:100%; border:1px solid #fd5000; border-radius:0.571rem; background:#fd5000; font-weight:700; text-align:center;} .sell_goods .btn_02 a {display:block; line-height:3.714rem; color:#fff;} .sell_goods .btn_03 {margin-bottom:2.143rem; width:100%; border:1px solid #fd5000; border-radius:0.571rem; background:#fd5000; font-weight:700; text-align:center;} .sell_goods .btn_03 a {display:block; line-height:3.714rem; color:#fff;} .popup_sellgoods_wrap {display:none;z-index:41; align-items:center; position:fixed; width:100%; height:100vh; top:0; left:0; right:0; bottom:0; background-color:rgba(0,0,0,.5); z-index:100;} .popup_sellgoods_wrap .popup {padding:2.143rem; background:#fff; border-radius:0.571rem; position:absolute; top:50%; left:50%; width:600px; margin:1rem 20px 0; transform:translate(0 ,-50%);} @media (max-width:414px) { .popup_sellgoods_wrap .popup {margin:2.5rem 6.25% 4.786rem;} } .popup_sellgoods_wrap .popup .title_area {margin-bottom:2.143rem;} .popup_sellgoods_wrap .popup .title_area .title {font-size:1.143rem; font-weight:700;} .popup_sellgoods_wrap .popup .title_area #unit {display:none;} .popup_sellgoods_wrap .popup .num_area {display:flex; margin-bottom:2.143rem;} .popup_sellgoods_wrap .popup .num_area div {width:100%;} .popup_sellgoods_wrap .popup .num_area div:first-child {margin-right:0.571rem;} .popup_sellgoods_wrap .popup .num_area .title {padding:1.143rem 0; border-top:1px solid #333; border-bottom:1px dotted #ddd; font-weight:600; text-align:center;} .popup_sellgoods_wrap .popup .num_area .num {display:flex; justify-content:space-between; align-items:center; padding:1.143rem 0; border-bottom:1px solid #eee;} .popup_sellgoods_wrap .popup .num_area .num .minus {width:3rem; height:2.286rem; border:1px solid #dfdfdf; border-radius:0.286rem; text-align:center; background:url(/_skin/bona/img/retail/cart_minus.png)no-repeat center center / 0.786rem;} .popup_sellgoods_wrap .popup .num_area .num .count {font-size:1.143rem; font-weight:700; text-align:center;} .popup_sellgoods_wrap .popup .num_area .num .plus {width:3rem; height:2.286rem; border:1px solid #dfdfdf; border-radius:0.286rem; text-align:center; background:url(/_skin/bona/img/retail/cart_plus.png)no-repeat center center / 0.786rem;} .popup_sellgoods_wrap .popup .num_area .repeating-linear {background:repeating-linear-gradient(-45deg, white, white 5px, #eee 5px, #eee 10px);} @media (max-width:414px) { .popup_sellgoods_wrap .popup .num_area {flex-direction:column;} } .popup_sellgoods_wrap .popup .btn_area {display:flex; width:100%;} .popup_sellgoods_wrap .popup .btn_area .btn_01 {width:100%; height:3.714rem; border:1px solid #9a9a9a; border-radius:0.571rem; font-weight:700; text-align:center;} .popup_sellgoods_wrap .popup .btn_area .btn_01 {width:9rem; height:3.714rem; border:1px solid #9a9a9a; border-radius:0.571rem; font-weight:700; text-align:center; background:url(/_skin/bona/img/retail/refresh.png)no-repeat center center / 0.786rem;} .popup_sellgoods_wrap .popup .btn_area .btn_01 a {display:block; line-height:3.714rem;} .popup_sellgoods_wrap .popup .btn_area .btn_02 {margin-left:0.571rem; width:100%; border:1px solid #fd5000; height:3.714rem; border-radius:0.571rem; background:#fd5000; font-weight:700; text-align:center;} .popup_sellgoods_wrap .popup .btn_area .btn_02 a {display:block; line-height:3.714rem; color:#fff;} .popup_sellgoods_wrap .popup .btn_area .btn_03 {margin-left:0.571rem; width:100%; border:1px solid #eee; height:3.714rem; border-radius:0.571rem; background:#eee; font-weight:700; text-align:center;} .popup_sellgoods_wrap .popup .btn_area .btn_03 a {display:block; line-height:3.714rem;} *,*:focus,*:hover{outline:none;} .popup_search_wrap {display:none;z-index:41; align-items:center; position:fixed; width:100%; height:100vh; top:0; left:0; right:0; bottom:0; background-color:rgba(0,0,0,.5); z-index:100;} .popup_search_wrap .popup {padding:2.143rem; background:#fff; border-radius:0.571rem; position:absolute; top:50%; left:50%; width:600px; margin:1rem 20px 0; transform:translate(0 ,-50%);} @media (max-width:414px) { .popup_search_wrap {align-items:stretch;} .popup_search_wrap .popup {margin:0; border-radius:0;} } .popup_search_wrap .popup .title_area {margin-bottom:1.143rem;} .popup_search_wrap .popup .title_area .title {display:flex; justify-content:space-between; font-size:1.143rem; font-weight:700;} .popup_search_wrap .popup .title_area .title img {width:1.429rem; height:1.429rem;} .popup_search_wrap .popup .input_area {display:flex; align-items:center; position:relative; margin-bottom:2.143rem; width:100%; } .popup_search_wrap .popup .input_area input {padding:0 1.071rem; width:100%; height:3.286rem; border:0; border-radius:0; border-bottom:1px solid #e9e9e9; color:#666; font-size:1rem; transition:all .3s ease;} .popup_search_wrap .popup .input_area input::placeholder {color:#ababab;} .popup_search_wrap .popup .input_area input:focus {border-bottom:1px solid #333;} .popup_search_wrap .popup .input_area img {position:absolute; top:0; right:0 ; margin:0.786rem 1.071rem; width:1.429rem; height:1.429rem;} .popup_search_wrap .popup .list-wrap {overflow-y: scroll;max-height: 320px;} .popup_search_wrap .popup .list {display:flex; flex-direction:column;} .popup_search_wrap .popup .list .box {padding:1.143rem 1.071rem; border-bottom:1px solid #eee;margin: inherit;} .popup_search_wrap .popup .list .box:first-child {border-top:1px solid #ddd;} .popup_search_wrap .popup .list .box .title {padding-bottom:0.571rem; font-weight:600;} .popup_search_wrap .popup .list .box .sub span {padding :0 0.571rem 0.571rem 0.571rem; font-weight:400; text-align:left; color:#e9e9e9;} @media only screen and (max-width:1239px) { .popup_sellgoods_wrap .popup {margin-left:-320px;} } @media only screen and (max-width:640px) { .popup_sellgoods_wrap .popup {left:0; width:100%; margin:0;} } @media (max-width:414px) { .popup_sellgoods_wrap .popup {margin:2.5rem 6% 4.786rem; width:88%; left:0;} } @media only screen and (max-width:1239px) { .popup_search_wrap .popup {margin-left:-320px;} } @media only screen and (max-width:640px) { .popup_search_wrap .popup {left:0; width:100%; margin:0;} } @media (max-width:414px) { .popup_search_wrap .popup {margin:0 6% 4.786rem; width:88%; left:0;} } .display-none {display:none;} .wrap-loading{ position:fixed; top:50%; left:50%; margin:-25px 0 0 -25px; width:50px; height:50px; border:5px solid #e1e1e1; border-radius:50%; border-top:5px solid #fd5000; animation:loader 2s linear infinite; } @keyframes loader {from{transform:rotate(0);} to{transform:rotate(360deg);}} /* 류발주 주문내역 */ .sell_order {background:#fff;} .sell_order {padding:2.500rem 6.25% 4.786rem;} .sell_order .order_01 {display:flex; justify-content:space-between; align-items:center; margin-bottom:2.143rem; width:100%;} .sell_order .order_01 .title {font-size:1.429rem; font-weight:700;} .sell_order .order_02 {margin-bottom:2.143rem; width:100%;} .sell_order .order_02 .title {padding-bottom:1.143rem; font-size:1.143rem; font-weight:700;} .sell_order .order_02 .off {margin-bottom:2.143rem; width:100%; height:3.714rem; border:1px solid #e9e9e9; border-radius:0.571rem; font-weight:700; text-align:center;} .sell_order .order_02 .off a {display:block; line-height:3.714rem;} .sell_order .order_02 .on {margin-bottom:2.143rem; width:100%; height:3.714rem; border:1px solid #fd5000; border-radius:0.571rem; font-weight:700; text-align:center;} .sell_order .order_02 .on a {display:block; line-height:3.714rem; color:#fd5000;} .sell_order .order_03 {margin-bottom:2.143rem; width:100%;} .sell_order .order_03 .title {padding-bottom:1.143rem; font-size:1.143rem; font-weight:700;} .sell_order .order_03 .period {display:flex; justify-content:space-between; align-items:center; margin-bottom:2.143rem; width:100%;} .sell_order .order_03 .period div {width:100%;} .sell_order .order_03 .period div input {width:100%; height:3.286rem; border-color:#dfdfdf; border-radius:0.286rem; padding:0.286rem 1.071rem; border:1px solid #e9e9e9; background:#fff; color:#666; font-size:1rem; transition:all .3s ease; background:url(/_skin/bona/img/mypage/cal.png)no-repeat right 1.171rem center / 0.786rem;} .sell_order .order_03 .period div input::placeholder {color:#ababab;} .sell_order .order_03 .period span {padding:0 0.286rem;} .sell_order .btn_02 {margin-bottom:2.143rem; width:100%; border:1px solid #fd5000; border-radius:0.571rem; background:#fd5000; font-weight:700; text-align:center;} .sell_order .btn_02 a {display:block; line-height:3.714rem; color:#fff;} .sell_order .order_04 {width:100%;} .sell_order .order_04 .list {display:flex; flex-direction:row; justify-content:space-between; align-items:center; padding:1.143rem 0; border-bottom:1px solid #eee; width:100%;} .sell_order .order_04 .list:first-child {border-top:1px solid #333;} .sell_order .order_04 .list .first {display:flex; flex-direction:row; justify-content:space-between; width:100%;} .sell_order .order_04 .list .first .left {} .sell_order .order_04 .list .first .left .date {padding-bottom:0.571rem;} .sell_order .order_04 .list .first .left .date span {padding-right:0.8rem;} .sell_order .order_04 .list .first .left .title {font-size:1.143rem; font-weight:600;} .sell_order .order_04 .list .first .right {display:flex; flex-direction:column;} .sell_order .order_04 .list .first .right .info {padding-bottom:0.571rem;} .sell_order .order_04 .list .first .right .info .box, .sell_order .order_04 .list .first .right .info .ea {font-weight:500; margin: 0;} .sell_order .order_04 .list .first .right .info .box strong, .sell_order .order_04 .list .first .right .info .ea strong {padding-right:0.286rem; font-weight:700;} .sell_order .order_04 .list .first .right .info .sep {padding :0 0.571rem 0.571rem 0.571rem; font-weight:400; text-align:left; color:#e9e9e9;} .sell_order .order_04 .list .first .right .info.noprice {display:flex;align-items:center;padding:0;height:100%;} .sell_order .order_04 .list .first .right .price {text-align:right;} .sell_order .order_04 .list .first .right .price strong {font-size:1.143rem;} .sell_order .order_04 .list .off {margin-left:2.286rem; padding:0 1.143rem; width:5.714rem; height:3rem; border:1px solid #9a9a9a; border-radius:0.571rem; font-weight:700; text-align:center; line-height:3rem;} .sell_order .order_04 .list .off a {display:block; line-height:3rem;} .sell_order .order_04 .list .on {margin-left:2.286rem; padding:0 1.143rem; width:5.714rem; height:3rem; border:1px solid #fd5000; border-radius:0.571rem; font-weight:700; text-align:center; line-height:3rem;} .sell_order .order_04 .list .on a {display:block; line-height:3rem; color:#fd5000;} @media (max-width:414px) { .sell_order .order_04 .list {flex-direction:column;} .sell_order .order_04 .list .first {margin-bottom:1.143rem;} .sell_order .order_04 .list .off {margin-left:0; width:100%;} .sell_order .order_04 .list .on {margin-left:0; width:100%;} } .popup_sellorder_wrap {display:none;z-index:41; align-items:center; position:fixed; width:100%; height:100vh; top:0; left:0; right:0; bottom:0; background-color:rgba(0,0,0,.5); z-index:100;} .popup_sellorder_wrap .popup {padding:2.143rem; background:#fff; border-radius:0.571rem; position:absolute; top:50%; left:50%; width:600px; margin:1rem 20px 0; transform:translate(0 ,-50%);} @media (max-width:414px) { .popup_sellorder_wrap .popup {margin:2.5rem 6.25% 4.786rem;} } .popup_sellorder_wrap .popup .head {display:flex; justify-content:space-between; border-top:1px solid #333; padding:1.143rem 0; border-bottom:1px dotted #333;} .popup_sellorder_wrap .popup .head .first {display:flex; justify-content:space-between; width:100%;} .popup_sellorder_wrap .popup .head .first .left {width:100%; text-align:center;} .popup_sellorder_wrap .popup .head .first .right {width:40%;text-align:center;} .popup_sellorder_wrap .popup .head .first .right span {display:inline-block; padding:0 1.6rem; color:#e9e9e9;} .popup_sellorder_wrap .popup .head .last {margin-left:1rem; width:0;} .popup_sellorder_wrap .popup .list {display:flex; flex-direction:row; justify-content:space-between; align-items:center; padding:1.143rem 0; border-bottom:1px solid #eee; width:100%;} .popup_sellorder_wrap .popup .list:first-child {} .popup_sellorder_wrap .popup .list .first {display:flex; flex-direction:row; justify-content:space-between; width:100%;} .popup_sellorder_wrap .popup .list .first .left {} .popup_sellorder_wrap .popup .list .first .left .date {padding-bottom:0.571rem;} .popup_sellorder_wrap .popup .list .first .left .title {font-size:1.143rem; font-weight:600;} .popup_sellorder_wrap .popup .list .first .right {display:flex; flex-direction:column;} .popup_sellorder_wrap .popup .list .first .right .info {padding-bottom:0.571rem;} .popup_sellorder_wrap .popup .list .first .right .info .box, .popup_sellorder_wrap .popup .list .first .right .info .ea {font-weight:500;margin: 0;} .popup_sellorder_wrap .popup .list .first .right .info .box strong, .popup_sellorder_wrap .popup .list .first .right .info .ea strong {padding-right:0.286rem; font-weight:700;} .popup_sellorder_wrap .popup .list .first .right .info .sep {padding :0 0.571rem 0.571rem 0.571rem; font-weight:400; text-align:left; color:#e9e9e9;} .popup_sellorder_wrap .popup .list .first .right .info.noprice {display:flex;align-items:center;padding:0;height:100%;} .popup_sellorder_wrap .popup .list .first .right .price {text-align:right;} .popup_sellorder_wrap .popup .list .first .right .price strong {font-size:1.143rem;} .popup_sellorder_wrap .popup .list .off {margin-left:2.286rem; padding:0 1.143rem; width:5.714rem; height:3.714rem; border:1px solid #9a9a9a; border-radius:0.571rem; font-weight:700; text-align:center; line-height:3.714rem;} .popup_sellorder_wrap .popup .list .off a {display:block; line-height:3.714rem;} .popup_sellorder_wrap .popup .list .on {margin-left:2.286rem; padding:0 1.143rem; width:5.714rem; height:3.714rem; border:1px solid #fd5000; border-radius:0.571rem; font-weight:700; text-align:center; line-height:3.714rem;} .popup_sellorder_wrap .popup .list .on a {display:block; line-height:3.714rem; color:#fd5000;} @media (max-width:414px) { .popup_sellorder_wrap .popup .list .first {margin-bottom:1.143rem;} .popup_sellorder_wrap .popup .list .off {margin-left:0; width:100%;} .popup_sellorder_wrap .popup .list .on {margin-left:0; width:100%;} .popup_sellorder_wrap .popup .head .first .right span {padding:0 0.8rem;} } .popup_sellorder_wrap .popup .foot {display:flex; justify-content:space-between; padding:1.143rem; border-bottom:1px dotted #ddd; background:#f6f6f6;} .popup_sellorder_wrap .popup .foot .first {display:flex; justify-content:space-between; width:100%; font-weight:700;} .popup_sellorder_wrap .popup .foot .first .left {width:100%;} .popup_sellorder_wrap .popup .foot .first .right {width:30%; text-align:center;} .popup_sellorder_wrap .popup .foot .first .right strong#sal_sum_box_qty {color:#fd5000;} .popup_sellorder_wrap .popup .foot .first .right span {display:inline-block; padding:0 1.6rem; color:#e9e9e9;} .popup_sellorder_wrap .popup .foot .last {margin-left:0; width:0;} .popup_sellorder_wrap .popup .sum {display:flex; justify-content:space-between; padding:1.143rem; border-bottom:1px solid #ddd; font-weight:700; background:#f6f6f6;} .popup_sellorder_wrap .popup .sum strong {font-size:1.143rem; color:#fd5000;} @media (max-width:414px) { .popup_sellorder_wrap .popup .head .last, .popup_sellorder_wrap .popup .foot .last {margin-left:0; width:0;} .popup_sellorder_wrap .popup .list {flex-direction:column; margin-bottom:1.143rem;} .popup_sellorder_wrap .popup .list .off {margin-left:0; width:100%;} .popup_sellorder_wrap .popup .list .on {margin-left:0; width:100%;} .popup_sellorder_wrap .popup .foot .first .right {width:24%;} .popup_sellorder_wrap .popup .foot .first .right span {display:inline-block; padding:0 0.8rem;} } .popup_sellorder_wrap .popup .btn_area {display:flex; justify-content:flex-end; margin-top:1.143rem;} .popup_sellorder_wrap .popup .btn_area img {width:1.429rem; height:1.429rem;} @media (max-width:414px) { .middle {overflow:scroll; padding:0 2rem 0 0;} /* 수정 230803 - 푸터위치수정 */ } @media only screen and (max-width:1239px) { .popup_sellorder_wrap .popup {margin-left:-320px;} } @media only screen and (max-width:640px) { .popup_sellorder_wrap .popup {left:0; width:100%; margin:0;} } @media (max-width:414px) { .popup_sellorder_wrap .popup {margin:0 6% 4.786rem; width:88%; left:0;} } /* 겟주 이용 가이드 추가 */ .guide {width:45.714rem;} .guide img {width:100%;} .guide .guide_area {display:flex; gap:2.857rem; padding:2.143rem 2.857rem;} .guide .guide_area .img {width:9.143rem;} .guide .guide_area .txt p {font-size:2.857rem; line-height:3.143rem; color:#333; word-break:keep-all;} .guide .guide_area .txt p strong {font-size:2.857rem; line-height:3.143rem; font-weight:600; color:#fd5000; word-break:keep-all;} .guide .guide_area .txt p.text {font-size:1.214rem; line-height:3rem; color:#333; word-break:keep-all;} .guide .guide_order {width:100%; border-top:1px solid #e6e6e6; border-bottom:1px solid #e6e6e6;} .guide .guide_order .guide_inner {padding:5.714rem 2.857rem;} .guide .guide_order .guide_inner .title {margin-bottom:2.857rem; font-size:2.286rem; font-weight:700; text-align:center;} .guide .guide_order .guide_inner .process {display:flex; justify-content:space-between;} .guide .guide_order .guide_inner .process .rec {display:flex; flex-direction:column; align-items:center;} .guide .guide_order .guide_inner .process .rec img {width:9.143rem;} .guide .guide_order .guide_inner .process .rec p {font-size:1.429rem; font-weight:500; word-break:keep-all;} .guide .guide_order .guide_inner .process .arr {padding-top:4rem;} .guide .guide_order .guide_inner .process .arr img {width:0.857rem;} .guide .guide_order .guide_inner .notice {margin-top:2.857rem; padding:1.143rem 0; border-radius:1.143rem; background:#f6f6f6;} .guide .guide_order .guide_inner .notice p {font-size:1.143rem; font-weight:400; text-align:center; color:#888; word-break:keep-all;} .guide .tl {display:flex; align-items:center; gap:2.286rem; padding:2.143rem 2.857rem 2.143rem; background:#fd5000;} .guide .tl img {margin-top:-2.143rem; width:6.857rem;} .guide .tl p {font-size:1.714rem; line-height:3rem; font-weight:800; color:#fff;} .guide .guide_section {padding:2.857rem;} .guide .guide_section .speech_01 {display:flex; align-items:center; align-items:flex-end; gap:2.286rem; margin-bottom:1.143rem; margin-left:1.143rem;} .guide .guide_section .speech_01 .bubble {padding:2.143rem 2.857rem; width:100%; border-radius:2.286rem; background:#fde2d1;} .guide .guide_section .speech_01 .bubble p {font-size:1.143rem; line-height:26px; font-weight:400; color:#333; word-break:keep-all;} .guide .guide_section .speech_01:last-child {margin-bottom:0;} .guide .guide_section .speech_02 {display:flex; align-items:center; align-items:flex-end; gap:2.286rem; margin-bottom:1.143rem; margin-right:1.143rem;} .guide .guide_section .speech_02 .bubble {padding:2.143rem 2.857rem; width:100%; border-radius:2.286rem; background:#e7f3cd;} .guide .guide_section .speech_02 .bubble p {font-size:1.143rem; line-height:26px; font-weight:400; color:#333; word-break:keep-all;} .guide .guide_section .speech_02:last-child {margin-bottom:0;} .guide .guide_section .speech_03 {display:flex; align-items:center; align-items:flex-end; gap:2.286rem; margin-bottom:1.143rem; margin-left:1.143rem;} .guide .guide_section .speech_03 .bubble {padding:2.143rem 2.857rem; width:100%; border-radius:2.286rem; background:#caf3f3;} .guide .guide_section .speech_03 .bubble p {font-size:1.143rem; line-height:26px; font-weight:400; color:#333; word-break:keep-all;} .guide .guide_section .speech_03:last-child {margin-bottom:0;} .guide .guide_section .speech_04 {display:flex; align-items:center; align-items:flex-end; gap:2.286rem; margin-bottom:1.143rem; margin-right:1.143rem;} .guide .guide_section .speech_04 .bubble {padding:2.143rem 2.857rem; width:100%; border-radius:2.286rem; background:#fbfcd5;} .guide .guide_section .speech_04 .bubble p {font-size:1.143rem; line-height:26px; font-weight:400; color:#333; word-break:keep-all;} .guide .guide_section .speech_04:last-child {margin-bottom:0;} .guide .guide_section .speech_01 img, .guide .guide_section .speech_02 img, .guide .guide_section .speech_03 img, .guide .guide_section .speech_04 img {width:6.857rem;} .guide .guide_section .img {margin-bottom:2.143rem;} .guide .guide_section .img:last-child {margin-bottom:0;} .guide .bg {background:#f9f9f9;} .guide .guide_section .guide_icon {display:flex; justify-content:space-between; margin-bottom:2.857rem; padding:2.143rem 2.857rem; border-radius:1.143rem; background:#fff;} .guide .guide_section .guide_icon span {font-size:1.143rem; font-weight:600;} .guide .guide_section .guide_icon div {display:flex; align-items:center; gap:1.143rem;} .guide .guide_section .guide_icon div img {width:4.571rem;} @media (max-width:1024px) { .guide {width:100%;} .guide .tl p {display:inline-block;} } @media (max-width:768px) { .guide {width:100%;} .guide .guide_section .img {width:100%;} } @media (max-width:440px) { .guide img {width:100%;} .guide .guide_area .img {width:24%;} .guide .guide_area {gap:1.143rem;} .guide .guide_area .txt p {font-size:1.714rem; line-height:2rem;} .guide .guide_area .txt p strong {font-size:1.714rem; line-height:2rem; font-weight:700;} .guide .guide_area .txt p.text {font-size:1rem;} .guide .guide_order .guide_inner {padding:2.857rem;} .guide .guide_order .guide_inner .title {margin-bottom:1.143rem;} .guide .guide_order .guide_inner .process .rec img {width:90%;} .guide .guide_order .guide_inner .process .rec p {font-size:1.143rem; line-height:2.571rem;} .guide .guide_order .guide_inner .process .arr {padding-top:2.286rem;} .guide .guide_order .guide_inner .process .arr img {width:0.571rem;} .guide .guide_order .guide_inner .notice {margin-top:1.429rem; padding:1.143rem} .guide .guide_order .guide_inner .notice p {font-size:1rem;} .guide .tl {gap:1.143rem; padding:1.143rem 2.857rem;} .guide .tl img {margin-top:-1.143rem; width:16%;} .guide .tl p {font-size:1.286rem; line-height:1.857rem;} .guide .guide_section .speech_01, .guide .guide_section .speech_02, .guide .guide_section .speech_03, .guide .guide_section .speech_04 {align-items:flex-start; gap:1.143rem;} .guide .guide_section .speech_01 img, .guide .guide_section .speech_02 img, .guide .guide_section .speech_03 img, .guide .guide_section .speech_04 img {width:16%} .guide .guide_section .speech_01 .bubble, .guide .guide_section .speech_02 .bubble, .guide .guide_section .speech_03 .bubble, .guide .guide_section .speech_04 .bubble {padding:1.143rem 1.429rem; border-radius:1.143rem;} .guide .guide_section .speech_01 .bubble p, .guide .guide_section .speech_02 .bubble p, .guide .guide_section .speech_03 .bubble p, .guide .guide_section .speech_04 .bubble p {font-size:1rem; line-height:1.714rem;} .guide .guide_section .guide_icon {margin-bottom:2.857rem; padding:1.143rem 1.429rem; justify-content:space-evenly;} .guide .guide_section .guide_icon span {font-size:1rem;} .guide .guide_section .guide_icon div img {width:4rem;} .guide .guide_section .guide_icon div {gap:0; flex-direction:column;} .guide .guide_bottom .rec span, .guide .guide_bottom .rec p {font-size:0.929rem;} } @media (max-width:412px) { .guide .guide_area .txt p.text {font-size:0.929rem; line-height:2rem;} .guide .guide_order .guide_inner .tl {margin-bottom:1.429rem;} .guide .guide_order .guide_inner .notice p {font-size:0.929rem;} .guide .guide_section .tl p {font-size:1.143rem; line-height:1.571rem;} } @media (max-width:390px) { .guide .guide_area .txt p {font-size:1.429rem; line-height:2rem;} .guide .guide_area .txt p strong {font-size:1.429rem; line-height:2rem;} .guide .guide_area .txt p.text {font-size:0.786rem; line-height:2rem;} .guide .guide_order .guide_inner .tl {margin-bottom:1.429rem; font-size:1.429rem;} .guide .guide_order .guide_inner .process .arr {padding-top:1.429rem;} .guide .guide_order .guide_inner .process .rec p {font-size:1rem;} .guide .guide_order .guide_inner .notice {padding:1.143rem;} .guide .guide_order .guide_inner .notice p {font-size:0.929rem;} .guide .guide_order .guide_inner .notice p .mo {display:none;} .guide .guide_section .tl {border-radius:1.143rem;} .guide .guide_section .tl img {margin-top:-0.857rem; width:14%;} .guide .guide_section .tl p {font-size:1rem; line-height:1.286rem;} .guide .guide_section .guide_icon div img {width:3.429rem;} .guide .guide_section .guide_icon span {font-size:1rem;} .guide .guide_section .speech_01 img, .guide .guide_section .speech_02 img, .guide .guide_section .speech_03 img, .guide .guide_section .speech_04 img {width:14%;} .guide .guide_section .speech_01, .guide .guide_section .speech_02, .guide .guide_section .speech_03, .guide .guide_section .speech_04 {gap:8px; margin-left:0; margin-right:0;} .guide .guide_section .speech_01 .bubble p, .guide .guide_section .speech_02 .bubble p, .guide .guide_section .speech_03 .bubble p, .guide .guide_section .speech_04 .bubble p {line-height:inherit;} } /* 프로모션 - 그랜드오픈 */ #event { width: 100%; } #event img { display:block; width: 100%; height:100%; vertical-align:top; } #event .thum { display: flex; justify-content: space-between; padding: 0 5.3%; background:#fff6df; } #event .thum { flex-wrap: wrap; } #event .thum a { margin-bottom: 4%; width: 48%; } #event .hide { position: relative; } #event .hide .hide_img { position: absolute; top:0; left:0; right: 0; bottom:0; } #event .second { background:#fd5000; } @media (max-width:1024px) { #event { width: 100%; } } @media (max-width:440px) { #event { width: 100%; } } /* 프로모션 - 위클리핫딜 */ #weekly { width: 640px; } #weekly img { display:block; width: 100%; vertical-align:top; } #weekly .rolling { position:relative; background:#0A0A0A; } #weekly .rolling .list { position:relative; } #weekly .rolling .list .time { position:absolute;top:12%;z-index:1;width:100%;font-size: 2.6rem; font-weight: 700;text-align:center;color:#fff; } #weekly .rolling .list .time .soon { position:absolute; top:12%; margin-top: 4px; z-index:1;width:100%;font-size: 2.6rem;font-weight: 700;text-align:center;color:#fff; } #weekly .rolling .list .time span { display:inline-block; margin-top:- 10px; margin-right: 16px; padding: 8px 24px; border-radius: 60px; font-size: 2rem; font-weight: 700; background:#fd5000; color:#fff; } #weekly .rolling .pgn { position:absolute;bottom:21%;z-index:1; display:flex;justify-content:center;gap:20px;width: 100%; } #weekly .rolling .pgn .swiper-pagination-bullet-active { width:1.143rem;height:1.143rem;border-radius:32px;background:#fff; } #weekly .rolling .pgn .swiper-pagination-bullet { width:1.143rem;height:1.143rem;border-radius:32px;border:2px solid #fff; } @media (max-width:1024px) { #weekly { width: 100%; } #weekly .rolling .list .time { top:11%; font-size: 3.6rem;} #weekly .rolling .list .time .soon { top:11%; font-size: 4rem;} #weekly .rolling .list .time span { margin-top:- 10px; } } @media (max-width:768px) { #weekly { width: 100%; } #weekly .rolling .list .time { top:11%; font-size: 3.6rem;} #weekly .rolling .list .time .soon { top:11%; font-size: 4rem;} } @media (max-width:440px) { #weekly { width: 100%; } #weekly .rolling .list .time, #weekly .rolling .list .time .soon { top:11%; font-size: 2.8rem;} #weekly .rolling .list .time span { font-size: 2rem; } #weekly .rolling .pgn { gap:16px } #weekly .rolling .pgn .on, #weekly .rolling .pgn .off { width:0.75rem;height:0.75rem; } } @media (max-width:414px) { #weekly { width: 100%; } #weekly .rolling .list .time, #weekly .rolling .list .time .soon { top:11%; font-size: 3rem;} #weekly .rolling .list .time span { padding: 4px 12px; font-size: 2rem; } } @media (max-width:360px) { #weekly { width: 100%; } #weekly .rolling .list .time, #weekly .rolling .list .time .soon { top:11%; font-size: 2.8rem;} #weekly .rolling .list .time span { font-size: 1.8rem; } } /* 맵 - 할인쿠폰팝업 20231013 */ #menu_dc_coupon { position: fixed; top: 0; left: 0; z-index: 1000; width: 100%; height: 100vh; background: rgba(0,0,0,0.3); display:none; } #menu_dc_coupon .menu_coupon_wrap { position: absolute; top: 50%; left: 50%; width: 640px; transform: translate(0 ,-50%); } #menu_dc_coupon .menu_coupon { margin: 0 auto; width: 260px; } #menu_dc_coupon .coupon_wrap { padding: 16px 16px 8px; border-radius: 16px 16px 0 0; background: #fd5000; } #menu_dc_coupon .coupon_wrap h3 { margin-bottom: 8px; font-size:28px; font-weight: 700; letter-spacing: -0.18px; text-align: center; color: #fff; } #menu_dc_coupon .coupon_wrap .coupon_card { position: relative; z-index: 0; } #menu_dc_coupon .coupon_wrap .coupon_card .coupon { z-index: 1; margin: 0 8px; width: auto; border-radius: 16px 16px 0 0; background: #fff; } #menu_dc_coupon .coupon_wrap .coupon_card .coupon p { display: flex; align-items: center; justify-content: center; padding: 16px 0; font-family: 'Manrope'; font-size: 42px; font-weight: 800; letter-spacing: -1px; } #menu_dc_coupon .coupon_wrap .coupon_card .coupon p span { font-size: 32px; fint-weight: 800; } #menu_dc_coupon .coupon_wrap .coupon_card .bar { position: absolute; left: 0; right: 0; bottom: 0; z-index: -1; width: 100%; height: 16px; border-radius: 16px; background: #333; } #menu_dc_coupon .txt_wrap { padding: 16px 16px 24px; border-radius: 0 0 16px 16px; background: #fff; } #menu_dc_coupon .txt_wrap p { display: flex; align-items: flex-start; gap: 4px; height: auto; font-size: 14px; } #menu_dc_coupon .txt_wrap p:last-child { margin-bottom: 0; } #menu_dc_coupon .txt_wrap p span.box { display: inline-block; margin-top: 8px; width: 4px !important; height: 4px; background: #111; } @media only screen and (max-width:1239px) { #menu_dc_coupon .menu_coupon_wrap {margin-left:-320px;} } @media only screen and (max-width:640px) { #menu_dc_coupon .menu_coupon_wrap {left:0; width:100%; margin:0;} } @media only screen and (max-width:440px) { #menu_dc_coupon .menu_coupon_wrap { position: fixed; top: 50%; left: 0%; width: 100%; transform: translate(0 , -50%); } #menu_dc_coupon .menu_coupon { margin: 0 auto; width: 60%; } #menu_dc_coupon .coupon_wrap { padding: 16px 8px 8px; border-radius: 8px 8px 0 0; } #menu_dc_coupon .coupon_wrap h3 { margin-bottom: 8px; font-size:24px; } #menu_dc_coupon .coupon_wrap .coupon_card { position: relative; z-index: 0; } #menu_dc_coupon .coupon_wrap .coupon_card .coupon { margin: 0 8px; border-radius: 8px 8px 0 0; } #menu_dc_coupon .coupon_wrap .coupon_card .coupon p { padding: 16px 0; font-size: 32px; } #menu_dc_coupon .coupon_wrap .coupon_card .coupon p span { font-size: 24px; } #menu_dc_coupon .coupon_wrap .coupon_card .bar { height: 12px; border-radius: 12px; } #menu_dc_coupon .txt_wrap { padding: 8px; border-radius: 0 0 8px 8px; } } @media only screen and (max-width:360px) { #menu_dc_coupon .menu_coupon { width: 72%; } #menu_dc_coupon .txt_wrap {padding: 16px 16px 16px 16px} #menu_dc_coupon .coupon_wrap .coupon_card .coupon {margin: 0 8px; } } /* 맵 - 툴팁 20231013 */ #mapwrap .customevent { position: relative; bottom: 93px; left: 10px; width: auto; padding: 5px 12px; border-radius: 4px; background: #6F8A6B; font-size: 0.929rem; line-height: 1.3rem; text-align: center; color: #fff; } #mapwrap .customevent p { display: flex; flex-wrap: nowrap;justify-content: center;gap: 8px;align-items: center;font-size: 0.875rem;line-height: 1.1rem;color: #fff;} #mapwrap .customevent img { width: 16px; height: 16px; } #mapwrap .customevent.off { bottom: 93px; left: 10px; padding: 5px 12px; width: auto; } #mapwrap .customevent.on { bottom: 93px; left: 10px; padding: 5px 12px; width: auto; } #mapwrap .customevent:after { position: absolute; bottom: -0.38rem; left:47%; width:0.643rem; height:0.429rem; margin-left:-0.286rem; background:url('/_skin/bona/img/etc/custom_after.png')no-repeat center/0.643rem; content:'';} #mapwrap .customout { position: relative; bottom: 70px; left: -16px; width: auto; padding: 5px 12px; border-radius: 4px; background: #6F8A6B; font-size: 0.929rem; line-height: 1.3rem; text-align: center; color: #fff; } #mapwrap .customout:after { position: absolute; bottom: -0.38rem; left:50%; width:0.643rem; height:0.429rem; margin-left:-0.286rem; background:url('/_skin/bona/img/etc/custom_after.png')no-repeat center/0.643rem; content:'';} @media (max-width:430px) { #mapwrap .customevent.on { left: 10px; } #mapwrap .customevent.price_off { left: -44px; } #mapwrap .customevent.price_on { left: -49px; } } /* 2024 - CSS 추가사항 */ :root { --Colour-Grey-WHITE: #FFF; --Colour-Brand-PRIMARY: #FD5000; --Colour-Grey-txt-secondary: #ABABAB; --Colour-Grey-txt: #333;--Colour-Grey-txt-point: #111; --Colour-Grey-txt-sub: #888; --Colour-Grey-bg-footer: #F6F6F6; --Colour-Grey-line: #E3E3E3; --Colour-Grey-bg: #EFECEA; --Colour-Grey-bg-light: #F9F9F9;--Colour-Grey-line-sub: #EEE; --Colour-Secondary: #6F8A6B; --Colour-Brand-TXTPICKBG: #ff002f; --Colour-Brand-Blue: #4FA6DD; --hover-brightness:1; --active-brightness:.98; } .cursorPointer { cursor: pointer; } .content-box {padding: 1.724rem 6.25%; display: flex; width: 100%; min-height: 5rem; overflow: hidden; background: var(--Colour-Grey-WHITE, #FFF); flex-direction: column; align-items: flex-start; gap: 2.5714rem;} .content-box-compact {padding: 1.142rem 6.25%; display: flex; width: 100%; overflow: hidden; background: var(--Colour-Grey-WHITE, #FFF); flex-direction: column; align-items: flex-start; gap: 2.5714rem;} .divid-row-thick {background-color: var(--Colour-Grey-bg); height: 1rem;display: block;} .col-box { width: 100%; display: flex; justify-content: space-between; align-items: center; flex-shrink: 0; gap:.5714rem;} .col-box.bigger-gap {gap:2.5714rem;} .col-1 { width:8.3%; display:inline-block} .col-2 { width:16%; display:inline-block} .col-3 { width:25%; display:inline-block} .col-4 { width:40%; display:inline-block} .col-5 { width:41.5%; display:inline-block } .col-6 { width:49.5%; display:inline-block } .col-8 { width:60%; display:inline-block } .col-9 { width:75%; display:inline-block} .col-10 { width:83%; display:inline-block } .col-11 { width:91.6%; display:inline-block} .col-center {justify-content: center;} .single-line {width: 100%; display: flex; justify-content: space-between; align-items: center; flex-shrink: 0; gap:.5714rem;} .single-line h4 {margin-bottom:0 ;} h4 {margin-bottom: 1.142rem; font-weight: 600; font-size: 1.285rem;} .m-b-1 {margin-bottom: 1.071rem;} .box-msg {text-align: center; font-size: 1.2rem;} .btn {display:flex; align-items: center; justify-content: center; border-radius: 8px; white-space: nowrap; box-sizing: border-box; cursor: hand;gap:.571rem;} .btn-primary {background-color: var(--Colour-Brand-PRIMARY); border: 2px solid var(--Colour-Brand-PRIMARY); color: var(--Colour-Grey-WHITE); font-size: 1.14rem; line-height: 1.1rem; font-weight: 700;padding: 0.8rem; } .btn-primary:hover {color: var(--Colour-Grey-WHITE);} .btn-primary-grey {background-color: var(--Colour-Grey-bg-light); border: 2px solid var(--Colour-Grey-bg-light); color: var(--Colour-Grey-txt); padding: 0.8rem; font-size: 1.14rem; font-weight: 700; line-height: 1rem;} .btn-primary-grey:hover {border-color:var(--Colour-Grey-bg); color: var(--Colour-Grey-txt-point);} .btn-primary-white {background-color: var(--Colour-Grey-WHITE); border: 2px solid var(--Colour-Grey-WHITE); color: var(--Colour-Grey-txt); padding: 0.8rem; font-size: 1.14rem; font-weight: 700; line-height: 1rem;} .btn-primary-line {border: 2px solid var(--Colour-Brand-PRIMARY); color: var(--Colour-Brand-PRIMARY); font-size: 1.14rem; font-weight: 700;padding: 0.8rem; } .btn-secondary {padding: 0.857rem 0.5714rem; border: 1px solid var(--Colour-Grey-txt-secondary, #ABABAB); color: var(--Colour-Grey-txt, #333); line-height: 1rem;} .btn-secondary[value="selected"] { font-weight: 700; border: 1px solid var(--Colour-Brand-PRIMARY, #FD5000); color: var(--Colour-Brand-PRIMARY, #FD5000); } .btn-secondary-light {padding: 0.5714rem; border: 1px solid var(--Colour-Grey-line); color: var(--Colour-Grey-txt, #333); line-height: 1rem;} .btn-thirdly { display:block; border: 1px solid var(--Colour-Grey-txt-secondary); border-radius:4px; padding: .57rem; color: var(--Colour-Grey-txt-sub); font-size: .92rem; line-height: .9rem;} .btn-thirdly-active { display:block; border: 1px solid var(--Colour-Secondary); background-color: var(--Colour-Secondary); border-radius:4px; padding: .57rem; color: var(--Colour-Grey-WHITE); font-size: .92rem; line-height: .9rem;} .btn-thirdly:hover {border-color: var(--Colour-Secondary); filter: brightness(var(--hover-brightness)); color: var(--Colour-Secondary);} .btn-thirdly-active:hover {border-color: var(--Colour-Secondary); filter: brightness(var(--hover-brightness)); color: var(--Colour-Grey-WHITE);} .btn-bg { background-color: var(--Colour-Grey-bg); padding: 0.5714rem 0.857rem; border: none; color: var(--Colour-Grey-txt, #333); font-weight: 600; line-height: 1rem; width: fit-content;} .btn-line {padding: 0.5714rem; border: 1px solid var(--Colour-Grey-txt, #333); color: var(--Colour-Grey-txt, #333); font-weight: 700; } .btn-round {border-radius: 2rem;} .btn-line:hover {border: 1px solid var(--Colour-Brand-PRIMARY); color: var(--Colour-Brand-PRIMARY);} .btn-line-grey {border: 1px solid var(--Colour-Grey-line); padding: 0.5714rem; color:var(--Colour-Grey-txt-secondary); font-weight: normal; background-color: var(--Colour-Grey-bg); } .btn-icon-grey {background-color: var(--Colour-Grey-bg-light); color: var(--Colour-Grey-txt); padding: 0.4rem;} .btn-icon-grey:hover {background-color: var(--Colour-Grey-bg); color: var(--Colour-Grey-txt-point);} .btn-group {display:flex; align-items: center; justify-content: flex-start; flex-wrap: nowrap; flex-direction: row;gap: .285rem;} .align-right {display: flex; flex-direction: row-reverse;} .btn-s {line-height: 0; padding: .5714rem; color: var(--Colour-Grey-txt-sub);} .btn-l {padding: 1.142rem; font-weight: 600; font-size: 1.1rem; line-height: 1.1rem;} .btn-dropdown {display:flex; align-items: center; justify-content:baseline; gap: .5714rem; padding: .6rem; color: var(--Colour-Grey-txt-secondary);padding-right: 0;} .btn-dropdown:hover {color: var(--Colour-Grey-txt);} .btn-wide {width: 100%;;} .btn-more {gap:.5714rem; background-color: var(--Colour-Brand-PRIMARY); color: var(--Colour-Grey-WHITE); font-size: 1.07rem; padding: .5714rem 1rem; border-radius:1.5714rem ;} .btn-more:hover{ color: var(--Colour-Grey-WHITE);} input, select, textarea {display: flex; padding: 0.5714rem; min-height: 3rem; align-items: center; justify-content: center; border: 1px solid var(--Colour-Grey-line, #ABABAB); color: var(--Colour-Grey-txt, #333); white-space: nowrap; box-sizing: border-box; width: 100%; border-radius: 8px;} input:focus, select:focus, textarea:focus {border-color: var(--Colour-Brand-PRIMARY);} input[type="time"], input[type="text"] {width: 100%; border-radius: 8px;} input:disabled, select:disabled, input.unit-percent:disabled, input.unit-ml:disabled {border: 1px solid var(--Colour-Grey-line, #E3E3E3); color: var(--Colour-Grey-txt-secondary, #ABABAB); background-color:var(--Colour-Grey-bg-footer, #F6F6F6) ;} input.input-reverse {text-align: right;} input.unit-ml {background: url(img/text-ml.png) no-repeat 95% center; } input.unit-percent {background: url(img/text-percent.png) no-repeat 95% center; } .text-s {color: var(--Colour-Grey-txt-secondary); font-size: smaller;} .text-l { font-size: 1.285rem; font-weight: 700;} .txt-right {text-align: right;} .color-primary {color: var(--Colour-Brand-PRIMARY);} .bg-box {background-color: var(--Colour-Grey-bg-light); border-radius: 1rem; width:100%; padding: 1.142rem;} .lay-btw {display: flex; justify-content: space-between; align-items: center;} .lay-row {display: flex; justify-content:flex-start; align-items: baseline; gap:1rem;} .box_search form .box .btn, .pbig_section .pbig_search form .box .btn {padding: 0; border: none; min-height: inherit;} #shop_info2 > .info {padding:1.643rem 6.25%;} #shop_info2 > .info .single-line {align-items: flex-start;} #shop_info2 > .info .btn {padding: .57rem;} #shop_info2 > .info ul > li {display: flex; justify-content: flex-start;align-items: center; gap: 1.143rem; padding-left: 0; margin-bottom: .5714rem;font-weight: 400; font-size: 1.071rem;} #shop_info2 > .info li > label {color: var(--Colour-Grey-txt-sub); min-width: 5rem; text-wrap: nowrap;} .store-img {position: relative;} .btn-circle {background-color: var(--Colour-Grey-WHITE); border-radius: 50%; width: inherit; padding: .5714rem; display: inline-block;} .btn-float-rt {position: absolute; right:1.142rem; top:1.142rem;} #product-list-state { background-color: var(--Colour-Grey-bg);} .product-list {width:100%} .tab {display:flex; align-items: center; justify-content: center; white-space: nowrap; box-sizing: border-box; cursor: hand; font-size: 1.14rem; font-weight: 700;padding: 1.4rem;} .tab-header {color: var(--Colour-Grey-txt-secondary); } .tab-header-active {color: var(--Colour-Brand-PRIMARY); } .divide {display:inline-block; background-color: var(--Colour-Grey-txt-secondary); width: 1px; height: 2rem;} .nav {background-color: var(--Colour-Grey-WHITE);} .nav > ol {width: 100%; display: flex; align-items: center; flex-shrink: 0;font-size: 1.14rem; overflow: hidden; padding-left:20px ;} .tab-menu {color: var(--Colour-Grey-txt-secondary); font-weight: normal; } .tab-menu-active {color: var(--Colour-Grey-txt-point); flex-direction: column} .tab-menu-active::after {content:''; background-color: var(--Colour-Brand-PRIMARY); flex-direction: column; height: 3px; width:100%; } .content-box > .box {margin: 0; width: 100%;} .box .item-box > div {margin-bottom: .5714rem;} .box > div {margin-bottom: .5714rem;} .box > div.store-info-box, .box > div.product-info-box {margin-bottom: 1.714rem;} .box > div.store-info-box:last-child {margin-bottom: 0;} .box_search .box > div {margin-bottom:0;} .content-box > .box .item-box {margin-bottom: 1.7rem;} .content-box h2, .content-box-compact h2 { font-size: 1.28rem; margin-bottom: 1.142rem; } .content-box h3, .content-box-compact h3 {margin-bottom: 1rem; font-size: 1.429rem;} .content-box .single-line h3, .content-box-compact .single-line h3 {margin-bottom:0;} .ordered-info-box {border: 1px solid var(--Colour-Grey-line-sub); border-radius: 1.142rem;} .ordered-shop-box {background-color: var(--Colour-Grey-bg-light); border-radius: 1.142rem 1.142rem 0 0; padding: 1.142rem;} .ordered-shop-name {font-weight: 700;} .ordered-shop-add {color: var(--Colour-Grey-txt-sub);} .ordered-detail-box { padding: 1.142rem;} .ordered-detail-box > strong {color: var(--Colour-Brand-PRIMARY);margin-bottom: .572rem; display: inline-block;} .ordered-detail-box .img-box > img {height: auto; width: 100%;} .ordered-detail-box .product-info-box {margin-bottom: 0;} .ordered-detail-box .info-box .prodcut-name {font-weight: 500;} .ordered-detail-box .info-box {display: flex; gap: .5714rem; flex-direction: column; font-size: 1.07rem;} .ordered-detail-box .info-box label {color: var(--Colour-Grey-txt-sub);margin-right: .5714rem; font-size: 1rem;} .product-sort {display:flex; align-items: center; justify-content:space-between; margin-bottom: 1.143rem; width: 100%;} .product-sort p {color: var(--Colour-Grey-txt-secondary);} .product-sort strong { color: var(--Colour-Grey-txt, #333); font-weight: normal;} .content-box .product-sort h3 {margin: 0;} .product-sort.single-oline {margin-bottom: 1.412rem;} .product-info-box { align-items: flex-start; margin-bottom: 1.714rem; vertical-align: top;} .product-info-box.col-half {margin-right: 5%; width: calc(50% - 3%); display: inline-block; gap: 1.14rem;} .product-info-box.col-half:nth-child(even) { margin-right: 0;} .product-info-box.col-half > .product-info {padding:0; margin-top: 1.14rem} .product-img {align-items: flex-start; display: flex; border-radius: 1rem; background-color: var(--Colour-Grey-bg-light);border-radius: .517rem;overflow: hidden;} .product-img img {width:100%} .img-box {align-items: flex-start; display: flex; flex-direction: column; position: relative; border: 1rem; width: 100%;} .img-box > img {width: 100%; height: 280px;} .img-box .item-info {padding: 1.14rem; position: absolute;display:flex; align-items: center; justify-content:space-between; width: 100%;} .img-box .item-info input[type="checkbox"].wish {margin: 0; background: url(img/Button-wish.svg) no-repeat center / 1.714rem; width: auto; min-height: inherit;} .img-box .item-info input[type="checkbox"].wish:checked {margin: 0; background: url(img/Button-wish-checked.svg) no-repeat center / 1.714rem;width: auto;} .product-info {position: relative;padding: 0 0 0 1.14rem; align-items: flex-start; display: flex; flex-direction: column; gap: 1.143rem;} .product-info .remove {position: absolute; top:0; right:0;} .info-box .type { font-size: .8rem; color: var(--Colour-Grey-txt-secondary);} .info-box .prodcut-name {font-size: 1.07rem; font-weight: 500;} .price-box .discount-rate { color: var(--Colour-Brand-PRIMARY, #FD5000); font-weight: 600;} .price-box .price-origin {color: var(--Colour-Grey-txt-secondary); text-decoration: line-through;} .price-box .price {font-size: 1.43rem; font-weight: 800;} .price-box .purchase {font-weight: normal;} .price-box .rating, .price-box .review-count {display: flex; align-items: center; font-size: .857rem; color: var(--Colour-Grey-txt-secondary); gap: .1rem;padding-top: 2px;;} .quantity-box {width: 100%;} .quantity-box h4 {color: var(--Colour-Grey-txt-secondary); font-size: 1rem;} .quantity-info {display:flex; align-items: center; justify-content:space-between; flex-wrap: nowrap; } .quantity {flex-grow: 1; display: flex; flex-direction: column; align-items: center; color: var(--Colour-Grey-txt-secondary); position: relative; font-size: .928rem;} .quantity::after {content: ''; display:inline-block; background-color: var(--Colour-Grey-line-sub); width: 1px; height: 1.7rem; position: absolute; right: 0;top:.5714rem;} .quantity:last-child::after {display: none;} .quantity .quantity-count { color: var(--Colour-Grey-txt); font-weight: 700; font-size: 1.143rem;} .quantity .quantity-count strong{ color: var(--Colour-Brand-PRIMARY)} .store-info-box { align-items: flex-start; margin-bottom: 1.714rem; vertical-align: top;} .store-info-box .store-info .info-box > *{margin-bottom: .5714rem;} .store-info-box .product-img {min-width: 140px;} .box > .log-box {margin-bottom:2.857rem;} .log-header {padding: 1rem 0; border-bottom: 1px dashed var(--Colour-Grey-line-sub); margin-bottom: 1.143rem;; } .log-header .log-date {color: var(--Colour-Grey-txt-sub);} .log-header h5 {display: inline-block; color: var(--Colour-Brand-PRIMARY);margin-left: .5714rem; font-size: 1.143rem;} .log-header h5.log-title, .log-header h5.log-number {color: var(--Colour-Grey-txt); margin: 0;} .log li {display: flex; justify-content: flex-start;align-items: center; gap: 1.143rem; margin-bottom: .5714rem; font-size: 1rem;} .log li > label {color: var(--Colour-Grey-txt-sub); width: 7.5714rem; text-wrap: nowrap;} .log li .state {color: var(--Colour-Brand-PRIMARY);} .log p strong {color: var(--Colour-Brand-PRIMARY);} .log li strong {font-weight: 400; color: var(--Colour-Grey-txt-point); font-size: 1.142rem;;} .log li strong.st-color {color: var(--Colour-Brand-PRIMARY);font-weight: 600;} .st-color {color: var(--Colour-Brand-PRIMARY);} .log-sales-box .log {border-bottom: 1px dashed var(--Colour-Grey-line-sub);padding-bottom: 2.5714rem;} .log-sales-detail-box .log li {justify-content: space-between;} .log-cnt {color: var(--Colour-Grey-txt-secondary); font-size: 1.12rem;} .sales-detail-box {font-size: 1.142rem; margin-bottom: .57rem;} .sales-product, .sales-order { font-weight: 700; font-size:1.42rem ;} .tag {display: inline-block; background-color: var(--Colour-Grey-bg-footer); padding: .57rem; border-radius: 1rem; font-size: .857rem; font-weight: normal; color: var(--Colour-Grey-txt); line-height: .8rem;} .tag-green {background-color: #E8FFD9; color:var(--Colour-Secondary) ;} .tag-red {color: var(--Colour-Brand-TXTPICKBG, #ff002f); background-color: #ffedf0;} .tag-blue-fill {background-color: var(--Colour-Brand-Blue); color: var(--Colour-Grey-WHITE);} .msg-warning {color: var(--Colour-Brand-TXTPICKBG, #ff002f); background-color: #ffedf0; padding: .57rem; border-radius: 4px; font-size: .857rem;} @media only screen and (max-width:640px){ .btn-secondary { display: flex; padding: 0.8rem; } input[type="time"] { display: flex; padding: 0.8rem;} .img-box > img {width: 100%; height: 180px;} .tab {padding:1rem} .log li strong { font-size: 1.1rem; min-width: 30%;} .col-6 {width:100%} .col-half {width: 49.5%;} .col-box.bigger-gap {gap:.5714rem; flex-wrap: wrap;} .log li > label {width:5rem} .store-info-box .product-img {min-width: 86px;} .store-info-box .pin img[name="pin"]{width: 100%;} } /* 모달 팝업 */ .bg-dim { display: block; position: absolute; top: 0; bottom: 0; left: 0; right:0; background-color: rgba(0,0,0,.8); } .modal { display: flex; width: calc(100% - 10rem); min-height:5rem; position: absolute; top: 5rem; left: 5rem; overflow: hidden; border-radius: 20px; background: var(--Colour-Grey-WHITE, #FFF); padding: 2.85rem; flex-direction: column; align-items: flex-start; gap: 2.5714rem;} .modal h2 {text-align: center; font-size: 1.28rem;} .modal h3 {margin-bottom: 1rem; font-size: 1.429rem;} .modal h4 {font-size: 1rem;} .modal > * { width: 100% } .modal .box > div {margin-bottom: .5714rem;} .modal .radiobox { height: 100%; flex-shrink: 0; } .col-box > label{color: var(--Colour-Grey-txt-sub, #888); min-width: 4.64rem ;} .col-box .single-line > label{color: var(--Colour-Grey-txt-sub, #888);min-width: 4.64rem ;} .col-box .single-line:nth-child(even) {min-width: none;} .col-box > label.long-label{ min-width: 7rem ;} .box {margin-bottom: 0;} .box .field-notice {color: var(--Colour-Brand-PRIMARY);font-size: .85rem;} .modal input[type="time"] {text-align: center;} .running-time .input-set {display: flex; align-items: center; flex-shrink: 0;} .field-box {margin-bottom: .5714rem;} @media only screen and (max-width:640px){ .modal { width: calc(100% - 5rem); left: 2.5714rem; padding: 2rem; } } .detail-box { padding: .857rem;} .detail-box > strong {color: var(--Colour-Brand-PRIMARY);margin-bottom: .572rem; display: inline-block;} .detail-box .img-box > img {height: auto; width: 100%;} .detail-box .detail-info-box {margin-bottom: 0;} .detail-box .detail-info-box .store-info {margin-left: .5714rem;} .detail-box .detail-info-box.info-box .store-name {font-weight: 600;} .detail-box .store-info .info-box {display: flex; gap: 0rem; flex-direction: column; font-size: 1.07rem;} .detail-box .info-box label {color: var(--Colour-Grey-txt-sub);margin-right: .5714rem; font-size: 1rem;} .new-coupon {display: inline-block; position: absolute; right:0; top:3.5rem;} .new-coupon a {font-size: 1.185rem; line-height: 1.185rem; padding: .857rem 1.7rem;} .sell_store .content-box .box {background-color: var(--Colour-Grey-WHITE); border-radius: 1.428rem ; padding:1.714rem ;} .sell_store .content-box .box .col-box{justify-content:flex-start;} .order-state-box {width: 100%;} .order-state-info {display:flex; width:100%; align-items: center; justify-content:space-between; flex-wrap: nowrap; margin-top: 1.142rem;} .order-state {flex-grow: 1; display: flex; flex-direction: column; align-items: center; position: relative; gap: 1.142rem;} .order-state::after {content: ''; display:inline-block; background-color: var(--Colour-Grey-line-sub); width: 1px; height: 4.5rem; position: absolute; right: 0;top:.5714rem;} .order-state:last-child::after {display: none;} .order-state .order-count { color: var(--Colour-Grey-txt); font-weight: 700; font-size: 1.714rem;} .order-state .order-count strong {font-weight: 700; font-size: 1.714rem; color: var(--Colour-Brand-PRIMARY)} .order-state .order-count .order-count-unit {font-size: 1.428rem;} .order-total {border-top: 1px solid var(--Colour-Grey-line); padding-top: 1.142rem;margin-top: 1.142rem; font-weight: 600;} .sell-total {font-weight: 600;} .order-total .sum, .sell-total .sum { font-size: 1.185rem;} .order-total .sum strong, .sell-total .sum strong { color: var(--Colour-Brand-PRIMARY);font-size: 1.428rem;} .manage-item-box li {display: flex; flex-grow: 1; flex-direction: column;} .manage-item {display: block; width: 100%; padding:1.142rem ; border: 1px solid var(--Colour-Grey-line); border-radius: .571rem; text-align: center;margin-bottom: .85rem;} .manage-sub {color: var(--Colour-Grey-txt, #333); text-align: center; font-weight: 600; display: block;;} /*테그 - 픽업 20240229*/ /* 픽업 - 매장*/ .tpickup_store { width:100%; height: 100%; display: flex; flex-wrap: wrap; border-radius: 4px; background: #F5F5F5; padding: 12px; } .tpickup_store .store_pic { width: 60px; height: 60px; padding:2px;} .tpickup_store .store_pic > img { width: 100%; height: 100%;} .tpickup_store .store_info { margin-left: 15px; width:80%;} .tpickup_store h4 { margin-bottom: 6px; font-size: 1.15rem;} .tpickup_store p { display: inline-block; } .tpickup_distance { color: #FD5000; font-size: small; } .tpickup_addr { font-size: 1.13rem; } .tpickup_another { margin: 12px 0; } .tpickup_another .btn_box_light { font-size: 1.25rem; line-height: 24px; font-weight: 600; display:block; border-radius: 4px; border: 1px solid #E3E3E3; padding: 18px; text-align: center; background: #FFF; } .tpickup_another img {vertical-align: top;} .wrap_inner3 { background-color: #F5F5F5;} .wrap_inner3 > div {padding: 6.25%; background: #fff; margin-top: 20px;} .wrap_inner3 > div:first-child {padding: 6.25%; background: #fff; margin-top: 0px; border-top:20px solid #f5f5f5;} .wrap_inner3 h3 {font-size: 1.286rem;} .info .name{margin-bottom: 12px;} .info .type-drink {margin: 0; color: #999999; font-size: 1.000rem;} .info .price-list {font-size: 1.286rem;font-weight: 600; margin-top: 0.857rem;} .list-header {display: flex; margin-bottom: 0.857rem;align-items: baseline;} .list-header h3 {flex-grow: 3;} .sort-drink { flex-grow: 1; text-align: right;} .sort-drink a, img {vertical-align: middle;} .sort-drink a {margin-left: 8px;} #cnt .sort select{border: none; height: inherit;} /* 맛집 공유 */ #store_sharing .sharing_top {position:relative; padding:0 6.25% 10px;} #store_sharing .sharing_top:after {display:block; position:absolute; bottom:0; left:0; width:100%; height:10px; background:#F9F9F9; content:'';} #store_sharing .sharing_top .srch_location {display:grid; align-items:start; justify-content:space-between; grid-template-columns:auto 24%;} #store_sharing .sharing_top .srch_location .share_select {height:3.286rem; border-radius:4px;} #store_sharing .date {margin:30px 0 10px;} #store_sharing .date .swiper-slide {display:inline-block; width:auto; height:2.714rem; border-radius:2.714rem; background:#F6F6F6; text-align:left;} #store_sharing .date .swiper-slide label {display:inline-block; padding:0 1.429rem; border-radius:2.714rem; color:#111; font-size:1.071rem; letter-spacing:-0.7px; line-height:2.714rem; cursor:pointer;} #store_sharing .date .swiper-slide input[type="radio"] {width:0; min-height:0; height:0; margin:0; padding:0;} #store_sharing .date .swiper-slide label.on {background:#FD5000; color:#fff; font-weight:600;} #store_sharing {} #store_sharing .pbig_search {padding:0;} #store_sharing .pbig_search .box {position:relative;} #store_sharing .pbig_search .box .basic_search {overflow:hidden; white-space:nowrap; text-overflow:ellipsis; width:100%; height:3.286rem; margin-bottom:0.714rem; padding-right:2.857rem; border:1px solid #E9E9E9; border-radius:4px; background:transparent; font-size:16px; color:#000;} #store_sharing .pbig_search .box .basic_search::placeholder {color:#999;} #store_sharing .pbig_search .box .basic_search:focus::placeholder {color:transparent;} #store_sharing .pbig_search .box .btn {position:absolute; top:0.857rem; right:0.786rem; width:1.429rem; height:1.429rem;} #store_sharing .pbig_search .box .btn:after {position:absolute; top:0; right:0; width:30px; height:30px; background:url('/_skin/bona/img/common/btn_fff.png')no-repeat center;} #store_sharing .pbig_search .box .btn {padding: 0; border: none; min-height: inherit;} #store_sharing .share_msg {background:url('/_skin/bona/img/shop/icon_bell.png')no-repeat left top/1.143rem; margin:20px 0 25px; padding-left:26px; color:#999; font-size:1.0714rem; letter-spacing:-0.3px;} #store_sharing .loca_slide {margin:26px 0 17px;} #store_sharing .loca_slide .swiper-slide {display:inline-block; width:auto; text-align:left;} #store_sharing .loca_slide .swiper-slide label {display:inline-block; color:#ABABAB; font-size:1.142rem; letter-spacing:-0.16px; cursor:pointer;} #store_sharing .loca_slide .swiper-slide input[type="radio"] {width:0; min-height:0; height:0; margin:0; padding:0;} #store_sharing .loca_slide .swiper-slide label.on {position:relative; color:#111; font-weight:700;} #store_sharing .loca_slide .swiper-slide label.on:after {display:block; position:absolute; bottom:0; left:0; width:100%; height:3px; background:#FD5000; content:'';} #store_sharing .fix_map {position:fixed; bottom:0; left:50%; z-index:100; display:flex; justify-content:center; align-items:center; width:100%; max-width:640px; height:60px; background:#FD5000;} #store_sharing .fix_map > * {display:flex; justify-content:center; align-items:center; width:100%; height:100%; color:#fff; font-size:1.142rem; font-weight:600; letter-spacing:-0.32px;} #store_sharing .share_map {display:flex; justify-content:start; align-items:center; position:absolute; top:-2px; right:0; z-index:28; } #store_sharing .share_map .map {position:static; margin-left:13px;} #store_sharing .share_map .map a {display:block; width:1.428rem; height:1.714rem; background:url('/_skin/bona/img/etc/map_pin_default.png') no-repeat center/1.428rem auto;} #store_sharing .share_map .store_share {} #store_sharing .share_map .store_share > a {display:block; width:2.071rem; height:2.071rem; background:url('/_skin/bona/img/button/icon_share_btn.png')no-repeat center/1.857rem; vertical-align:middle;} #store_sharing .sns_box {display:none; position:fixed; left:50%; top:0; width:640px; height:100%; z-index:40; background:rgba(0,0,0,0.5);} #store_sharing .sns_box .box {position:absolute; top:50%; left:50%; width:28.571rem; height:12.143rem; margin:-6.071rem 0 0 -14.286rem; padding:2.571rem 0; border-radius:10px; background:#fff;} #store_sharing .sns_box .box h3 {margin-bottom:1.357rem; font-size:1.286rem; text-align:center;} #store_sharing .sns_box .box > a {display:inline-block; position:absolute; top:1.429rem; right:1.429rem; width:1.429rem; height:1.429rem; background:url('/_skin/bona/img/shop/sns_close.png')no-repeat center/1.429rem;} #store_sharing .sns_box .list {font-size:0; text-align:center;} #store_sharing .sns_box .list li {display:inline-block; margin:0 0.286rem;} #store_sharing .sns_box .list li a {display:block; overflow:hidden; width:3.571rem; height:3.571rem; border-radius:50%; background-repeat:no-repeat; background-position:center; background-size:46px; text-align:center; text-indent:-9999px;} #store_sharing .sns_box .list li.kakao a {background-image:url('/_skin/bona/img/shop/icon_kakao.png');} #store_sharing .sns_box .list li.kakaostory a {background-image:url('/_skin/bona/img/shop/icon_kakaostory.png');} #store_sharing .sns_box .list li.twitter a {background-image:url('/_skin/bona/img/shop/icon_twitter.png');} #store_sharing .sns_box .list li.facebook a {background-image:url('/_skin/bona/img/shop/icon_facebook.png');} #store_sharing .sns_box .list li.url a {background-image:url('/_skin/bona/img/shop/icon_url.png');} @media only screen and (max-width:1239px) { #store_sharing .search {display:block;} } /* 취향 분석 */ #taste_analysis {margin-bottom:50px;} #taste_analysis canvas {position:static;} #taste_analysis .chart_inner {background:rgba(235, 223, 216,0.4); border-radius:6px; padding-bottom:60px;} #taste_analysis .chart_inner .title_section {padding:5.785rem 0 0;} #taste_analysis .chart_inner .title_section h3, #taste_analysis .chart_inner .title_section span {font-size:1.714rem; font-weight:700; letter-spacing:-0.24px;} #taste_analysis .chart_inner .title_section span {color:#FD5000;} #taste_analysis .chart_inner .title_section p {padding-top:1.0714rem; font-size:1.0714rem; letter-spacing:-0.15px;} #taste_analysis .chart_inner .chart_sort {max-width:395px; height:50px; margin:20px auto 40px; padding-left:15px; background-color:#fff; border:1px solid #E9E9E9; color:#999; letter-spacing:-0.14px;} #taste_analysis .chart_inner .taste {border-radius:6px; background:#F7F2EF;} #taste_analysis .chart_inner .taste h3 {margin-bottom:1.286rem; font-size:1.571rem; text-align:center;} #taste_analysis .chart_inner .taste dl {margin-bottom:0.571rem; font-size:0; text-align:center;} #taste_analysis .chart_inner .taste dl dt {display:inline-block; font-size:1.071rem; font-weight:600; vertical-align:middle;} #taste_analysis .chart_inner .taste dl dd {display:inline-block; width:63.4%; margin-left:1.000rem; font-size:0; vertical-align:middle;} #taste_analysis .chart_inner .taste dl span {display:inline-block; width:19.5%; margin-left:0.071rem; height:0.857rem;} #taste_analysis .chart_inner .taste dl span.gage1 {border-radius:0.857rem 0 0 0.857rem; background:#910000; opacity:0.2;} #taste_analysis .chart_inner .taste dl span.gage2 {background:#910000; opacity:0.4;} #taste_analysis .chart_inner .taste dl span.gage3 {background:#910000; opacity:0.6;} #taste_analysis .chart_inner .taste dl span.gage4 {background:#910000; opacity:0.8;} #taste_analysis .chart_inner .taste dl span.gage5 {border-radius:0 0.857rem 0.857rem 0; background:#910000; opacity:1;} #taste_analysis .chart_inner .taste dl dd.level0 span {background:#fff; opacity:1;} #taste_analysis .chart_inner .taste dl dd.level1 span.gage2 {background:#fff; opacity:1;} #taste_analysis .chart_inner .taste dl dd.level1 span.gage3 {background:#fff; opacity:1;} #taste_analysis .chart_inner .taste dl dd.level1 span.gage4 {background:#fff; opacity:1;} #taste_analysis .chart_inner .taste dl dd.level1 span.gage5 {border-radius:0 0.857rem 0.857rem 0; background:#fff; opacity:1;} #taste_analysis .chart_inner .taste dl dd.level2 span.gage3 {background:#fff; opacity:1;} #taste_analysis .chart_inner .taste dl dd.level2 span.gage4 {background:#fff; opacity:1;} #taste_analysis .chart_inner .taste dl dd.level2 span.gage5 {border-radius:0 0.857rem 0.857rem 0; background:#fff; opacity:1;} #taste_analysis .chart_inner .taste dl dd.level3 span.gage4 {background:#fff; opacity:1;} #taste_analysis .chart_inner .taste dl dd.level3 span.gage5 {border-radius:0 0.857rem 0.857rem 0; background:#fff; opacity:1;} #taste_analysis .chart_inner .taste dl dd.level4 span.gage5 {border-radius:0 0.857rem 0.857rem 0; background:#fff; opacity:1;} #taste_analysis .chart_inner .chart_box {display:flex; align-items:center; justify-content:center; width:100%; max-width:100%; max-height:320px;} #taste_analysis .chart_inner .total_drink {display:flex; justify-content:space-between; align-items:center; max-width:395px; height:66px; margin:40px auto 0; padding:0 6%; background:#EFE8E4; border-radius:10px;} #taste_analysis .chart_inner .total_drink .field {color:#333; font-size:1.0714rem; font-weight:500;} #taste_analysis .chart_inner .total_drink .field > span {color:#910000; font-size:1.0714rem; font-weight:700;} #taste_analysis .chart_inner .ref_link {display:block; width:160px; height:40px; margin:20px auto 0;} #taste_analysis .chart_inner .ref_link > a {display:flex; justify-content:center; align-items:center; width:100%; height:100%; background:#FD5000; border-radius:23px; color:#fff; font-size:1.0714rem; font-weight:500;} @media only screen and (max-width: 640px) { #taste_analysis .chart_inner .total_drink, #taste_analysis .chart_inner .chart_sort {max-width:276px;} }