@charset "utf-8";

.shop-wrap {position:relative; max-width:1660px; padding-left:320px; padding-right:30px; margin:0 auto; display:flex;}
.shop-view-wrap {position:relative; max-width:1660px; padding-left:30px; padding-right:206px; margin:0 auto;}
#sub .shop-view-wrap .quick {top:45px;}

.list-area {flex:1 1 auto; min-width:0; width:1%; margin-right:170px;}
.list-area .sub-title {margin-bottom:35px; text-align:left;}

.goods-title {margin-bottom:35px;}
.goods-title h2 {font-size:34px; font-weight:600; line-height:1.3em;}

/* 필터검색 */
.filter-area {position:absolute; top:190px; left:30px; width:210px; /* margin-right:80px; margin-top:190px; */}
.filter-area .inner {position:relative;}
.filter-area .tit {display:none;}
.filter-area .ctr {position:absolute; top:0; right:0;}
.filter-area .icon-refresh {display:block; width:18px; height:18px; background:transparent url("../images/shop/icon_refresh.png") 50% 50% no-repeat; border:0;}
.filter-area .icon-close {display:none;}
.filter-group {margin-bottom:30px;}
.filter-group h3 {color:#221e1f; font-size:20px; font-weight:500; line-height:1.15em; letter-spacing:-.025em; padding-bottom:11px; margin-bottom:16px; border-bottom:1px solid #c4c4c4;}
.filter-group .radio-type {font-size:15px; font-weight:300; line-height:1.3em; letter-spacing:-.025em;}
.filter-group .radio-type .item {margin-bottom:11px;}
.filter-group .radio-type .item:last-child {margin-bottom:0;}
.filter-group .check-type {display:flex; flex-wrap:wrap; margin:-3px -2px; font-size:14px; font-weight:300; line-height:27px; letter-spacing:-.025em;}
.filter-group .check-type .item {padding:3px 2px;}
.filter-group .check-type .check {display:block; position:relative; min-width:56px; text-align:center;}
.filter-group .check-type .check input {position:absolute; top:0; left:0; width:0; height:0; border:0; opacity:0; z-index:-1;}
.filter-group .check-type .check label {display:block; border:1px solid #221e1f; padding:0 11px; border-radius:20px; cursor:pointer; transition:.2s;}
.filter-group .check-type .check input:checked + label {background:#221e1f; border-color:#221e1f; color:#fff;}

/* 카테고리 */
.goods-cate {margin-bottom:80px; overflow:hidden;}
.goods-cate ul {display:flex; flex-wrap:wrap; margin:-4px -19px -4px -20px;}
.goods-cate ul li {position:relative; padding:4px 0; display:flex; align-items:center;}
.goods-cate ul li:before {content:""; width:1px; height:26px; background:#b2b2b2;}
.goods-cate ul li a {display:block; color:#221e1f; font-size:17px; font-weight:300; line-height:1.5em; padding:0 19px;}
.goods-cate ul li a:hover {color:#999}
.goods-cate ul li.active a {color:#999 !important;}

/* 상품정렬 */
.goods-sort {display:flex; justify-content:space-between; align-items:center; margin-bottom:30px;}
.goods-sort .ico-filter {display:none;}
.goods-sort .total {white-space:nowrap; color:#999; font-size:15px; line-height:1.5em; letter-spacing:-.02em;}
.goods-sort .total strong {color:#231f20; font-weight:400;}
.goods-sort .sort select {display:inline-block; border:0; height:25px; font-size:15px; line-height:1.5em; padding:0 24px 0 0; background:#fff url('/images/shop/sort_select.png') right center no-repeat; -webkit-appearance:none; -moz-appearance:none; appearance:none;}
.goods-sort .sort select::-ms-expand {display:none;}

/* 상품 리스트 */
.goods-list {min-height:40vh;}
.goods-list ul {display:flex; flex-wrap:wrap; margin:0 -25px;}
.goods-list ul li {width:25%; text-align:left; padding:0 25px; margin-bottom:60px;}
.goods-list ul li a {display:block; position:relative;}
.goods-list ul li a:hover .thumb img {transform:scale(1.02) translate(-50%,-50%);}
.goods-list ul li .thumb {position:relative; padding-bottom:100%; margin-bottom:13px; overflow:hidden;}
.goods-list ul li .thumb img {position:absolute; top:50%; left:50%; transition:.4s; transform:translate(-50%,-50%); width:auto !important; height:auto !important; max-width:100%; max-height:100%; object-fit:contain;}
.goods-list ul li .thumb:after {content:""; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid #a5a5a5;}
.goods-list ul li .tit {font-size:17px; line-height:1.4em;}
.goods-list ul li.none {text-align:center; margin:0; padding:50px 0; width:100%; height:40vh; display:flex; align-items:center; justify-content:center;}

/* 상품상세 상단 */
.path {margin-bottom:50px; font-size:15px; font-weight:500; line-height:1.3em; display:flex; flex-wrap:wrap; align-items:center;}
.path .arrow {display:inline-block; width:33px; height:17px; background:url("../images/sub/path_arrow.png") 50% 50% no-repeat; overflow:hidden; text-indent:-99999em;}
.path a:last-child {color:#999; font-weight:400;}

.goods-summary {display:flex; margin-bottom:160px;}

.goods-photo {width:44%; max-width:620px; margin-right:95px;}
.goods-photo .slider {border:1px solid #999; margin-bottom:35px;}
.goods-photo .item {position:relative; padding-bottom:100%; overflow:hidden;}
.goods-photo .item img {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:auto !important; height:auto !important; max-width:100%; max-height:100%; object-fit:contain;}
.goods-photo .item video {position:absolute; top:50%; left:50%; width:100%; height:56.25%; min-height:auto !important; transform:translate(-50%,-50%);}
.goods-photo .item iframe {position:absolute; top:50%; left:50%; width:100%; height:56.25%; min-height:auto !important; transform:translate(-50%,-50%);}
.goods-photo .thumbs .items {margin:0 -13px;}
.goods-photo .thumbs .slick-slide {padding:0 13px;}
.goods-photo .thumbs .item {cursor:pointer;}
.goods-photo .thumbs .item:after {content:""; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid #ddd;}
.goods-photo .thumbs .slick-current .item:after {border-color:#999;}

.goods-info {flex:1 1 auto; min-width:0; width:1%;}
.goods-info .title {padding:0 0 18px 50px;}
.goods-info .title h2 {font-size:34px; font-weight:600; line-height:1.4em; letter-spacing:-.025em;}
.goods-info .title p {color:#999; font-size:17px; font-weight:300; line-height:1.4em; letter-spacing:-.025em; margin-top:8px;}
.goods-info .table {border-top:2px solid #221e1f; padding-top:24px;}
.goods-info .table table {table-layout:fixed; width:100%; border-collapse:collapse; border-spacing:0px;}
.goods-info .table table tbody th {padding:13px 0 13px 50px; width:217px; font-weight:500; font-size:20px; line-height:1.3em; letter-spacing:-.025em; text-align:left; border-bottom:1px solid #999;}
.goods-info .table table tbody td {padding:13px 0; color:#777; font-size:17px; font-weight:300; line-height:1.4em; letter-spacing:-.025em; border-bottom:1px solid #999;}
.goods-info .table table tbody td img {vertical-align:middle;}
.goods-info .table table tr:last-child th,
.goods-info .table table tr:last-child td {border-bottom:0; vertical-align:top;}
.goods-info .table table tr:last-child td {padding-top:18px;}
.goods-info .memo {max-height:8.4em; overflow:hidden;}
.goods-info .memo.open {max-height:100%;}
.goods-info .view-more-memo {display:block; margin-top:10px; height:31px; background:url("../images/shop/memo_more.png") 50% 50% no-repeat; border:1px solid #a5a5a5; position:relative;}
.goods-info .view-more-memo.open {background-image:url("../images/shop/memo_more_close.png");}
.goods-info .btns {margin-top:60px;}
.goods-info .btns .row {display:flex; margin:0 -9px;}
.goods-info .btns .col {width:33.33333333%; max-width:198px; padding:0 9px;}
.goods-info .btns .btn {display:flex; align-items:center; justify-content:center; padding:0 15px; height:56px; text-align:center; font-size:20px; font-weight:500; line-height:1.3em; letter-spacing:-.025em; border-radius:30px; border:1px solid #221e1f;}
.goods-info .btns .btn-request {background:#221e1f; color:#fff;}
.goods-info .btns .btn-wish:hover {background:#221e1f; color:#fff;}
.goods-info .btns .btn-cart:hover {background:#221e1f; color:#fff;}
.goods-info .btns .btn-request:hover {background:#96d9f8; border-color:#96d9f8;}

.usability table {table-layout:fixed; border-collapse:collapse; border-spacing:0px; width:auto !important;}
.usability table td {padding:0 !important; border:0 !important; line-height:28px !important; vertical-align:middle !important;}
.usability .bar {margin:3px 15px 0; position:relative; width:142px; height:1px; background:#999;}
.usability .bar .dot {position:absolute; top:-6px; width:13px; height:13px; margin-left:-6px; background:#838484; border:1px solid #676868; border-radius:100%;}

/* 관련상품 */
.relatied-goods .tab {margin-bottom:50px; padding:0 45px; border-bottom:1px solid #999;}
.relatied-goods .tab ul {display:flex;}
.relatied-goods .tab ul li {width:50%; text-align:center;}
.relatied-goods .tab ul li a {display:block; padding:13px 0; position:relative; color:#999; font-size:17px; font-weight:500; line-height:1.3em; letter-spacing:-.025em;}
.relatied-goods .tab ul li.active a {color:#221e1f;}
.relatied-goods .tab ul li.active a:after {content:""; position:absolute; bottom:-4px; left:50%; margin-left:-30px; width:60px; height:7px; background:#221e1f;}
.relatied-goods .goods-list {padding:0 45px; min-height:auto !important;}
.relatied-goods .goods-list ul {margin:-20px;}
.relatied-goods .goods-list ul li {width:16.66666666%; padding:20px;}
.relatied-goods .goods-list ul li .tit {font-size:15px; font-weight:500;}
.relatied-goods .goods-list ul li.none {height:auto; width:100%; padding:50px 0;}

/* 장바구니 */
.cart-top-info {max-width:940px; text-align:center; border:1px solid #ccc; padding:20px; margin:42px auto 0;}
.cart-top-info h3 {font-size:20px; margin-bottom:16px; line-height:1.3em;}
.cart-top-info p {color:#999; font-size:15px; font-weight:300; line-height:1.6em;}
.cart-top-info.mg {margin:0 auto 80px;}

.all-check-area {text-align:right; margin-bottom:12px; padding:0 18px; font-size:15px; line-height:1.3em;}
.all-check-area .del {display:inline-flex; align-items:center; margin-left:18px; vertical-align:middle;}
.all-check-area .del img {margin-right:5px;}

.cart-wrap {margin-bottom:100px;}
.cart-wrap .row {display:flex; margin:0 -40px;}
.cart-wrap .col {flex:1; padding:0 40px;}
.cart-wrap h3 {margin:0 0 12px 25px; font-size:20px; font-weight:500; line-height:1.3em;}
.cart-wrap .items {border-top:2px solid #231f20;}
.cart-wrap .item {display:flex; align-items:center; padding:11px 0; border-bottom:1px solid #ddd;}
.cart-wrap .item .check {width:40px; margin-left:25px;}
.cart-wrap .item .img {width:107px; margin-left:12px;}
.cart-wrap .item .tit {margin:0 40px; flex:1 1 auto; min-width:0; width:1%;}
.cart-wrap .item .tit .txt1 {font-size:17px; line-height:1.4em; font-weight:500;}
.cart-wrap .item .tit .txt2 {font-size:15px; color:#999; line-height:1.4em; margin-top:7px;}
.cart-wrap .item .count {width:63px; margin-right:25px;}
.cart-wrap .item .count .input {display:block; margin-bottom:8px; width:100%; height:27px; padding:0 15px; font-size:14px; border-color:#cfcfcf; background-size:10px auto; background-position:right 10px center;}
.cart-wrap .item .count .btn-pack {display:block; width:100%; border-color:#cfcfcf;}
.cart-wrap .item .count .btn-pack:hover {background:#231f20; border-color:#231f20; color:#fff;}
.cart-wrap .item .count .num {display:block; width:100%; border:1px solid #cfcfcf; line-height:25px; font-size:14px; text-align:center; border-radius:30px;}

/* 최근본상품 */
.latest-list {max-width:1176px; margin:0 auto;}
.latest-list ul {display:flex; flex-wrap:wrap; margin:0 -20px;}
.latest-list ul li {width:16.66666666%; text-align:left; padding:0 20px; margin-bottom:30px;}
.latest-list ul li a {display:block; position:relative;}
.latest-list ul li a:hover .thumb img {transform:scale(1.02) translate(-50%,-50%);}
.latest-list ul li .thumb {position:relative; padding-bottom:100%; margin-bottom:13px; overflow:hidden;}
.latest-list ul li .thumb img {position:absolute; top:50%; left:50%; transition:.4s; transform:translate(-50%,-50%); width:auto !important; height:auto !important; max-width:100%; max-height:100%; object-fit:contain;}
.latest-list ul li .thumb:after {content:""; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid #dfdfdf;}
.latest-list ul li .tit {font-size:15px; font-weight:500; line-height:1.4em;}

/* 관심상품 */
.buttons-right {text-align:right; margin-bottom:23px;}
.buttons-right .btn-pack.medium {margin-left:15px; padding:0 28px; font-size:17px; font-weight:500; height:43px; line-height:41px;}
.buttons-right .btn-pack.dark {background:#fff; border:1px solid #231f20; color:#231f20}
.buttons-right .btn-pack.dark:hover {background:#231f20; border:1px solid #231f20; color:#fff;}

.wishlist-title {position:relative; padding-bottom:5px; margin-bottom:43px; border-bottom:2px solid #ccc;}
.wishlist-title h3 {margin-left:22px; font-size:20px; font-weight:500; line-height:1.3em;}
.wishlist-title .checkbox {font-size:15px; color:#999; line-height:1.3em; position:absolute; top:6px; right:12px;}

.wishlist {margin-bottom:20px;}
.wishlist:last-child {margin-bottom:0;}
.wishlist ul {display:flex; flex-wrap:wrap; margin-right:-28px;}
.wishlist ul li {position:relative; width:20%; padding:0 28px; margin-bottom:50px;}
.wishlist ul li .checkbox {position:absolute; top:-3px; left:3px;}
.wishlist ul li a {display:block; position:relative;}
.wishlist ul li a:hover .thumb img {transform:scale(1.02) translate(-50%,-50%);}
.wishlist ul li .thumb {position:relative; padding-bottom:100%; margin-bottom:6px; overflow:hidden;}
.wishlist ul li .thumb img {position:absolute; top:50%; left:50%; transition:.4s; transform:translate(-50%,-50%); width:auto !important; height:auto !important; max-width:100%; max-height:100%; object-fit:contain;}
.wishlist ul li .thumb:after {content:""; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid #ddd;}
.wishlist ul li .cate {color:#999; font-size:12px; font-weight:500; line-height:1.4em;}
.wishlist ul li .tit {font-size:15px; font-weight:500; line-height:1.4em;}
.wishlist ul li .txt {color:#999; font-size:12px; font-weight:500; line-height:1.4em; margin-top:7px;}
.wishlist ul li.none {width:100%; padding:30px 0; text-align:center; margin:0;}

/* 신청내역 */
.period-search {border:2px solid #ccc; padding:29px; text-align:center; margin-bottom:70px;}
.period-search .inner {margin:0 auto; display:inline-flex; align-items:center;}
.period-search .tit {width:160px; font-size:20px; font-weight:500; line-height:1.3em; letter-spacing:-.025em; text-align:left;}
.period-search .cnt {flex:1 1 auto; min-width:0; width:1%; padding:0 65px; border-left:2px solid #b2b2b3;}
.period-search .type1 {display:flex; flex-wrap:wrap; margin:-5px;}
.period-search .type1 .bt {width:100px; margin:5px; line-height:35px; background:#fff; font-size:17px; border:1px solid #555; border-radius:20px;}
.period-search .type1 .bt.active {background:#231f20; border-color:#231f20; color:#fff;}
.period-search .type2 {margin-top:23px; display:flex; align-items:center;}
.period-search .type2 .input {width:190px; height:37px; background:#fff; border:1px solid #555; text-align:center; font-size:17px; padding:0;}
.period-search .type2 .between {margin:0 10px;}
.period-search .btn .submit {width:150px; height:50px; color:#fff; font-size:20px; background:#231f20; border:0; border-radius:30px; transition:.2s;}
.period-search .btn .submit:hover {background:#96d9f8;}

.order-list {border-bottom:1px solid #ddd;}
.order-list table:first-child {border-top:0;}
.order-list table {table-layout:fixed; width:100%; border-collapse:collapse; border-spacing:0px; border-top:2px solid #ccc; position:relative; margin-top:-1px;}
.order-list th {font-size:20px; font-weight:500; line-height:1.3em; letter-spacing:-.025em; padding:0 0 14px;}
.order-list td {height:135px; padding:10px; text-align:center; font-size:17px; line-height:1.5em; letter-spacing:-.025em; border-bottom:1px solid #ddd;}
.order-list td img {max-width:107px;}
.order-list tr td:first-child {vertical-align:top; padding-top:54px;}
.order-list .btn-pack.medium {padding:0 18px; min-width:100px; height:32px; line-height:30px; font-size:17px; border-color:#ccc;}

.order-list-m {display:none;}

.view-more-list {display:block; height:46px; background:url("../images/shop/list_more.png") 50% 50% no-repeat; border:2px solid #666666; margin-top:-2px; position:relative;}