@charset "utf-8";

/* .ul-board {display: -webkit-flex; display: flex; gap: 30px;} */
.ul-board .post:not(.empty) {width: calc((100% - 90px)/4);}
.ul-board .empty {width: 100%; text-align: center;}

.ul-board .post .thumb {width: 100%; height: 100%; border-radius: 10px; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.08); overflow: hidden; position: relative; display: block;}
.ul-board .post .thumb img {width: 100%; object-fit: contain; display: block;}
.ul-board .post .info {width: 100%; padding: 14px 30px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 24px; background: var(--dim, rgba(0, 0, 0, 0.67)); position: absolute; bottom: 0; left: 0; right: 0;}
.ul-board .post .subject {color: #FFF; font-size: 1.25rem; font-weight: 550; line-height: 140%;}

.btn-more2 {width: -moz-fit-content; width: -webkit-fit-content; width: fit-content; display: -webkit-flex; display: flex; justify-content: center; align-items: center; font-size: 1.125rem; font-weight: 600; color: var(--red);}
.btn-more2 .arrow {position: relative; margin-left: 16px; width: 16px; height: 16px; transition: width 300ms ease; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='10.005' viewBox='0 0 46 10.005'%3E%3Cpath id='arrow-right-long' d='M45.707,101.634a1,1,0,0,0,0-1.416l-4-4a1,1,0,1,0-1.416,1.416l2.294,2.294H1a1,1,0,1,0,0,2H42.585l-2.294,2.294a1,1,0,0,0,1.416,1.416l4-4Z' transform='translate(0 -95.925)' fill='%23f13130'/%3E%3C/svg%3E%0A"); background-repeat: no-repeat; background-position: right center;}
.btn-more2:hover .arrow, 
.ul-board .post:hover .btn-more2 .arrow {width: 46px;}

.btn-more2.white {color: #fff;}
.btn-more2.white .arrow {background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='10.005' viewBox='0 0 46 10.005'%3E%3Cpath id='arrow-right-long' d='M45.707,101.634a1,1,0,0,0,0-1.416l-4-4a1,1,0,1,0-1.416,1.416l2.294,2.294H1a1,1,0,1,0,0,2H42.585l-2.294,2.294a1,1,0,0,0,1.416,1.416l4-4Z' transform='translate(0 -95.925)' fill='%23ffffff'/%3E%3C/svg%3E%0A");}





@media screen and (max-width:1200px){
    .ul-board .post:not(.empty) {width: calc((100% - 72px)/4);}
}

@media screen and (max-width:992px){
    .ul-board .post:not(.empty) {width: calc((100% - 32px)/3);}
    .ul-board .post .info {padding: 14px 24px;}
}

@media screen and (max-width:768px){
    .ul-board .post:not(.empty) {width: calc((100% - 16px)/2);}
}

@media screen and (max-width:480px){
    .ul-board .post:not(.empty) {width: calc((100% - 12px)/2);}
}