/**********************************************************
 * 뷰포트 해상도가 801px 이상인 경우 사용되는 코드
 * --------------------------------------------
 * main 영역에 있는 콘텐츠 대상
 */
/****************************************
 * 공지 팝업
 */
@media screen and (min-width: 1061px) {
    .notice-popup {
        left: calc(50% + 130px - 200px);
    }
}

/*****************************************
 * HOT ITEM
 */
.hot-item-title {
    margin-top: 100px;
    font-family: NanumSquareEB;
    font-size: 2.3rem;
}
.hot-item-list {
    margin: 40px 10%;
}

/*--------------------------------------
 * hover시 이미지 변경
 */
.item > div:hover::before,
.hot1 > a > div:hover::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-size: cover;
}
.hot1 > a > div:hover::before {
    background-image: url("http://nail.joo.popol.website/images/thumbnail-starmoon-h.jpg");
}
.hot2 > div:hover::before {
    background-image: url("http://nail.joo.popol.website/images/hot/hot_candy_u.jpg");
}
.hot3 > div:hover::before {
    background-image: url("http://nail.joo.popol.website/images/hot/hot_puppy_u.jpg");
}
.hot4 > div:hover::before {
    background-image: url("http://nail.joo.popol.website/images/hot/hot_lemon_u.jpg");
}
.hot5 > div:hover::before {
    background-image: url("http://nail.joo.popol.website/images/hot/hot_lime_u.jpg");
}
.hot6 > div:hover::before {
    background-image: url("http://nail.joo.popol.website/images/hot/hot_rainbow_u.jpg");
}
.hot7 > div:hover::before {
    background-image: url("http://nail.joo.popol.website/images/hot/hot_vita_u.jpg");
}
.hot8 > div:hover::before {
    background-image: url("http://nail.joo.popol.website/images/hot/hot_sunset_u.jpg");
}

/*--------------------------------------
 * 상품 정보
 */
 .item > ul {
    font-size: 1.5rem;
}
.item > ul > li:nth-of-type(3) {
    font-size: 1rem;
}