/* search  */
.search-box {
    position: relative;
    display: flex;
    height: 50px;
    align-items: center;
    gap: 15px;
    flex: 1 0 0;
    /* padding: 18px 20px; */
}
.search-box .icon {
       position: absolute;
    top: 15px;
    /* padding: 18px 20px; */
    left: 20px;
}
.search-box input {
    padding: 18px 20px;
    background: #F0F1F3;
    height: 60px;
    padding-left: 50px !important;
    border-radius: 50px;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    -ms-border-radius: 50px;
    -o-border-radius: 50px;
}
.search-input {
    color: black;
}
.search-input::placeholder, .search-input {
    color: #AAA;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    border: 0;
    outline: 0;
    width: 100%;
}
body {
    /* max-width: 428px; */
    background: var(--F8F8F8, #F8F8F8);
    margin: 0 auto; 
}
body main.page-home{
    background: #fff;
}
.main-page-contanet{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 42px 18px 32px;
}

.banner-slider-home .container-banner .swiper-slide .d-block .img-fluid{
    height: 750px !important
}
/* slider banner  */

.swiper-container {
    max-width: 100%;
    display: flex;
    height: 100%;
    flex-direction: column;
    align-items: center;
    flex-shrink: 0;
    width: 100%;
}
.swiper-container .swiper-slide .d-block{
    width: 100%;
}
.banner-slider-home:not(.full-screen) .swiper-container .swiper-slide img{border-radius: 10px;}
.swiper-container .swiper-slide img{
    margin: 0 0px 0px 0px;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
    flex-shrink: 0;
    border-radius: 0;
    object-fit: cover;
}
span.outer-dot {
    position: relative;
    width: 9px;
    height: 9px;
    background: none;
}
span.inner-dot {
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 10px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #909090;
  margin: 0!important;
}

span.outer-dot.swiper-pagination-bullet-active span.inner-dot {
    width: 25px;
    height: 7px;
    border-radius: 3.5px;
    background: var(--sub-purple, #D2CEFF);
}
span.outer-dot.swiper-pagination-bullet-active{
    width: 25px;
    height: 7px;
}
.swiper-slide {
    background-size: cover;
    background-position: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }
  .swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal{
    top: 0px !important;
}
.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal{
    margin-bottom:20px !important;
    margin-top:15px !important
}

.swiper-pagination {
    position: relative !important;
}
.swiper-pagination{
    display: flex;
    align-items: center;
    gap: 13px;
    justify-content: center;
}
.banner-slider-home{
    /* border-bottom: 3px solid #EEE; */
    overflow-x: hidden;
    /* overflow-y: scroll; */
}
/* concect now  */
.open-now-concect{
    display: flex;
    padding: 40px 20px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
}
.open-now-concect .open-button-concect{
    display: flex;
    height: 16px;
    justify-content: center;
    align-items: center;
    gap: 174px;
    flex: 1 0 0;
}
.open-button-concect .content-title{
    color: #000;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

/* concect  */
.section-more-ticket.see-more-ticket{
    margin: 0 20px 0;padding-left: 20px !important;
    display: flex;
    gap: 14px;    
    overflow-x: auto;
    overflow-y: hidden;
    flex-flow: row nowrap;
}
/*.see-more-ticket .item {
    aspect-ratio: 21 / 28;
    width: 100% !important;
    height: 100% !important;
}*/
.section-more-ticket .swiper-slide{
    width: 372px !important;
}

.pv-early-bird .swiper-container{height: 351px}
.pv-early-bird .swiper-slide{width: 285px !important;padding-top: 33px;display: block;}
.pv-early-bird .img{position: relative;}
.pv-early-bird .img img{height: 131px !important;transition: all 0.3s}
.pv-early-bird .swiper-slide-active{padding-top: 0}
.pv-early-bird .swiper-slide-active .img img{height: 198px !important}
.img .discount-percent{position: absolute;right: 0;bottom: 0;border-radius: 8px 0 0 0;background-color: #F55F5F;
    font-size: 15px;color: white;padding: 5px 16px;line-height: 22px;font-style: normal;font-weight: 600;
}

.see-more-ticket .item {
    position: relative;overflow: hidden;
    width: 372px;
    height: 495px;
    flex: 0 0 auto;
    margin-right: 0;
    background-position: center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    border-radius: 10px;
}

.see-more-ticket .item:before{content: "";display: block;width: 100%;height: 100%;position: absolute;top: 0;left: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 47.3%, #000000 100%);
}

.see-more-ticket .content {
    margin: 0 0 24px 24px;
    position: absolute;
    z-index: 5;
    bottom: 0;
    width: 90% !important;
}
.see-more-ticket .content{
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
}
.content .tt1{
    color: #FFF;
    font-size: 24px;
    font-style: normal;
    font-weight: 800;
    line-height: 36px;
}
.content .tt2{
    align-self: stretch;margin-bottom: 16px;
    color: #FFF ;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height:30px;
}
.content .inner{
    color: #FFF;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
}
/* see all ticket  */

.see-all-ticket{
    display: flex;
    padding: 20px 0px 20px 0px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
}
.see-all-ticket .buton-see-al{
    display: flex;
    height: 49px;
    padding: 10px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 10px;
    border: 1px solid #AAAAAA;
    background: #FFF;
    width: 335px;
}
.see-all-ticket .buton-see-al .ittle{
    color:  #000;
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
}
.sponsored{
    display: flex;
    height: 147px;
    /* padding: 20px 0px; */
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
    background: #CCC;
}
.title-spons{
    color: #fff !important;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

/* discount  */
.discount-get{
    /* margin-top: 20px; */
}
.title-discount{
    padding: 40px 20px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    display: flex;
}
.title-discount span{
    color: #000;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

/* discount */

.list-discount {
    margin: 0 16px;
    display: flex;
    flex-flow: row nowrap;
    gap: 16px;
    overflow-x: scroll;
    overflow-y: hidden;
    margin-top: 24px;
}
.list-discount .item {
    width: 100%;
    height: auto;
    position: relative;
}
.list-discount .item .img img {
    width: 100%;
    height: 100%;
    max-width: unset;
    border-radius: 10px 10px 0px 0px;

}
.list-discount::-webkit-scrollbar {
    display: none;
}
.content-discount{
    display: flex;
    padding: 9px 15px 10px;
    flex-direction: column;
    align-items: flex-start;
    gap: 0px;
    border-radius: 0px 0px 15px 15px;
    border: 1px solid #EEE;
    box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.04);
}
.content-discount svg{margin-top: -2px;}
.discount-get.eaely-bird .content-discount .tt3{margin-bottom: 5px;}
.content-discount .tt1{
    color: #000;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 23px;
}
.content-discount .tt3{
    margin-bottom: 15px;
}
.content-discount .tt2{margin-bottom: 5px;}
.content-discount .ticket-title{margin-bottom: 8px;}
.content-discount .tt2 ,.content-discount .tt3{
    display: flex;font-weight: 500;
    align-items: center;line-height: 18px;
    gap: 7px;
}
.content-discount .tt4{
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;    
}
.content-discount .tt4 .content-tt4{
    display: flex;
    align-items: center;
    gap: 5px;
}

.price-discount{
    color: #000;
    font-size: 15px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.div-buy-sp{
    display: flex;
    padding: 5px 20px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    align-self: stretch;
    border-radius: 20px;
    background: var(--main-purple, #815FF5);
    box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.15);
}
.div-buy-sp span{
    color: #FFF;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
}
/* list-eaely-bird */
.list-eaely-bird{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 24px;
}

.list-eaely-bird .item{
    display: flex;
    padding: 0px 20px;
    align-items: center;
}
.list-eaely-bird .item .img img{
    border-radius: 10px 0px 0px 10px;
    height: 173px;
    width: 130px;
    object-fit: cover;
}
.list-eaely-bird .item .img{position: relative;}

.content-discount  .tt1{
    margin-bottom: 3px;
}
.content-discount .div-span-col{    margin-bottom: 15px;}
.list-eaely-bird  .content-discount{
    display: flex;
    padding: 20px 10px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 0px;
    flex: 1 0 0;
    align-self: stretch;
    border-radius: 0px 15px 15px 0px;
    border: 1px solid #AAAAAA;
    box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.15);height: 173px;border-left: 0;
    }
    .list-eaely-bird .content-discount  .div-span-col{
        color: #1E1E1E;margin-bottom: 4px !important;
        font-size: 16px;
        font-style: normal;
        font-weight: 500;
        line-height: normal;
    }
    .list-eaely-bird .content-discount  .title-content{
        overflow: hidden;
        color: #000;
        text-overflow: ellipsis;
        font-size: 13px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
    }
    .list-eaely-bird .content-discount .title-content{
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }
    .list-eaely-bird .item{
        width: 100%;
    }
    /*   Performance review */
    .list-list-review  .item{
        display: flex;
        padding:20px 15px;
        align-items: center;
        gap: 16px;
        border-radius: 10px;
        background: var(--F8F8F8, #F8F8F8);
    }
    .list-list-review .item .content-discount-content-review{
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        display: flex;
        line-height: 18px;
    }
    .list-list-review .item .img img{
        width: 96px;
        height: auto;
        border-radius: 6px;
        object-fit: cover;
    }
    .content-discount-content-review  .stars{
        display: flex;
        align-items: center;
        gap: 2px;
    }
    .stars i.active path {
        fill: #FFCE32;
    }

    .stars i  svg{
        width: 18px;
        height: 18px;
    }
    .content-discount-content-review .title-content{
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
        color:#333;
        text-overflow: ellipsis;
        font-size: 13px;
        font-style: normal;
        font-weight: 500;
        line-height: normal;
    }
    .content-discount-content-review .tt2{
        -webkit-line-clamp: 1;
        overflow: hidden;
        color:#333;
        text-overflow: ellipsis;
        font-size: 13px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
    }
    .content-discount-content-review .tt4{
        color: black;
        font-size: 13px;
        font-style: normal;
        font-weight: 500;
        line-height: normal;
    }
    .cotent-tt5{
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
        overflow: hidden;
        color: #5A6A85;
        text-overflow: ellipsis;
        font-size: 11px;
        font-style: normal;
        font-weight: 600;
        line-height: 18px; 
    }
    .list-review{
        display: flex;
        padding: 20px;
        flex-direction: column;
        align-items: center;
    }
.list-review .list-list-review{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    align-self: stretch;
}
    /* end  */


    .section-more-ticket  .swiper-container{
        width: calc(50% + 50vw);
    }

    
    .list-discount .swiper-container .swiper-slide img{
        margin: 0 !important;
    }
   
    .list-discount .item .img{
        height: auto !important;
    }
    .list-list-review .item{
        justify-content: space-between;
    }
    .list-list-review .item .img img{
        width: 112px;
        height: 112px;
    }
    .ngay-thang-nam , .title-dia-dia{
       font-size: 14px;font-weight: 500;
       color: #A1A1A1; line-height: 18px;
    }

    /* @media only screen and (min-width: 1020px) {
        .list-discount .item{
            width: 238px;
        }
    }
    */
    body.mobile.is_web main , body.web.is_web main{
        padding-top: 0px;
    }
    body.web #wrapper ,body.mobile.is_web #wrapper  {
        padding-top: 60px;
    }
    .full-screen{
        margin-left: -20px !important;
        margin-right: -20px !important;
    }

    /* .section-more-ticket .swiper-slide ,   .list-discount .swiper-slide{
        padding-right: 16px !important;
        margin-right: 0px !important; 
    }
     .section-more-ticket .swiper-slide:first-child  , .list-discount .swiper-slide:first-child {
        margin-left: 20px;
    }
     .section-more-ticket .swiper-slide  ,   .list-discount .swiper-slide{
        padding-right: 16px !important;
    }    
     .section-more-ticket .swiper-slide:last-child   ,  .list-discount .swiper-slide:last-child{
        padding-right: 16px !important;
    }
   .section-more-ticket .swiper-slide:last-child{
        margin-right: -16px !important;
    }*/
    .line-boder{
        border-bottom: 1.5px solid #EEE;
    }
     .list-review .list-list-review{
        gap: 15px !important;
    }
    .is_web.mobile .list-review .list-list-review{
        gap: 10px !important;
    }
    .list-list-review .item{
        width: 100%;
    }
    body .see-all-ticket{
        padding: 32px 0 ;
    }
.discount-get.list-review{padding-top: 0}
@media only screen and (max-width: 640px) {
    .see-all-ticket .buton-see-al{width: 100%}
}
@media only screen and (max-width: 640px) {
    .swiper-backface-hidden .swiper-slide .sponsored{
        min-height: 85px;
        max-height: 147px;
        height: 85px;
    }
    header.header-back{box-shadow: none}
    .main-page-contanet{padding-top: 32px;}
    .search-box input{height: 50px;}
    .banner-slider-home .container-banner .swiper-slide .d-block .img-fluid{height: 435px !important}
    .open-now-concect,.title-discount{line-height: 25px;padding: 34px 0}
    .open-button-concect .content-title,.title-discount span{font-size: 17px;}
    .section-more-ticket .swiper-slide{width: 238px !important}
    .see-more-ticket .item{width: 238px;height: 315px;}
    .content .tt1{font-size: 18px;font-weight: 700;line-height: 27px;}
    .content .tt2{font-size: 14px;font-weight: 600; line-height: 21px;margin-bottom: 10px;}
    .content .inner{font-size: 12px;line-height: 18px;}

    .pv-early-bird .swiper-slide{width: 285px !important}
    .pv-early-bird .swiper-slide-active .img img {height: 169px !important;}
    .pv-early-bird .img img{height: 162px;}
    .pv-early-bird .swiper-slide:not(.swiper-slide-active){padding-top: 16px;}
    .content-discount .tt1{font-size: 15px;}
    .ngay-thang-nam, .title-dia-dia{font-size: 12px;}
    .price-discount{font-size: 14px;}
    .div-buy-sp span{font-size: 12px;}
    .img .discount-percent{font-size: 12px;padding: 3px 16px;}
    .pv-early-bird .swiper-container{height: 335px;}
    .list-eaely-bird .item .img img{height: 167px}
    .list-eaely-bird .content-discount{height: 167px;}
    .list-eaely-bird .content-discount .div-span-col{font-size: 13px;}
}
body.mobile .swiper-container .swiper-slide img{
    object-fit: unset;
}

body.web .box-early-bird-pre-purchase.slide-not-center{
    margin-left: 0 !important;
    margin-right: 0 !important;
    .swiper-slide{
        width: 285px !important;
        padding-top: 0 !important;
    }
    .swiper-wrapper{
        column-gap: 15px;
        padding-left: 12px;
    }
    .img img{
        height: 198px !important;
    }
}

.mobile .slide-not-center .pv-early-bird .swiper-slide:not(.swiper-slide-active) {
    padding-top: 0px;
}
.mobile .slide-not-center .pv-early-bird .img img {
    height: 169px !important;
}
.mobile .full-screen.slide-not-center{
    margin-left: 0px !important;
}

#section-vote{
    margin-bottom: 32px;
}
.main-page-contanet,
.swiper-container .swiper-slide img
.open-now-concect,
.section-more-ticket.see-more-ticket,
.title-discount,
.list-discount,
.list-eaely-bird .item,
.list-review
{
    padding-left: 0;
    padding-right: 0;
    margin-left: 0;
    margin-right: 0;
}
body.mobile::-webkit-scrollbar {
    display: none;
}
.list-eaely-bird .item{overflow: hidden;border-radius: 15px;}
.discount-get.list-review{
    padding-bottom: 32px;
}
#main{
    padding-bottom: 32px;
}
.web .list-eaely-bird .item .img img{
    width: 170px;
}
body.mobile .pv-early-bird .swiper-container .swiper-slide img,
body.mobile .banner-slider-home .swiper-container .swiper-slide img
{
    object-fit: cover;
}
body.web .see-all-ticket {
    padding: 40px 0;
}


.web .pv-early-bird .swiper-container {
    height: 366px;
}
.web .pv-early-bird .item{
     .product-title{
        line-height: 27px;
         margin-bottom: 0;
    }
    .ticket-title{
        line-height: 24px;
        font-size: 16px;
        color: #1E1E1E;
        font-weight: 500;
        margin-bottom: 5px;
    }
    .address{
        margin-bottom: 15px;
    }
    .content-discount{
        display: block;
    }
}
.mobile .pv-early-bird .img img{height: 137px !important;}
.mobile .pv-early-bird .swiper-slide-active .img img {
    height: 169px !important;
}
.section-more-ticket::-webkit-scrollbar {display: none;}
.wrap-comment .list-comment .item-comment .comment-content {
    white-space: pre-line;
}
.is_app .div-footer-web{
    margin-bottom: 90px;
}
.item-top__name-date{
    column-gap: 8px;
    color: #767676;
}
.item-top__name-date .date-dot{
    width: 4px;
    height: 4px;
    background: #9c9c9c;
    border-radius: 999px;
}
.web #main{padding-top: 0;}
body.web .line-boder{
    border-bottom-width: 3px;
}

.ticket-sold-out .div-buy-sp {
    background: #CCCCCC;
    color: #fff;
}
.ticket-sold-out .tag-sold-out {
    position: absolute;
    top: 0;
    z-index: 999;
    width: 100%;
    height: 100%;
    background: #00000080;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px 10px 0 0;
}
.tag-sold-out span {
    font-size: 18px;
    color: #fff;
    font-weight: 600;
    display: block;
    min-width: 112px;
    height: 32px;
    background: #000000CC;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 6px 12px;
}