/* 기본 갤러리 리스트 (우리 이러고 놀아요) */
._sub .basicthumb{ width: 100%; margin-top: 65px; }
._sub .basicthumb > ul{ display: flex; flex-wrap: wrap; margin-left: 1px; margin-top: 1px; }
._sub .basicthumb > ul li{ width: 33.33%; border: 1px solid #1a1a1a; box-sizing: border-box; margin-left: -1px; margin-top: -1px; cursor: pointer; }
._sub .basicthumb > ul li .inn{ padding: 30px; box-sizing: border-box; }
._sub .basicthumb > ul li .inn .thumb{ position: relative; overflow: hidden; }
._sub .basicthumb > ul li .inn .thumb::after{ content: ''; display: block; padding-bottom: 100%; }
._sub .basicthumb > ul li .inn .thumb img{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; transition-duration: 0.6s; }

@media screen and (min-width: 821px){
    ._sub .basicthumb > ul li:hover img{ transform: scale(1.05); }
}

@media screen and (max-width: 1280px){
    ._sub .basicthumb > ul li .inn{ padding: 20px; }
}

@media screen and (max-width: 820px){
    ._sub .basicthumb > ul li .inn{ padding: 10px; }
}

@media screen and (max-width: 500px){
    ._sub .basicthumb > ul li{ width: 50%; }
}



/* 핀터레스트 형식 갤러리 리스트 */
._sub .packlist{ margin-top: 65px; width: calc(100% + 32px); margin-left: -16px; }
._sub .packlist .grid{ width: 100%; }
._sub .packlist .grid-sizer,
._sub .packlist .grid-item{ width: calc(368 / 1472 * 100%); cursor: pointer; }
._sub .packlist .grid-item{ padding: 0 16px; box-sizing: border-box; margin-bottom: 55px; }

._sub .packlist .grid-item .thumb{ width: 100%; overflow: hidden; }
._sub .packlist .grid-item .thumb img{ transition-duration: 0.8s; }
._sub .packlist .grid-item p{ font-size: 20px; letter-spacing: -0.025em; font-weight: 500; margin-top: 20px; white-space: nowrap; text-align: center; text-overflow: ellipsis; overflow: hidden; line-height: 1.4; }

@media screen and (min-width: 821px){
    ._sub .packlist .grid-item:hover .thumb img{ transform: scale(1.1); }
}

@media screen and (max-width: 1280px){
    ._sub .packlist{ width: calc(100% + 14px); margin-left: -7px; }
    ._sub .packlist .grid-item{ padding: 0 7px; }
    ._sub .packlist .grid-item p{ font-size: 16px; }
}

@media screen and (max-width: 820px){
    ._sub .packlist{ margin-top: 40px; }
    ._sub .packlist .grid-sizer,
    ._sub .packlist .grid-item{ width: 33.33%; }
    ._sub .packlist .grid-item p{ font-size: 14px; margin-top: 10px; }
}

@media screen and (max-width: 500px){
    ._sub .packlist{ width: calc(100% + 10px); margin-left: -5px; }
    ._sub .packlist .grid-item{ padding: 0 5px; }
    ._sub .packlist .grid-sizer,
    ._sub .packlist .grid-item{ width: 50%; margin-bottom: 30px; }
}



/* 페이징 */
.paging{ display: flex; margin-top: 15px; justify-content: center; align-items: center; }
.paging .btn{ padding: 5px; box-sizing: border-box; font-size: 28px; letter-spacing: -0.025em; color: #7c7c7c; text-align: center; padding-top: 0; font-family: 'Urbanist'; }
.paging .num{ display: flex; align-items: center; justify-content: center; margin: 0 8px; }
.paging .num li > a{ width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; font-size: 16px; color: #7c7c7c; border-radius: 50%; }
.paging .num li.on > a{ color: #000; background-color: #ffb440; font-weight: 700; }


/* 목록추가버튼 */
.loadmore{ display: flex; justify-content: center; align-items: center; }
.loadmore > a{ width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; font-size: 20px; border-radius: 50%; background-color: rgba(255,255,255,0.1); color: rgba(255,255,255,0.2); }