@charset "UTF-8";
input, select, button, textarea { font-family: inherit; }

/* ALL STYLE */
#all { width: 100%; height: auto; min-width: 1300px; overflow: hidden; font-weight: 400; font-size: 15px; }

.layout_wrap { clear: both; width: 100%; }

.layout_inner { width: 1200px; margin: 0 auto; }

.userFullWidth { width: 1200px; }

.userCWidth { width: 820px; }

.userCWidth2 { width: 1200px; }

.width100 { width: 100%; }

/*헤더 콘텐츠 영역 */
#contain { width: 1500px; position: relative; padding: 60px 0; margin-bottom: 60px; overflow: hidden; }

/*GOODS*/
#index { padding: 0 30px; }

.goods_wrap { font-size: 0; width: 100%; margin: 0; }
.goods_wrap div { font-size: 15px; }
.goods_wrap .nodata { font-size: 18px; }

.goods { position: relative; width: 350px; display: inline-block; font-size: 15px; vertical-align: top; margin: 0; margin-right: 33.3333333333px; margin-bottom: 45px; }
.goods:nth-of-type(4n) { margin-right: 0; }
.goods a { cursor: pointer; text-decoration: none; width: 100%; height: 100%; float: left; height: 100%; display: block; color: #515151; }
.goods .sale { position: absolute; top: 18px; left: 18px; z-index: 1; font-size: 18px; width: 54px; height: 54px; background: #2e3f95; color: #fff; display: flex; justify-content: center; align-items: center; font-weight: 200; border-radius: 100%; }
.goods .img { position: relative; display: flex; justify-content: center; align-items: center; width: 350px; height: 350px; overflow: hidden; background: #fafafa; }
.goods .img:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; box-sizing: border-box; opacity: 0; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; transition: all 0.3s; background: #515151; mix-blend-mode: overlay; }
.goods .img img { transition: all .3s; }
.goods:hover .img:after { opacity: 1; }
.goods:hover .img img { transform: scale(1.02); }
.goods .txt { letter-spacing: -0.05em; line-height: 1.2; text-align: left; margin-top: 3rem; }
.goods .txt .name { font-size: 18px; color: #454545; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.goods .txt .comment { margin-top: 0.5rem; font-size: 1.6rem; color: #868686; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.goods .txt .price { margin-top: 30px; font-size: 15px; }
.goods .txt .price .line { color: #a8a8a8; text-decoration: line-through; }
.goods .txt .price div { font-size: inherit; line-height: 1; font-weight: 400; letter-spacing: -0.05em; }
.goods .txt .price div span { font-size: 2.1rem; font-weight: 600; margin-right: 0.5rem; }
.goods .txt .price .pv { margin-top: 9px; color: #162647; font-size: inherit; font-weight: 600; }

.category { text-align: center; border-top: 2px solid #677485; border-bottom: 1px solid #d9d9d9; overflow: hidden; width: 100%; margin-bottom: 50px; }
.category .main_cate { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; width: 100%; min-height: 90px; }
.category .main_cate.center { justify-content: center; }
.category .cate_tit { color: #363636; font-size: 22.5px; font-weight: 600; letter-spacing: -0.9px; }
.category .arrow { width: 40px; height: 40px; color: #bdbdbd; border: 1px solid #e0e0e0; border-radius: 100%; font-size: 25px; display: inline-flex; justify-content: center; align-items: center; }
.category .arrow.left i { -moz-transform: translateX(-5%); -webkit-transform: translateX(-5%); transform: translateX(-5%); }
.category .arrow.right i { -moz-transform: translateX(5%); -webkit-transform: translateX(5%); transform: translateX(5%); }
.category .arrow:hover { border-color: #bdbdbd; }
.category .arrow:hover i { color: #9e9e9e; }
.category ul { width: 100%; display: flex; justify-content: center; align-items: center; background: #f5f5f5; box-shadow: inset 0 1px 0 0 #e0e0e0; }
.category ul li { margin: 1.5rem; }
.category ul a { color: #222; padding: 0.5rem; }
.category ul a span { position: relative; }
.category ul a span:after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; width: 100%; }
.category ul a:hover span:after { background: #222; }
.category ul a span.active { color: black; }
.category ul a span.active:after { background: #0a1120; }

/*220914 best goods 추가*/
div.goods_title { width: 100%; font-size: 24px; text-align: left; font-weight: 400; color: #111; display: flex; justify-content: flex-start; align-items: center; margin-bottom: 30px; }
div.goods_title i { font-size: 18px; margin-left: 5px; color: #162647; margin-top: -2px; }

.goods_wrap { padding: 20px 0; }
.goods_wrap + hr { border: none; border-bottom: 1px solid #e0e0e0; margin: 0 0 50px 0; }

#shop_3depth_cate { width: 100%; display: flex; justify-content: center; align-items: center; box-shadow: inset 0 1px 0 0 #e0e0e0; }
#shop_3depth_cate ul { width: auto; background: transparent; box-shadow: none; }
#shop_3depth_cate ul a span { position: relative; }
#shop_3depth_cate ul a span:after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; width: 100%; }
#shop_3depth_cate ul a:hover { text-decoration: none; }
#shop_3depth_cate ul a:hover span { text-decoration: none; }
#shop_3depth_cate ul a:hover span:after { background: #222; }
#shop_3depth_cate ul a.hover { color: #162647; }
#shop_3depth_cate ul a.hover span { text-decoration: none; }
#shop_3depth_cate ul a.hover span:after { background: #162647; }
