@charset "utf-8";

/* 새글 스킨 (latest) */
.pic_lt {position:relative;margin-top:30px;background:#fff}

.pic_lt ul:after {display:block;visibility:hidden;clear:both;content:""}
.pic_lt ul {margin: 0 -10px}
.pic_lt li {float:left;width:33.33%;padding:0 10px}
.pic_lt li:hover .lt_img img {transform: scale(1.1);}
.pic_lt li.gallery_li:nth-child(4n+1) {clear: both!important}
.pic_lt li .lt_img {margin: 0 0 10px; display: block;  border-radius: 20px;  overflow: hidden; position: relative; width: 100%; height: 0; padding-top: 75%;}
.pic_lt li .lt_img img, 
.pic_lt li .lt_img video {position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: center center !important; transition: all 0.3s linear;}
.pic_lt li a {font-size: 2.3rem; font-weight: 500; color: #000; padding-bottom: 10px;}
.pic_lt li a:hover {color:#00417b;}
.pic_lt li .new_icon {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#23db79;background:#b9ffda;text-align:center;border-radius:2px;margin-left:2px;font-weight:bold;vertical-align:middle}

.pic_lt .profile_img img{border-radius:50%}

.lt_info {padding:10px 0 0}
.lt_info .lt_nick {color: #666666; font-size: 1.8rem;}
.lt_info .lt_date {color:#888}

.pic_lt .empty_li {line-height:145px ;color:#1e2535;text-align:left;padding:0 10px;}
.pic_lt .empty_li:before {background:none;padding:0}

.pic_lt .lt_cmt {background:#e9eff5;color:#3a8afd;font-size:11px;height:16px;line-height:16px;padding:0 5px;border-radius:3px;vertical-align:middle}
.pic_lt .lt_more {position:absolute;top:11px;right:0;display:block;width:40px;line-height:25px;color:#3a8afd;border-radius:3px;text-align:center}
.pic_lt .lt_more:hover {color:#777}


@media screen and (max-width:850px){	
	.pic_lt li a {font-size: 2rem;}
	.lt_info .lt_nick {font-size: 1.5rem; padding:0px 0 15px}
}

@media screen and (max-width:768px){	
	.pic_lt li a {font-size: 1.8rem;}
	.lt_info .lt_nick {font-size: 1.5rem; padding:0 0 12px}
}

@media screen and (max-width:640px) {
    .pic_lt li {width:50%;}
}

@media screen and (max-width: 480px) {
    /* 1. 한 줄에 하나씩 나오도록 리스트 정렬 */
    .pic_lt li {
        width: 100% !important;
        float: none !important;
        margin-right: 0 !important;
        margin-bottom: 25px !important;
    }

    /* 2. 이미지 감싸는 틀의 기존 높이/패딩 강제 초기화 및 16:10 비율 적용 */
    .pic_lt li .lt_img {
        width: 100% !important;
        
        /* 기존에 잡혀있을지 모르는 높이 관련 속성들을 완전히 부숩니다 */
        height: auto !important; 
        min-height: 0 !important;
        padding: 0 !important; 
        padding-top: 0 !important;
        
        /* 16:10 비율을 강제하고, 모바일 화면에서 너무 커지지 않게 최대 높이 제한 */
        aspect-ratio: 16 / 10 !important; 
        max-height: 270px !important; /* 화면이 커지더라도 세로가 이 이상 늘어나지 않게 커트라인 */
        
        display: block !important;
        border-radius: 20px !important;
        overflow: hidden !important;
    }

    /* 3. 내부 이미지 스타일 강제 지정 */
    .pic_lt li .lt_img img, 
    .pic_lt li .lt_img video {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        
        /* 절대 찌그러지거나 넘치지 않고 16:10 틀 안에 꽉 차게 만듦 */
        object-fit: cover !important; 
        object-position: center center !important;
    }
}