
<!-- 상세페이지에 아래 코드 전체를 삽입하세요. -->
<style>
/* 기본 초기화 */
.sb-wrap, .sb-wrap * {
box-sizing: border-box !important;
}
.sb-wrap {
width: 100% !important;
margin: 0 auto !important;
text-align: center !important;
}
.sb-selector-box {
width: min(850px, calc(100% - 24px)) !important;
margin: 0 auto !important;
padding: 40px 0 30px !important;
color: #242424 !important;
font-family: Pretendard, "Noto Sans KR", Arial, sans-serif !important;
text-align: center !important;
}
.sb-selector-box::before {
display: block !important;
width: 86px !important;
height: 5px !important;
margin: 0 auto 30px !important;
background: #111 !important;
content: "" !important;
}
.sb-current-text {
display: inline-flex !important;
align-items: center !important;
gap: 8px !important;
margin-bottom: 24px !important;
padding: 10px 16px !important;
border-radius: 999px !important;
color: #0b5d86 !important;
background: #dff3ff !important;
font-size: 15px !important;
font-weight: 700 !important;
}
.sb-current-text::before {
width: 8px !important;
height: 8px !important;
border-radius: 50% !important;
background: #179bd7 !important;
content: "" !important;
}
/* 버튼 그리드 레이아웃 (태그 간섭 방지용 div 구성) */
.sb-grid {
display: grid !important;
grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
gap: 12px !important;
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
}
.sb-btn {
display: flex !important;
min-height: 70px !important;
align-items: center !important;
justify-content: center !important;
padding: 12px 8px !important;
border: 1px solid #c7c7c2 !important;
border-radius: 14px !important;
color: #333 !important;
background: #fff !important;
box-shadow: 0 5px 14px rgba(0, 0, 0, 0.05) !important;
font-size: 17px !important;
font-weight: 700 !important;
text-decoration: none !important;
transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease !important;
}
.sb-btn:hover, .sb-btn:focus {
border-color: #444 !important;
box-shadow: 0 8px 18px rgba(0, 0, 0, 0.1) !important;
transform: translateY(-3px) !important;
}
/* 현재 활성화된 버튼 */
.sb-btn.active {
border-color: #179bd7 !important;
color: #fff !important;
background: #179bd7 !important;
box-shadow: 0 8px 18px rgba(23, 155, 215, 0.28) !important;
cursor: default !important;
}
.sb-btn.active::after {
display: inline-block !important;
margin-left: 6px !important;
padding: 3px 6px !important;
border-radius: 5px !important;
color: #0b5d86 !important;
background: #fff !important;
font-size: 10px !important;
content: "현재" !important;
}
/* 이미지 영역 */
.sb-img-box {
width: 100% !important;
margin-top: 20px !important;
}
.sb-img-box p {
margin: 0 !important;
padding: 0 !important;
}
.sb-img-box img {
display: block !important;
width: 100% !important;
max-width: 850px !important;
height: auto !important;
margin: 0 auto !important;
}
/* 반응형 (모바일) */
@media (max-width: 720px) {
.sb-selector-box {
width: calc(100% - 24px) !important;
padding: 30px 0 20px !important;
}
.sb-grid {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
gap: 8px !important;
}
}
@media (max-width: 420px) {
.sb-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.sb-btn {
min-height: 54px !important;
padding: 8px 4px !important;
font-size: 15px !important;
}
}
</style>
<div class="sb-wrap">
<!-- 상단 버튼 영역 -->
<div class="sb-selector-box">
<div class="sb-current-text">
지금 보고 계신 페이지는 1000g입니다.
</div>
<!-- 쇼핑몰 CSS 차단을 피하기 위해 pure div + a 로 교체 -->
<div class="sb-grid">
<a class="sb-btn" href="/goods/goods_view.php?goodsNo=1000001199">37.5g</a>
<a class="sb-btn" href="/goods/goods_view.php?goodsNo=1000001200">100g</a>
<a class="sb-btn" href="/goods/goods_view.php?goodsNo=1000001201">200g</a>
<a class="sb-btn" href="/goods/goods_view.php?goodsNo=1000001202">300g</a>
<a class="sb-btn" href="/goods/goods_view.php?goodsNo=1000001203">500g</a>
<a class="sb-btn active" href="/goods/goods_view.php?goodsNo=1000001204">1000g</a>
</div>
</div>
<!-- 이미지 상세 영역 -->
<div class="sb-img-box">
<p><img src="https://gi.esmplus.com/kgoldw/kgoldw/silverbar/silverbar_info.jpg" alt="실버바"></p>
<p><img src="https://gi.esmplus.com/kgoldw/kgoldw/silverbar/silverbar_1.jpg" alt="실버바"></p>
<p><img src="https://gi.esmplus.com/kgoldw/kgoldw/silverbar/silverbar_2.jpg" alt="실버바"></p>
<p><img src="https://gi.esmplus.com/kgoldw/kgoldw/silverbar/silverbar_3.jpg" alt="실버바"></p>
<p><img src="https://gi.esmplus.com/kgoldw/kgoldw/silverbar/silverbar_4.jpg" alt="실버바"></p>
<p><img src="https://gi.esmplus.com/kgoldw/kgoldw/silverbar/silverbar_5.jpg" alt="실버바"></p>
<p><img src="https://gi.esmplus.com/kgoldw/kgoldw/silverbar/silverbar_6.jpg" alt="실버바"></p>
<p><img src="https://gi.esmplus.com/kgoldw/kgoldw/silverbar/silverbar_7.jpg" alt="실버바"></p>
<p><img src="https://gi.esmplus.com/kgoldw/kgoldw/silverbar/silverbar_8.jpg" alt="실버바"></p>
</div>
</div>
- 배송비 : 기본배송료는 2,500원 입니다. (도서,산간,오지 일부지역은 배송비가 추가될 수 있습니다) 50,000원 이상 구매시 무료배송입니다.
- 본 상품의 평균 배송일은 0일입니다.(입금 확인 후) 설치 상품의 경우 다소 늦어질수 있습니다.[배송예정일은 주문시점(주문순서)에 따른 유동성이 발생하므로 평균 배송일과는 차이가 발생할 수 있습니다.]
- 본 상품의 배송 가능일은 0일 입니다. 배송 가능일이란 본 상품을 주문 하신 고객님들께 상품 배송이 가능한 기간을 의미합니다. (단, 연휴 및 공휴일은 기간 계산시 제외하며 현금 주문일 경우 입금일 기준 입니다.)
- 상품 택(tag)제거 또는 개봉으로 상품 가치 훼손 시에는 상품수령후 7일 이내라도 교환 및 반품이 불가능합니다.
- 저단가 상품, 일부 특가 상품은 고객 변심에 의한 교환, 반품은 고객께서 배송비를 부담하셔야 합니다(제품의 하자,배송오류는 제외)
- 일부 상품은 신모델 출시, 부품가격 변동 등 제조사 사정으로 가격이 변동될 수 있습니다.
- 신발의 경우, 실외에서 착화하였거나 사용흔적이 있는 경우에는 교환/반품 기간내라도 교환 및 반품이 불가능 합니다.
- 수제화 중 개별 주문제작상품(굽높이,발볼,사이즈 변경)의 경우에는 제작완료, 인수 후에는 교환/반품기간내라도 교환 및 반품이 불가능 합니다.
- 수입,명품 제품의 경우, 제품 및 본 상품의 박스 훼손, 분실 등으로 인한 상품 가치 훼손 시 교환 및 반품이 불가능 하오니, 양해 바랍니다.
- 일부 특가 상품의 경우, 인수 후에는 제품 하자나 오배송의 경우를 제외한 고객님의 단순변심에 의한 교환, 반품이 불가능할 수 있사오니, 각 상품의 상품상세정보를 꼭 참조하십시오.
- 소비자분쟁해결 기준(공정거래위원회 고시)에 따라 피해를 보상받을 수 있습니다.
- A/S는 판매자에게 문의하시기 바랍니다.
상품이 장바구니에 담겼습니다.
바로 확인하시겠습니까?