@charset "utf-8";
/* filename : shop.css / date : 2024-03-20 / name : kohwonji / email : wonjikoh@kakao.com */

/* fillter conttent : scroll bar, form : checkbox layer, shop view : option : total */
.fillter-content::-webkit-scrollbar, .frm-check-wrap .opt-check-list::-webkit-scrollbar, .opt-total-wrap::-webkit-scrollbar {-webkit-appearance:none;} .fillter-content::-webkit-scrollbar:vertical, .frm-check-wrap .opt-check-list::-webkit-scrollbar:vertical, .opt-total-wrap::-webkit-scrollbar:vertical {width:6px;} .fillter-content::-webkit-scrollbar:horizontal, .frm-check-wrap .opt-check-list::-webkit-scrollbar:horizontal, .opt-total-wrap::-webkit-scrollbar:horizontal {height:8px;} .fillter-content::-webkit-scrollbar-thumb, .frm-check-wrap .opt-check-list::-webkit-scrollbar-thumb, .opt-total-wrap::-webkit-scrollbar-thumb {background-color:var(--col-primary); border-radius:10px; border:1px solid var(--col-bg2);} .fillter-content::-webkit-scrollbar-track, .frm-check-wrap .opt-check-list::-webkit-scrollbar-track, .opt-total-wrap::-webkit-scrollbar-track {border-radius:10px; background-color:var(--col-bg2);}

