@charset "utf-8";
/* rcbank PC 상품페이지 새 디자인 - 원판(goods_view.htm)이 처음부터 이 모양으로 그린다 (2026-10-07)
   사장님 "기존 디자인에 새것을 그리지 말고 원판을 새 디자인으로" : 예전엔 rcb_pcview2.js 가 옛 화면을 다시 짜서 잠깐 옛 모양이 보였다.
   이 파일은 상품 스킨 앞쪽에서 <link> 로 먼저 읽는다. 동작(수량·가격 다시 계산·펼치기·애니메이션)은 rcb_pcview3.js. */

/* ---------- 1) 가입 할인 카드 + 판매가 줄 긋기·회원가 ---------- */
.rcb-pjoin{position:relative;overflow:hidden;display:flex;align-items:center;gap:16px;margin:8px 0 0;padding:9px 12px 9px 14px;border-left:.32em solid #2c5fc4;background:#f3f7ff;color:#1d2b4f;font-family:"맑은고딕","Malgun Gothic",sans-serif;font-size:15px;line-height:1.45;text-decoration:none!important;box-sizing:border-box}
.rcb-pjoin:hover{background:#e9f1ff}
.rcb-pjoin-t{flex:1;min-width:0}.rcb-pjoin-t span,.rcb-pjoin-t small{display:block}.rcb-pjoin-t span{font-weight:bold}.rcb-pjoin-t b{color:#e8423f}
.rcb-pjoin-t small{margin-top:1px;color:#5b6b88;font-size:12px}.rcb-pjoin-t small i{font-style:normal;color:#2c5fc4;font-weight:bold}
.rcb-pjoin-go{flex:0 0 auto;padding:.55em 1.1em;border-radius:4px;background:#2c5fc4;color:#fff;font-weight:bold;font-size:14px;white-space:nowrap}
.rcb-pjoin:hover .rcb-pjoin-go{background:#1f4aa3}
.rcb-pjoin::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:50%;background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,255,255,.75),rgba(255,255,255,0));transform:skewX(-18deg);pointer-events:none}
.rcb-pjoin.rcb-shine::after{animation:rcbPjShine 1.1s ease-out .25s 2}
@keyframes rcbPjShine{from{left:-60%}to{left:130%}}
.rcb-pj-strike{position:relative;transition:color .4s}
.rcb-pj-strike::after{content:"";position:absolute;left:0;top:var(--rcb-pj-y,52%);height:2px;width:0;background:#e8423f;transition:width .45s ease-out}
.rcb-pj-strike.on,.rcb-pj-strike.on #price{color:#9aa3b5}.rcb-pj-strike.on::after{width:100%}
.rcb-pj-mprice{display:inline-block;margin-left:10px;color:#e8423f;font-size:26px;font-weight:bold;letter-spacing:-.5px;opacity:0;transform:translateY(6px);transition:opacity .35s .35s,transform .35s .35s;vertical-align:baseline}
.rcb-pj-mprice.on{opacity:1;transform:none}
.rcb-pj-mprice em{font-style:normal;font-size:12px;margin-left:5px;padding:1px 6px;border-radius:3px;background:#e8423f;color:#fff;vertical-align:5px}
@media (prefers-reduced-motion: reduce){.rcb-pjoin.rcb-shine::after{animation:none}.rcb-pj-strike::after,.rcb-pj-mprice{transition:none}}

/* ---------- 2) 정보 표 · 구매수량 ---------- */
#goods_spec table.top{background:none!important;border:0!important;padding:0!important}
#goods_spec table.top tr{height:auto}
#goods_spec table.top th{text-align:left;width:auto;padding:4px 10px 4px 0;color:#6b7690;font-weight:normal;font-size:14px;white-space:nowrap}
#goods_spec table.top td.rcb-pi-cell{padding:0}
.rcb-pi{font-family:"맑은고딕","Malgun Gothic",sans-serif;color:#1d2b4f;padding:4px 0 12px;border-bottom:1px solid #e3e7ef;margin-bottom:2px;font-size:12px;font-weight:normal;line-height:normal}
.rcb-pi-lb{display:block;color:#6b7690;font-size:13px;font-weight:normal;letter-spacing:.5px;margin-bottom:2px}
.rcb-pi-pr{line-height:1.25}
.rcb-pi-st{display:flex;flex-wrap:wrap;align-items:baseline;row-gap:4px;margin:12px 0 0;font-size:14px;line-height:1.4}
.rcb-pi-it{display:inline-flex;align-items:baseline;gap:6px;padding:0 14px;border-left:1px solid #d9dfea;white-space:nowrap}
.rcb-pi-it:first-child{padding-left:0;border-left:0}
.rcb-pi-it > i{font-style:normal;color:#6b7690;font-size:13px;font-weight:normal}
.rcb-pi-it > span{color:#1d2b4f;font-weight:bold}
.rcb-pi-it a{color:#1d2b4f!important;text-decoration:none}.rcb-pi-it a:hover b{text-decoration:underline}
.rcb-pi-sub{display:flex;align-items:baseline;gap:8px;margin-top:4px;font-size:15px}
.rcb-pi-sub > i{font-style:normal;color:#6b7690;font-size:13px;font-weight:normal}
.rcb-pi-sub > span{color:#e8423f;font-weight:bold}
.rcb-pq{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:10px 0 4px;font-family:"맑은고딕","Malgun Gothic",sans-serif;color:#1d2b4f}
.rcb-pq-lb{font-size:15px;font-weight:bold;min-width:4.5em}
.rcb-pq-step{display:inline-flex;align-items:stretch;border:1px solid #c5cee0;border-radius:5px;overflow:hidden;background:#fff}
.rcb-pq-step button{width:2em;border:0;background:#f4f6fa;color:#46629e;font:bold 15px/1 "맑은고딕","Malgun Gothic",sans-serif;cursor:pointer;padding:0}
.rcb-pq-step button:hover{background:#e6ecf7}.rcb-pq-step button:focus-visible{outline:2px solid #2c5fc4;outline-offset:-2px}
.rcb-pq-step input#goodEA{width:3em!important;height:auto!important;padding:.3em 0!important;border:0!important;border-left:1px solid #e3e7ef!important;border-right:1px solid #e3e7ef!important;text-align:center!important;font:bold 15px/1.2 "맑은고딕","Malgun Gothic",sans-serif!important;color:#1d2b4f;outline:0}
.rcb-pq-u{font-size:15px}
.rcb-pq-x{font-size:13px;color:#6b7690}.rcb-pq-x:empty{display:none}
.rcb-pq-x div{display:inline}
.rcb-pq-sold{font-size:14px;color:#6b7690}

/* ---------- 3) 옵션 선택 상자 ---------- */
.rcb-po-h{display:flex;align-items:baseline;justify-content:space-between;padding:14px 0 6px;color:#1d2b4f;font:bold 15px "맑은고딕","Malgun Gothic",sans-serif}
.rcb-po-h small{font-size:13px;font-weight:normal;color:#6b7690}.rcb-po-h small b{color:#2c5fc4}.rcb-po-h.done small b{color:#1f7a45}
table.sub.rcb-po{width:100%;border-collapse:separate;border-spacing:0 6px;margin-top:-6px}
table.sub.rcb-po td{padding:0;vertical-align:middle}
table.sub.rcb-po td.rcb-po-l{width:1%;white-space:nowrap;padding-right:12px;color:#6b7690;font:14px/1.3 "맑은고딕","Malgun Gothic",sans-serif}
table.sub.rcb-po tr.on td.rcb-po-l{color:#1d2b4f;font-weight:bold}
table.sub.rcb-po select{width:100%;-webkit-appearance:none;appearance:none;height:auto;min-height:0;padding:.55em 2.4em .55em .85em;border:1px solid #c5cee0;border-radius:6px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2346629e' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right .9em center;color:#6b7690;font:14px/1.4 "맑은고딕","Malgun Gothic",sans-serif;cursor:pointer;box-sizing:border-box}
table.sub.rcb-po select:hover{border-color:#8fa6d6}
table.sub.rcb-po select:focus{outline:0;border-color:#2c5fc4;box-shadow:0 0 0 3px rgba(44,95,196,.15)}
table.sub.rcb-po tr.on select{border-color:#2c5fc4;background-color:#f3f7ff;color:#1d2b4f;font-weight:bold}
table.sub.rcb-po select option{color:#1d2b4f;font-weight:normal}
.rcb-po-end{border-bottom:1px solid #ececec;margin:5px 0 10px}

/* ---------- 4) 구매 안내 (배송비~카드무이자) ---------- */
.rcb-pg{margin:10px 14px 0;border:1px solid #dfe4ea;background:#fff;text-align:left;font-family:"맑은고딕","Malgun Gothic",sans-serif;color:#1d2b4f}
.rcb-pg.rcb-pg-r{margin:14px 0 0}
.rcb-pg-t{padding:9px 12px 4px;font-size:11px;font-weight:bold;letter-spacing:1px;color:#8d96a2;background:#fafbfc}
.rcb-pg-h{display:flex;align-items:center;gap:10px;padding:.7em 12px;border-top:1px solid #eef1f5;background:#fff;font:14px/1.45 "맑은고딕","Malgun Gothic",sans-serif;cursor:pointer;user-select:none}
.rcb-pg-h:hover{background:#f6f8fb}.rcb-pg-h:focus-visible{outline:2px solid #2c5fc4;outline-offset:-2px}
.rcb-pg-n{flex:0 0 5.2em;font-weight:bold;color:#2c5fc4}
.rcb-pg-s{flex:1;min-width:0;color:#3a4763;font-size:13px}
.rcb-pg-a{flex:0 0 12px;height:8px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2346629e' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center;transition:transform .2s}
.rcb-pg-h.on{background:#f6f8fb}.rcb-pg-h.on .rcb-pg-a{transform:rotate(180deg)}.rcb-pg-h.on .rcb-pg-n{color:#1d2b4f}
.rcb-pg-c{padding:2px 14px 12px 12px;background:#f6f8fb;font:13px/1.65 "맑은고딕","Malgun Gothic",sans-serif;color:#3a4763}
.rcb-pg-ln{margin-top:5px}.rcb-pg-ln:first-child{margin-top:0}
.rcb-pg-ln.kv{display:flex;gap:10px}.rcb-pg-ln.kv > i{flex:0 0 5.2em;font-style:normal;color:#6b7690}.rcb-pg-ln.kv > span{flex:1;min-width:0}
.rcb-pg-warn{color:#d23b38}
.rcb-pg-c a{color:#2c5fc4!important;text-decoration:none}
.rcb-pg-c .rcb-pg-link{cursor:pointer;color:#6b7690}
.rcb-icw{display:inline-block;vertical-align:-.22em;line-height:0;margin:0 2px}.rcb-icw svg{height:1.15em;width:auto}
@media (prefers-reduced-motion: reduce){.rcb-pg-a{transition:none}}

/* ---------- 4-0) www 구매 단추 (shop 과 같은 배치, 구형 네이버페이 그대로) ---------- */
:not(.rcb-buy):not(.rcb-buy2) > #purchase-buttons,.rcb-buy,.rcb-buy2{margin-top:14px}
.rcb-buy2{display:flex;align-items:center;width:100%}
.rcb-buy2 #purchase-buttons{display:grid!important;grid-template-columns:1fr 48px;gap:8px;width:240px!important;flex:0 0 240px;font-size:0}
.rcb-buy2.rcb-buy2-solo #purchase-buttons{width:270px!important;flex-basis:270px}
.rcb-buy2 #purchase-buttons a{display:flex!important;align-items:center;justify-content:center;box-sizing:border-box;width:auto!important;height:46px;line-height:1!important;margin:0;padding:0 8px;border:1px solid transparent;border-radius:4px!important;font:bold 17px "맑은고딕","Malgun Gothic",sans-serif!important;letter-spacing:-.3px;text-decoration:none;white-space:nowrap}
.rcb-buy2 #purchase-buttons a i,.rcb-buy2 #purchase-buttons a img{margin:0 7px 0 0!important;vertical-align:middle}
.rcb-buy2 #purchase-buttons a[href*="addcart2"],.rcb-buy2 #purchase-buttons a[href*="fnRequestStockedNoti"]{grid-column:1 / -1}
.rcb-buy2 #purchase-buttons a[href*="addcart2"]{background:#3758d6!important;border-color:#3758d6;color:#fff!important}
.rcb-buy2 #purchase-buttons a[href*="addcart()"]{background:#fff!important;border-color:#3758d6;color:#3758d6!important}
.rcb-buy2 #purchase-buttons a[href*="fnRequestStockedNoti"]{background:#fff!important;border-color:#8a93a3;color:#46586f!important}
.rcb-buy2 #purchase-buttons a[href*="plusFriendChat"]{padding:0;background:#fee500!important;border-color:#fee500;color:#191919!important}
.rcb-buy2 #purchase-buttons a[href*="plusFriendChat"] #btn-kakaotalk{display:none}
.rcb-buy2 #purchase-buttons a[href*="plusFriendChat"] img{width:28px;margin:0!important}
.rcb-buy2 #purchase-buttons a:hover{filter:brightness(.95)}
.rcb-buy2-vl{position:relative;flex:0 0 36px;align-self:stretch}.rcb-buy2-vl::before{content:"";position:absolute;left:50%;top:6px;bottom:6px;border-left:1px solid #dfe4ea}
.rcb-buy2 .rcb-buy2-np{flex:0 0 auto;padding:0!important;margin:0!important}

/* ---------- 5) 관련상품 위 여백 + [담기] ---------- */
aside.rcr2.rcb-related{margin-top:0!important;padding-top:30px}
.rcr2-i{min-width:0;display:flex;flex-direction:column}.rcr2-i > .rcr2-c{flex:1}
.rcr2-add{display:block;width:100%;margin-top:6px;padding:6px 4px;border:1px solid #46629e;border-radius:5px;background:#fff;color:#46629e;font:bold 12px/1.3 "맑은고딕","Malgun Gothic",sans-serif;text-align:center;text-decoration:none!important;cursor:pointer;box-sizing:border-box}
.rcr2-add:hover{background:#46629e;color:#fff}.rcr2-add[disabled]{opacity:.6;cursor:default}
.rcr2-add.rcr2-done{background:#22a35a;border-color:#22a35a;color:#fff}

/* ---------- 6) 상단 분류 (첫 줄 = 가장 연관 있는 분류, 나머지 부모별 줄, 2줄 넘으면 접기) ---------- */
.rcbct .rcbct-sub{display:flex;align-items:flex-start;flex-wrap:nowrap;margin-top:0;margin-left:62px}
.rcbct .rcbct-flat{display:flex;align-items:flex-start;flex-wrap:nowrap}
.rcbct .rcbct-sub > .rcbct-w,.rcbct .rcbct-sub > .rcbct-sep,.rcbct .rcbct-flat > .rcbct-w,.rcbct .rcbct-flat > .rcbct-sep,.rcbct .rcbct-flat > .rcbct-hd{flex:0 0 auto;white-space:nowrap;line-height:22px}
.rcbct a.rcbct-chip.rcbct-chipmain{border-color:#46629e;color:#1d2b4f;font-weight:bold}
.rcbct .rcbct-chips{flex:1;min-width:0;display:block}.rcbct .rcbct-chips a.rcbct-chip{margin:0 4px 3px 0}
.rcbct .rcbct-chips.rcbct-fold{max-height:25px;overflow:hidden}
.rcbct .rcbct-cmore{flex:0 0 auto;display:inline-flex;align-items:center;margin:2px 0 0 2px;padding:4px 9px;border:1px solid #c5cee0;border-radius:11px;background:#fff;color:#46629e;font:11px/1 "맑은고딕","Malgun Gothic",sans-serif;cursor:pointer;white-space:nowrap}
.rcbct .rcbct-cmore:hover{border-color:#46629e;background:#f3f7ff}
.rcbct .rcbct-x{display:none}.rcbct.rcbct-open .rcbct-x{display:flex}
.rcbct.rcbct-hasmore{position:relative;margin-bottom:16px!important}
.rcbct-morew{position:absolute;left:0;right:0;bottom:0;transform:translateY(50%);text-align:center;line-height:0;margin:0}
.rcbct-more{display:inline-flex;align-items:center;gap:4px;margin:0;padding:4px 12px;border:1px solid #c5cee0;border-radius:11px;background:#fff;color:#46629e;font:11px/1 "맑은고딕","Malgun Gothic",sans-serif;cursor:pointer;vertical-align:middle;white-space:nowrap}
.rcbct-more:hover{border-color:#46629e;background:#f3f7ff}.rcbct-more:focus-visible{outline:2px solid #2c5fc4;outline-offset:1px}
.rcbct-more .rcbct-ar{display:block;flex:0 0 8px;width:8px;height:5px;background:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2710%27 height=%276%27 viewBox=%270 0 10 6%27%3E%3Cpath d=%27M1 1l4 4 4-4%27 fill=%27none%27 stroke=%27%2346629e%27 stroke-width=%271.6%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27/%3E%3C/svg%3E") no-repeat center/contain}
.rcbct.rcbct-open .rcbct-more .rcbct-ar{transform:rotate(180deg)}
.rcbct .rcbct-more .rcbct-o2{display:none}.rcbct.rcbct-open .rcbct-more .rcbct-o1{display:none}.rcbct.rcbct-open .rcbct-more .rcbct-o2{display:inline}

/* ---------- 4-1) 떠 있는 구매 패널 (스크롤하면 뜬다 - 패널 자체는 스킨 끝 rcbPcPanelInit 이 만든다) ---------- */
html #rcb-pc-panel{border-color:#dfe4ea;box-shadow:0 4px 16px rgba(29,43,79,.10);font-family:"맑은고딕","Malgun Gothic",sans-serif;color:#1d2b4f}
html #rcb-pc-panel .rcb-pc-title{color:#1d2b4f;border-bottom-color:#eef1f5}html #rcb-pc-panel .rcb-pc-gno{color:#6b7690}
html #rcb-pc-panel .rcb-pc-eta{margin:8px 10px 0;padding:7px 10px;border:0;border-left:.32em solid #0b7040;background:#f4fbf7;color:#1d2b4f}
html #rcb-pc-panel .rcb-pc-body{padding-top:8px}html #rcb-pc-panel .rcb-pc-optrow{margin-bottom:7px}
html #rcb-pc-panel .rcb-pc-olab{display:block;margin:0 0 2px;color:#6b7690;font-size:11px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html #rcb-pc-panel .rcb-pc-optrow.on .rcb-pc-olab{color:#1d2b4f;font-weight:bold}
html #rcb-pc-panel select.rcb-pc-sel{-webkit-appearance:none;appearance:none;height:auto;padding:.45em 2em .45em .7em;border:1px solid #c5cee0;border-radius:6px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2346629e' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right .7em center;color:#6b7690;font:12px/1.4 "맑은고딕","Malgun Gothic",sans-serif;cursor:pointer}
html #rcb-pc-panel select.rcb-pc-sel:hover{border-color:#8fa6d6}
html #rcb-pc-panel select.rcb-pc-sel:focus{outline:0;border-color:#2c5fc4;box-shadow:0 0 0 3px rgba(44,95,196,.15)}
html #rcb-pc-panel .rcb-pc-optrow.on select.rcb-pc-sel{border-color:#2c5fc4;background-color:#f3f7ff;color:#1d2b4f;font-weight:bold}
html #rcb-pc-panel select.rcb-pc-sel option{color:#1d2b4f;font-weight:normal}
html #rcb-pc-panel select.rcb-pc-miss{border-color:#e8423f;background-color:#fff4f2}
html #rcb-pc-panel .rcb-pc-optbtn{height:auto;padding:.45em 0;line-height:1.4;border-color:#c5cee0;border-radius:6px;background:#fff;color:#46629e;font:12px/1.4 "맑은고딕","Malgun Gothic",sans-serif}
html #rcb-pc-panel .rcb-pc-qty{display:flex;align-items:center;margin:10px 0 8px;overflow:visible}
html #rcb-pc-panel .rcb-pc-qlab{float:none;flex:1;color:#1d2b4f;font-size:13px;font-weight:bold;line-height:1.4}
html #rcb-pc-panel .rcb-pc-qbtn,html #rcb-pc-panel #rcb-pc-qval{float:none;height:auto;margin:0;line-height:1.2;padding:.35em 0;border:1px solid #c5cee0;border-radius:0;box-sizing:border-box}
html #rcb-pc-panel .rcb-pc-qbtn{width:2em;background:#f4f6fa;color:#46629e;font:bold 15px/1.2 "맑은고딕","Malgun Gothic",sans-serif;text-align:center;user-select:none}
html #rcb-pc-panel .rcb-pc-qbtn:hover{background:#e6ecf7}
html #rcb-pc-panel .rcb-pc-qbtn.rcb-q-dn{order:1;border-radius:5px 0 0 5px}
html #rcb-pc-panel #rcb-pc-qval{order:2;width:2.8em;border-left:0;border-right:0;background:#fff;color:#1d2b4f;font:bold 14px/1.2 "맑은고딕","Malgun Gothic",sans-serif}
html #rcb-pc-panel .rcb-pc-qbtn.rcb-q-up{order:3;border-radius:0 5px 5px 0}
html #rcb-pc-panel .rcb-pc-total{border-top-color:#eef1f5;padding:10px 12px 4px}
html #rcb-pc-panel .rcb-pc-tlab{color:#6b7690;font-size:13px}html #rcb-pc-panel #rcb-pc-totval{color:#1d2b4f;font-size:19px;letter-spacing:-.3px}
html #rcb-pc-panel .rcb-pc-oslab{color:#6b7690}html #rcb-pc-panel .rcb-pc-osval{color:#1d2b4f}html #rcb-pc-panel .rcb-pc-member .rcb-pc-osval{color:#e8423f}
html #rcb-pc-panel a.rcb-pc-join{display:flex;align-items:baseline;gap:6px;margin:0 12px 8px;padding:6px 8px;border-left:.32em solid #2c5fc4;background:#f3f7ff;color:#1d2b4f!important;font-size:12px;text-decoration:none!important}
html #rcb-pc-panel a.rcb-pc-join b{color:#e8423f;font-size:14px}
html #rcb-pc-panel a.rcb-pc-join em{font-style:normal;padding:0 4px;border-radius:3px;background:#e8423f;color:#fff;font-size:10px;font-weight:bold}
html #rcb-pc-panel a.rcb-pc-join span{margin-left:auto;color:#2c5fc4;font-weight:bold;white-space:nowrap}
html #rcb-pc-panel a.rcb-pc-join:hover{background:#e9f1ff}
html #rcb-pc-panel .rcb-pc-foot{padding-top:0}
html #rcb-pc-panel .rcb-pc-btn{height:auto;padding:.7em 0;line-height:1.3;border:1px solid transparent;font:bold 15px/1.3 "맑은고딕","Malgun Gothic",sans-serif;margin-top:6px}
html #rcb-pc-panel .rcb-pc-order{background:#3758d6;border-color:#3758d6;color:#fff}
html #rcb-pc-panel .rcb-pc-cart{background:#fff;border-color:#3758d6;color:#3758d6}
html #rcb-pc-panel .rcb-pc-btn:hover{filter:brightness(.95)}