.wrap-popup{width:100%; height:100%; position:fixed; top:0; left:0; background:rgba(0,0,0,.7); opacity:1; z-index:100000; display:flex; align-items:center; justify-content:center; padding:15px; transition:.3s; overflow-y:auto}
.wrap-popup .inner{max-width:600px; width:100%; position:relative; transition:.3s; }
.wrap-popup .inner .mainImg{width:100%; float:left; position:relative; z-index:5;}
.wrap-popup .inner .mainImg a.nav-img{width:100%; float:left; position:relative;}
.wrap-popup .inner .mainImg a.nav-img img{width:100%; border-radius:10px 10px 0 0;}
.wrap-popup .inner .mainImg .caption{width:100%; float:left; position:relative; background:#fff; border-radius: 0 0 10px 10px; padding: 7px 20px 12px 15px; height:60px;}
.wrap-popup .inner .mainImg .caption h4{display:block; width:100%; float:left; font-size:15px; font-weight:600; color:#000; margin:0; width:100%; float:left; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.wrap-popup .inner .mainImg .caption .info{width:100%; float:left; position:relative; display:flex; align-items:center; margin-top:3px;}
.wrap-popup .inner .mainImg .caption .info label{margin:0; font-size:13px; line-height:18px; height:18px; padding: 0 5px; border-radius:5px; margin-right:5px; }
.wrap-popup .inner .mainImg .caption .info span{font-size:13px;}
.wrap-popup .inner .mainImg .caption .navEventMore{position:absolute; right:15px; bottom:7px; color:#000; float:left; transition:.3s; opacity:1; visibility:initial; transition:.3s;}
.wrap-popup .inner .mainImg .caption .navEventMore span{text-transform:uppercase; display:block; font-size:13px; font-weight:bold; color:var(--color2); letter-spacing:1px; line-height:45px; padding-right:35px; position:relative;}
.wrap-popup .inner .mainImg .caption .navEventMore span:after{font-weight: 900;font-family: "Font Awesome 5"; content: "\f054"; font-size:12px; color:#000; margin-top:-14px; width:26px; height:26px; line-height:27px; display:block; border-radius:50%; box-shadow: 0 0 0 1px rgba(0,0,0,.1); position:absolute; right:0; top:50%; text-align:center; padding-left: 2px;}
.wrap-popup .inner .mainImg .caption .navEventMore .popoverTotal{ position:absolute; bottom:100%; padding: 7px 0; right:0px; background:#fff; width:120px; border-radius:7px; box-shadow: 0 0 0 1px rgba(0,0,0,.02), 0 2px 10px rgba(0,0,0,.1); padding: 5px 10px 5px 10px; margin-bottom:2px;}
.wrap-popup .inner .mainImg .caption .navEventMore .total{float:left; position:relative; display:block; clear:both; margin: 3px 0; z-index:3;}
.wrap-popup .inner .mainImg .caption .navEventMore .total b{font-weight:normal;margin:0; font-size:11px; font-weight:bold; line-height:17px; height:16px; min-width:16px; text-align:center; padding: 0 4px; border-radius:5px; margin-right:5px; display:inline-block }
.wrap-popup .inner .mainImg .caption .navEventMore .total i{font-style:normal;font-size:13px;}
.wrap-popup .inner .mainImg .caption.isMore{padding-right:130px;}
.wrap-popup .inner .mainImg.linkTarget a.nav-img{pointer-events:none;}

.wrap-popup .inner .mainImg .nav-close{position:absolute; right:15px; top:15px; z-index:3; background:#cc0303; line-height:27px; padding: 0 7px; height:26px; border-radius:5px; font-size:14px; font-weight:500; color:#fff }
.wrap-popup .inner .panel{position:absolute; width:260px; height:100%; top:0; right:0; background:#fff; border-radius:0 10px 10px 0; z-index:3; padding-bottom:60px; opacity:0; visibility:hidden; transition:.3s;}
.wrap-popup .inner .panel .navClosePanel{text-transform:uppercase; width:calc(100% - 32px); display:block; font-size:13px; font-weight:bold; color:var(--color2); letter-spacing:1px; line-height:60px; height:60px; padding-left:35px; position:absolute; bottom:0; left:16px; box-shadow: inset 0 1px rgba(0,0,0,.1)}
.wrap-popup .inner .panel .navClosePanel:before{font-weight: 900;font-family: "Font Awesome 5"; content: "\f053"; font-size:12px; color:#000; margin-top:-14px; width:26px; height:26px; line-height:27px; display:block; border-radius:50%; box-shadow: 0 0 0 1px rgba(0,0,0,.15); position:absolute; left:0; top:50%; text-align:center; padding-left: 2px;}
.wrap-popup .inner .panel .navClosePanel:after{content: ''; width:14px; height:14px; display:block; position:absolute; left:20px; top:-7px; background:#fff; border-top:1px solid rgba(0,0,0,.07);border-left:1px solid rgba(0,0,0,.07); transform:rotate(45deg)
}
.wrap-popup .inner .panel ul{width:100%; margin:0; padding:10px 0px; list-style:none; float:left;}
.wrap-popup .inner .panel ul li{width:100%; float:left; position:relative;  display:flex; align-items:center; z-index:1; padding: 0 16px; }
.wrap-popup .inner .panel ul li a{width:100%; height:100%; float:left; position:absolute; color:#000; top:0; left:0; z-index:3;}
.wrap-popup .inner .panel ul li .innerItem{width:100%; height:60px; position:relative; z-index:2; padding-top:10px; box-shadow: 0 1px rgba(0,0,0,.07); }
.wrap-popup .inner .panel ul li .innerItem h4{font-weight:500; font-size:14px; width:100%; float:left; margin:0 0 0px 0; padding:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#000}
.wrap-popup .inner .panel ul li .innerItem .info{width:100%; float:left; position:relative; display:flex; align-items:center; margin-top:3px;}
.wrap-popup .inner .panel ul li .innerItem .info label{margin:0; font-size:13px; line-height:18px; height:18px; padding: 0 5px; border-radius:5px; margin-right:5px; }
.wrap-popup .inner .panel ul li .innerItem .info span{font-size:13px;}
.wrap-popup .inner .panel ul li:before{content:''; width:5px; height:100%; background:var(--color2); position:absolute; top:0; left:0; border-radius:5px 0 0 5px; transition:.3s; opacity:0;}
.wrap-popup .inner .panel ul li.active{background-image: linear-gradient(to right, #d4e8ff , #fff);}
.wrap-popup .inner .panel ul li.active:before{left:-5px; opacity:1;}
.wrap-popup .inner .panel ul li{border-radius: 0 10px 0 0}
.wrap-popup .inner .panel ul li:last-child .inner{box-shadow:none;}

.isRun{background:#cc0303; color:#fff; }
.isWait{background:#2b894a; color:#fff;}

.wrap-popup.ishide{opacity:0; visibility:hidden; z-index:-1;}

.nav-openPopup{position:fixed; right:30px; bottom:250px; z-index:30; float:left; width:60px; transition:.3s; opacity:1; visibility:initial;}
.nav-openPopup img{width:100%; animation: heart 1s linear infinite;}
.nav-openPopup.ishide{opacity:0; visibility:hidden; transform:scale(0) }

@media (max-width:767px){
    .nav-openPopup{right:15px; bottom:75px;}
}

@keyframes heart {
  0% {transform: scale(1);}
  15% {transform: scale(1.3);}
  30% {transform: scale(1);}
  45% {transform: scale(1.3);}
  60% {transform: scale(1);} 
}

@media (max-width:991px) {
    .wrap-popup .inner .mainImg .caption .navEventMore span:after{content:"\f078"}
    .wrap-popup .inner .panel{width:100%; position:relative; opacity:0; visibility:hidden; float:left; padding:0px; z-index:10; transition:.3s; overflow:hidden; max-height:0; border-radius: 0 0 10px 10px;}
    .wrap-popup .inner .panel .navClosePanel{bottom:initial; top:5px; background:var(--color2); height:40px; border-radius:7px; color:#fff; line-height:40px; padding-left:15px;}
    .wrap-popup .inner .panel .navClosePanel:after{background:var(--color2); border:none;}
    .wrap-popup .inner .panel .navClosePanel:before{left:initial; right:10px; content:"\f077"; background:#fff;}
    .wrap-popup .inner .panel ul{padding: 0 10px;}
    .wrap-popup .inner .panel ul li{width:calc(50% - 10px); margin:5px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.07); border-radius:6px; background:#fff!important; transition:.3s;}
    .wrap-popup .inner .panel ul li:before{display:none;}
    .wrap-popup .inner .panel ul li .innerItem{box-shadow:none;}
    .wrap-popup .inner .panel ul li.active{box-shadow: inset 0 0 0 1px var(--color2)}

    .wrap-popup.isPanelShow .inner .panel{max-height:initial; padding-top:55px; padding-bottom:10px; opacity:1; visibility:initial; overflow:initial}
    .wrap-popup.isPanelShow .inner .mainImg .caption{border-radius:0; padding-right:15px!important;}
    .wrap-popup.isPanelShow .inner .mainImg .caption .navEventMore{opacity:0; visibility:hidden;}
}

@media (max-width:650px) {
    .wrap-popup .inner .panel ul li{width:calc(100% - 10px)}
}

@media (min-width:992px){
    .wrap-popup.isPanelShow .inner{max-width:860px; padding-right:260px;}
    .wrap-popup.isPanelShow .inner .panel{opacity:1; visibility:initial; z-index:6;}
    .wrap-popup.isPanelShow .inner .mainImg a.nav-img img{border-radius: 10px 0 0 0;}
    .wrap-popup.isPanelShow .inner .mainImg .caption{border-radius: 0 0 0 10px;border-right:1px solid rgba(0,0,0,.07); padding-right:15px!important;}
    .wrap-popup.isPanelShow .inner .mainImg .caption .navEventMore{opacity:0; visibility:hidden;}
}


.adsInline{max-width:600px; width:100%; display:table; position:relative; padding:3px;z-index:10; border:1px solid rgba(0,0,0,.07); border-radius:10px; margin: 20px auto;}
.adsInline .itemAds{ padding: 3px; width:100%; float:left;}
.adsInline .itemAds a{width:100%; float:left; position:relative;}
.adsInline .itemAds a img{max-width:initial!important; width:100%!important; margin:0!important; border-radius:7px!important;}
.adsInline .labelAds{position:absolute; top:0; right:0; z-index:2; background:#fff; font-size:12px; line-height:22px; height:22px; padding: 0 8px; border-radius: 0 10px 0 10px; font-weight:500; color:#000}


@media (min-width:1440px){
    .adsInline.isFull{max-width:100%; display:flex; justify-content: space-between; align-content:center; align-items:center; }
    .adsInline.isFull .itemAds{display:flex;  height:100%; }
}