/* BASIC css start */
.main{margin-top: 50px;}
.clear{clear:both}

/* 메인 비쥬얼 배너 */
#mainSpot {width:100%; overflow:hidden; padding-left: 16%;}
#mainSpot .inner .spotSlider li a img { width:100%; }
#mainSpot .inner .more_view{}

.slick-dots {
    position: absolute;
    bottom: 27px;
    z-index: 10;
    width: 100%;
    left: -32.5%;
    bottom: 26px;
    height: 0;
    text-align: center;
    font-size: 0;
    line-height: 0;
}
.slick-dots li{    display: inline-block;
    width: 9px;
    height: 9px;
    border: 1px solid #555555;
    margin: 0 4px;
    cursor: pointer;
    -webkit-transition: 0.3s ease-in-out;
    -moz-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;}
.slick-dots li.slick-active {
    background-color: #555555;
    cursor: default;
}
.slick-dots li button{font-size: 0; opacity: 0;}
.slick-slide img{float: right;}
.slick-initialized .slick-slide{outline: 0; border: 0;}
#mainSpot .inner .spotSlider li a i{position: absolute; bottom: 105px;
    left: 50%;
    transform: translateX(-50%);}
#mainSpot .inner .spotSlider li a i img:hover{opacity:0.8;}


/*서브 롤링 배너*/
.roll{margin: 70px 25px;}
.roll div a img{width: 100%;}
.roll div .roll_text{text-align: center; padding: 0 22px; display: flow-root;}
.roll div .imabanner_tit{font-size: 2.4em;
    color: #4a4a4a;
    font-family: futura-pt, 'Noto Sans KR', sans-serif;
    padding: 30px 0 20px;
    font-weight: 300;}
    
.roll div .imabanner_con{font-size: 1.15em;
    color: #808080;
    font-family: futura-pt, 'Noto Sans KR', sans-serif;
    font-weight: 300;
    line-height: 25px;}
    
.roll .slick-dots, .roll_pro_nr .slick-dots{    position: absolute;
    bottom: -27px !important;
    left: 50%;
    transform: translateX(-50%); }

.roll .slick-dots li, .roll_pro_nr .slick-dots li{
    width:12px !important;
    height:12px !important;
    border-radius: 50%;
    background-color: #d2d2d2 !important;
    border-style: none;
    margin: 0px 7px;
}

.roll .slick-dots li.slick-active, .roll_pro_nr .slick-dots li.slick-active {
    background-color: #4b4b4b !important;
}

/*브랜드 스토리*/
.brandStory{margin-right: 12%;}
.brandStory img{width: 92%;}
.brandStory figcaption{padding: 54px 0 0 24px;}
.brandStory figcaption h3{font-size: 2.6em;
    color: #666666;
    font-family: futura-pt,'Source Sans Pro', sans-serif;
}
.brandStory figcaption .line{width: 16px;
    height: 2px;
    background: #666666;
    margin: 30px 0 22px;}
.brandStory figcaption span{    font-size: 1.3em;
    color: #7b7b7b;
    line-height: 26px; font-family: 'Source Sans Pro', futura-pt ,sans-serif;}
    
/*상품 영역*/
.ma_spe{margin-top: 60px; padding: 0 6px;}
.list_shopping2x .list_shoppingInfo .shop_info .listName{color: #848484;
    font-size: 1.3em;
    font-family: futura-pt,'Source Sans Pro', sans-serif; margin-bottom: 13px;    font-weight: normal;}    

.list_shopping2x li{margin-bottom: 32px;}
.list_shopping2x .list_shoppingInfo{text-align: left;}
.list_shopping2x .list_shoppingInfo .shop_info p{}
.listDiscount{display: inline-block;}
.listDiscount del{font-size: 1.4em;
    color: #a1a1a1;
    font-family: 'Source Sans Pro', sans-serif; font-weight: bold;}
.listDiscount del .won{font-size: 0.9em;
    font-weight: normal;}
.listPrice{display: inline-block;    color: #3c3c3c;
    font-size: 1.4em; font-weight: bold;}
.list_shopping2x .list_shoppingInfo .MK-product-icons{padding: 7px 0 13px;
    display: block;}
.list_shopping2x .list_shoppingInfo .shop_info .shop_price > .won{display: inline-block;
    font-size: 1.3em;}
    
/* 서브배너 */
.sub{padding: 0 12px;}
.sub .swiper-slide a img{width: 100%;}
.sub .slick-dots{left: 35% !important; bottom: 27px;}
.sub .slick-dots li{background-color:#fff !important; border:0 !important;width: 10px; height: 10px;}
.sub .slick-dots li.slick-active{background-color:#373737 !important;}

.rollarea{padding: 0 12px;}
.rollarea .item-list{margin-top: 15px;}
.rollarea .thumb{    width: 30%;
    display: inline-block;
    vertical-align: top;}
.rollarea .thumb a img{width: 100%;}
.rollarea .prd-info{    display: inline-block;
    margin-left: 10px;
    width: 66.2%;}
.rollarea .prd-info .hapBox{border-bottom: 1px solid #ededee;}
.rollarea .prd-info .hapBox .prd-ico{float: left;}
.rollarea .prd-info .hapBox .prd-preview{float: right;
    padding-bottom: 5px;}
.rollarea .prd-info ul .prd-name{margin: 13px 0;}
.rollarea .prd-info ul .prd-name a{    color: #848484;
    font-size: 1.3em;
    font-family: futura-pt,'Source Sans Pro', sans-serif;
    margin-bottom: 13px;
    font-weight: 400;}
.rollarea .prd-info ul .prd-price strike{font-size: 1.4em;
    color: #a1a1a1;
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: bold;}
.rollarea .prd-info ul .prd-price strike .won{font-size: 0.9em;
    font-weight: normal;}
.rollarea .prd-info ul .price{display: inline-block;
    color: #3c3c3c;
    font-size: 1.4em;
    font-weight: bold;}
.rollarea .prd-info ul .price .won{display: inline-block;
    font-size: 0.98em;}

/* 인스타 */
.insta_area{padding: 0 12px 25px; text-align:center}
.insta_area .cateTit{    float: left;
    padding-top: 0;     
    text-align: left;
    margin-bottom: 30px;
    }
.insta_area i{float: right; padding-top:8px}
.insta_area .cateTit h2{    font-size: 1.95em;
    color: #666;
    font-family: futura-pt, 'Noto Sans KR', sans-serif;
    font-weight: 600; margin-bottom:5px}
.insta_area .cateTit p{font-size: 1.2em;
    color: #666666;
    font-family: futura-pt, 'Noto Sans KR', sans-serif;
    letter-spacing: -1px;}
.insta_rlar{float:right}
/* BASIC css end */