.l-text{color: var(--highlight-color);}


/*product  flex-wrapper */
.product.flex-wrapper * {min-width: 0;}
.product.flex-wrapper .list-item a{width: 100%;height: 100%;}
.product.flex-wrapper .list-icon {position: relative;}
.product.flex-wrapper .list-icon .start-video {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
.product.flex-wrapper .list-icon>img,
.product.flex-wrapper .list-icon>video
{width: 100%;height: 100%;object-fit: cover;}
.product.flex-wrapper .list-info-desc p{font-size: 12px;}
.product.flex-wrapper .list-info-desc{display: flex;justify-content: space-between;}


.product.flex-wrapper .list-item .list-item__download{display: flex;justify-content: center;margin:10px 0}
.product.flex-wrapper .list-item .list-item__download .btn-link{font-size: 12px;border-width: 1px;}

@media only screen and (min-width: 100px) and (max-width: 768px) {


/*product  flex-wrapper */
.product.flex-wrapper {gap:0;}
.product.flex-wrapper .list-item {border-bottom: 1px solid #d9d9d9;border-top: 1px solid #d9d9d9;}
.product.flex-wrapper .list-item a{display:flex;gap:10px;align-items: center;padding:10px  0;padding-right:30px;}
.product.flex-wrapper .list-item a::after{content: '>';color: var(--highlight-color);display: inline-block;font-size: 16px;font-weight: 600;font-family: monospace;line-height: 1;position: absolute;right: 0;top: 50%;transform: translateY(-50%);}
.product.flex-wrapper .list-info{flex:1;}
.product.flex-wrapper p{font-size: 16px;margin:0;word-break: break-all;}
.product.flex-wrapper .list-item .list-icon{width: 100px;height: 100px;flex-shrink: 0;}

.product.flex-wrapper .list-item .list-item__download .btn-link{padding: 8px 14px 8px 24px;}
}


@media (min-width: 768px) {


/*product  flex-wrapper */
.product.flex-wrapper .list-item{flex: 0 0 calc((100% - 30px * 3) / 4);background-color: #fff;-webkit-box-shadow: 0 20px 40px -16px hsla(0, 0%, 9%, .15);box-shadow: 0 20px 40px -16px hsla(0, 0%, 9%, .15);}
.product.flex-wrapper .list-item a{display:flex;flex-direction: column;}
.product.flex-wrapper .list-icon{width: 100%;height: 210px;margin-bottom: 28px;text-align: center;border-bottom: 1px solid #d9d9d9;}
.product.flex-wrapper .list-info{padding: 15px 15px 0;flex:1;display: flex;flex-direction: column;} 
.product.flex-wrapper .list-info .list-info-content{flex:1}

}