@charset "UTF-8";

.ul-gallery-list {display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 30px;}
.ul-gallery-list>.item {border: var(--border-solid); border-radius: 10px; overflow: hidden; cursor: pointer;}
.ul-gallery-list .thumb {display: block; position: relative; padding-bottom: 75%; border: var(--border-solid); border-radius: 10px 10px 0 0; overflow: hidden; margin: -1px; cursor: pointer;}
.ul-gallery-list .thumb img {width: 100%; height: 100%; display: block; object-fit: cover; position: absolute; inset: 0;}
.ul-gallery-list .thumb .ribbon {position: absolute; top: 0; left: 0; padding: 9.5px 13px; background: #ff8998; font-weight: 600; color: #fff; z-index: 1;}
.ul-gallery-list .thumb .ribbon.deadline {background: var(--gray);}
.ul-gallery-list .txt-area {padding: 12px 18px 14px; border-radius: 0 0 10px 10px;}
.ul-gallery-list .tit {display: block; font-weight: 600; color: var(--darkgray); line-height: 1.5; margin-bottom: 24px;}
.ul-gallery-list .tit .course-name {color: var(--violet-blue); word-break: normal;}
.ul-gallery-list .tit .lecture-name {color: var(--darkgray); word-break: normal;}

.ul-info .item + .item {margin-top: 6px;}
.ul-info .item:not(.tag-area, .price) {display: -webkit-flex; display: flex; justify-content: start; align-items: center; flex-wrap: wrap; white-space: pre-line; font-size: 0.875rem;}
.ul-info .item + .item.price {margin-top: 10px;}
.price .consumer-price {color: #595959; font-size: 13px; font-weight: 500; line-height: 100%; text-decoration-line: line-through;}
.price .consumer-price + .selling-price {margin-left: 4px;}
.price .discount-rate {color: #EB2C57; font-size: 15px; font-weight: 700; line-height: 100%;}
.price .selling-price {color: var(--darkgray); font-size: 15px; font-weight: 700; line-height: 100%;}





/* Safari 14.1 이전 버전 */
@supports not (inset: 0){
    .ul-gallery-list>.item {margin-right: 30px;}
    .ul-gallery-list>.item:nth-child(4n) {margin-right: 0;}
}



@media screen and (max-width:992px){
    .ul-gallery-list {gap: 18px;}
    .ul-gallery-list .txt-area {padding: 10px 13px 12px;}
    .ul-gallery-list .tit {margin-bottom: 16px;}
    .ul-info .item {margin-bottom: 4px;}

    /* Safari 14.1 이전 버전 */
    @supports not (inset: 0){
        .ul-gallery-list>.item {margin-right: 18px;}
        .ul-gallery-list>.item:nth-child(4n) {margin-right: 0;}
    }
}

@media screen and (max-width:768px){
    .ul-gallery-list {grid-template-columns: 1fr 1fr;}
}

@media screen and (max-width:480px){
    .ul-gallery-list {gap: 10px;}
    .ul-gallery-list .txt-area {padding: 8px 11px 11px;}
    .ul-gallery-list .tit {margin-bottom: 12px;}

    /* Safari 14.1 이전 버전 */
    @supports not (inset: 0){
        .ul-gallery-list>.item {margin-right: 10px;}
        .ul-gallery-list>.item:nth-child(4n) {margin-right: 0;}
    }
}