/* BASIC css start */
#header { position:fixed; }

/* 페이지 로드 */
@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes fadein { /* Firefox */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes fadein { /* Opera */
    from {
        opacity:0;
    }
    to {
        opacity: 1;
    }
}

/* 메인 비쥬얼 배너 */
#mainSpot { position:relative; width:100%; min-width:1100px; overflow:hidden; animation: fadein 2s; -moz-animation: fadein 2s; /* Firefox */ -webkit-animation: fadein 2s; /* Safari and Chrome */ -o-animation: fadein 2s; /* Opera */}
#mainSpot .comment{position: absolute; bottom: 0; left: 0; z-index: 100; color:#fff}
#mainSpot .slick-dots { position: absolute; bottom: 40px; left: 46%; width: 100%; height: 0; line-height: 0;  z-index: 10;  text-align: center; font-size: 0;}
#mainSpot .slick-dots li{ display: inline-block; width: 8px; height: 8px; margin: 0 5px; border-radius: 50%; border: 1px solid #fff; 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;}
#mainSpot .slick-dots li.slick-active { background-color: #fff; cursor: default;}
#mainSpot .slick-dots li button{font-size: 0;}
.active_slider li{ position: relative;}
.active_slider li .slide_content{ position: absolute; bottom: 50px; left: 70px; opacity:0;}
.active_slider li.active .slide_content{opacity:1; margin-bottom:30px; animation:moveUp 1.3s forwards;}
@keyframes moveUp{
    from {
        opacity:0; margin-bottom:0
    }
    to{
        opacity:1; margin-bottom:30px;
    }
}

.active_slider li .slide_content p{ margin: 0 0 24px;  color: #fff; font-size: 14px; font-family: 'Montserrat', 'NanumBarunGothic', sans-serif; letter-spacing: 3px;}
.active_slider li .slide_content h1{margin: 0 0 35px; color: #fff; font-size: 27px; font-family: 'Merriweather', 'NanumBarunGothic', sans-serif; letter-spacing: 3px;}
.active_slider li .slide_content span a{ display: block; width: 150px; height: 44px; line-height: 44px; color: #494949; font-size: 14px; font-family: 'Montserrat', 'NanumBarunGothic', sans-serif; background: #fff; letter-spacing: 2px; text-align: center;}

/* 특별 상품 영역*/
.specArea{margin-bottom: 60px;}
.specArea .item-wrap .item-cont .item-list{ width: 380px; /* normal */ width: -moz-calc(100%/4 - 15px); /* Firefox */ width: -webkit-calc(100%/4 - 15px); /* WebKit */ width: -o-calc(100%/4 - 15px); /* Opera */ width: calc(100%/4 - 15px);  /* Standard */}
.specArea .item-wrap .item-cont .item-list:nth-of-type(4n){padding-right:0}
.specArea .item-wrap .item-cont .item-list .prd-shop{margin-top: 18px;}

/* 브랜드 스토리 */
.brandArea{width: 100%; max-width: 1540px; margin: 0 auto; padding: 110px 0; border-bottom: 1px solid #c8c8c8;}
.brandArea .brandBox{width: 1275px; margin: 0 auto;}
.brandArea .brandBox > a{display: inline-block; width: 750px;}
.brandArea .brandBox > a > img{width: 100%;}
.brandArea .brandBox figcaption{ display: inline-block; max-width: 414px; padding: 0 0 75px 50px; vertical-align: bottom;}
.brandArea .brandBox figcaption h3{ margin: 0 0 40px; font-size: 27px; color: #000; font-family: 'EB Garamond', serif; font-weight: 500; line-height: 48px; letter-spacing: 2px;}
.brandArea .brandBox figcaption p{ color: #000; font-size: 16px; font-family: 'NanumBarunGothic', sans-serif; font-weight: 300; line-height: 32px;}

/* 신상품 영역 */
.newArea .item-wrap .item-cont{ width: 1275px; margin: 0 auto;}
.newArea .item-wrap .item-cont .item-list{width: 565px; /* normal */ width: -moz-calc(100%/2 - 72px); /* Firefox */ width: -webkit-calc(100%/2 - 72px); /* WebKit */ width: -o-calc(100%/2 - 72px); /* Opera */ width: calc(100%/2 - 72px);  /* Standard */ max-width: 565px; padding-right: 145px;}
.newArea .item-wrap .item-cont .item-list:nth-of-type(2){padding-right:0}

/* 배너 상품 영역 */
.banneArea{ width: 100%; max-width: 1500px; margin: 0 auto;}
.banneArea .prd-info .prd-name{display: block; padding: 0 0 20px; color: #444444; font-size: 13px; font-family: 'Noto Sans', 'NanumBarunGothic', sans-serif; line-height: 16px;}
.banneArea .ban_cont:after{content:''; display:block; clear:both}
.banneArea .ban_cont .ban_list{padding: 0 20px 0 0; width: 360px; /* normal */ width: -moz-calc(100%/4 - 15px); /* Firefox */ width: -webkit-calc(100%/4 - 15px); /* WebKit */ width: -o-calc(100%/4 - 15px); /* Opera */ width: calc(100%/4 - 15px);  /* Standard */ max-width: 360px; float: left;}
.banneArea .ban_cont .ban_list:last-of-type{padding:0}
.banneArea .ban_cont .ban_list:hover{opacity:0.85}
.banneArea .ban_cont .ban_list .ban_thumb a img{width: 100%;}
.banneArea .ban_cont .ban_list .prd-info{padding: 18px 0 60px; overflow: hidden;}
.banneArea .ban_cont .ban_list .prd-shop a{ display: inline-block; color: #444444; font-family: 'NanumBarunGothic', sans-serif; line-height: 16px; text-overflow: ellipsis; word-wrap: normal;}

/* 상품 목록 영역 */
.item-wrap{ width: 100%; max-width: 1500px;;}
.item-wrap .item-cont{ width: 100%; max-width: 1500px; margin: 0 auto;}
.product-wrap { margin:0 auto; position:relative; width: 100%; max-width: 1500px; border-bottom: 1px solid #c8c8c8; }
.prd-shop{display: inline-block; margin: 0 0 40px; border-bottom: 1px solid #444; color: #444444; font-family: 'NanumBarunGothic', sans-serif; line-height: 16px;}
.item-wrap .item-cont .item-list .prd-shop a{display: inline-block; color: #444444; font-family: 'NanumBarunGothic', sans-serif; line-height: 16px; text-overflow: ellipsis; word-wrap: normal;}

/* 고정 이미지 배너 */
.fixedBnnr { position:relative; width:100%; min-width:1100px; height:220px; background:url(//image.makeshop.co.kr/makeshop/d3/basic_simple/main/fixbn.jpg) center top no-repeat fixed }
.fixedBnnr .inner { margin:0 auto; position:relative; width:1100px; text-align:center }
.fixedBnnr .inner .tx { padding-top:100px; font-size:16px; color:#fff; letter-spacing:16px }
/* BASIC css end */

