@charset "utf-8";

/* CSS Document */

.promotion-box {
    padding: 40px 20px;
    background-image: url(../img/footer-bg.jpg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
}
.promotion-box-row {
    margin: 0 auto;
    width: 100%;
    max-width: 1350px;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    row-gap: 40px;
}
.promotion-title{
}
.promotion-title-txt{
font-size: 40px;
color: #2e3192;
font-weight: 400;
}
.promotion-package {
    display: flex;
    flex-direction: column;
    row-gap: 20px;
}
.promotion-package .title{
font-size: 18px;
color: #999;
}
.promotion-package .title span{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    -webkit-box-orient: vertical;
    flex: auto;
}
.promotion-package .exp{
display: flex;
flex-direction: row;
column-gap: 20px;
align-items: center;
}
.promotion-package .exp .date{
background-color: #3eaf7c;
}
.promotion-package .exp .btn-buy{
background-color: #2e3192;
}
.promotion-package .exp .date,.promotion-package .exp .btn-buy{
color: #FFF;
flex: 1;
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
column-gap: 10px;
padding: 10px;
}
.promotion-package .exp a{
color: #FFF;
}
.promotion-package .exp img{
max-height: 18px;
}
.promotion-tab{
width: 100%;
transition: all 0.3s;
top: 0;
left: 0;
}
.promotion-nav ul{
display: flex;
padding: 0;
margin: 0;
list-style: none;
column-gap: 10px;
}
.promotion-nav li a{
background-color: #FFF;
border-radius: 5px;
padding: 5px 15px;
min-width: 100px;
}
.promotion-nav li a.active{
color: #000;
}

.package-slide.slider .slick-list{
margin: 10px -20px;
}
.package-slide.slider .slick-slide{
padding: 0 20px;
}

@media screen and (max-width:1024px) {
.package-slide.slider .slick-list,
.knowleads-slide .slick-list {
    margin: 10px -10px;
}
.package-slide.slider .slick-slide,
.knowleads-slide .slick-slide {
    padding: 0 10px;
}
}

@media screen and (max-width:768px) {
.package-slide.slick-initialized .slick-slide,
.knowleads-slide.slick-initialized .slick-slide {
    padding: 0 10px;
    display: flex;
flex-direction: column;
gap: 20px;
}
}