/* fillter : range */
.frm-range {width: 100%; height: auto; padding-bottom: 20px; position: relative;}
.frm-range::before, .frm-range::after {position: absolute; top: 24px;}
.frm-range::before {content: '1,000원'; left: 0;}
.frm-range::after {content: '50,000원'; right: 0;}
.frm-range .frm-range-slider {width: 100%; height: 20px; margin-top: 10px; position: relative;}
.frm-range .frm-range-slider span {display: block; position: absolute;}
.frm-range .frm-range-slider span[class*=entered-] {width: 100%; height: 2px; top: 50%; left: 0; transform: translateY(-50%);}
.frm-range .frm-range-slider span[class*=thumb-] {width: 20px; height: 20px; border-radius: 100%; border: 1px solid #ccc; background-color: #fff; top: 0; z-index: 1;}
.frm-range .frm-range-slider .entered-track {background-color: var(--col-gray);}
.frm-range .frm-range-slider .entered-value {background-color: var(--col-secondary);}
.frm-range .frm-range-slider .thumb-minimum {left: 0;}
.frm-range .frm-range-slider .thumb-maximum {right: 0;}

/* sub banner */
.sub-banner {width: 100%; max-width: 1200px; max-height: 300px; min-height: 240px; margin: 20px auto 0; border-radius: 4px; overflow: hidden; position: relative;}
.sub-banner .sbn-item {line-height: 0;}
.sub-banner button[class^="bn-"] {background-color: rgba(8, 11, 38, .1); color: #fff;}
.sub-banner button[class^="bn-"]:hover {background-color: var(--col-primary);}
.sub-banner .bn-prev-sb {left: 20px;}
.sub-banner .bn-next-sb {right: 20px;}
.sub-banner .swiper-pagination {position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%);}
.sub-banner:hover button[class^="bn-"] {opacity: 1;}

/* product item list */
.prod-item-list {width: 100%; height: auto; display: grid; grid-template-columns: repeat(4, minmax(209px, 1fr)); gap: 0 21px;}
/* SelfDesign item list */
.prod-selfitem-list {width: 100%; height: auto; display: grid; grid-template-columns: repeat(5, minmax(224px, 1fr)); gap: 0 20px;}
/* product item list : item asset */
.md-prod-list .prod-item {position: relative; padding-bottom: 40px;       width: 200px;}/* 출고사례 */
.prod-item-list .prod-item {position: relative; padding-bottom: 40px;       width: 225px;}/* 출고사례 */
.prod-item a {display: block; width: 100%;}
/* product item : picture */
.prod-item .item-pic {width: 100%; position: relative;}
.prod-item .item-pic .bdg-self {width: 60px !important; height: 60px; padding: 0; border: 0; border-radius: 0; position: absolute; top: 0; left: 0; z-index: 1;}
.prod-item .item-pic a {display: block; width: 100%; height: 100%;}
.prod-item .item-pic img {border-radius: 4px; transition: all .3s;}
/* product item : util button */
.prod-item .item-util {display: block; position: absolute; bottom: 15px; right: 15px; z-index: 1;}
.prod-item .item-util i[class^="icon-"] {display: block; width: 24px; height: 24px; opacity: .85; font-size: 0; background-repeat: no-repeat;}
.prod-item .item-util .icon-cart {background-image: var(--cart-icon-inactive);}
.prod-item .item-util .icon-wish {background-image: var(--wish-icon-inactive);}
.prod-item .item-util .item-cart.success .icon-cart {background-image: var(--cart-icon-active);}
.prod-item .item-util .item-wish.success .icon-wish {background-image: var(--wish-icon-active);}

/* product item : information */
.prod-item .item-info {width: 100%; height: auto; padding-top: 20px;}
.prod-item .item-info h4 {_width: 200px; font-weight: var(--ft-medium); font-size: var(--ft-size16); color: var(--col-black) !important; white-space:nowrap; text-overflow:ellipsis; word-break:break-all; overflow:hidden;}
.prod-item .item-info .item-desc {width: 100%; padding-top: 8px; color: var(--col-gray); white-space:nowrap; text-overflow:ellipsis; word-break:break-all; overflow:hidden;}
/* product item : price */
/*
.item-price {display: flex; align-items: flex-end; font-weight: var(--ft-semibold);}
.prod-item .item-info .item-price {padding: 20px 0 10px; display: flex; align-items: flex-end; gap: 10px; font-size: var(--ft-size16); font-weight: var(--ft-semibold); line-height: 16px;}
.prod-item .item-info .item-price .sale {color: #ff4040;}
.prod-item .item-info .item-price .price {color: var(--col-black) !important; }
.prod-item .item-info .item-price .discount {font-weight: var(--ft-medium); font-size: var(--ft-size13); color: var(--col-gray);}
.prod-item .item-info .item-price .call-me {font-weight: var(--ft-bold); font-size: var(--ft-size14); color: var(--col-secondary);}
*/
.item-price {display: flex; align-items: flex-end; font-weight: var(--ft-semibold);}
.item-price .sale {color: #ff4040;}
.item-price .price {color: var(--col-black) !important; }
.item-price .discount {font-weight: var(--ft-medium); font-size: var(--ft-size13); color: var(--col-gray);}
.item-price .call-me {font-weight: var(--ft-bold); font-size: var(--ft-size14); color: var(--col-secondary);}
.prod-item .item-info .item-price {padding: 20px 0 10px; gap: 10px; font-size: var(--ft-size16); line-height: 16px;}

/* product item : badge */
.prod-item .item-badge {padding-top: 8px; display: flex; gap: 4px;}
span[class^="bdg-"] {width: auto; height: 24px; padding: 0 10px; display: inline-flex; align-items: center; border: 1px solid; border-radius: 4px; font-size: 12px; font-family: var(--fm-eng); text-transform: uppercase;}
.item-badge .bdg-event {color: #2160ff; border-color: #bccfff;}
.item-badge .bdg-sale {color: #ff4040; border-color: #ff9f9f;}
/* product item : review */
.prod-item .item-review {padding-top: 4px; display: flex; align-items: center; gap: 8px;}
.prod-item .item-review .grades-wrap {display: flex;}
.prod-item .item-review .grades-wrap button {display: inline-block; width: 20px; height: 20px; background: url("../image/shop/star.svg") 0 0 / 100% no-repeat; margin-left: -2px; cursor: default;}
.prod-item .item-review .grades-wrap button.active {background: url("../image/shop/star_active.svg") 0 0 / 100% no-repeat;}
.prod-item .item-review .review {display: block; padding: 6px 8px; font-size: var(--ft-size13); color: var(--col-secondary); background-color: var(--col-bg2); border-radius: 4px;}
.prod-item .item-pic a:hover img {opacity: .75;}

/* head */
.shop-head {width: 100%; max-width: 1200px; height: auto; margin: 45px auto 30px; text-align: center;}

/* depth 2 category */
.sub-cate-wrap {width: 100%; max-width: 1200px; height: auto; margin: 0 auto;}
.sub-cate-wrap ul {width: 100%; height: auto; padding: 30px 0; border: 1px solid var(--col-line1); border-left: 0; border-right: 0; _display: flex;  text-align: center; display: inline-block; justify-content: center; gap: 40px;}
.sub-cate-wrap ul li {display: inline-block;     margin: 10px 10px;    }
.sub-cate-wrap ul li a {display: block; width: 100%; height: 100%; text-align: center; color: var(--col-gray);}
.sub-cate-wrap ul li a img {border-radius: 28px; border: 1px solid #fff; line-height: 0;}
.sub-cate-wrap ul li a span {display: block; padding-top: 10px;}
.sub-cate-wrap ul li a:hover {color: var(--col-black);}
.sub-cate-wrap ul li a:hover img {border-color: var(--col-line2);}
.sub-cate-wrap ul li .current {color: var(--col-secondary); font-weight: var(--ft-medium);}
.sub-cate-wrap ul li .current img {border-color: currentColor;}

/* shop order total */
.shop-order-total { color: var(--col-secondary);font-weight: var(--ft-bold); font-size: var(--ft-size16);text-align: right;}
.shop-order-total h2, .shop-order-total p  {     display: inline-block;    }
.shop-order-total .TotalCalOrder1 {    font-size: 14px;    font-weight: 600;    margin-left: 20px;  }
.shop-order-total .TotalCalOrder2 {    font-size: 12px;    font-weight: 600;    }
.shop-order-total .TotalCalOrder3 {    font-size: 20px;    font-weight: 600;       margin: 0 0 0 5px; }
.shop-order-total .TotalCalOrder31 {    font-size: 15px;    font-weight: 600;       margin: 0 10px 0 0px;     color: #8f92b6;    text-decoration: line-through; }
.shop-order-total .fn_order_totalPri_Org{
    text-decoration: line-through;
    color: #8f92b6;
    font-size: 14px;
}
.shop-order-total .fn_order_totalPri_Dis{       display: block;     }
.shop-order-addpoint{
    font-weight: var(--ft-bold);
    font-size: var(--ft-size14);
    text-align: right;
}
.shop-order-addpoint em{
    font-size: var(--ft-size16);
}

/* shop : order button */
.shop-order-btns {display: flex; gap: 8px;}
.shop-order-btns button {width: 100%;}

/* page : shop list */
.shop-list-wrap {width: 100%; max-width: 1200px; height: auto; padding-bottom: 96px; margin: 80px auto 0;}

/*.shop-list-wrap .shop-contains { width: 100%; gap: 64px; position: relative; display: flex; margin-top: 50px; margin-bottom: 75px;  }*/
.shop-list-wrap .shop-contains {width: 100%; height: auto; padding-top: 20px; display: flex; gap: 40px;}
.shop-list-wrap .shop-contains .prod-fillter {width: 240px; position: relative;}
.shop-list-wrap .sticky .prod-fillter{    position: sticky;
    position: sticky;
    flex-shrink: 0;
    height: 100%;
    max-height: calc(-120px + 100vh);
    top: 80px;
    border-bottom: 1px solid rgb(238, 238, 238);
    overflow: hidden scroll;
    scrollbar-width: none;
}



/* page : shop list sorting */
.sorting {width: 100%; height: auto; padding-bottom: 0; display: flex; justify-content: space-between; align-items: center;    padding: 0px 0 20px 0;}
.sorting .total {font-weight: var(--ft-semibold);}
.sorting .total mark {color: var(--col-secondary);}
.sorting .post-mode {display: flex;}
.sorting .post-mode li {display: flex; align-items: center;}
.sorting .post-mode li:not(:nth-child(1))::before {content: ''; display: block; width: 1px; height: 14px; margin: 0 10px; background-color: var(--col-line2);}
.sorting .post-mode li button {height: 32px; display: flex; align-items: center; color: var(--col-gray);}
.sorting .post-mode li button::before {content: ''; display: none; width: 18px; height: 18px; background-image: var(--check-blue-icon); background-position: center; background-size: 110%; background-repeat: no-repeat;}
.sorting .post-mode li button:hover {color: var(--col-black);}
.sorting .post-mode li button.selected {font-weight: var(--ft-semibold); color: var(--col-secondary); gap: 4px;}
.sorting .post-mode li button.selected::before {display: block;}

.sorting .post-mode select {    display: flex;    align-items: center;    margin-left: 30px;    border: 1px solid #adadad;    border-radius: 4px;    padding: 5px;}


/* page : shop list : fillter result */
.fillter-result {width: 100%; height: auto;padding: 0px 0 10px 0; display: inline-block; gap: 10px;}
.fillter-result button {width: auto; height: 32px; padding: 0 10px;margin: 2px 2px; display: inline-flex; align-items: center; border-radius: 4px; border: 1px solid var(--col-line2); color: var(--col-secondary); font-weight: var(--ft-medium); cursor: default;}
.fillter-result button .icon-close {display: block; padding-left: 4px; cursor: pointer; font-size: 18px; color: #a9acb3;}
.fillter-result button .color-selec {width: 20px; height: 20px; border-radius: 100%; font-size: 0;}
.fillter-result button .color-selec.color-white {border: 1px solid var(--col-line2);}

/* page : shop list : fillter */
.prod-fillter > p {font-weight: var(--ft-bold); font-size: var(--ft-size15); line-height: 32px;}
.prod-fillter > ul {margin-top: 10px; border-top: 1px solid var(--col-line2);}
.prod-fillter .item-cate {padding-top: 10px;}
.prod-fillter .item-cate li a {display: block; padding: 8px 0;}
.prod-fillter .fillter-list > li {border-bottom: 1px solid var(--col-line2);}
.prod-fillter .fillter-list > li > button {width: 100%; padding: 16px 0; display: flex; justify-content: space-between; align-items: center; font-weight: var(--ft-bold); font-size: var(--ft-size15);}
.prod-fillter .fillter-list .fillter-category{  display: block ;  max-height: 180px;    padding-bottom: 10px;    overflow-y: auto;  }
.prod-fillter .fillter-list .fillter-category .snd-item > li {margin-bottom: 10px; position: relative;}

.prod-fillter .fillter-list .fillter-content {display: none; _max-height: 180px; padding-bottom: 10px; overflow-y: auto;}
.prod-fillter .fillter-list .fillter-content .snd-item > li {margin-bottom: 10px; position: relative;}
.prod-fillter .fillter-list .fillter-content .snd-item li.GsColor {         margin-bottom: 0; _display: inline;    }
.prod-fillter .fillter-list .fillter-content li .add-icon {color: var(--col-gray); position: absolute; top: -2px; right: 0;}
.prod-fillter .fillter-list .snd-item.color {display: flex; flex-wrap: wrap; gap: 8px;}
.prod-fillter .fillter-list .snd-item.color > li {margin-bottom: 0;}
.prod-fillter .fillter-list .trd-item {padding: 6px 0 0 24px;}
.prod-fillter .fillter-list .price-range {color: var(--col-secondary); font-weight: var(--ft-medium);}
.prod-fillter .fillter-list .frm-inp-price {width: 100%; height: auto; margin-top: 16px; display: flex; align-items: center; gap: 10px;}
.prod-fillter .fillter-list .frm-inp-price input[type="text"] {width: 100%; padding: 8px; border: 1px solid var(--col-line2); border-radius: 4px; outline: none; text-align: right;}
.prod-fillter .filter-reset {width: 96px; height: 32px; font-weight: var(--ft-medium); position: absolute; top: 0; right: 0;}
.prod-fillter .filter-reset .material-icons {font-size: 18px; vertical-align: middle;}
.prod-fillter .filter-reset::after {display: none;}
.prod-fillter .fillter-list > li > button.active i {transform: rotate(-180deg);}

/* page : search : detail search */
.frm-sch-detail {width: 100%; max-width: 1200px; height: auto; margin: 0 auto;}
.frm-sch-detail p {font-weight: var(--ft-bold); font-size: var(--ft-size15);width: 100%;    text-align: center;}
.frm-sch-detail p mark {color: var(--col-secondary);}
.frm-sch-detail p mark span {     font-size: 20px;  }
/* detail search : category 1 */


.frm-sch-detail .cate-goods {width: 100%; height: auto;}
.frm-sch-detail .cate-goods ul {display: flex; justify-content: center; gap: 20px;    flex-wrap: wrap;}
.frm-sch-detail .cate-goods ul #AllSchGs {
    position: relative;
    font-weight: 600;
    margin-top: 55px;
    display: block;
        color: var(--col-secondary);
}
.frm-sch-detail .cate-goods ul #AllSchGs i {    display: block; text-align: center; }
.frm-sch-detail .cate-goods ul #AllSchGs i.AllSch_All {  font-size: 30px; }
.frm-sch-detail .cate-goods ul #AllSchGs i.AllSch_Num {  font-size: 20px; }
.frm-sch-detail .cate-goods ul #AllSchGs i.AllSch_Bot {  font-size: 16px;     padding-top: 30px;    }


.frm-sch-detail .cate-goods .it-check {width: 100px;display: block;}
.frm-sch-detail .cate-goods .it-check label {flex-wrap: wrap; justify-content: center; font-size: var(--ft-size16);}
.frm-sch-detail .cate-goods .it-check label:before {display: none; position: absolute; top: 0; left: 18px;}
.frm-sch-detail .cate-goods .it-check label i {display: flex; justify-content: center; align-items: center; width: 100px; height: 100px; margin-bottom: 20px; border-radius: 100%;
    border: 1px solid #fff; background-color: #f2f3f4; font-weight: var(--ft-bold); overflow: hidden;    box-shadow: 3px 3px 3px 0px #999;}
/* detail search : category 1 : hover + checked */
.frm-sch-detail .cate-goods li:hover .it-check label {color: var(--col-black);}
.frm-sch-detail .cate-goods li:hover .it-check label i {border-color: var(--col-line2);}
.frm-sch-detail .cate-goods .it-check input[type="checkbox"]:checked + label {color: var(--col-secondary);}
.frm-sch-detail .cate-goods .it-check input[type="checkbox"]:checked + label i {border-color: var(--col-secondary);}
.frm-sch-detail .cate-goods .it-check input[type="checkbox"]:checked + label::before {display: inline-block;}
.frm-sch-detail .cate-goods-bg {    width: 100%;    height: 150px;    background: #efefef;    margin-top: -120px;    border-radius: 10px;}

/* detail search : category 2, 3 */
.frm-sch-detail .cate-goods-wrap {width: 100%; height: auto;}
.frm-sch-detail .cate-goods-wrap .inner {border-top: 1px solid var(--col-line1); padding-top: 30px; margin-top: 30px;}
.frm-sch-detail .cate-goods-wrap .inner ul {width: 100%; height: auto; margin-top: 20px; display: flex; align-items: center; gap: 5px;    flex-wrap: wrap;}

/* detail search : type */
.frm-sch-detail .cate-goods-type {width: 100%; height: auto; margin-top: 30px;}
.frm-sch-detail .cate-goods-type .inner {display: grid; grid-template-columns: 160px 1fr;}
.frm-sch-detail .cate-goods-type .inner p {padding: 10px 20px; background-color: var(--col-bg); border-top: 1px solid var(--col-line2); display: flex; align-items: center;}
.frm-sch-detail .cate-goods-type .inner ul {padding: 10px 20px; border-top: 1px solid var(--col-bg2); display: flex; flex-wrap: wrap; align-items: center; gap: 10px;}
.frm-sch-detail .cate-goods-type .inner ul .GsColor{width: 70px;}
.frm-sch-detail .cate-goods-type .inner ul .GsColor label span {    margin-left: 15px;  }
.frm-sch-detail .cate-goods-type .inner:last-child p {border-bottom: 1px solid var(--col-line2);}
.frm-sch-detail .cate-goods-type .inner:last-child ul {border-bottom: 1px solid var(--col-bg2);}
/* detail search : button */
.frm-sch-detail .bt-sch-group {width: 100%; height: auto; margin-top: 20px; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px;}
.frm-sch-detail .bt-sch-group button[type="reset"]::after {display: none;}

/* search result */
.sch-result-wrap {width: 100%; max-width: 1200px; height: auto; margin: 50px auto 96px;}
.sch-result-wrap .prod-item-list {grid-template-columns: repeat(5, minmax(224px, 1fr));}

/* customer : sub navigation bar : link */
.bt-help-group {width: 100%; height: auto; margin-top: 48px; display: grid; gap: 4px;}
.bt-help-group a {display: block; width: 100%; height: auto; padding: 16px; border: 1px solid var(--col-line2); border-radius: 4px; position: relative;}
.bt-help-group a strong {display: flex; align-items: center; gap: 8px; font-weight: var(--ft-semibold);}
.bt-help-group a span {display: block; color: var(--col-gray); line-height: 1.2;}
.bt-help-group a .more {position: absolute; right: 10px; color: #a9acb3;}
.bt-help-group .bt-contact span {padding-top: 4px;}
.bt-help-group .bt-contact .more {top: 50%; transform: translateY(-50%);}
.bt-help-group .bt-download strong i {color: var(--col-primary);}
.bt-help-group .bt-download span {padding-top: 16px; margin-top: 16px; border-top: 1px solid var(--col-line1);}
.bt-help-group .bt-download .more {top: 16px;}
.bt-help-group .bt-credit {display: flex; align-items: center; justify-content: center; gap: 8px; padding: 10px; background-color: var(--col-primary); color: #fff; border: 0; font-weight: var(--ft-semibold);}
.bt-help-group a:hover {border-color: var(--col-secondary);}
.bt-help-group a:hover strong i, .bt-help-group a:hover .more {color: var(--col-secondary);}
.bt-help-group .bt-credit:hover {background-color: var(--col-gray);}



/* shop : quantity */
.shop-quantity-wrap {width: 100%; height: auto; display: flex; justify-content: space-between; align-items: center;}
.shop-quantity {display: inline-flex; border: 1px solid var(--col-line2);}
.shop-quantity button[type="button"] {width: 30px !important; height: 30px; background-color: #f2f3f4; position: relative;}
.shop-quantity button[type="button"]:before, .shop-quantity button[type="button"]:after {content: ''; display: block; background-color: var(--col-black); position: absolute;}
.shop-quantity button[type="button"]:before {width: 10px; height: 2px; top: 14px; left: 10px;}
.shop-quantity button[type="button"]:after {width: 2px; height: 10px; top: 10px; left: 14px;}
.shop-quantity button.down:after {display: none;}
.shop-quantity input {width: 36px; height: 30px; text-align: center; outline: none; border: 1px solid var(--col-line2); border-top: 0; border-bottom: 0;}
.shop-quantity-wrap .opt-item-price {font-weight: var(--ft-semibold); font-size: var(--ft-size14);}

/* page : shop view */
.shop-veiw-wrap {width: 100%; max-width: 1200px; height: auto; margin: 0 auto; padding-bottom: 96px; display: flex;}
.shop-veiw-wrap .goods-item-wrap {width: 880px;}
.shop-veiw-wrap .goods-item-opt {width: 320px; height: 100%; position: sticky; top: 67px;}
.shop-veiw-wrap .goods-item-opt .opt-wrap {width: 100%; height: auto; padding-left: 20px; display: flex; flex-direction: column; gap: 6px;}
.shop-veiw-wrap .goods-item-opt .opt-wrap #rsSelOptValue{     font-size: 10px; text-align: center; }

/* page : shop view : view info */
.view-info {width: 100%; height: auto; display: flex;}
.view-info .goods-picture {width: 400px; height: auto; line-height: 0;}
.view-info .goods-picture .bt-zoom {display: block; width: 48px; height: 48px; border-radius: 100%; background: url("../image/common/search_white.svg") center no-repeat rgba(0, 0, 0, .3); font-size: 0; position: absolute; bottom: 10px; right: 10px; z-index: 99;}
.view-info .goods-picture .thumb-slider {width: 100%; height: auto; margin-top: 20px;}
.view-info .goods-picture .thumb-slider .swiper-slide {border: 1px solid #fff; cursor: pointer;}
/*.view-info .goods-picture .thumb-slider .swiper-slide-thumb-active {border: 1px solid var(--col-secondary);}*/
.view-info .goods-picture .swiper-wrapper .PicMedium img{width: 400px; height: 400px; line-height: 0;display: block;background-image: url(/images/goods_bg.jpg);}


.view-info .goods-info {width: calc(100% - 400px); padding: 0 20px;}
.view-info .goods-info .item-badge {padding-bottom: 20px;}
.view-info .goods-info .item-badge em {font-weight: var(--ft-medium); font-size: var(--ft-size13); color: #2160ff;}
.view-info .goods-info h3 {font-weight: var(--ft-bold); font-size: var(--ft-size20); letter-spacing: -0.02em;}
.view-info .goods-info .item-price {padding: 24px 0; gap: 16px; font-size: var(--ft-stitle); letter-spacing: -0.04em;}
.view-info .goods-info .item-price .sale {font-weight: var(--ft-bold);}
.view-info .goods-info .item-price .discount {font-size: var(--ft-size16); letter-spacing: 0;}
.view-info .goods-info .pointtxt {font-size: var(--ft-size14);
    letter-spacing: 0;
    font-weight: var(--ft-bold);
    position: absolute;
    margin-top: -22px;
    color: #0400ff;}
.view-info .goods-info .item-info {border-top: 1px solid var(--col-line2); font-size: var(--ft-size13);}
.view-info .goods-info .item-info ul {padding: 10px 0; border-bottom: 1px solid var(--col-line2);}
.view-info .goods-info .item-info ul li {display: flex; gap: 4px; padding: 10px 0;  align-items: center;}
.view-info .goods-info .item-info ul li b {width: 60px;    flex-shrink: 0;}
.view-info .goods-info .item-info ul li span {color: #4f4f4f;}
.view-info .goods-info .item-info ul li span.DeliveryWay .DeliveryWayImg { width: 36px;}
.view-info .goods-info .item-info ul li span.ProdUint {   display: block;  }
.view-info .goods-info .item-util-btns {width: 100%; height: auto; margin-top: 20px; display: flex; justify-content: flex-end; gap: 8px;}
.view-info .goods-info .item-util-btns .item-self {width: calc(100% - 56px); height: 56px;}
.view-info .goods-info .item-util-btns .item-wish {width: 56px; height: 56px; border: 1px solid var(--col-line2); border-radius: 4px; font-size: 0; display: grid; place-items: center;}
.view-info .goods-info .item-util-btns .item-wish .icon-wish {display: block; width: 30px; height: 30px; opacity: .5; background-image: var(--wish-icon-inactive); background-position: center; background-size: 100%;}
.view-info .goods-info .item-util-btns .item-wish.success .icon-wish {opacity: .85; background-image: var(--wish-icon-active);}

/* page : shop view : best goods */
.best-goods {width: 100%; height: auto; margin-top: 40px; position: relative;}
.best-goods h4 {font-weight: var(--ft-bold);}
.best-goods .prod-item-list {margin-top: 20px;}
.best-goods .prod-item-list .prod-item {width: 156px !important; padding-bottom: 0;}
.best-goods .prod-item-list .prod-item .item-util {bottom: 4px; right: 4px;}
.best-goods .prod-item-list .prod-item .item-info h4 {font-size: var(--ft-size14); white-space: normal; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.2;}
.best-goods .prod-item-list .prod-item .item-info .item-price {padding: 10px 0 0; flex-wrap: wrap; gap: 2px 10px; font-size: var(--ft-size14);}
.best-goods .prod-item-list .prod-item .item-info .item-price .sale {width: 100%;}
.best-goods .slider-btns {display: flex; position: absolute; top: 0; right: 20px;}
.best-goods .slider-btns button {width: 24px; height: 24px; margin-left: -1px; border: 1px solid var(--col-line2); color: var(--col-gray);}
.best-goods .slider-btns button i {line-height: 22px;}
.best-goods .slider-btns button.bn-prev {border-radius: 4px 0 0 4px;}
.best-goods .slider-btns button.bn-next {border-radius: 0 4px 4px 0;}

/* page : shop view : goods detail : tabmenu */
.goods-detail-wrap {width: 100%; height: auto; margin-top: 60px;}
.goods-detail-wrap .goods-tab {width: 100%; height: auto; display: flex;}
.goods-detail-wrap .goods-tab li {flex: 1; text-align: center;}
.goods-detail-wrap .goods-tab li a {display: block; width: 100%; line-height: 56px; border: 1px solid var(--col-line2); border-left: 0; border-right: 0; color: var(--col-gray); font-weight: var(--ft-medium); background-color: #fff;}
.goods-detail-wrap .goods-tab li a:hover {color: var(--col-black);}
.goods-detail-wrap .goods-tab li .current {background-color: var(--col-primary); color: #fff !important; border-color: var(--col-primary);}
.goods-detail-wrap .goods-tab li:nth-child(1) a {border-left: 1px solid var(--col-line2);}
.goods-detail-wrap .goods-tab li:nth-child(1) .current {border-left-color: var(--col-primary);}
.goods-detail-wrap .goods-tab li:last-child a {border-right: 1px solid var(--col-line2);}
.goods-detail-wrap .goods-tab li:last-child .current {border-right-color: var(--col-primary);}
.goods-detail-wrap .goods-tabcont {width: 100%; height: auto; margin-top: 70px;}

.goods-detail-wrap .GsRegGsType .GsRegGsTypeSub { color: var(--col-black);
    font-size: var(--ft-size20);
    margin: 30px 0 5px 0;
    display: block;   }
.goods-detail-wrap .GsRegGsType .GsRegGsTypeTable {
        border: 1px solid #dedede;
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 30px;
}
.goods-detail-wrap .GsRegGsType .GsRegGsTypeTable th {
    border: 1px solid #dedede;
    padding: 10px;
    background-color: #f1f1f1;
    color: #454545;
    width: 230px;
}
.goods-detail-wrap .GsRegGsType .GsRegGsTypeTable td {
    border: 1px solid #dedede;
    padding: 10px;
}
/* page : shop view : goods detail : tab contents : #item-detail */
.hanadesign-selec {width: 100%; height: auto; padding-bottom: 60px;}
.hanadesign-selec p {width: 100%; line-height: 56px; text-align: center; background-color: var(--col-gray); color: #fff; font-weight: var(--ft-semibold); font-size: var(--ft-size16); overflow: hidden; position: relative;}
.hanadesign-selec p:before {content: ''; display: inline-block; width: 30px; height: 100%; background-color: rgba(255, 255, 255, .5); position: absolute; top: 0; left: 0; animation: btn-effect 3s ease-in-out infinite;}
.hanadesign-selec ul {width: 100%; height: auto; padding: 20px 16px; background-color: #f2f2f2; display: grid; grid-template-columns: repeat(6, 1fr); column-gap: 4px;}
.hanadesign-selec ul li {padding: 8px; border: 1px solid #ececec; border-radius: 4px; background-color: #fff;}
.hanadesign-selec ul li .lsbtn-NewDes {       background-color: #ebefff;    border: 1px solid #d1ddff;    border-radius: 5px;  }
.hanadesign-selec ul li .btnSelfDes  {    width: 120px;      height: 100%;    margin: 0;    font-size: 20px; }
.hanadesign-selec ul li .picture {display: flex; flex-direction: column; align-items: center; gap: 10px; _width: 110px; height: auto; position: relative;}
/*
.hanadesign-selec ul li .picture::before {content: ''; display: none; width: 100%; height: 100%; background-color: rgba(0, 0, 0, .5); position: absolute; top: 0; left: 0; z-index: 1;}
*/
.hanadesign-selec ul li .picture .more {display: none; color: #fff; font-weight: var(--ft-semibold); text-align: center; position: absolute; top: 50%; left: 50%; z-index: 2; transform: translate(-50%, -50%);}
.hanadesign-selec ul li .picture .more i {display: block; width: 70px; height: 70px; margin-bottom: 10px; border-radius: 100%; background-color: #fff; position: relative;}
.hanadesign-selec ul li .picture .more i::before, .hanadesign-selec ul li .picture .more i::after {content: ''; display: block; background-color: var(--col-black); position: absolute;}
.hanadesign-selec ul li .picture .more i::before {width: 26px; height: 3px; top: 33px; left: 22px;}
.hanadesign-selec ul li .picture .more i::after {width: 3px; height: 26px; top: 22px; left: 33px;}
.hanadesign-selec ul li em {display: block; padding-bottom: 4px; font-weight: var(--ft-bold); font-size: var(--ft-size13);}
.hanadesign-selec ul li button {width: 100%; height: 36px; margin-top: 10px; border: 1px solid var(--col-line2); border-radius: 4px; font-weight: var(--ft-semibold);}
.hanadesign-selec ul li:hover {box-shadow: 0 5px 10px rgba(0, 0, 0, .2);}
.hanadesign-selec ul li:hover .picture {cursor: pointer;}
.hanadesign-selec ul li:hover .picture::before {display: block;}
.hanadesign-selec ul li:hover .picture .more {display: block;}
.hanadesign-selec ul li button:hover {border-color: var(--col-primary); background-color: var(--col-primary); color: #fff;}



#item-reviews > h4 {padding-bottom: 10px; font-weight: var(--ft-bold); font-size: var(--ft-stitle);}
#item-reviews p {color: var(--col-gray);}
#item-reviews .blue-star {    color: #50a6ff;   }
#item-reviews .grey-star {    color: #e4e4e4;   }

#item-reviews .item-bo-wrap {width: 100%; height: auto; margin-top: 30px; position: relative;}
#item-reviews .data-util {width: auto; height: 40px;}
#item-reviews .data-util fieldset {display: flex; justify-content: flex-end; align-items: center; gap: 16px;}
#item-reviews .post-list-table .thead {margin-top: 20px; border-top: 2px solid var(--col-primary); border-bottom: 1px solid #f2f3f4; background-color: #f7f8fc; font-weight: var(--ft-semibold); display: grid; grid-template-columns: 100px 1fr 90px 90px; text-align: center;}
#item-reviews .post-list-table .thead li {padding: 20px 0;}
#item-reviews .post-list-table .tbody .rev {width: 100%; padding: 12px 0; display: grid; grid-template-columns: 100px 1fr 90px 90px; align-items: center; color: var(--col-gray); border-bottom: 1px solid #f2f3f4; text-align: center;}
#item-reviews .post-list-table .tbody .rev .star img{   width: 14px;    }
#item-reviews .post-list-table .tbody .rev .status {width: 80px; line-height: 32px;}
#item-reviews .post-list-table .tbody .rev .status.complet {background-color: var(--col-bg2); border-radius: 4px; color: var(--col-secondary);}
#item-reviews .post-list-table .tbody .rev .subject {text-align: left; white-space: nowrap; text-overflow: ellipsis; word-break: break-all; overflow: hidden; cursor: pointer;}
#item-reviews .post-list-table .tbody .NoAnswer { gap: 20px;    display: flex;}
#item-reviews .post-list-table .tbody .post-cont {padding: 20px; background-color: #f9f9f9; border-bottom: 1px solid #f2f3f4;}
#item-reviews .post-list-table .tbody .post-cont span[class^="icon-"] {display: block; width: 32px; height: 32px; background-size: 100%; font-size: 0;    background-repeat: no-repeat;}
#item-reviews .post-list-table .tbody .post-cont .RewImage{    width: 160px;    display: inline-block;    margin-top: 20px;  }

/*#item-reviews .post-list-table .tbody .post-cont span:nth-child(1){      width: 25px;    }
#item-reviews .post-list-table .tbody .post-cont span:nth-child(2){      width: 680px;    }
#item-reviews .post-list-table .tbody .post-cont span:nth-child(3){      _width: 100px;    }*/
#item-reviews .post-list-table .tbody .post-cont .icon-rev {background-image: url("../image/shop/icon_que.svg");}
#item-reviews .post-list-table .tbody .post-cont .icon-ans {background-image: url("../image/shop/icon_ans_blue.svg");}
#item-reviews .post-list-table .tbody .post-cont .RevCont {display: block;}
#item-reviews .post-list-table .tbody .post-cont .RevImg {display: block;}
#item-reviews .post-list-table .tbody .post-cont .user-adm {display: flex; align-items: center; gap: 20px; border-left: 1px solid var(--col-line2); padding-left: 20px;}
#item-reviews .post-list-table .tbody .post-cont .user-adm button:hover {color: var(--col-black);}
#item-reviews .post-list-table .tbody .post-cont .ans {  border-top: 1px solid #f2f3f4;    padding-top: 5px;   }
#item-reviews .post-list-table .tbody .post-cont .ans p {padding-top: 8px; line-height: 1.4; color: var(--col-black);}
#item-reviews .item-bo-wrap .bt-qa-write {position: absolute; top: 0; left: 0;}
#item-reviews .item-bo-wrap .bt-qa-write::after {display: none;}






.add_review .review_text{color:#8f929c; font-size:14px; line-height:16px; letter-spacing:-0.7px;}
.add_review .review_photo{position:relative; margin-top:10px; font-size:0; line-height:0;}
.add_review .review_photo .photo_item{display:inline-block; overflow:hidden; position:relative; width:123px; height:123px; vertical-align:top;}
.add_review .review_photo .photo_item:nth-child(1){border-radius:5px 0 0 5px;}
.add_review .review_photo .photo_item:nth-child(7){border-radius:0 5px 5px 0;}
.add_review .review_photo .photo_item.more{display:none; position:absolute; top:0; right:1px; z-index:1; border-radius:0 5px 5px 0; background:rgba(0,0,0,0.4); color:#fff; font-size:16px; font-weight:600; line-height:23px;}
.add_review .review_photo .photo_item:nth-child(7) + .photo_item.more{display:block;}
.add_review .review_photo .photo_item + .photo_item{margin-left:3px;}
.add_review .review_photo .photo_item .photo_btn{width:100%; height:100%;}
.add_review .review_photo .photo_item .photo_btn img{width:100%; transition:all .25s ease-in-out;}
.add_review .review_photo .photo_item .photo_btn:hover{opacity:.9;}
.add_review .review_photo .photo_item .photo_btn:hover img{opacity:.8; transform:scale(1.05);}
.add_review .review_count{margin-top:20px; color:#6f6f6f; font-size:16px; line-height:18px; letter-spacing:-1px;}
.add_review .review_count span{font-weight:500;}
.add_review .review_count .review_array{float:right; color:#aeaeae; font-size:14px;}
.add_review .review_count .review_array:hover{color:#6f6f6f;}
.add_review .review_list{margin-top:10px; border-top:1px solid #bfbfbf;}
.add_review .review_list .review_item{position:relative; padding:22px 0 22px 204px; border-bottom:1px solid #e7e7e7;}
.add_review .review_list .review_item .review_info{position:absolute; top:22px; left:0;}
.add_review .review_list .review_item .review_info .info_box .info_best{display:inline-block; width:81px; height:22px; margin-right:8px; border-radius:11px; background-color:#3374ff; color:#fff; font-size:13px; font-weight:600; text-align:center; line-height:23px; vertical-align:top; letter-spacing:-1px;}
.add_review .review_list .review_item .review_info .info_box .info_name{color:#888; font-size:14px; font-weight:500; line-height:22px;}
.add_review .review_list .review_item .review_info .info_star{margin-top:12px;}
.add_review .review_list .review_item .review_info .info_star .star_btn{display:inline-block; font-size:0; line-height:0; vertical-align:top;}
.add_review .review_list .review_item .review_info .info_star .star_btn button{width:16px; height:16px; background:url(/images/add_review_star.png) no-repeat center / 100%; vertical-align:top;}
.add_review .review_list .review_item .review_info .info_star .star_btn button.active{background-image:url(/images/add_review_star_active.png);}
.add_review .review_list .review_item .review_info .info_star .star_btn button + button{margin-left:2px;}
.add_review .review_list .review_item .review_info .info_star .star_num{display:inline-block; color:#000; font-size:16px; font-weight:600; line-height:16px; vertical-align:top;}
.add_review .review_list .review_item .review_cont .cont_head .cont_title{margin-right:20px; color:#888; font-size:16px; font-weight:500; line-height:22px;}
.add_review .review_list .review_item .review_cont .cont_head .cont_date{color:#9b9b9b; font-size:14px; font-weight:500; line-height:22px;}
.add_review .review_list .review_item .review_cont .cont_body{margin-top:5px;}
.add_review .review_list .review_item .review_cont .cont_body .cont_text{color:#373737 !important; font-size:16px; font-weight:500; line-height:20px; word-break:break-all;}
.add_review .review_list .review_item .review_cont .cont_body .photo_list{margin-top:15px; font-size:0; line-height:0;}
.add_review .review_list .review_item .review_cont .cont_body .photo_list .photo_item{display:inline-block; overflow:hidden; width:123px; height:123px; vertical-align:top;}
.add_review .review_list .review_item .review_cont .cont_body .photo_list .photo_item:first-child{border-radius:5px 0 0 5px;}
.add_review .review_list .review_item .review_cont .cont_body .photo_list .photo_item:last-child{border-radius:0 5px 5px 0;}
.add_review .review_list .review_item .review_cont .cont_body .photo_list .photo_item + .photo_item{margin-left:4px;}
.add_review .review_list .review_item .review_cont .cont_body .photo_list .photo_item button{width:100%; height:100%;}
.add_review .review_list .review_item .review_cont .cont_body .photo_list .photo_item button img{width:100%; transition:all .25s ease-in-out;}
.add_review .review_list .review_item .review_cont .cont_body .photo_list .photo_item button:hover img{opacity:.9; transform:scale(1.05);}
.add_review_popup{opacity:0; visibility:hidden; position:fixed; top:0; left:0; right:0; bottom:0; z-index:9999; background-color:rgba(71,71,71,0.5); transition:all .5s ease-in-out; overflow-x:hidden; overflow-y:auto;}
.add_review_popup.active{opacity:1; visibility:inherit;}
.add_review_popup .popup_box{position:absolute; top:50%; left:0; right:0; width:845px; max-height:calc(100vh - 40px); margin:auto; padding:66px 45px 45px 45px; border-radius:10px; background-color:#fff; transform:translateY(-50%);}
.add_review_popup .popup_title{color:#0b1843; font-size:24px; font-weight:500; line-height:26px; letter-spacing:-0.7px;}
.add_review_popup .popup_review_list{margin: 20px -23px -3px 0;font-size:0;line-height:0;overflow-x: hidden;overflow-y: auto;max-height:630px;}
.add_review_popup .popup_review_list .photo_item{display:inline-block; overflow:hidden; width:123px; height:123px; margin:0 3px 3px 0; vertical-align:top;}
.add_review_popup .popup_review_list .photo_item .photo_btn img{width:100%; transition:all .25s ease-in-out;}
.add_review_popup .popup_review_list .photo_item .photo_btn:hover img{opacity:.8; transform:scale(1.05);}
.add_review_popup .popup_list{display:block; width:228px; margin:20px auto 0 auto; padding-left:90px; border-radius:23px; background:#ccc url(/image/shop/add_review_list.png) no-repeat left 62px top 12px; color:#fff; font-size:15px; font-weight:700; text-align:left; line-height:46px; transition:background-color .25s ease-in-out;}
.add_review_popup .popup_list:hover{background-color:#bbb;}
.add_review_popup .popup_close{position:absolute; top:45px; right:45px; width:26px; height:26px; background:url(/images/add_review_close.png) no-repeat center; font-size:0;}
.add_review_popup .case_slide{margin-top:20px;}
.add_review_popup .case_slide .swiper-slide .popup_img{overflow:hidden; border-radius:10px;}
.add_review_popup .case_slide .swiper-slide .popup_img img{width:100%;}
.add_review_popup .case_slide .swiper-slide .popup_info{position:relative; margin-top:5px; padding-left:94px;}
.add_review_popup .case_slide .swiper-slide .popup_info .info_date{position:absolute; top:0; left:0; color:#9b9b9b; font-size:14px; line-height:18px;}
.add_review_popup .case_slide .swiper-slide .popup_info .info_title{color:#888; font-size:16px; font-weight:500; line-height:18px;}
.add_review_popup.caseDetail .popup_box{width:478px;}
.add_review_popup .swiper-button-prev,
.add_review_popup .swiper-button-next{top:calc(50% - 30px) !important; width:22px !important; height:60px !important; background:url(/image/shop/add_review_arrow.png) no-repeat; font-size:0;}
.add_review_popup .swiper-button-prev{left:-50px; transform:rotate(180deg);}
.add_review_popup .swiper-button-next{right:-50px;}
.add_review_popup.reviewDetail .popup_box .review_slide{margin-top:20px;}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_img{display:inline-block; width:387px; font-size:0; line-height:0; vertical-align:top;}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_img .review_photo_slide{overflow:hidden; border-radius:10px;}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_img .review_photo_slide .swiper-slide{}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_img .review_photo_slide .swiper-slide img{width:100%;}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_img .review_thumb_slide{margin-top:12px;}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_img .review_thumb_slide .swiper-slide{overflow:hidden; border-radius:5px; background-color:#000;}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_img .review_thumb_slide .swiper-slide.swiper-slide-thumb-active img{opacity:.6;}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_img .review_thumb_slide .swiper-slide + .swiper-slide{}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_img .review_thumb_slide .swiper-slide img{width:100%; transition:opacity .25s ease-in-out;}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_detail_info{display:inline-block; float:right; width:calc(100% - 404px); vertical-align:top;}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_detail_info .info_best{display:inline-block; width:81px; height:22px; margin-right:8px; border-radius:11px; background-color:#3374ff; color:#fff; font-size:13px; font-weight:600; text-align:center; line-height:23px; vertical-align:top; letter-spacing:-1px;}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_detail_info .info_top{margin-top:10px;}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_detail_info .info_top .info_name{display:inline-block; color:#888; font-size:20px; font-weight:500; line-height:28px; vertical-align:top;}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_detail_info .info_top .info_star{float:right;}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_detail_info .info_top .info_star .star_btn{display:inline-block; font-size:0; line-height:0; vertical-align:top;}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_detail_info .info_top .info_star .star_btn button{width:28px; height:28px; background:url(/images/add_review_star.png) no-repeat center / 100%; vertical-align:top;}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_detail_info .info_top .info_star .star_btn button.active{background-image:url(/images/add_review_star_active.png);}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_detail_info .info_top .info_star .star_btn button + button{margin-left:3px;}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_detail_info .info_top .info_star .star_num{margin-left:8px; font-size:20px; font-weight:600; line-height:28px;}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_detail_info .info_date{margin-top:12px; color:#9b9b9b; font-size:14px; font-weight:500; line-height:16px;}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_detail_info .info_title{margin-top:12px; color:#888; font-size:16px; font-weight:500; line-height:22px;}
.add_review_popup.reviewDetail .popup_box .review_slide .popup_detail_info .info_text{margin-top:12px; color:#373737 !important; font-size:16px; font-weight:500; line-height:20px; word-break:break-all;}
@media (max-height:833px){
    .add_review_popup .popup_review_list{max-height:calc(100vh - 197px);}
}








#item-review > h4 {padding-bottom: 10px; font-weight: var(--ft-bold); font-size: var(--ft-stitle);}
#item-review p {color: var(--col-gray);}
#item-review .blue-star {    color: #50a6ff;   }
#item-review .grey-star {    color: #e4e4e4;   }

#item-review .item-bo-wrap {width: 100%; height: auto; margin-top: 30px; position: relative;}
#item-review .data-util {width: auto; height: 40px;}
#item-review .data-util fieldset {display: flex; justify-content: flex-end; align-items: center; gap: 16px;}
#item-review .post-list-table .thead {margin-top: 20px; border-top: 2px solid var(--col-primary); border-bottom: 1px solid #f2f3f4; background-color: #f7f8fc; font-weight: var(--ft-semibold); display: grid; grid-template-columns: 100px 1fr 90px 90px; text-align: center;}
#item-review .post-list-table .thead li {padding: 20px 0;}
#item-review .post-list-table .tbody .rev {width: 100%; padding: 12px 0; display: grid; grid-template-columns: 100px 1fr 90px 90px; align-items: center; color: var(--col-gray); border-bottom: 1px solid #f2f3f4; text-align: center;}
#item-review .post-list-table .tbody .rev .star img {width: 14px;}
#item-review .post-list-table .tbody .rev .status {width: 80px; line-height: 32px;}
#item-review .post-list-table .tbody .rev .status.complet {background-color: var(--col-bg2); border-radius: 4px; color: var(--col-secondary);}
#item-review .post-list-table .tbody .rev .subject {text-align: left;}
#item-review .post-list-table .tbody .NoAnswer { gap: 20px;    display: flex;}
#item-review .post-list-table .tbody .post-cont {padding: 20px; background-color: #f9f9f9; border-bottom: 1px solid #f2f3f4;}
#item-review .post-list-table .tbody .post-cont span[class^="icon-"] {display: block; width: 32px; height: 32px; background-size: 100%; font-size: 0;    background-repeat: no-repeat;}
#item-review .post-list-table .tbody .post-cont span:nth-child(1){      width: 25px;    }
#item-review .post-list-table .tbody .post-cont span:nth-child(2){      width: 680px;    }
#item-review .post-list-table .tbody .post-cont span:nth-child(3){      _width: 100px;    }
#item-review .post-list-table .tbody .post-cont .icon-rev {background-image: url("../image/shop/icon_que.svg");}
#item-review .post-list-table .tbody .post-cont .icon-ans {background-image: url("../image/shop/icon_ans_blue.svg");}
#item-review .post-list-table .tbody .post-cont > p {_display: flex; align-items: center; gap: 20px;}
#item-review .post-list-table .tbody .post-cont .user-adm {display: flex; align-items: center; gap: 20px; border-left: 1px solid var(--col-line2); padding-left: 20px;}
#item-review .post-list-table .tbody .post-cont .user-adm button:hover {color: var(--col-black);}
#item-review .post-list-table .tbody .post-cont .ans {  border-top: 1px solid #f2f3f4;    padding-top: 5px;   }
#item-review .post-list-table .tbody .post-cont .ans p {padding-top: 8px; line-height: 1.4; color: var(--col-black);}
#item-review .item-bo-wrap .bt-qa-write {position: absolute; top: 0; left: 0;}
#item-review .item-bo-wrap .bt-qa-write::after {display: none;}





/* page : shop view : goods detail : tab contents : #item-qa */
#item-qa > h4 {padding-bottom: 10px; font-weight: var(--ft-bold); font-size: var(--ft-stitle);}
#item-qa p {color: var(--col-gray);}
#item-qa .item-bo-wrap {width: 100%; height: auto; margin-top: 30px; position: relative;}
#item-qa .data-util {width: auto; height: 40px;}
#item-qa .data-util fieldset {display: flex; justify-content: flex-end; align-items: center; gap: 16px;}
#item-qa .post-list-table .thead {margin-top: 20px; border-top: 2px solid var(--col-primary); border-bottom: 1px solid #f2f3f4; background-color: #f7f8fc; font-weight: var(--ft-semibold); display: grid; grid-template-columns: 100px 1fr 90px 90px; text-align: center;}
#item-qa .post-list-table .thead li {padding: 20px 0;}
#item-qa .post-list-table .tbody .que {width: 100%; padding: 12px 0; display: grid; grid-template-columns: 100px 1fr 90px 90px; align-items: center; color: var(--col-gray); border-bottom: 1px solid #f2f3f4; text-align: center;}
#item-qa .post-list-table .tbody .que .status {width: 80px; line-height: 32px;}
#item-qa .post-list-table .tbody .que .status.complet {background-color: var(--col-bg2); border-radius: 4px; color: var(--col-secondary);}
#item-qa .post-list-table .tbody .que .subject {text-align: left; white-space: nowrap; text-overflow: ellipsis; word-break: break-all; overflow: hidden; cursor: pointer;}
#item-qa .post-list-table .tbody .NoAnswer { gap: 20px;    display: flex;}
#item-qa .post-list-table .tbody .post-cont {padding: 20px; background-color: #f9f9f9; border-bottom: 1px solid #f2f3f4;}
#item-qa .post-list-table .tbody .post-cont span[class^="icon-"] {display: block; width: 32px; height: 32px; background-size: 100%; font-size: 0;    background-repeat: no-repeat;}
#item-qa .post-list-table .tbody .post-cont span:nth-child(1){      width: 25px;    }
#item-qa .post-list-table .tbody .post-cont span:nth-child(2){      width: 680px;    }
#item-qa .post-list-table .tbody .post-cont span:nth-child(3){      _width: 100px;    }
#item-qa .post-list-table .tbody .post-cont .icon-que {background-image: url("../image/shop/icon_que.svg");}
#item-qa .post-list-table .tbody .post-cont .icon-ans {background-image: url("../image/shop/icon_ans_blue.svg");}
#item-qa .post-list-table .tbody .post-cont > p {display: flex; align-items: center; gap: 20px;}
#item-qa .post-list-table .tbody .post-cont .user-adm {display: flex; align-items: center; gap: 20px; border-left: 1px solid var(--col-line2); padding-left: 20px;}
#item-qa .post-list-table .tbody .post-cont .user-adm button:hover {color: var(--col-black);}
#item-qa .post-list-table .tbody .post-cont .ans {  border-top: 1px solid #f2f3f4;    padding-top: 5px;   }
#item-qa .post-list-table .tbody .post-cont .ans p {padding-top: 8px; line-height: 1.4; color: var(--col-black);}
#item-qa .item-bo-wrap .bt-qa-write {position: absolute; top: 0; left: 0;}
#item-qa .item-bo-wrap .bt-qa-write::after {display: none;}

#item-exchange > h4 {padding-bottom: 10px; font-weight: var(--ft-bold); font-size: var(--ft-stitle);}
#item-exchange strong {    color: var(--col-black);    font-size: var(--ft-size20);    margin: 30px 0 5px 0;    display: block;}
#item-exchange p {color: var(--col-gray);    padding: 5px;}
#item-exchange p.red {color: red;}

/* page : shop view : option */
.goods-item-opt .opt-wrap {font-size: var(--ft-size13);}
.goods-item-opt .opt-wrap button {width: 100%;}
.goods-item-opt .opt-wrap button  img {  cursor: zoom-in;   }
.goods-item-opt .opt-title {display: block; padding: 5px; font-weight: var(--ft-bold);}
.goods-item-opt .bt-opt-add {font-weight: var(--ft-semibold); font-size: var(--ft-size14);}
.goods-item-opt .opt-list li .opt-price {color: var(--col-black); text-align: right;}
.goods-item-opt .opt-list li:not(:last-child) {border-bottom: 1px solid #eee;}
.goods-item-opt .opt-list li:hover {background-color: #eee; color: var(--col-black) !important;}
.goods-item-opt .select-opt1 .bt-self-des {padding: 8px; background-color: var(--col-bg2);
    padding: 8px;
    display: flex;
    align-items: center;
    gap: 0px;
    cursor: pointer;
}
.goods-item-opt .select-opt1 .self-design-btn {  width: 80px;    border: 1px solid #e5e5e5; height: 40px;    border-radius: 5px;  }
.goods-item-opt .select-opt1 .self-design-btn .btnSelfDes{        height: 100%;      background-color: var(--col-gray) !important; }
.goods-item-opt .select-opt1 .self-design-btn .btnSelfDes .icon-self{    display: block;
    width: 30px;
    height: 30px;
        display: flex;
    align-items: center;

    background-image: var(--selfdes-icon);
    background-size: 100%;}

.goods-item-opt .select-opt1 .bt-design-delete { width: 24px !important;    position: absolute;    right: 4px;    _margin-top: -75px;   }

.goods-item-opt .select-opt1 .select-layer {max-height: 292px;}
.goods-item-opt .select-opt1 .select-layer .opt-list li {padding: 3px; display: flex; align-items: center; gap: 10px; cursor: pointer;}
.goods-item-opt .select-opt1 .select-layer .opt-list li .box-design-img {width: 80px; cursor: zoom-in;    border: 1px solid #e5e5e5;}
.goods-item-opt .select-opt1 .select-layer .opt-list li .box-design-txt {width: 100%;}
.goods-item-opt .select-opt1 .select-layer .opt-list li .btnGsDesTxt {    width: 100%;  height: 60px;    text-align: left;   }
.goods-item-opt .select-opt1 .select-layer .opt-list li .btnGsDesTxt span {    display: block;   }
.goods-item-opt .select-opt1 .select-layer .opt-list li .btnGsDesTxt span:nth-child(2) {    color: #415da5; font-weight: 500; }

.goods-item-opt .select-opt1 .select-layer .opt-list li.lsbtn-NewDes {       background-color: #ebefff;    border: 1px solid #d1ddff;    border-radius: 5px;  }

.goods-item-opt .select-opt2 .select-layer {max-height: 237px;}
.goods-item-opt .select-opt2 .select-layer .opt-list li {padding: 10px 8px; display: grid; grid-template-columns: 1fr 70px; align-items: flex-end; gap: 10px; cursor: pointer; color: var(--col-gray);}
.goods-item-opt .select-opt2 .select-layer .opt-list li .opt-name {line-height: 1.4;}
.goods-item-opt .select-opt2 #rsSelOptValue {    margin: 10px -10px 0px 3px;    }

.goods-item-opt .select-opt3 .select-layer {max-height: 237px;}
.goods-item-opt .select-opt3 .select-layer .opt-list li {padding: 5px 8px; display: grid; grid-template-columns: 1fr 70px; align-items: flex-end; gap: 10px; cursor: pointer; color: var(--col-gray2);}
.goods-item-opt .select-opt3 .select-layer .opt-list li .opt-name {line-height: 1.4;}
.goods-item-opt .select-opt3 #rsSelOptValue {    margin: 10px -10px 0px 3px;    }

.goods-item-opt .select-opt1 #rsSelDesValue {    margin: 2px -10px 0px 3px;     display: grid;    grid-template-columns: 48px 1fr;    column-gap: 20px;   align-items: center;}
.goods-item-opt .select-opt1 #rsSelDesValue .thumb{  _border: 1px solid var(--col-line2); background-color: #fff; border-radius: 4px; overflow: hidden; line-height: 0;display: inline-flex;  }
.goods-item-opt .select-opt1 #rsSelDesValue .thumb span{    min-height: 45px;
    border: 1px solid var(--col-line2);
    background-color: #fff;
    border-radius: 4px;
    overflow: hidden;
    line-height: 0;
    align-items: center;
    display: grid;   }
.goods-item-opt .select-opt1 #rsSelDesValue .thumb span img{ cursor: zoom-in;   }

/* page : shop view : option : checkbox */
.goods-item-opt .frm-check-wrap .opt-check-list {display: block; width: 100%; min-height: 40px; max-height: 120px; overflow-y: auto; border: 1px solid var(--col-line2); border-radius: 4px; background-color: #fff;}
.goods-item-opt .frm-check-wrap .opt-check-list:hover {border-color: var(--col-gray2); box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15);}
.goods-item-opt .frm-check-wrap .opt-check-list ul {padding: 4px;}
.goods-item-opt .frm-check-wrap .opt-check-list li {padding: 2px 8px; display: grid; grid-template-columns: 1fr 80px; align-items: center;}
.goods-item-opt .frm-check-wrap .opt-check-list li .it-check label{    width: 100%;     margin: 0;    padding: 3px 0;    }
/* page : shop view : option : input */
.goods-item-opt .frm-inp-wrap .it {width: 100%;}
.goods-item-opt .frm-inp-wrap .Essestiall::placeholder {    color: red; }

/* page : shop view : option : total */
.goods-item-opt .opt-total-wrap {width: 100%;  margin-top: -7px; overflow: auto; border: 1px solid var(--col-line2);}
/*.goods-item-opt.sticky .opt-total-wrap {height: 320px;}*/
@media all and (max-height:1000px) { .goods-item-opt .opt-total-wrap {height: 120px;}}
@media all and (min-height:1000px) and (max-height:1100px) { .goods-item-opt .opt-total-wrap {height: 200px;}}
@media all and (min-height:1100px) and (max-height:1200px) { .goods-item-opt .opt-total-wrap {height: 300px;}}
@media all and (min-height:1200px) and (max-height:1300px) { .goods-item-opt .opt-total-wrap {height: 400px;}}
@media all and (min-height:1300px) and (max-height:1400px) { .goods-item-opt .opt-total-wrap {height: 500px;}}
@media all and (min-height:1400px) and (max-height:1500px) { .goods-item-opt .opt-total-wrap {height: 600px;}}
@media all and (min-height:1500px) and (max-height:1600px) { .goods-item-opt .opt-total-wrap {height: 700px;}}
@media all and (min-height:1600px) and (max-height:1700px) { .goods-item-opt .opt-total-wrap {height: 800px;}}
@media all and (min-height:1700px) and (max-height:1800px) { .goods-item-opt .opt-total-wrap {height: 900px;}}
@media all and (min-height:1800px) and (max-height:1900px) { .goods-item-opt .opt-total-wrap {height: 1000px;}}

@media all and (max-height:800px) { .goods-item-opt.sticky .opt-total-wrap {height: 200px;}}
@media all and (min-height:800px) and (max-height:850px) { .goods-item-opt.sticky .opt-total-wrap {height: 230px;}}
@media all and (min-height:850px) and (max-height:900px) { .goods-item-opt.sticky .opt-total-wrap {height: 280px;}}
@media all and (min-height:900px) and (max-height:1000px) { .goods-item-opt.sticky .opt-total-wrap {height: 320px;}}
@media all and (min-height:1000px) and (max-height:1100px) { .goods-item-opt.sticky .opt-total-wrap {height: 400px;}}
@media all and (min-height:1100px) and (max-height:1200px) { .goods-item-opt.sticky .opt-total-wrap {height: 500px;}}
@media all and (min-height:1200px) and (max-height:1300px) { .goods-item-opt.sticky .opt-total-wrap {height: 600px;}}/*
@media all and (min-height:1300px) and (max-height:1400px) { .goods-item-opt.sticky .opt-total-wrap {height: 700px;}}
@media all and (min-height:1400px) and (max-height:1500px) { .goods-item-opt.sticky .opt-total-wrap {height: 800px;}}
@media all and (min-height:1500px) and (max-height:1600px) { .goods-item-opt.sticky .opt-total-wrap {height: 900px;}}
@media all and (min-height:1600px) and (max-height:1700px) { .goods-item-opt.sticky .opt-total-wrap {height: 1000px;}}
@media all and (min-height:1700px) and (max-height:1800px) { .goods-item-opt.sticky .opt-total-wrap {height: 1100px;}}
@media all and (min-height:1800px) and (max-height:1900px) { .goods-item-opt.sticky .opt-total-wrap {height: 1200px;}}*/

@media all and (min-height:1900px)  { .goods-item-opt .opt-total-wrap {height: 1200px;}}



.goods-item-opt .opt-prod {    }
.goods-item-opt .opt-total-wrap .opt-prod {    margin-top: -1px;padding: 5px 10px;  background-color: #f9f9f9; position: relative;border-top: 1px solid var(--col-line2);border-bottom: 1px solid var(--col-line2);}

.goods-item-opt .opt-total-wrap .GsPrice {   text-align: right; border-top: 1px solid #e5e5e5; padding-top: 5px; margin-top: 5px; font-weight: var(--ft-semibold); font-size: var(--ft-size14); color: #1e00ff;	}
.goods-item-opt .opt-total-wrap .opt-prod .info {display: grid; grid-template-columns: 54px 1fr; column-gap: 10px; padding-bottom: 5px;align-items: center;}
.goods-item-opt .opt-total-wrap .opt-prod .info2 {display: grid; grid-template-columns: 54px 54px 1fr;column-gap: 4px; padding-bottom: 5px;}
.goods-item-opt .opt-total-wrap .opt-prod .thumb {min-height: 45px; border: 1px solid var(--col-line2); background-color: #fff; border-radius: 4px; overflow: hidden;
    line-height: 0;align-items: center;    display: grid;}
.goods-item-opt .opt-total-wrap .opt-prod .prod-name {    display: flex;
    margin: 5px 0 0px 0;
    font-weight: var(--ft-semibold);
    line-height: 1.2;
    align-items: center;}
.goods-item-opt .opt-total-wrap .opt-prod .prod-name .btn {     width: auto;}
.goods-item-opt .opt-total-wrap .opt-prod .opt-name {display: block; color: var(--col-gray); font-size: 12px; line-height: 1.3;}
.goods-item-opt .opt-total-wrap .opt-prod .opt-name .ReqText {display: block; color: var(--col-gray); font-size: 12px; line-height: 1.3;}
.goods-item-opt .opt-total-wrap .opt-prod .item-add-opt {width: 100%; height: auto; padding-top: 0px; margin-top: 5px; border-top: 1px solid var(--col-line2);}
.goods-item-opt .opt-total-wrap .opt-prod .bt-opt-delete {width: 24px !important; height: 24px; position: absolute; top: 4px; right: 4px;}
.goods-item-opt .opt-total-wrap .opt-prod .bt-opt-delete .material-icons {font-size: 20px;}


/* hanasignmall product link */
.hana-prod-link {
    width: 100%;
    height: auto;
    margin: 8px auto 0;
}

.hana-prod-link a {
    width: 100% !important;
    gap: 4px;
    color: #fff !important;
}

.hana-prod-link a b {
    color: #ffeb3b;
}

.hana-prod-link a span {
    display: block;
    padding: 8px 16px;
    margin-left: 8px;
    background-color: #fff;
    color: var(--col-primary);
    font-weight: var(--ft-bold);
    font-size: var(--ft-size14);
    border-radius: 50px;
}

.hana-prod-link a span::after {
    content: '\2192';
    display: inline-block;
    padding-left: 8px;
    font-weight: var(--ft-bold);
}

.hana-prod-link a:hover span {
    color: var(--col-gray) !important;
}

/* related products */
.rel-goods {
    width: 100%;
    height: auto;
    margin-top: 48px;
}

.rel-goods > .stitle {
    text-align: center;
}

.rel-goods .prod-item-list {
    margin: 24px 0;
    grid-template-columns: repeat(5, minmax(224px, 1fr));
}

.rel-goods .prod-item-list .prod-item {
    padding-bottom: 15px;
        width: 224px;
}
#list-item-wrap .prod-selfitem-list .prod-item {     width: 224px;

}