@charset "utf-8";


h2.title {margin-bottom: 25px; font-size: 32px; font-weight: 500; color: #222}
.btn-coupon {padding: 3px 9px; font-size: 13px; font-weight: 400; color: #2fb2ab; background: #fff; border: 1px solid #2fb2ab; border-right-width: 7px}
.btn-option-remove {position: absolute; top: 0; right: 0; width: 19px; height:19px; background: url(../images/sub/product/btn_remove.gif) no-repeat !important;}
.quantity {display: inline-block; font-size: 0; vertical-align: middle}
.quantity .quantity-tit {display: inline-block; margin: -3px 15px 0 0; font-size: 16px; font-weight: 400; vertical-align: middle}
.quantity a {display: inline-block; width: 23px; height: 23px; background: url(../images/sub/product/icon_down.gif) no-repeat; vertical-align: middle}
.quantity .up {background: url(../images/sub/product/icon_up.gif) no-repeat}

/*추가*/
.quantity .up.active{background: url(/layouts/gfesta/images/sub/product/icon_up_active.gif) no-repeat}
.quantity .down.active{background: url(/layouts/gfesta/images/sub/product/icon_down_active.gif) no-repeat}

.quantity input {display: inline-block; width: 36px; height: 31px; margin: 0 5px; padding: 0; font-size: 15px; color: #333; text-align: center; vertical-align: middle}
.dpn {display: none !important}
.dpb {display: block !important}
.dpib {display: inline-block !important}
.mt50 {margin-top: 50px}

/* 상품 */
ul.category {margin-bottom: 20px; padding-bottom: 14px; border-bottom: 1px solid #d3d3d3}
ul.category:after {content: ''; display: block; clear: both}
ul.category li {float: left; padding: 15px 15px}
ul.category li:first-child {padding-left: 0}
ul.category li a {position: relative; color: #444}
ul.category li a:before {content: ''; display: none; position: absolute; bottom: -16px; left: 0; width: 100%; height: 3px; background: #2fb2ab}
ul.category li a.active, ul.category li a:hover{font-weight: 500; color: #2fb2ab}
ul.category li a.active:before, ul.category li a:hover:before{display: block}
.sv-txt{font-weight:400;font-size:16px;color:#2fb2ab}
.prd-btn-area{overflow:hidden;text-align:right}
.prd-btn-area li {display:inline-block; width: 245px; height: 56px; text-align: center; margin-right: 6px}
.prd-btn-area li:last-child {margin-right: 0}
.prd-btn-area li a {display: block; border: 1px solid #d3d3d3; font-size: 20px; font-weight: 400; color: #222; line-height: 54px}
.prd-btn-area li a.bg {border-color: #2fb2ab; background: #2fb2ab; color: #fff}
.prd-btn-area li a.bg-none {border-color: #d2d2d2; background: #d2d2d2; color: #000} /* 20200401 add */

/* 2020.12.14 수정
.prd-box .array {margin-bottom: 20px; text-align: right}
.prd-box .prd-list:after {content: ''; display: block; clear: both}
.prd-box .prd-list li {float: left; width: 370px; margin: 0 45px 56px 0}
.prd-box .prd-list li:nth-child(3n) {margin-right: 0}
.prd-box .prd-list .img a {position: relative; display: block ;height:370px;background:#f4f4f4 url(/layouts/gfesta/images/common/img_gfesta.png) no-repeat 50% 50%}
.prd-box .prd-list .img a:before {content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index:10; background: #000; opacity: 0; transition: opacity 0.5s}
.prd-box .prd-list .img a:hover:before {opacity: 0.4}
.prd-box .prd-list .info {position: relative; padding-top: 20px}
.prd-box .prd-list .info .item {height: 82px}
.prd-box .prd-list .info .name a {display: block; width: 330px; height: 48px; margin-bottom: 10px; font-weight: 400; color: #222; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word}
.prd-box .prd-list .info .price-area span {display: inline-block}
.prd-box .prd-list .info .price-area .cost-price {margin-right: 7px; font-size: 14px; color: #999; text-decoration: line-through}
.prd-box .prd-list .info .price-area .price {font-weight: 500; color: #222}
.prd-box .prd-list .info .price-area .sv {font-weight: 500; color: #2fb2ab}
.prd-box .prd-list .info .purchase {margin-top: 21px; padding-top: 15px; font-size: 14px; border-top: 1px solid #d3d3d3}
.prd-box .prd-list .info .wish {position: absolute; top: 24px; right: 0; width: 19px; height: 16px; font-size: 0; text-indent:-9999px; background-image: url(/layouts/gfesta/images/sub/product/icon_wish.png); background-repeat:no-repeat; background-position: 0 0; cursor: pointer}
.prd-box .prd-list .info .wish.active {background-position: 100% 0}
*/
.prd-box .array {margin-bottom:20px;text-align:right;}
.prd-box .prd-list:after {content: ''; display: block; clear: both}
.prd-box .prd-list li {float:left; width:270px; margin:0 40px 60px 0}
.prd-box .prd-list li:nth-child(4n) {margin-right: 0}
.prd-box .prd-list .img a {position: relative; display: block /*추가*/;height:270px;background:#f4f4f4 url(../images/common/img_gfesta.png) no-repeat 50% 50%}
.prd-box .prd-list .img a:before {content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index:10; background: #000; opacity: 0; transition: opacity 0.5s}
.prd-box .prd-list .img a:hover:before {opacity: 0.4}
.prd-box .prd-list .info {position:relative; padding-top:15px}
.prd-box .prd-list .info .item {}
.prd-box .prd-list .info .name a {display:block;width:100%;height:44px;margin-bottom:15px;font-size:16px;line-height:22px;font-weight:400;color:#333;display:-webkit-box;overflow:hidden;text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-wrap:break-word;}
.prd-box .prd-list .info .price-area span {display: inline-block}
.prd-box .prd-list .info .price-area .cost-price {margin-right:7px;font-size:14px;color:#999; text-decoration:line-through;}
.prd-box .prd-list .info .price-area .price {font-size:20px;font-weight:700;color:#111;line-height:20px;}
.prd-box .prd-list .info .price-area .member {color:#2fb2ab;font-size:18px;font-weight:500;}
.prd-box .prd-list .info .price-area .sv {font-weight: 500; color: #2fb2ab}
.prd-box .prd-list .info .purchase {margin-top:15px;padding-top:15px;font-size:14px;color:#aaa;border-top:1px solid #e9e9e9;}
.prd-box .prd-list .info .wish {position:absolute; bottom:0px;right:0px;width:24px;height:24px;font-size:0;text-indent:-9999px;background-image:url(../images/common/gf_icons.png); background-repeat:no-repeat;background-position:-226px -1px; cursor:pointer;}
.prd-box .prd-list .info .wish.active {background-position:-226px -26px;}

/*추가*/
.name .wish {position: absolute; top: 29px; right: 0; display:block;}
.name .wish i{font-size:22px}
.name .wish.active i{color:#31b3ac}

.prd-view-box {width: 1200px; margin: 0 auto 80px}
.prd-view-box:after {content: ''; display: block; clear: both}
.prd-view-box > div {float: left}
.prd-view-box .img {width: 500px; margin-right: 50px}
.prd-view-box .img .slider-for img {width: 500px; height: 500px}
.prd-view-box .img .slider-nav {display:none;margin-top: 23px; padding: 0 28px}
.prd-view-box .img .slider-nav .slick-track {margin: 0 auto}
.prd-view-box .img .slider-nav img {width: 104px; height: 104px}
.prd-view-box .img .slider-nav .slide {position: relative; margin: 7px; cursor: pointer}
.prd-view-box .img .slider-nav .slide:before {content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.6)}
.prd-view-box .img .slider-nav .slide:hover:before, .prd-view-box .img .slider-nav .slide.slick-current:before {border: 4px solid #2fb2ab; background: none}
.prd-view-box .img .slick-arrow {width: 14px; height: 100%; background-image: url(/layouts/gfesta/images/sub/product/arrow_prd_view.gif); background-repeat: no-repeat; background-position: 0 50%}
.prd-view-box .img .slick-next {background-position: 100% 50%}
.prd-view-box .info {width: 650px}

/*상품보기에서 짤리는 제목 줄넘김 수정*/
.name.line-box{padding:10px 30px 10px 0 !important;}
.name.line-box h2{padding-bottom:10px;}
.prd-view-box .info .line-box {position:relative;/*추가*/padding: 20px 0; border-bottom: 1px solid #ededed}
.prd-view-box .info .bgg {padding: 15px 15px; background: #f4f4f4}  /* 2020.11.13 숫자 하락 수정. */
.prd-view-box .info .cont {display: none}
.prd-view-box .info .company {margin-top: -6px; padding-bottom: 19px; font-size: 18px; color: #444; border-bottom: 1px solid #d3d3d3}
.prd-view-box .info .name h2 {font-size: 30px; font-weight: 700; color: #222; line-height: 1.3}
.prd-view-box .info .name .buy {display: block; margin-top: 6px; font-weight: 400}
.prd-view-box .info .name .num {display: inline-block; margin-left: 10px; font-size: 18px; font-weight: 300; color: #222}
.prd-view-box .info .price-area > div {margin-bottom: 1px; font-size: 0}
.prd-view-box .info .price-area > div:last-child {margin-bottom: 0}
.prd-view-box .info .price-area > div span {position: relative; display: inline-block; font-size: 16px}
.prd-view-box .info .price-area > div span:nth-child(1) {width: 106px; font-weight: 400}
/*.prd-view-box .info .price-area > div span:nth-child(2) {min-width: 122px; margin-right: 13px; color: #888}*/
/*추가*/
.prd-view-box .info .price-area > div span:nth-child(2) {min-width: 122px; padding-right: 10px; margin-right: 13px; color: #888}
.prd-view-box .info .price-area > div span:nth-child(2):before {content: ''; position: absolute; top: 50%; right: 0; height: 12px; margin-top: -6px; border-right: 1px solid #d3d3d3}
.prd-view-box .info .price-area > div span:nth-child(3) {font-weight: 500; color: #2fb2ab}
/*.prd-view-box .info .price-area > div span:nth-child(3) {padding-left: 20px;}*/
.prd-view-box .info .price-area > div span:nth-child(2).strong {font-size: 23px; font-weight: 700; color: #222}
.prd-view-box .info .delivery {position: relative; padding-left: 35px; font-weight: 400; color: #2fb2ab}
.prd-view-box .info .delivery .fal {position: absolute; top: 50%; left: 0; margin-top: -8px; color: #666}
.prd-view-box .info .delivery_subtxt {padding: 0}
.prd-view-box .info .delivery_subtxt a {display: block; width: 100%; padding: 20px 0; font-weight: 400; color: #2fb2ab; text-align: left; background: url(../images/common/arrow_select.gif) no-repeat 622px 50%}
.prd-view-box .info .delivery_subtxt a.active {background: url(/layouts/gfesta/images/common/arrow_select_on.gif) no-repeat 622px 50%}
.prd-view-box .info .package {position: relative; padding-left: 35px}
.prd-view-box .info .package .fal {position: absolute; top: 50%; left: 0; margin-top: -8px}
.prd-view-box .info .option-tit {display: block; padding: 20px 0 10px; font-weight: 400;}

/*추가*/
.prd-view-box .select-option>a{display:block;height:37px;padding-left:15px;border:1px solid #d3d3d3;background:url(/layouts/gfesta/images/common/arrow_select.gif) no-repeat right 15px top 50%;line-height:37px;font-size:15px}
.prd-view-box .select-option>ul{display:none;max-height:190px;overflow-y:auto;border-style:none solid solid solid;border-width:1px;border-color:#222}
.prd-view-box .select-option>ul>li{border-bottom:1px solid #ededed}
.prd-view-box .select-option>ul>li:last-child{border-bottom:0}
.prd-view-box .select-option>ul a{display:block;padding:7px 15px;font-weight:400;color:#444;font-size:15px}
.prd-view-box .select-option>ul a:hover{background-color:#f5f5f5}
.prd-view-box .select-option .on{border-top:1px solid #222;border-right:1px solid #222;border-left:1px solid #222;background:#f7f7f7 url(/layouts/gfesta/images/common/arrow_select_on.gif) no-repeat 622px 50%}
.prd-view-box .select-option .on+ul{display:block}


/**/
.option-detail-box{position:relative;}
.prd-view-box .info .option-info li {position: relative; margin-bottom: 22px; padding-bottom: 22px; border-bottom: 1px solid #ededed}
.prd-view-box .info .option-info li:last-child {margin-bottom: 0; padding-bottom: 0; border-bottom: 0}
.prd-view-box .info .option-info em, .bgg li em{display: block; margin-bottom: 16px; color: #444}
.prd-view-box .info .option-info {margin-top: 20px}
.prd-view-box .info .option-info .quantity {margin-right: 10px}
.prd-view-box .info .total-price {position:relative;padding: 22px 0; font-weight: 400; text-align: right}
.prd-view-box .info .total-price span {display:inline-block;padding-right:28px;background:url(/layouts/gfesta/images/sub/product/btn_price_info.png) no-repeat 100% 50%;font-weight: 400}
.prd-view-box .info .total-price em {display: inline-block; min-width: 180px; padding-left: 20px; font-size: 28px; font-weight: 700; color: #222; vertical-align: sub}
.price-info-box{display:none;position:absolute;right:0;top:67px;padding:15px 23px;border:1px solid #333;background-color:#fff;text-align:left;font-weight:300}
.price-info-box:before{display:block;content:"";position:absolute;left:153px;top:-10px;width:19px;height:10px;background:url(/layouts/gfesta/images/sub/product/bg_triangle.png) no-repeat 0 0}
.price-info-box a{position:absolute;right:23px;top:19px}
.prd-detail-box {position: relative; padding-top: 56px; border-top: 1px solid #d3d3d3}
.prd-detail-box > .inner {position: relative; border-right: 1px solid #d3d3d3}
.prd-detail-box .detail-tab {position: absolute; top: 0; left: 0; width: 100%; border-bottom: 2px solid #333; background: #fff}
.prd-detail-box .detail-tab.fixed {position: fixed; top: 59px; left: 0; width: 100%; z-index: 9}
.prd-detail-box .detail-tab ul {overflow: hidden; width: 1200px; margin: 0 auto}
.prd-detail-box .detail-tab ul li {float: left; text-align: center}
.prd-detail-box .detail-tab ul li a {position: relative; display: block; width: 221px; height: 54px; font-size: 17px; line-height: 54px}
.prd-detail-box .detail-tab ul li a:before {content: ''; position: absolute; top: 50%; right: 0; height: 15px; margin-top: -7px; border-right: 1px solid #d3d3d3}
.prd-detail-box .detail-tab ul li a.active {font-weight: 400; color: #fff; background: #333}
.prd-detail-box .detail-tab ul li a.active:before, .prd-detail-box .detail-tab ul li:last-child a:before {display: none}

/*추가*/
.prd-detail-info {width: 860px; padding: 70px 25px 130px 0; border-right: 1px solid #d3d3d3}

.prd-detail-info .prd-notice {margin-bottom: 50px}
.prd-detail-info .prd-notice img{width:860px}
.prd-detail img{width:860px}
.prd-detail-more {margin-top: 90px}
.prd-detail-more > .tit {padding-bottom: 8px; font-size: 20px; font-weight: 500; color: #222; border-bottom: 2px solid #222}
.prd-notify .cont {padding-top: 15px}
.prd-notify ul li {margin-bottom: 9px}
.prd-notify ul li:last-child {margin-bottom: 0}
.prd-notify ul li:after {content: ''; display: block; clear: both}
.prd-notify span {float: left}
.prd-notify .notify-tit {width: 150px; font-weight: 400}
.prd-notify .notify-cont {width: calc(100% - 150px)}
.prd-exchange .cont {padding-top: 15px}
.prd-exchange .exchange-tit {font-weight: 500; color: #222}
.prd-exchange ul li {margin-top: 11px}
.prd-exchange ul li .tit {font-weight: 400; color: #444}
.prd-review .cont > ul > li {position: relative; padding: 15px 0; border-bottom: 1px solid #d3d3d3}
.prd-review .writer {position: absolute; top: 15px; right: 0}
.prd-review .writer li {position: relative; float: left; padding: 0 20px; font-size: 15px}
.prd-review .writer li:before {content: ''; position: absolute; top: 50%; right: 0; height: 12px; margin-top: -6px; border-right: 1px solid #c7c6c4}
.prd-review .writer li:first-child {padding-left: 0}
.prd-review .writer li:last-child {padding-right: 0}
.prd-review .writer li:last-child:before {display: none}
.prd-review .prd-tit {margin-bottom: 10px}
.prd-review .review-tit {margin-bottom: 8px; font-weight: 500; color: #444}
.prd-review .photo-review {display: inline-block; margin-left: 5px; vertical-align: 0}
.prd-review .btn-photo {display: inline-block; float: right; margin-top: 6px; padding-right: 13px; font-size: 15px; font-weight: 400; color: #444; background: url(/layouts/gfesta/images/common/arrow_btn.gif) no-repeat 100% 50%}
.prd-inquiry {/*추가*/margin-top:110px; padding-bottom: 8px}
.prd-table {text-align: center}
.prd-table td {padding: 11px 0; border-bottom: 1px solid #d3d3d3}
.prd-table td.ellipsis {padding: 11px 8px}
.prd-table td.tit {padding: 0 13px; text-align: left}
.prd-table td.tit a {display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-break: break-all}

/*추가*/
.prd-table .status {display: inline-block; width: 78px; height: 26px; font-size: 14px; color: #444; border: 1px solid #333; border-radius: 13px; line-height: 26px;font-weight:400 /*오류 line-height:400*/}
.prd-table .reply{color:#2fb2ab}

.qna-wrap {display: none}
.qna-wrap td {padding: 25px 32px; text-align: left; background: #f4f4f4}
.qna-wrap .qna > div {position: relative; padding-left: 42px}
.qna-wrap .qna > div:before {content: ''; position: absolute; top: 0; left: 0; width: 27px; height: 27px; background-image: url(/layouts/gfesta/images/sub/product/icon_answer.png); background-repeat: no-repeat; background-position: 0 0}
.qna-wrap .qna .question {margin-bottom: 20px}
.qna-wrap .qna .answer:before {background-position: 100% 0}
.prd-table .fal {display: inline-block; margin-left: 5px; font-size: 14px}
.prd-detail-option {position: absolute; top: 0; right: 0; width: 314px; background: #fff}

/*추가*/
.prd-detail-option.fixed {position: fixed; top: 115px; /*left: 50vw;*/left:50%; margin-left:285px; z-index: 9;background-color:transparent}
.prd-detail-option.min-w{left:886px;right:auto;margin-left:0}

.prd-detail-option.bottom {top: auto; bottom: 0}
.prd-detail-option .option-body {position: relative; overflow-y: auto; max-height: calc(100vh - 410px); padding: 20px 15px 45px; z-index: 1}
.prd-detail-option .option-body .select-area {margin-bottom: 25px}
.prd-detail-option .option-body .select-area select {width: 100%}

/*상품보기내 셀렉트 옵션 조정*/
#selectOption option{text-overflow:ellipsis; -webkit-line-clamp:1;
    -webkit-box-orient :vertical; word-wrap:break-word; margin-right:0 !important; }

.prd-detail-option .option-body {position: relative; overflow-y: auto; max-height: calc(100vh - 410px); padding: 20px 15px 45px; z-index: 1}
.prd-detail-option .option-body .select-area {margin-bottom: 25px}
.prd-detail-option .option-body .select-area select {width: 100%}
.prd-detail-option .option-body ul {background: #f3f3f3}
.prd-detail-option .option-body ul li {position: relative; padding: 15px; border-bottom: 1px solid #d3d3d3}
.prd-detail-option .option-body ul li:first-child {border-top: 1px solid #d3d3d3}
.prd-detail-option .choice-item {margin-bottom: 13px}
.prd-detail-option .choice-item:after {content: ''; display: block; clear: both}
.prd-detail-option .choice-item > div {float: left}
.prd-detail-option .choice-item .thumb {width: 66px; height: 66px; margin-right: 9px}
.prd-detail-option .choice-item .thumb img {width: 100%; height: 100%}
.prd-detail-option .choice-item .info {width: calc(100% - 100px); margin-top: -5px; font-size: 15px}
.prd-detail-option .choice-item .info span {display: block}
.prd-detail-option .choice-calc {margin-right: 87px}
.prd-detail-option .choice-calc:after {content: ''; display: block; clear: both}
.prd-detail-option .choice-calc .quantity {display: inline-block; position: relative; width: 60px; height: 33px; margin-right: 6px; border: 1px solid #d3d3d3; background: #fff}
.prd-detail-option .choice-calc input {width: 38px; height: 100%; margin: 0; padding: 0; text-align: center; border: 0}
.prd-detail-option .choice-calc .btn-quantity {position: absolute; right: 0; display: block; width: 21px; height: 16px; border-left: 1px solid #d3d3d3; vertical-align: middle}

/*추가*/
.prd-detail-option .choice-calc .down {/*top: 0;*/top:16px; background: url(../images/sub/product/icon_quantity.gif) no-repeat 0 0; border-bottom: 1px solid #d3d3d3}
.prd-detail-option .choice-calc .up {bottom: 0; background: url(../images/sub/product/icon_quantity.gif) no-repeat 0 100%}

.prd-detail-option .choice-calc .btn-coupon {display: inline-block; vertical-align: middle}
.prd-detail-option .choice-result {position: absolute; bottom: 17px; right: 15px; font-size: 20px; font-weight: 700; color: #222}
.prd-detail-option .btn-option-remove {top: 35px; right: 15px}
.prd-detail-option .total-price {position: relative; padding: 22px 15px; border-top: 1px solid #d3d3d3}
.prd-detail-option .total-price span {display: inline-block; width: 70px; font-weight: 400; vertical-align: middle}
.prd-detail-option .total-price em {display: inline-block; width: calc(100% - 70px); font-size: 28px; font-weight: 700; color: #222; vertical-align: middle; text-align: right}
.prd-detail-option .prd-btn-area {padding: 0 15px 20px}
.prd-detail-option .prd-btn-area:after {content: ''; display: block; clear: both}
.prd-detail-option .prd-btn-area li {width: 100%; margin-bottom: 10px}
.prd-detail-option .prd-btn-area li:last-child {margin-bottom: 0}
.paging {margin-top: 30px; font-size: 0; text-align: center}
.paging span {display: inline-block; vertical-align: middle}


/*추가*/
.paging a, .paging strong {display: inline-block; width: 33px; height: 33px; font-size: 14px; vertical-align: middle; line-height: 34px; border: 1px solid #d4d4d4; border-left: 0}
/*.paging a, .paging strong {display: inline-block; width: 33px; height: 33px; font-size: 14px; vertical-align: middle; line-height: 34px; border: 1px solid #d4d4d4; }*/

/*추가 - 폰트어썸 화살표 위치조정 한별*/
.paging .fal{line-height:34px !important; }
.paging strong {color: #fff; font-weight: 300; background: #333; border-color: #333}
.paging .btn-move {color: #727272}
.paging .btn-first {border-left: 1px solid #d4d4d4}
.paging .btn-last {border-right: 1px solid #d4d4d4}
.paging + .btn-prd-write, .paging + .btn-write{float: right; display: inline-block; height: 35px; width: 108px; margin-top: -35px; font-size: 14px; font-weight: 400; color: #fff; background: #333; line-height: 35px; text-align: center;}

/*추가 paging 화살표 한별*/
.jump-page.next{margin-left:20px; border: 1px solid #d4d4d4;}
.jump-page.prev{margin-right:20px; border: 1px solid #d4d4d4;}
.paging a:first-child{border-left:1px solid #d4d4d4;}


/* 이벤트 */
.event-list li {margin-bottom: 20px}
.event-list li:last-child {margin-bottom: 0}

/* 주문 */
.order-wrap {position: relative}
.tit-location {position: relative}
.delivery-box{transform:translateY(10px);-ms-transform:translateY(10px)}
.order-location {position: absolute; top: 13px; right: 0}
.order-location:after {content: ''; display: block; clear: both}
.order-location li {position: relative; float: left; padding: 0 23px; font-size: 17px; color: #999}
.order-location li strong {font-weight: 500; color: #444}
.order-location li .fal {display: inline-block; margin-right: 7px; font-size: 23px; vertical-align: -1px}
.order-location li:before {content: ''; position: absolute; top: 50%; right: 0; width: 8px; height: 14px; margin: -7px -4px 0 0; background: url(../images/sub/order/arrow-location.gif) no-repeat}
.order-location li:first-child {padding-left: 0}
.order-location li:last-child {padding-right: 0}
.order-location li:last-child:before {display: none}
.btn-order-area {overflow: hidden; margin-bottom: 15px}
.btn-order-area a {float: left; display: block; margin-right: 10px; padding: 0 14px; height: 37px; font-size: 15px; color: #444; border: 1px solid #d3d3d3; line-height: 37px; text-align: center}
.btn-order-area a:last-child {margin-right: 0}
.btn-order-area .gray {color: #fff; background: #999; border-color: #999}
.btn-order-area .black {color: #fff; background: #333; border-color: #333}
.order-list-item {width: 810px}
.order-list-item > li {margin-bottom: 40px; border-top: 2px solid #333; border-bottom: 1px solid #d3d3d3}
.order-list-item > li:last-child {margin-bottom: 0}

/*추가*/
.order-list-item .company {padding: 14px 0; font-size: 18px; font-weight: 500; color: #222;}
/*.order-list-item .company {padding: 14px 0; font-size: 18px; font-weight: 500; color: #222; border-bottom: 1px solid #d3d3d3}*/

.order-list-item table {text-align: center}

/*추가*/
.order-item-table {border-top: 1px solid #d3d3d3; text-align: center}
.order-item-table td {padding: 20px 0; /*border-bottom: 1px solid #d3d3d3*/}
.order-item-table tr:last-child td {border-bottom: 0}
.order-item-table .img {float: left; margin-right: 15px}

.order-item-table .img img {width: 84px; height: 84px}
.order-item-table .info {float: left; width: calc(100% - 100px); text-align: left}
.order-item-table .info span {display: block}
.order-item-table .info .name {margin-bottom: 8px; font-size: 17px; font-weight: 400; color: #222}
.order-item-table .info .option {font-size: 15px}
.order-item-table .price {font-size: 20px; font-weight: 500; color: #222}
.order-item-table .btn-remove {display: inline-block; width: 17px; height: 17px; background: url(../images/sub/order/btn_remove_basket.gif) no-repeat}
.order-item-table .quantity {display: block}
.order-item-table .btn-coupon {display: inline-block; margin-top: 11px}

.order-calc-table {background: #f4f4f4; /*추가*/ border-top: 1px solid #d3d3d3}
.order-calc-table td {position: relative; padding: 20px 0}
.order-calc-table span {display: block}
.order-calc-table .price {font-size: 20px; font-weight: 500; color: #222}
.order-calc-table .desc {font-size: 14px}
.order-calc-table td:before {content: ''; position: absolute; top: 50%; right: 0; width: 25px; height: 25px; margin: -12px -12px 0 0; background-image: url(/layouts/gfesta/images/sub/order/icon_calc.png); background-repeat: no-repeat; background-position:  0 0}
.order-calc-table td:nth-child(2):before {background-position: -25px 0}
.order-calc-table td:nth-child(3):before {background-position: -50px 0}
.order-calc-table td:nth-child(4):before {display: none}
.order-calc-table td:nth-child(4) .price {color: #2fb2ab}
.order-total {position: absolute; top: 0; right: 0; width: 298px; padding: 17px 25px 25px; border: 1px solid #d3d3d3; background: #fff; z-index: 1}
.order-total.v2 {padding-bottom: 20px}
.order-total.fixed {position: fixed; top: 58px; right: 50%; margin-right: -600px}
.order-total.bottom {top: auto; bottom: 0}
.order-total-wrap {position: absolute; top: 0; right: 0; width: 350px; background: #fff; z-index: 1}
.order-total-wrap .order-total {position: static}
.order-total-wrap .order-total .prd-total {padding-top: 18px; font-size: 20px; font-weight: 500; color: #222; border-top: 1px solid #d3d3d3; text-align: center}
.order-total-wrap .order-total.v2 {margin-bottom: 40px}
.order-total-wrap .order-total.v2 ul li {margin-bottom: 20px}
.order-total-wrap .order-total.v2 ul li:after {content: ''; display: block; clear: both}
.order-total-wrap .order-total.v2 .img {float: left; width: 84px; height: 84px; margin-right: 14px}
.order-total-wrap .order-total.v2 .img img {width: 100%; height: 100%}
.order-total-wrap .order-total.v2 .info {width: calc(100% - 100px); float: left}
.order-total-wrap .order-total.v2 .info span {display: block; width: 100%}
.order-total-wrap .order-total.v2 .info .name {margin: -5px 0 10px; font-size: 17px; font-weight: 400; color: #222}
.order-total-wrap .order-total.v2 .info .option {margin-bottom: 10px; font-size: 15px; color: #222}
.order-total-wrap .order-total.v2 .info .price {font-size: 15px; font-weight: 500; color: #222}
.order-total em {display: block; margin-bottom: 25px; padding-bottom: 18px; font-size: 20px; font-weight: 400; color: #222; border-bottom: 1px solid #333; text-align: center}
.order-total ul li {margin-bottom: 9px; font-size: 0}
.order-total ul li:after {content: ''; display: block; clear: both}
.order-total ul li span {display: inline-block; width: 50%; vertical-align: middle}
.order-total .tit {font-weight: 400; font-size: 16px}
.order-total .cont {font-size: 17px; font-weight: 400; color: #222; text-align: right}
.order-total .total {margin-top: 21px; padding-top: 9px; border-top: 1px solid #d3d3d3}
.order-total .total .tit{vertical-align:2px}
.order-total .total span {color: #222}
.order-total .total .cont {font-size: 26px; font-weight: 500}
.order-total .btn-pay {display: block; width: 298px; height: 57px; margin-top: 32px; font-size: 20px; font-weight: 400; color: #fff; background: #2fb2ab; text-align: center; line-height: 56px}
.order-list .prd-detail-more {margin-top: 40px}
.order-list .prd-detail-more:first-child {margin-top: 0}
.order-list .prd-detail-more table {padding-top: 8px; text-align: left}
.order-list .prd-detail-more table td {padding: 10px 0}
.order-list .prd-detail-more table th {padding-top: 11px; font-weight: 400; vertical-align: top}
.order-list .prd-detail-more table .have {margin: 0 20px 0 30px}

/*190717 장바구니 배송비 notice 추가관련  css*/

.deli-noti-li{position: relative;}

.tit.deli-noti{display: inline-block;
    background: url(/layouts/gfesta/images/sub/product/btn_price_info.png) no-repeat 60% 50%;
    font-weight: 400;}

.deli-noti-li .price-info-box{font-size: 14px; color: #000;
    position:absolute; top:30px;
}
.deli-noti-li .price-info-box .col-aqua{color:#2fb2ab;}

.deli-noti-li .price-info-box:before {
    display: block;
    content: "";
    position: absolute !important;
    left: 77px !important;
    top: -10px !important;
    width: 19px !important;
    height: 10px !important;
    background: url(/layouts/gfesta/images/sub/product/bg_triangle.png) no-repeat 0 0 !important;
}

/*190719 결제페이지 배송비 notice */
.deli-noti-li2{position: relative;}

.tit.deli-noti2{display: inline-block;
    background: url(/layouts/gfesta/images/sub/product/btn_price_info.png) no-repeat 81% 50%;
    font-weight: 400;}

.deli-noti-li2 .price-info-box{font-size: 14px; color: #000;
    position:absolute; top:35px;}

.deli-noti-li2 .price-info-box:before {
    display: block;
    content: "";
    position: absolute !important;
    left: 104px !important;
    top: -10px !important;
    width: 19px !important;
    height: 10px !important;
    background: url(/layouts/gfesta/images/sub/product/bg_triangle.png) no-repeat 0 0 !important;}

/*추가*/
.order-list .prd-detail-more .radio2 {padding-right: 20px}
/*.order-list .prd-detail-more .radio2 {min-width: 116px; padding-right: 10px}*/

.order-list .prd-detail-more .simple-pay-type li {margin-top: 5px}
.order-list .prd-detail-more .simple-pay-type li:nth-child(1) {margin-top: 0}
.order-list .prd-detail-more.personal th {padding-top: 5px}
.order-list .prd-detail-more.personal td {padding: 5px 0; color: #444}
.order-list .prd-detail-more.personal .checkbox2 {display: block; margin: 17px 0 -7px}
.order-list .prd-detail-more.personal .checkbox2 label {font-size: 18px; font-weight: 500; color: #222; background-position: 0 50%}
.order-list .prd-detail-more .agree-box {padding:20px 0}
.order-list .prd-detail-more .agree-box strong {margin-bottom:10px;color:#333}
.order-list .prd-detail-more .agree-box p {margin-top:10px;padding-left:20px;overflow:hidden}
.order-list .prd-detail-more .agree-box p:nth-child(2) {margin-top:20px}
.order-list .prd-detail-more .agree-box p>* {float:left}
.order-list .prd-detail-more .agree-box p a {display:block;float:right;width:80px;height:25px;background-color:#aaa;border-radius:50px;text-align:center;font-weight:300;font-size:14px;line-height:23px;color:#fff}
.order-end {width: 870px; margin: 0 auto}
.order-end .top {margin-bottom: 35px; font-size: 15px; color: #444; text-align: center}
.order-end .top em {display: block; margin-bottom: 5px; font-size: 20px; font-weight: 400; color: #222;}
.order-end .order-end-table {border-top: 2px solid #333; border-bottom: 2px solid #333; text-align: left}
.order-end .order-end-table th, .order-end .order-end-table td {border-bottom: 1px solid #d3d3d3}
.order-end .order-end-table tr:last-child th, .order-end .order-end-table tr:last-child td {border-bottom: 0}
.order-end .order-end-table th {padding-left: 30px; font-size: 20px; font-weight: 500; color: #222}
.order-end .order-end-table td {padding: 15px 0}
.order-end .order-end-table td ul li {margin-bottom: 9px}
.order-end .order-end-table td ul li:last-child {margin-bottom: 0}
.order-end .order-end-table .price {font-size: 20px; font-weight: 500; color: #2fb2ab}
.order-end .end-btn-area {margin-top: 30px; font-size: 0; text-align: center}
.order-end .end-btn-area a {display: inline-block; width: 430px; height: 46px; font-size: 16px; font-weight: 400; color: #fff; background: #999; line-height: 46px}
.order-end .end-btn-area a:first-child {margin-right: 10px}
.order-end .end-btn-area .bg {background: #2fb2ab}
.btn-post {display: inline-block; width: 110px; height: 39px; margin-left: 10px; font-size: 15px; color: #fff; background: #999; text-align: center; line-height: 39px;}
.btn-terms {display: inline-block; width: 78px; height: 26px; margin-left: 10px; font-size: 14px; font-weight: 300; color: #fff; background: #999; text-align: center; border-radius: 14px; line-height: 26px}
.faq-table td:nth-child(2) {font-weight: 400; color: #444}
.faq-table .qna-wrap td {padding: 25px 32px; text-align: left}
.radio, .radio2 {display: inline-block}
.radio i{font-size:20px;color:#bdbdbd}
/*.radio label, .radio2 label {display: inline-block; background-image: url(../images/common/radio_no.png); background-repeat: no-repeat}*/
.radio label, .radio2 label {display: inline-block;}
.radio2 label>i{font-size:20px;vertical-align:-1px;color:#bdbdbd}

/*추가*/
.radio input[type="radio"]:checked + label>i, .radio2 input[type="radio"]:checked + label>i{color:#2fb2ab}
.search_result {margin-bottom: 20px; padding-bottom: 13px; font-weight: 400; color: #222; border-bottom: 1px solid #d3d3d3}

.search_result strong {position: relative; display: inline-block; padding-right: 12px; margin-right: 8px; font-weight: 500; font-size: 20px}
.search_result strong:before {content: ''; position: absolute; bottom: 5px; right: 0; width: 1px; height: 14px; background: #d4d4d4}
.product-search.unified {margin-bottom: 50px; text-align: center}
.product-search.unified span {display: inline-block; margin-right:12px; font-weight: 400; color: #444}
.product-search.unified .btn-srh {width: 82px; margin-left: 4px}
.prev-next{margin-top:40px; border-top:1px solid #d9d9d9}
.prev-next dl{overflow:hidden}
.prev-next dt,.prev-next dd{height:53px;line-height:53px;border-bottom:1px solid #d9d9d9;}
.prev-next dt{position:relative;float:left;padding: 0 28px 0 20px;text-align:center;font-weight:500;color:#222}
.prev-next dt:after{display:block;content:"";position:absolute;right:0;top:50%;width:1px;height:15px;margin-top:-7px;background-color:#d9d9d9}
.prev-next dd{overflow:hidden;padding-left:28px}
.prev-next a{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/*추가*/
.pay-select>ul>li{border-bottom:1px solid #ededed}
.pay-select li>a{display:block;height:59px;background:url(../images/common/arrow_select.gif) no-repeat right 15px top 50%;line-height:59px;font-size:18px;font-weight:500;color:#222}
.pay-select li>a>i{margin-right:2px;vertical-align:-1px;font-size:20px;color:#bdbdbd}
.pay-select li>.on{background:url(../images/common/arrow_select_on.gif) no-repeat right 15px top 50%}
.pay-select li>.on+div{display:block}
.pay-select>ul>li>div{display:none;background-color:#f4f4f4}
.pay-select ul ul{overflow:hidden;padding:12px 25px}
.pay-select ul ul li{float:left;margin-right:25px;padding:10px 0}
.pay-select ul ul li i{font-size:21px;color:#bdbdbd}
.pay-select input[type=radio]:checked+label>i{color:#2fb2ab}
.pay-select label{color:#444}
.pay-select .s-pay li{width:calc(100% / 3);margin-right:0}
.pay-select .s-pay label{display:inline-block}
.pay-select .s-pay label>span{display:inline-block;margin-left:6px;padding-left:102px;background-repeat:no-repeat;background-position:0 0}
.pay-select .s-pay1 span{background-image:url(/layouts/gfesta/images/sub/order/img_smailpay.png)}
.pay-select .s-pay2 span{background-image:url(/layouts/gfesta/images/sub/order/img_payco.png)}
.pay-select .s-pay3 span{background-image:url(/layouts/gfesta/images/sub/order/img_npay.png)}
.pay-select .s-pay4 span{background-image:url(/layouts/gfesta/images/sub/order/img_paynow.png)}
.pay-select .s-pay5 span{background-image:url(/layouts/gfesta/images/sub/order/img_kakaopay.png)}
.pay-select .s-pay6 span{background-image:url(/layouts/gfesta/images/sub/order/img_zeropay.png)}
.pay-td{border-top:1px solid #ededed;padding:0 !important}
.df-pay i{vertical-align:-2px}

/** 2020.08.31 카카오페이 PC CSS 결제수단 합치기 수정 add daeyoonkim10 */
.pay-select .df-pay label{display:inline-block}
.pay-select .df-pay label>span{display:inline-block;margin-left:6px;padding-left:102px;background-repeat:no-repeat;background-position:0 0;}
.pay-select .df-pay .pay1-5 span{background-image:url(/layouts/gfesta/images/sub/order/img_kakaopay.png)}

/*190717 추가  장바구니 비었을 때*/
.no-cart-msg{text-align:center;}
.no-cart-msg>div {margin-bottom: 20px; padding-top: 100px; font-weight: 500; font-size: 20px; color: #222;}
.no-cart-msg a {width: auto; margin: 0; padding: 0 20px; height: 46px; line-height: 46px; font-size: 16px;}

/* 팝업 */
.ly-pop.w780 {width: 780px}
.ly-pop.w742 {width: 742px}
.pop-write-table {padding: 10px 0; border-top: 2px solid #333; border-bottom: 1px solid #d3d3d3}
.pop-write-table th {padding-top: 17px; font-weight: 400; color: #666; text-align: left; vertical-align: top}
.pop-write-table th.file {padding-top: 10px}
.pop-write-table td {padding: 10px 0}
.pop-write-table textarea {padding: 12px 15px}
.pop-write-table + .btm-btn a {padding: 0 20px}

/* 멤버스 */
.members-wrap .lnb {}
.members-wrap .lnb li:first-child {border-top: 1px solid #d3d3d3}
.members-wrap .lnb a:hover, .members-wrap .lnb .on {background-color: #2fb2ab; background-image:url(/layouts/gfesta/images/common/bg_lnb_on2.gif); color: #fff}
.members-wrap .lnb a:hover:after,.members-wrap .lnb .on:after {display: none;}
.btn-type1 {display: inline-block; height: 39px; padding: 0 15px; font-size: 15px; color: #fff; background: #999; line-height: 39px; text-align: center}
.members-search {padding-bottom: 36px; border: 1px solid #d3d3d3; text-align: center}
.members-search .today {display: block; height: 54px; font-weight: 400; color: #444; background: #f4f4f4; line-height: 54px; border-bottom: 1px solid #d3d3d3}
.members-search .input-area {margin-top: 14px}
.members-search .input-area input[type="text"] {width: 360px; margin-right: 10px; vertical-align: top}
.members-search .txt1 {padding-top: 33px; font-size: 18px; font-weight: 500; color: #222}
.members-search .txt2 {margin-top: 14px}
.members-wrap .normal-tit {padding-bottom: 9px; font-size: 20px; font-weight: 500; color: #222}
.members-wrap .period {float: right; font-size: 15px; margin-top: -30px}
.chart-area {width: 100%; height: 487px; margin-top: 40px; border: 1px solid #d3d3d3; box-sizing: border-box}
.btn-big {display: inline-block; height: 43px; margin-top: 30px; padding: 0 18px; font-size: 15px; font-weight: 400; background: #333; color: #fff; line-height: 43px}
.members-wrap .product-search {padding: 25px 0; text-align: center; font-size: 0}
.members-wrap .product-search span {display: inline-block; font-size: 15px; vertical-align: top}
.members-wrap .product-search .date-srh>span {float: none; display: inline-block}
.members-wrap .product-search select {margin-right: 10px}
.members-wrap .product-search .week-ck {display: inline-block; float: none; vertical-align: top}
.members-wrap .product-search .week-ck label {width: 83px}


.login-link{width:360px;margin:20px auto 0;overflow:hidden}
.login-link li{position:relative;width:120px;float:left}
.login-link li:first-child{width:110px}
.login-link li:nth-child(2){width:120px}
.login-link li:nth-child(3){width:130px}
.login-link li:not(:last-child)::before{content:"|";position:absolute;top:1.5px;right:0px;font-size:12px;color:#d3d3d3}
.login-link li a{display:block;position:relative;font-size:15px;font-weight:300;color:#666;text-align:center}
.login-link li a .search_id, .login_box ul li a .search_pw{margin-right:5px;margin-bottom:-2px}
.login-link li a .join{width:13px;height:15px;background:url(../images/sub/member/human_check.png) 0 0 no-repeat}
.login-link li a .search_id{width:14px;height:15px;background:url(../images/sub/member/search_id_icon.png) 0 0 no-repeat}


/*추가*/
.login-link li a .search_pw{width:11px;height:15px;background:url(../images/sub/member/search_password_icon.png) 0 0 no-repeat}
.opy-on{opacity:1 !important}
.ly-pop.w600{width:600px}
.coupon-price{border-bottom:1px solid #d3d3d3;background-color:#f4f4f4}
.coupon-price ul{overflow:hidden;padding:29px 0}
.coupon-price li{float:left;position:relative;width:calc(100% / 3);text-align:center}
.coupon-price li:nth-child(1):before,.coupon-price li:nth-child(2):before{display:block;content: ''; position: absolute; top: 50%; right: 0; width: 25px; height: 25px; margin: -12px -12px 0 0; background:url(../images/sub/order/icon_calc.png) no-repeat 0 0}
.coupon-price li:nth-child(2):before{background-position:-50px 0}
.coupon-price strong{display:block;font-size:20px;font-weight:500;;color:#222}

/*옵션 로딩 애니메이션*/
.count-box{position:relative;display:inline-block;width:45px;height:31px;vertical-align:middle}
.spinner{position:absolute;top:0;left:7px;height:23px;width:23px;background:rgba(255, 255, 255, 0.2);border-radius:50%}
.spinner-box{border:4px solid rgba(179, 179, 179, 0.4);border-top-color: #2fb2ab;animation: spinner2 600ms linear infinite}
@keyframes spinner2 {to {transform: rotate(360deg);}}

/*190718추가 회원정보관리 배너*/
.personalInfo-banner{border:1px solid #000; height:180px; margin-bottom: 40px;}
img.pers-banner{width:100%; height:100%;}


/*190722 일반회원 마이페이지 메뉴 배너추가*/
.myinfo-menu-banner{height:250px; background:url(/layouts/gfesta/images/sub/banner/menu_member_join.png)no-repeat; background-size:coverd; margin-top:50px; display: block; }

