@charset "utf-8";

ul.slide-pager {}
ul.slide-pager:after {display:block;content:"";clear:both;}
ul.slide-pager li {float:left;margin-left:10px;}
ul.slide-pager li:first-child {margin-left:0;}
ul.slide-pager a {display:block;width:10px;height:10px;background-color:#a5a5a5;border-radius:5px;}
ul.slide-pager a.on {width:35px;}

.slide-ctrl {display:inline-block;vertical-align:middle;width:16px;height:24px;font-size:0;background-repeat:no-repeat;background-position:center center;}
.slide-ctrl.prev {background-image:url('../img/common_icon_slide_prev2.png');background-position:left  center;}
.slide-ctrl.next {background-image:url('../img/common_icon_slide_next2.png');background-position:right center;}
.slide-ctrl.ctrl {background-image:url('../img/common_icon_slide_pause.png');}
.slide-ctrl.ctrl.on {background-image:url('../img/common_icon_slide_play.png');}

.main-section {padding:50px 0;}
.main-section h2 {padding-bottom:45px;line-height:30px;font-size:30px;font-weight:700;color:#101010;text-align:center;}
.main-section .btn-more {display:block;margin:40px auto 0 auto;width:76px;height:76px;padding-top:42px;line-height:12px;font-size:12px;color:#fff;text-align:center;border-radius:100%;background:#222 url('../img/main_icon_more01.png') no-repeat center top 23px;box-sizing:border-box;}

/*
 * 메인 비주얼
 */
.main-visual {position:relative;}
.main-visual ul.visual {height:calc(190px + 419px);overflow:hidden;}
.main-visual ul.visual li {padding-top:190px;height:419px;background-color:#ececec;background-repeat:no-repeat;background-position:center bottom;cursor:pointer;}
.main-visual .slide-ctrl {z-index:101;position:absolute;top:364.5px;display:block;width:40px;height:70px;font-size:0;background:no-repeat center center;}
.main-visual .slide-ctrl.prev {left:50%;margin-left:-650px;background-image:url('../img/main_slide_btn_prev.png');}
.main-visual .slide-ctrl.next {left:50%;margin-left: 610px;background-image:url('../img/main_slide_btn_next.png');}

.main-visual > .nav {z-index:101;position:absolute;bottom:40px;left:50%;transform:translateX(-50%);} 
.main-visual > .nav:after {display:block;content:"";clear:both;}
.main-visual > .nav > a.ctrl {float:left;display:block;margin-right:12px;width:22px;height:22px;font-size:0;background:url('../img/main_slide_navi_play.png') no-repeat;background-size:contain;}
.main-visual > .nav > a.ctrl.on {background-image:url('../img/main_slide_navi_pause.png');}
.main-visual > .nav > .pager {float:left;}
.main-visual > .nav > .pager:after {display:block;content:"";clear:both;}
.main-visual > .nav > .pager > a {float:left;display:block;margin:5px 0 0 7px;width:12px;height:12px;font-size:0;border:1px solid #7d7975;border-radius:100%;opacity:0.7;box-sizing:border-box;}
.main-visual > .nav > .pager > a:first-child {margin-left:0;}
.main-visual > .nav > .pager > a.on {background-color:#7d7975;}

/*
 * 기획전
 */
.main-section.evt {}
.main-section.evt h2 {line-height:28px;font-size:28px;}
.main-section.evt h2 > span {font-weight:400;}
.main-section.evt h2 > span > i {display:inline-block;vertical-align:middle;margin:0 3px;font-size:12px;font-style:normal;}
.main-section.evt .event-list {margin:-60px 0 0 -60px;width:calc(100% + 60px);}
.main-section.evt .event-list:after {display:block;content:"";clear:both;}
.main-section.evt .event-list > .itm {float:left;margin:60px 0 0 60px;width:calc((100% - 60px * 2 - 0.1px)/2);height:341px;overflow:hidden;}
.main-section.evt .event-list > .itm:after {display:block;content:"";clear:both;}
.main-section.evt .event-list > .itm > img {float:left;display:block;width:240px;}
.main-section.evt .event-list > .itm > .inf {float:right;width:calc(100% - 240px - 25px);letter-spacing:-0.05em;}
.main-section.evt .event-list > .itm > .inf > a {display:block;}
.main-section.evt .event-list > .itm > .inf > a > .tit {line-height:30px;font-size:22px;font-weight:700;color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.main-section.evt .event-list > .itm > .inf > a > .dsc {margin-top:10px;height:36px;line-height:18px;font-size:15px;color:#888;word-break:keep-all;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
.main-section.evt .event-list > .itm > .inf > a > .lnk {display:inline-block;margin-top:15px;padding-right:14px;line-height:14px;font-size:14px;color:#888;background:url('../img/common_icon_more02.png') no-repeat right 2px top 2px;}
.main-section.evt .event-list > .itm > .inf > a:hover > .lnk {font-weight:700;color:#333;background-image:url('../img/common_icon_more02_on.png');}
.main-section.evt .event-list > .itm > .inf > .goods {margin-top:25px;}
.main-section.evt .event-list > .itm > .inf > .goods:after {display:block;content:"";clear:both;}
.main-section.evt .event-list > .itm > .inf > .goods > a {float:left;display:block;margin-left:10px;width:calc((100% - 20px - 0.1px)/3);}
.main-section.evt .event-list > .itm > .inf > .goods > a:first-child {margin-left:0;}
.main-section.evt .event-list > .itm > .inf > .goods > a > img {width:100%;display:block;}
.main-section.evt .event-list > .itm > .inf > .goods > a > .tit {margin-top:10px;height:40px;line-height:20px;font-size:14px;color:#666;word-break:break-all;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
.main-section.evt .event-list > .itm > .inf > .goods > a:hover > .tit {color:#333;font-weight:700;}
.main-section.evt .event-list > .itm > .inf > .goods > a > .prc {margin-top:15px;line-height:18px;font-size:16px;font-weight:bold;color:#006ab6;}
.main-section.evt .event-list > .itm > .inf > .goods > a > .prc > i {margin-left:2px;font-size:0.85em;font-weight:400;font-style:normal;color:#555;}

/*
 * 당신의 취향저격
 */
.main-section.fav {background-color:#fafafa;}
.main-section.fav h2 {line-height:28px;font-size:28px;color:#434343;}
.main-section.fav h2:after {display:inline-block;vertical-align:bottom;content:"";margin-left:5px;width:31px;height:31px;background:url('../img/main_title_icon01.png') no-repeat;}

.favorite-wrapper {}
.favorite-wrapper:after {display:block;content:"";clear:both;}
.favorite-wrapper > .group {float:left;margin-left:65px;min-height:500px;width:calc((100% - (65px * 2) - 387px)/2);}
.favorite-wrapper > .group:first-child {margin-left:0;}
.favorite-wrapper > .group.GC {width:387px;}
.favorite-wrapper > .group > .group-list {}
.favorite-wrapper > .group > .group-list > .group {margin-top:35px;}
.favorite-wrapper > .group > .group-list > .group:first-child {margin-top:0;}
.favorite-wrapper > .group > .group-list > .group.bd1 {border-top:1px solid #e3dfdf;}
.favorite-wrapper > .group > .group-list > .group .wrp {padding-left:20px !important;padding-right:20px !important;}
.favorite-wrapper > .group > .group-list > .group > a {display:block;}
.favorite-wrapper > .group > .group-list > .group > a > img {display:block;width:100%;}
.favorite-wrapper > .group > .group-list > .group > a .dsc {margin:30px 0 5px;line-height:18px;font-size:14px;color:#666;}
.favorite-wrapper > .group > .group-list > .group > a .tit {line-height:28px;font-size:22px;font-weight:700;color:#333;}
.favorite-wrapper > .group > .group-list > .group > a .more {margin-top:12px;padding-right:13px;display:inline-block;line-height:14px;font-size:14px;color:#666;background:url('../img/common_icon_more02.png') no-repeat right 2px top 2px;}
.favorite-wrapper > .group > .group-list > .group > a:hover .more {color:#111;font-weight:700;background-image:url('../img/common_icon_more02_on.png');}
.favorite-wrapper > .group > .group-list > .group > .item-list {margin-top:15px;}
.favorite-wrapper > .group > .group-list > .group > .item-list > .item {display:block;padding:10px 0;border-top:1px solid #e3dfdf;}
.favorite-wrapper > .group > .group-list > .group > .item-list > .item:first-child {border-top:0;}
.favorite-wrapper > .group > .group-list > .group > .item-list > .item:after {display:block;content:"";clear:both;}
.favorite-wrapper > .group > .group-list > .group > .item-list > .item > img {float:left;display:block;width:80px;}
.favorite-wrapper > .group > .group-list > .group > .item-list > .item > .inf {float:right;width:calc(100% - 80px - 15px);padding-top:5px;letter-spacing:-0.05em;}
.favorite-wrapper > .group > .group-list > .group > .item-list > .item > .inf > .tit {height:40px;line-height:20px;font-size:14px;color:#666;word-break:keep-all;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
.favorite-wrapper > .group > .group-list > .group > .item-list > .item:hover > .inf > .tit {color:#111;font-weight:700;}
.favorite-wrapper > .group > .group-list > .group > .item-list > .item > .inf > .prc {margin-top:10px;line-height:14px;font-size:14px;font-weight:700;color:#006ab6;}
.favorite-wrapper > .group > .group-list > .group > .item-list > .item > .inf > .prc > i {font-size:12px;font-weight:400;font-style:normal;color:#555;}
.favorite-wrapper > .group > .group-list > .category {margin-top:15px;}
.favorite-wrapper > .group > .group-list > .category:first-child {margin-top:0;}
.favorite-wrapper > .group > .group-list > .category > a {position:relative;display:block;}
.favorite-wrapper > .group > .group-list > .category > a > img {display:block;width:100%;}
.favorite-wrapper > .group > .group-list > .category > a > .inf {position:absolute;left:0;bottom:0;width:100%;padding:20px 10px 20px 25px;background-color:rgba(21,21,21,0.5);transition:all .3s;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
.favorite-wrapper > .group > .group-list > .category > a:hover > .inf {background-color:rgba(21,21,21,0.9);}
.favorite-wrapper > .group > .group-list > .category > a > .inf > .dsc {margin-bottom:5px;line-height:18px;font-size:14px;color:#cecece;}
.favorite-wrapper > .group > .group-list > .category > a > .inf > .tit {line-height:24px;font-size:20px;font-weight:700;color:#fff;}

/*
 * MD's P!ck
 */
.main-section.pick {}
.main-section.pick h2 {color:#2c2c2c;}
.main-section.pick h2 > i {font-style:normal;font-weight:400;color:#006ab6;letter-spacing:0.05em;}

.best-cate {line-height:16px;font-size:16px;color:#888;text-align:center;}
.best-cate > .lst {display:inline-block;}
.best-cate > .lst:after {display:block;content:"";clear:both;}
.best-cate > .lst > a {float:left;display:block;margin-left:30px;padding-bottom:3px;transition:all .3s;}
.best-cate > .lst > a:first-child {margin-left:0;}
.best-cate > .lst > a:hover {color:#2c2c2c;font-weight:700;}
.best-cate > .lst > a.on {color:#2c2c2c;font-weight:700;border-bottom:1px solid #2c2c2c;}
.best-cate > .lst > a.dn {padding-right:13px;background:url('../img/main_icon_arrow_dn.png') no-repeat right top 1px;}
.best-cate > .lst > a.up {padding-right:13px;background:url('../img/main_icon_arrow_up.png') no-repeat right top 1px;}
.best-cate > .lst > a.dn:hover,
.best-cate > .lst > a.dn.on {background-image:url('../img/main_icon_arrow_dn_on.png');}
.best-cate > .lst > a.up:hover,
.best-cate > .lst > a.up.on {background-image:url('../img/main_icon_arrow_up_on.png');}

.best-wrapper {position:relative;margin-top:25px;}
.best-wrapper > .ctrl {position:absolute;z-index:3;display:block;top:50%;transform:translateY(-50%);width:40px;height:40px;font-size:0;background:rgba(255,255,255,0.8) no-repeat center center;}
.best-wrapper > .ctrl.prev {left :0;background-image:url('../img/main_best_slide_prev.png');}
.best-wrapper > .ctrl.next {right:0;background-image:url('../img/main_best_slide_next.png');}
.best-wrapper .best-slide {height:calc(325px * 2);overflow:hidden;}
.best-wrapper .best-slide .best-slide-item {}
.best-wrapper .best-slide .best-slide-item > .lst {height:calc(325px * 2);}
.best-wrapper .best-slide .best-slide-item > .lst:after {display:block;content:"";clear:both;}
.best-wrapper .best-slide .best-slide-item > .lst > a {position:relative;float:left;display:block;width:calc(100% / 4);}
.best-wrapper .best-slide .best-slide-item > .lst > a:before {display:block;content:"";padding-bottom:100%;}
.best-wrapper .best-slide .best-slide-item > .lst > a > img {position:absolute;left:0;top:0;display:block;width:100%;height:100%;}
.best-wrapper .best-slide .best-slide-item > .lst > a > .num {z-index:2;position:absolute;left:0;top:0;display:block;width:35px;height;35px;line-height:35px;background-color:#1e1e1e;font-size:14px;font-weight:700;font-style:normal;color:#fff;text-align:center;}
.best-wrapper .best-slide .best-slide-item > .lst > a > .cnt {z-index:1;position:absolute;left:0;right:0;bottom:0;padding:20% 25px 20px;
    background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.5) 100%);
    text-shadow: 1px 2px 2px rgba(51,51,51,0.5);}
.best-wrapper .best-slide .best-slide-item > .lst > a > .cnt > .tit {display:block;line-height:22px;font-size:17px;font-weight:700;color:#fff;word-break:keep-all;}
.best-wrapper .best-slide .best-slide-item > .lst > a > .cnt > .prc {display:block;margin-top:5px;line-height:20px;font-size:18px;font-weight:700;color:#83e1eb;}
.best-wrapper .best-slide .best-slide-item > .lst > a > .cnt > .prc > i {margin-left:3px;font-style:normal;font-size:14px;font-weight:400;color:#fff;}
.best-wrapper .best-slide .best-slide-item > .lst > a.big {width:calc(100% / 2);}
.best-wrapper .best-slide .best-slide-item > .lst > a.big > img {}
.best-wrapper .best-slide .best-slide-item > .lst > a.big > .num {width:48px;height:48px;line-height:48px;font-size:20px;}
.best-wrapper .best-slide .best-slide-item > .lst > a.big > .cnt {padding:20% 40px 60px;}
.best-wrapper .best-slide .best-slide-item > .lst > a.big > .cnt > .tit {line-height:32px;font-size:24px;}
.best-wrapper .best-slide .best-slide-item > .lst > a.big > .cnt > .prc {margin-top:15px;font-size:24px;}
.best-wrapper .best-slide .best-slide-item > .lst > a.big > .cnt > .prc > i {font-size:20px;}

/*
 * 추천 카테고리
 */
.suggest-category {position:relative;height:330px;overflow:hidden;}
.suggest-category > .ctrl {position:absolute;top:calc((100% - 35px)/2);transform:translateY(-50%);display:block;width:36px;height:41px;font-size:0;background:rgba(255,255,255,0.5) no-repeat center center;background-size:auto 50%;}
.suggest-category > .ctrl.prev {left :0;background-image:url('../img/common_icon_slide_prev2.png');}
.suggest-category > .ctrl.next {right:0;background-image:url('../img/common_icon_slide_next2.png');}
.suggest-category .ct-list:after {display:block;content:"";clear:both;}
.suggest-category .ct-list .itm {float:left;margin-left:40px;width:calc((100% - (40px * 3) - 0.1px) / 4);}
.suggest-category .ct-list .itm:first-child {margin-left:0px;}
.suggest-category .ct-list.slider .itm {margin-left:0;}
.suggest-category .ct-list .itm > img {display:block;width:100%;border-radius:100%;}
.suggest-category .ct-list .itm > .tit {display:block;margin-top:15px;line-height:20px;font-size:20px;color:#000;text-align:center;}
 
/*
 * 전체 아이템
 */
ul.goods-list {margin:0 0 -50px -35px;width:calc(100% + 35px);}
ul.goods-list:after {display:block;content:"";clear:both;}
ul.goods-list>li {float:left;margin:0 0 50px 35px;display:block;width:calc((100% - 35px * 4)/4);height:449px;color:#000;}
ul.goods-list>li a {display:block;}
ul.goods-list>li .pic img {display:block;width:100%;/*width:280px;height:280px;*/}
ul.goods-list>li .tit {margin-top:15px;font-size:18px;line-height:20px;color:#121212;letter-spacing:-0.05em;word-break:keep-all;max-height:40px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
ul.goods-list>li .dsc {margin-top:15px;font-size:14px;line-height:20px;color:#666;letter-spacing:-0.5px;max-height:40px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
ul.goods-list>li .prc {margin-top:15px;font-size:18px;line-height:18px;font-weight:700;line-height:18px;color:#006ab6;}
ul.goods-list>li .prc i {margin-left:3px;font-style:normal;font-size:14px;font-weight:400;color:#555;}
ul.goods-list>li .prc .wrn {margin-left:15px;}

/*================================================================================================
 * Tablet & Mobile 공용 : ~ 1023px
 *================================================================================================*/
@media (max-width:1023px) /* (max-width:1025px) */
{
}

/*================================================================================================
 * Tablet : 638px~1023px 해상도에서 해석하는 코드 
 *================================================================================================*/
@media (min-width:638px) and (max-width:1023px) /* (max-width:1025px) */
{   
}

/*================================================================================================
 * Mobile : 637px 이하 해상도에서 해석하는 코드
 *================================================================================================*/
@media(max-width:637px)
{
}

/*================================================================================================
 * Mobile : ~379px 해상도에서 해석하는 코드 (해상도 낮은 Mobile)
 *================================================================================================*/
@media (max-width:379px) /* (max-width:1025px) */
{
}