/*  10:44:12 24/09/2024 */
 .dot-stretching {

     position: relative;
     width: 10px;
     height: 10px;
     border-radius: 5px;
     background-color: #288ad6;
     color: #288ad6;
     transform: scale(1.25, 1.25);
     animation: dotStretching 2s infinite ease-in;
     text-align: left
 }

 .dot-stretching::before {
     width: 10px;
     height: 10px;
     border-radius: 5px;
     background-color: #288ad6;
     color: #288ad6;
     animation: dotStretchingBefore 2s infinite ease-in
 }

 .dot-stretching::after {
     width: 10px;
     height: 10px;
     border-radius: 5px;
     background-color: #288ad6;
     color: #288ad6;
     animation: dotStretchingAfter 2s infinite ease-in
 }

 .dot-stretching::before,
 .dot-stretching::after {
     content: '';
     display: inline-block;
     position: absolute;
     top: 0
 }

 #preloader {
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     margin: 0 auto;
     width: 100%;
     height: 100%;
     display: none;
     z-index: 1;
     background: rgba(255, 255, 255, .75)
 }

 .preloader {
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     margin: 0 auto;
     width: 100%;
     height: 100%;
     display: none;
     z-index: 999;
     background: rgba(255, 255, 255, .75)
 }

 .load {
     display: block;
     width: 20px;
     height: 20px;
     border: 5px solid #fff;
     border-top: 5px solid transparent;
     -webkit-animation: load-animate infinite linear 1s;
     animation: load-animate infinite linear 1s;
     border-radius: 100%
 }

 .overlay {
     position: fixed;
     top: 0;
     left: 0;
     right: 0;
     margin: 0 auto;
     width: 100%;
     height: 100%;
     display: none;
     z-index: 99;
     background: rgba(255, 255, 255, .75)
 }

 #loader {
     display: block;
     position: relative;
     left: 0;
     right: 0;
     margin: 0 auto;
     width: 80px;
     height: 80px
 }

 #loader:after {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     margin: 0 auto;
     background: url(../cdnv2.tgdd.vn/webmwg/2024/ContentMwg/images/logo.png) no-repeat center;
     background-size: 45%;
     border-radius: 50%;
     margin: 0;
     background-color: #f8c5468c
 }

 #loader:before {
     content: "";
     display: block;
     position: absolute;
     left: -3px;
     top: -3px;
     width: 100%;
     height: 100%;
     margin: 0 auto;
     border-radius: 50%;
     border: 3px solid transparent;
     border-top-color: #f8c546;
     -webkit-animation: spin 1s linear infinite;
     animation: spin 1s linear infinite;
     z-index: 1
 }

 body.dmx-site #loader:after {
     background-color: #288ad68f
 }

 body.dmx-site #loader:before {
     border-top-color: #288ad6
 }

 .desktop #loader {
     top: 15%
 }

 .loaderweb {
     display: block;
     position: relative;
     left: 50%;
     top: 50%;
     width: 80px;
     height: 80px;
     margin: -75px 0 0 -50px;
     border-radius: 50%;
     border: 3px solid transparent;
     border-top-color: #000;
     -webkit-animation: spin 2s linear infinite;
     animation: spin 2s linear infinite
 }

 .loaderweb:before {
     content: "";
     position: absolute;
     top: 5px;
     left: 5px;
     right: 5px;
     bottom: 5px;
     border-radius: 50%;
     border: 3px solid transparent;
     border-top-color: #8e8e8e;
     -webkit-animation: spin 3s linear infinite;
     animation: spin 3s linear infinite
 }

 .loaderweb:after {
     content: "";
     position: absolute;
     top: 15px;
     left: 15px;
     right: 15px;
     bottom: 15px;
     border-radius: 50%;
     border: 3px solid transparent;
     border-top-color: #000;
     -webkit-animation: spin 1.5s linear infinite;
     animation: spin 1.5s linear infinite
 }

 .desktop .loaderweb {
     top: 15%
 }

 #progressTop {
     position: fixed;
     z-index: 99;
     top: 0;
     left: -6px;
     width: 1%;
     height: 5px;
     background-color: #288ad6;
     -moz-border-radius: 1px;
     -webkit-border-radius: 1px;
     border-radius: 1px;
     -moz-transition: width 3000ms ease-out, opacity 500ms linear;
     -ms-transition: width 3000ms ease-out, opacity 500ms linear;
     -o-transition: width 3000ms ease-out, opacity 500ms linear;
     -webkit-transition: width 600ms ease-out, opacity 500ms linear;
     transition: width 5000ms ease-out, opacity 500ms linear
 }

 #progressTop b,
 #progressTop i {
     position: absolute;
     top: 0;
     height: 3px;
     -moz-box-shadow: #777 1px 0 6px 1px;
     -ms-box-shadow: #777 1px 0 6px 1px;
     -webkit-box-shadow: #777 1px 0 6px 1px;
     box-shadow: #777 1px 0 6px 1px;
     -moz-border-radius: 100%;
     -webkit-border-radius: 100%;
     border-radius: 100%
 }

 .bubblingG {
     text-align: center;
     width: 99%;
     height: 40px;
     margin: auto;
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     background-color: rgba(255, 255, 255, .75);
     z-index: 1
 }

 .bubblingG span {
     display: inline-block;
     vertical-align: middle;
     width: 7px;
     height: 7px;
     margin: 25px 3px;
     background: #fff;
     border-radius: 49px;
     -o-border-radius: 49px;
     -ms-border-radius: 49px;
     -webkit-border-radius: 49px;
     -moz-border-radius: 49px;
     animation: bubblingG 1.5s infinite alternate;
     -o-animation: bubblingG 1.5s infinite alternate;
     -ms-animation: bubblingG 1.5s infinite alternate;
     -webkit-animation: bubblingG 1.5s infinite alternate;
     -moz-animation: bubblingG 1.5s infinite alternate
 }

 .view-more .bubblingG span,
 .seemore .bubblingG span {
     animation: bubblingG-black 1.5s infinite alternate;
     -o-animation: bubblingG-black 1.5s infinite alternate;
     -ms-animation: bubblingG-black 1.5s infinite alternate;
     -webkit-animation: bubblingG-black 1.5s infinite alternate;
     -moz-animation: bubblingG-black 1.5s infinite alternate
 }

 #bubblingG_1 {
     animation-delay: 0s;
     -o-animation-delay: 0s;
     -ms-animation-delay: 0s;
     -webkit-animation-delay: 0s;
     -moz-animation-delay: 0s
 }

 #bubblingG_2 {
     animation-delay: .45s;
     -o-animation-delay: .45s;
     -ms-animation-delay: .45s;
     -webkit-animation-delay: .45s;
     -moz-animation-delay: .45s
 }

 #bubblingG_3 {
     animation-delay: .9s;
     -o-animation-delay: .9s;
     -ms-animation-delay: .9s;
     -webkit-animation-delay: .9s;
     -moz-animation-delay: .9s
 }

 .loaderLocation {
     border: 2px solid #f3f3f3;
     border-radius: 50%;
     border-top: 2px solid #222;
     width: 20px;
     height: 20px;
     -webkit-animation: spin 2s linear infinite;
     animation: spin 2s linear infinite;
     position: absolute;
     top: 3px;
     left: 20%
 }

 .lds-ellipsis {
     display: block;
     position: relative;
     width: 80px;
     height: 80px;
     margin: auto
 }

 .lds-ellipsis div {
     position: absolute;
     top: 33px;
     width: 13px;
     height: 13px;
     border-radius: 50%;
     background: #1aa1db;
     animation-timing-function: cubic-bezier(0, 1, 1, 0)
 }

 .lds-ellipsis div:nth-child(1) {
     left: 8px;
     animation: lds-ellipsis1 .6s infinite
 }

 .lds-ellipsis div:nth-child(2) {
     left: 8px;
     animation: lds-ellipsis2 .6s infinite
 }

 .lds-ellipsis div:nth-child(3) {
     left: 32px;
     animation: lds-ellipsis2 .6s infinite
 }

 .lds-ellipsis div:nth-child(4) {
     left: 56px;
     animation: lds-ellipsis3 .6s infinite
 }

 .lds-roller {
     display: block;
     position: relative;
     width: 80px;
     height: 80px;
     top: 5%;
     margin: 0 auto;
     text-align: center
 }

 .lds-roller div {
     animation: lds-roller 1.2s cubic-bezier(.5, 0, .5, 1) infinite;
     transform-origin: 40px 40px
 }

 .lds-roller div:after {
     content: " ";
     display: block;
     position: absolute;
     width: 7px;
     height: 7px;
     border-radius: 50%;
     background: #fff;
     margin: -4px 0 0 -4px
 }

 .lds-roller div:nth-child(1) {
     animation-delay: -.036s
 }

 .lds-roller div:nth-child(1):after {
     top: 63px;
     left: 63px
 }

 .lds-roller div:nth-child(2) {
     animation-delay: -.072s
 }

 .lds-roller div:nth-child(2):after {
     top: 68px;
     left: 56px
 }

 .lds-roller div:nth-child(3) {
     animation-delay: -.108s
 }

 .lds-roller div:nth-child(3):after {
     top: 71px;
     left: 48px
 }

 .lds-roller div:nth-child(4) {
     animation-delay: -.144s
 }

 .lds-roller div:nth-child(4):after {
     top: 72px;
     left: 40px
 }

 .lds-roller div:nth-child(5) {
     animation-delay: -.18s
 }

 .lds-roller div:nth-child(5):after {
     top: 71px;
     left: 32px
 }

 .lds-roller div:nth-child(6) {
     animation-delay: -.216s
 }

 .lds-roller div:nth-child(6):after {
     top: 68px;
     left: 24px
 }

 .lds-roller div:nth-child(7) {
     animation-delay: -.252s
 }

 .lds-roller div:nth-child(7):after {
     top: 63px;
     left: 17px
 }

 .lds-roller div:nth-child(8) {
     animation-delay: -.288s
 }

 .lds-roller div:nth-child(8):after {
     top: 56px;
     left: 12px
 }

 @keyframes lds-ellipsis1 {
     0% {
         transform: scale(0)
     }

     100% {
         transform: scale(1)
     }
 }

 @keyframes lds-ellipsis3 {
     0% {
         transform: scale(1)
     }

     100% {
         transform: scale(0)
     }
 }

 @keyframes lds-ellipsis2 {
     0% {
         transform: translate(0, 0)
     }

     100% {
         transform: translate(24px, 0)
     }
 }

 @-webkit-keyframes spin {
     0% {
         -webkit-transform: rotate(0deg)
     }

     100% {
         -webkit-transform: rotate(360deg)
     }
 }

 @keyframes spin {
     0% {
         transform: rotate(0deg)
     }

     100% {
         transform: rotate(360deg)
     }
 }

 @keyframes bubblingG {
     0% {
         width: 7px;
         height: 7px;
         background-color: #fff;
         transform: translateY(0)
     }

     100% {
         width: 17px;
         height: 17px;
         background-color: #288ad6;
         transform: translateY(-20px)
     }
 }

 @-o-keyframes bubblingG {
     0% {
         width: 7px;
         height: 7px;
         background-color: #fff;
         -o-transform: translateY(0);
     }

     100% {
         width: 17px;
         height: 17px;
         background-color: #288ad6;
         -o-transform: translateY(-20px);
     }
 }

 @-ms-keyframes bubblingG {
     0% {
         width: 7px;
         height: 7px;
         background-color: #fff;
         -ms-transform: translateY(0)
     }

     100% {
         width: 17px;
         height: 17px;
         background-color: #288ad6;
         -ms-transform: translateY(-20px)
     }
 }

 @-webkit-keyframes bubblingG {
     0% {
         width: 7px;
         height: 7px;
         background-color: #fff;
         -webkit-transform: translateY(0)
     }

     100% {
         width: 17px;
         height: 17px;
         background-color: #288ad6;
         -webkit-transform: translateY(-20px)
     }
 }

 @-moz-keyframes bubblingG {
     0% {
         width: 7px;
         height: 7px;
         background-color: #fff;
         -moz-transform: translateY(0)
     }

     100% {
         width: 17px;
         height: 17px;
         background-color: #288ad6;
         -moz-transform: translateY(-20px)
     }
 }

 @keyframes bubblingG-black {
     0% {
         width: 7px;
         height: 7px;
         background-color: #fff;
         transform: translateY(0)
     }

     100% {
         width: 17px;
         height: 17px;
         background-color: #333;
         transform: translateY(-20px)
     }
 }

 @-o-keyframes bubblingG-black {
     0% {
         width: 7px;
         height: 7px;
         background-color: #fff;
         -o-transform: translateY(0);
     }

     100% {
         width: 17px;
         height: 17px;
         background-color: #fff;
         -o-transform: translateY(-20px);
     }
 }

 @-ms-keyframes bubblingG-black {
     0% {
         width: 7px;
         height: 7px;
         background-color: #fff;
         -ms-transform: translateY(0)
     }

     100% {
         width: 17px;
         height: 17px;
         background-color: #fff;
         -ms-transform: translateY(-20px)
     }
 }

 @-webkit-keyframes bubblingG-black {
     0% {
         width: 7px;
         height: 7px;
         background-color: #fff;
         -webkit-transform: translateY(0)
     }

     100% {
         width: 17px;
         height: 17px;
         background-color: #fff;
         -webkit-transform: translateY(-20px)
     }
 }

 @-moz-keyframes bubblingG-black {
     0% {
         width: 7px;
         height: 7px;
         background-color: #fff;
         -moz-transform: translateY(0)
     }

     100% {
         width: 17px;
         height: 17px;
         background-color: #fff;
         -moz-transform: translateY(-20px)
     }
 }

 @-webkit-keyframes bounce {
     0% {
         transform: scale(0)
     }

     14% {
         transform: scale(1.15)
     }

     28% {
         transform: scale(1)
     }

     42% {
         transform: scale(1.15)
     }

     70% {
         transform: scale(1)
     }

     100% {
         transform: scale(1)
     }
 }

 @keyframes bounce {
     0% {
         transform: scale(0)
     }

     14% {
         transform: scale(1.15)
     }

     28% {
         transform: scale(1)
     }

     42% {
         transform: scale(1.15)
     }

     70% {
         transform: scale(1)
     }

     100% {
         transform: scale(1)
     }
 }

 @keyframes load-animate {
     0% {
         transform: rotate(0deg)
     }

     50% {
         transform: rotate(180deg);
         opacity: .35
     }

     100% {
         transform: rotate(360deg)
     }
 }

 @keyframes dotStretching {
     0% {
         transform: scale(1.25, 1.25)
     }

     50%,
     60% {
         transform: scale(.8, .8)
     }

     100% {
         transform: scale(1.25, 1.25)
     }
 }

 @keyframes dotStretchingBefore {
     0% {
         transform: translate(0) scale(.7, .7)
     }

     50%,
     60% {
         transform: translate(-20px) scale(1, 1)
     }

     100% {
         transform: translate(0) scale(.7, .7)
     }
 }

 @keyframes dotStretchingAfter {
     0% {
         transform: translate(0) scale(.7, .7)
     }

     50%,
     60% {
         transform: translate(20px) scale(1, 1)
     }

     100% {
         transform: translate(0) scale(.7, .7)
     }
 }

 @-webkit-keyframes spin {
     0% {
         -webkit-transform: rotate(0deg);
         -ms-transform: rotate(0deg);
         transform: rotate(0deg)
     }

     100% {
         -webkit-transform: rotate(360deg);
         -ms-transform: rotate(360deg);
         transform: rotate(360deg)
     }
 }

 @keyframes spin {
     0% {
         -webkit-transform: rotate(0deg);
         -ms-transform: rotate(0deg);
         transform: rotate(0deg)
     }

     100% {
         -webkit-transform: rotate(360deg);
         -ms-transform: rotate(360deg);
         transform: rotate(360deg)
     }
 }

 @-webkit-keyframes sonar {
     0% {
         opacity: 1;
         -webkit-transform: scale(1);
         transform: scale(1)
     }

     100% {
         -webkit-transform: scale(4);
         transform: scale(4);
         opacity: 0
     }
 }

 @keyframes sonar {
     0% {
         opacity: 1;
         -webkit-transform: scale(1);
         transform: scale(1)
     }

     100% {
         -webkit-transform: scale(4);
         transform: scale(4);
         opacity: 0
     }
 }

 @keyframes load-effect {
     0% {
         transform: rotate(0deg)
     }

     100% {
         transform: rotate(360deg)
     }
 }

 @keyframes lds-roller {
     0% {
         transform: rotate(0deg)
     }

     100% {
         transform: rotate(360deg)
     }
 }

 [class^="boxchat-"],
 [class*="boxchat-"] {
     background-image: url(//cdn.tgdd.vn/mwgcart/stag-topzone/images/common/boxchat.png);
     background-repeat: no-repeat;
     display: inline-block;
     height: 30px;
     width: 30px;
     line-height: 30px;
     vertical-align: middle;
     background-size: 150px 376px
 }

 .boxchat-balloons {
     background-position: -1px -286px;
     width: 87px;
     height: 87px
 }

 .boxchat-call {
     background-position: -96px -318px;
     width: 24px;
     height: 24px
 }

 .boxchat-zalo {
     background-position: -124px 0;
     width: 24px;
     height: 24px
 }

 .boxchat-closewindow {
     background-position: -131px -32px;
     width: 10px;
     height: 11px
 }

 .popup-boxchat {
     display: block
 }

 .popup-boxchat .boxchat-balloons {
     position: fixed;
     bottom: 24px;
     right: 40px;
     cursor: pointer;
     z-index: 99
 }

 .chat-window {
     position: fixed;
     right: 50px;
     bottom: 114px;
     background: #fff;
     border-radius: 8px;
     box-shadow: 0 0 12px rgba(51, 51, 51, .2);
     padding: 8px 16px 16px;
     display: none;
     transition: .3s;
     z-index: 99
 }

 .chat-window.active {
     display: block
 }

 .chat-window .sp-onl {
     display: block;
     overflow: hidden
 }

 .chat-window .sp-onl h4 {
     display: block;
     overflow: hidden;
     font-size: 14px;
     line-height: 20px;
     color: #333;
     font-weight: bold
 }

 .chat-window .sp-onl i {
     position: absolute;
     right: 8px;
     top: 8px;
     cursor: pointer
 }

 .chat-window ul {
     display: block;
     overflow: hidden
 }

 .chat-window ul li {
     display: block;
     overflow: hidden;
     border: 1px solid #e0e0e0;
     border-radius: 4px;
     margin: 12px 0;
     padding: 6px 26px 6px 16px;
     position: relative
 }

 .chat-window ul li.prevent {
     opacity: .3
 }

 .chat-window ul li.prevent a {
     pointer-events: none
 }

 .chat-window ul li .stage {
     display: none;
     position: absolute;
     top: calc(50% - 5px);
     left: 50%
 }

 .chat-window ul li.prevent .stage {
     display: block
 }

 .chat-window ul li:last-child {
     margin: 0
 }

 .chat-window ul li a {
     display: block;
     overflow: hidden
 }

 .chat-window ul li i {
     display: inline-block;
     vertical-align: middle
 }

 .chat-window ul li strong {
     display: inline-block;
     vertical-align: middle;
     font-size: 14px;
     line-height: 20px;
     font-weight: 600;
     margin: 0 0 0 8px;
     color: #333
 }

 .chat-window ul li strong.no-pointer {
     cursor: text
 }

 .chat-window ul li span {
     display: block;
     overflow: hidden;
     font-size: 12px;
     font-weight: 400;
     color: #333
 }

 .zalo-chat-widget {
     display: none;
     bottom: 130px !important;
     right: 175px !important
 }

 .zalo-chat-widget.active {
     display: block
 }

 @media screen and (max-width:640px) {
     .popup-boxchat .boxchat-balloons {
         bottom: 80px;
         right: 16px
     }

     .chat-window {
         bottom: 170px;
         right: 26px
     }

     .zalo-chat-widget {
         bottom: 186px !important;
         right: 151px !important
     }
 }

 * {
     margin: 0;
     padding: 0
 }

 * {
     box-sizing: border-box
 }

 img {
     border: 0
 }

 a {
     text-decoration: none;
     transition: .3s
 }

 ul,
 ol {
     list-style: none
 }

 .clr {
     clear: both
 }

 .clearfix {
     display: block
 }

 .clearfix:after {
     content: "";
     display: block;
     clear: both
 }

 body,
 input,
 button,
 option,
 textarea,
 label,
 select,
 legend,
 h1,
 h2,
 h3,
 h4,
 h5,
 h6,
 h1 a,
 h2 a,
 h3 a,
 h4 a,
 h5 a,
 h6 a {
     font: 14px/18px Helvetica Neue, Helvetica, Arial, SF Pro Display, sans-serif;
     color: #333;
     outline: none
 }

 body {
     min-width: 1024px;
     background: #3e3e3f
 }

 p {
     -webkit-margin-before: 0;
     -webkit-margin-after: 0;
     -webkit-margin-start: 0;
     -webkit-margin-end: 0;
     text-rendering: geometricPrecision
 }

 input[type=text],
 input[type=tel],
 textarea {
     -webkit-appearance: none
 }

 section {
     width: 100%
 }

 [class^="topzone-"],
 [class*="topzone-"] {
     background-image: url(//cdnv2.tgdd.vn/webmwg/2024/tz/images/icon-topzone.webp);
     background-repeat: no-repeat;
     display: inline-block;
     height: 30px;
     width: 30px;
     line-height: 30px;
     vertical-align: middle;
     background-size: 514px 226px
 }

 [class^="iconlogo-"],
 [class*="iconlogo-"] {
     background-image: url(//cdnv2.tgdd.vn/webmwg/2024/tz/images/desktop/icon_logo@2x-min.png);
     background-repeat: no-repeat;
     display: inline-block;
     height: 40px;
     width: 133px;
     line-height: 30px;
     vertical-align: middle;
     background-size: 300px 425px
 }

 .topzone-logo {
     background-position: 0 0;
     width: 103px;
     height: 35px
 }

 .topzone-autho {
     background-image: url(//cdnv2.tgdd.vn/webmwg/2024/tz/images/APR_logo.webp);
     width: 32px;
     height: 40px;
     background-size: 100%
 }

 .topzone-search {
     background-position: -187px -11px;
     width: 18px;
     height: 18px
 }

 .topzone-delSearch {
     background-position: -214px -12px;
     width: 14px;
     height: 14px
 }

 .topzone-cart {
     background-position: -239px -11px;
     width: 14px;
     height: 17px
 }

 .topzone-homeDiver {
     background-position: -264px -3px;
     width: 35px;
     height: 34px
 }

 .topzone-homeDeli {
     background-position: -306px -4px;
     width: 39px;
     height: 32px
 }

 .topzone-homeInsur {
     background-position: -356px -2px;
     width: 29px;
     height: 36px
 }

 .topzone-homeReturn {
     background-position: -396px -4px;
     width: 36px;
     height: 32px
 }

 .topzone-cateiphone {
     background-position: 0 -45px;
     width: 152px;
     height: 32px
 }

 .topzone-catemac {
     background-position: -159px -46px;
     width: 102px;
     height: 31px
 }

 .topzone-cateipad {
     background-position: -268px -45px;
     width: 105px;
     height: 32px
 }

 .topzone-catewatch {
     background-position: -380px -45px;
     width: 131px;
     height: 34px
 }

 .topzone-playbutton {
     background-position: 0 -122px;
     width: 104px;
     height: 104px
 }

 .topzone-stick {
     background-position: -217px -95px;
     width: 10px;
     height: 7px
 }

 .topzone-close {
     background-position: -237px -95px;
     width: 12px;
     height: 12px
 }

 .topzone-playvideo {
     background-position: -262px -88px;
     width: 29px;
     height: 29px
 }

 .topzone-box {
     background-position: -1px -87px;
     width: 22px;
     height: 25px
 }

 .topzone-boxtskt {
     width: 24px;
     height: 24px;
     background: transparent url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAJcEhZcwAAFiUAABYlAUlSJPAAAABFUExURUdwTP///////////////////////////////////////////////////////////////////////////////////////1fUNLcAAAAWdFJOUwCfQD8Qv2Df719vjyB/gE8wUM+vH3CEv/pOAAABMklEQVRIx+2WyxaDIAxEAUFAUVFb/v9TS0FAIL7WbZaeuSaDnIkIgUXJjB4U6YUx5JHa1nRLrUbu1KJvbqhpx7yaNXTfUqoztWEdrQZkkpaHwvzgbMjUo3/6LTzXNsWwH5yO24C49744Jt6mAGymAd0wDQ6MQot/S6ZuATsT9o8QLy0RDNkJLbkFOLq0E1qWwBuys2/Jc0DXdoqWBUBsRwl9h9iyBjDwHdZ0UU6AFrwox8AMqGtAJ6D92nxVN7QA7KnJBEjgShcAUho9A1L9gT/wq4BZ5S3ApSUPYUwuADr7GFmQikmuj4GQlqJ32yumf6cgIKblPkS39LfJr3IgrFXDpnLNhaxzR+CBg0WZUqZdtt7EAl1UD/RksQ/cZJVvFrA0jsy9/wF3bKLaLFc1yYPBP9RfKsV95xMDAAAAAElFTkSuQmCC') no-repeat center top;
     background-size: 24px 24px
 }

 .topzone-doitra {
     background-position: -32px -89px;
     width: 20px;
     height: 20px
 }

 .topzone-baohanhpolicy {
     background-position: -63px -89px;
     width: 16px;
     height: 20px
 }

 .topzone-giaohang {
     background-position: -89px -91px;
     width: 22px;
     height: 18px
 }

 .topzone-tongdai {
     background-position: -119px -90px;
     width: 20px;
     height: 20px
 }

 .topzone-stickchoose {
     background-position: -167px 89px;
     width: 20px;
     height: 20px
 }

 .topzone-plus {
     background-position: -144px -90px;
     width: 20px;
     height: 20px
 }

 .topzone-cohang {
     background-position: -298px -94px;
     width: 14px;
     height: 14px
 }

 .topzone-hethang {
     background-position: -319px -93px;
     width: 14px;
     height: 14px
 }

 .topzone-bike {
     background-position: -113px -125px;
     width: 24px;
     height: 24px
 }

 .topzone-staff {
     background-position: -138px -126px;
     width: 24px;
     height: 24px
 }

 .topzone-box {
     background-position: -169px -125px;
     width: 24px;
     height: 24px
 }

 .topzone-trainghiem {
     background-position: -198px -126px;
     width: 24px;
     height: 24px
 }

 .topzone-tragop {
     background-position: -226px -125px;
     width: 24px;
     height: 24px
 }

 .topzone-cathe {
     background-position: -256px -125px;
     width: 24px;
     height: 24px
 }

 .topzone-phantram {
     background-position: -286px -127px;
     width: 24px;
     height: 24px
 }

 .topzone-baohanh {
     background-position: -315px -125px;
     width: 24px;
     height: 24px
 }

 .topzone-bikeDetail {
     background-position: -112px -153px;
     width: 24px;
     height: 24px
 }

 .topzone-staffDetail {
     background-position: -227px -153px;
     width: 24px;
     height: 24px
 }

 .topzone-boxDetail {
     background-position: -139px -154px;
     width: 24px;
     height: 24px
 }

 .topzone-trainghiemDetail {
     background-position: -171px -154px;
     width: 24px;
     height: 24px
 }

 .topzone-tragopDetail {
     background-position: -197px -156px;
     width: 24px;
     height: 24px
 }

 .topzone-catheDetail {
     background-position: -290px -154px;
     width: 24px;
     height: 24px
 }

 .topzone-phantramDetail {
     background-position: -254px -153px;
     width: 24px;
     height: 24px
 }

 .topzone-baohanhDetail {
     background-position: -314px -154px;
     width: 24px;
     height: 24px
 }

 .topzone-btnTZ {
     background-position: -431px -89px;
     width: 83px;
     height: 29px
 }

 .topzone-dmx {
     background-position: -369px -122px;
     width: 145px;
     height: 26px
 }

 .topzone-tgdd {
     background-position: -369px -154px;
     width: 145px;
     height: 25px
 }

 .center-page {
     max-width: 1180px;
     min-width: 1024px;
     margin: auto
 }

 .topzone-fb {
     background-position: -340px -90px;
     width: 11px;
     height: 19px
 }

 .topzone-link {
     background-position: -356px -93px;
     width: 14px;
     height: 15px
 }

 .topzone-eyes {
     background-position: -375px -93px;
     width: 14px;
     height: 14px
 }

 .topzone-filter {
     background-position: -374px -189px;
     width: 19px;
     height: 17px
 }

 .topzone-close-option {
     background-position: -400px -189px;
     width: 8px;
     height: 8px
 }

 .topzone-close-filter {
     background-position: -415px -189px;
     width: 16px;
     height: 16px
 }

 .iconlogo-sport {
     background-position: 0 0
 }

 .iconlogo-fashion {
     background-position: -145px 0
 }

 .iconlogo-ji {
     background-position: 0 -50px
 }

 .iconlogo-bachhoaxanh {
     background-position: 0 -100px
 }

 .iconlogo-cycle {
     background-position: 0 -285px
 }

 .iconlogo-thegioididong {
     background-position: -145px -100px
 }

 .iconlogo-dienmayxanh {
     background-position: 0 -150px
 }

 .iconlogo-kids {
     background-position: -145px -380px
 }

 .iconlogo-ankhang {
     background-position: -145px -284px
 }

 .iconlogo-tantam {
     background-position: 0 -330px
 }

 .iconlogo-4kfarm {
     background-position: -145px -330px
 }

 .iconlogo-vieclam {
     background-position: 0 -378px;
     background-color: #ffd400
 }

 .iconlogo-erablue {
     background-position: -145px -150px
 }

 [class^="iconsocial-"],
 [class*="iconsocial-"] {
     background-image: url(//cdnv2.tgdd.vn/webmwg/2024/tz/images/common/icon_socical.webp);
     background-repeat: no-repeat;
     display: inline-block;
     line-height: 30px;
     vertical-align: middle;
     background-size: 120px 90px
 }

 .iconsocial-facebook {
     background-position: -45px 0;
     width: 33px;
     height: 33px
 }

 .iconsocial-youtube {
     background-position: 0 0;
     width: 33px;
     height: 33px
 }

 .iconsocial-zalo {
     background-position: -85px 0;
     width: 33px;
     height: 33px
 }

 .footer-socia {
     margin-top: 10px
 }

 .footer-social .txt {
     color: #888;
     margin-bottom: 10px
 }

 .footer-social .link-social {
     display: inline-block;
     margin-right: 10px
 }

 header {
     width: 100%;
     background: #101010;
     height: 60px
 }

 header.sticky {
     position: fixed;
     top: 0;
     z-index: 10000
 }

 .head {
     display: flex;
     justify-content: space-between;
     align-items: center;
     max-width: 1200px;
     min-width: 1024px;
     margin: auto;
     width: 100%;
     height: 60px;
     position: relative
 }

 .logo-topzone {
     float: left;
     transition: opacity .1s cubic-bezier(.645, .045, .355, 1)
 }

 .logo-topzone a {
     display: inline-block;
     vertical-align: middle
 }

 .logo-topzone a:first-child {
     padding: 0 10px 0 0;
     border-right: 1px solid #3b3b3b;
     margin-right: 10px
 }

 .menu {
     float: left;
     width: 65%
 }

 @keyframes specialFadeOut {
     from {
         opacity: 1
     }

     to {
         opacity: 0;
         transform: scale(.8)
     }
 }

 .specialFadeOut {
     animation-name: specialFadeOut
 }

 @keyframes specialFadeIn {
     from {
         opacity: 0;
         transform: scale(.8)
     }

     to {
         opacity: 1
     }
 }

 .specialFadeIn {
     animation-name: specialFadeIn
 }

 .menu li {
     float: left;
     width: 12%;
     transition: opacity .2s cubic-bezier(.645, .045, .355, 1)
 }

 .menu li.hidden {
     display: none;
     transition: opacity .2s cubic-bezier(.645, .045, .355, 1)
 }

 .menu li:nth-child(1) {
     animation-delay: 30ms;
     animation-duration: 400ms;
     animation-fill-mode: both;
     animation-name: specialFadeIn
 }

 .menu li:nth-child(2) {
     animation-delay: 70ms;
     animation-duration: 400ms;
     animation-fill-mode: both;
     animation-name: specialFadeIn
 }

 .menu li:nth-child(3) {
     animation-delay: 100ms;
     animation-duration: 400ms;
     animation-fill-mode: both;
     animation-name: specialFadeIn
 }

 .menu li:nth-child(4) {
     animation-delay: 130ms;
     animation-duration: 400ms;
     animation-fill-mode: both;
     animation-name: specialFadeIn
 }

 .menu li:nth-child(5) {
     animation-delay: 170ms;
     animation-duration: 400ms;
     animation-fill-mode: both;
     animation-name: specialFadeIn
 }

 .menu li:nth-child(6) {
     animation-delay: 210ms;
     animation-duration: 400ms;
     animation-fill-mode: both;
     animation-name: specialFadeIn
 }

 .menu li:nth-child(7) {
     animation-delay: 240ms;
     animation-duration: 400ms;
     animation-fill-mode: both;
     animation-name: specialFadeIn
 }

 .menu li:nth-child(8) {
     animation-delay: 270ms;
     animation-duration: 400ms;
     animation-fill-mode: both;
     animation-name: specialFadeIn
 }

 .menu li.hidden:nth-child(1) {
     animation-delay: 245ms;
     animation-duration: 400ms;
     animation-fill-mode: both;
     animation-name: specialFadeOut
 }

 .menu li.hidden:nth-child(2) {
     animation-delay: 210ms;
     animation-duration: 400ms;
     animation-fill-mode: both;
     animation-name: specialFadeOut
 }

 .menu li.hidden:nth-child(3) {
     animation-delay: 170ms;
     animation-duration: 400ms;
     animation-fill-mode: both;
     animation-name: specialFadeOut
 }

 .menu li.hidden:nth-child(4) {
     animation-delay: 130ms;
     animation-duration: 400ms;
     animation-fill-mode: both;
     animation-name: specialFadeOut
 }

 .menu li.hidden:nth-child(5) {
     animation-delay: 100ms;
     animation-duration: 400ms;
     animation-fill-mode: both;
     animation-name: specialFadeOut
 }

 .menu li.hidden:nth-child(6) {
     animation-delay: 70ms;
     animation-duration: 400ms;
     animation-fill-mode: both;
     animation-name: specialFadeOut
 }

 .menu li:hover a {
     background: #2d2d2d
 }

 .menu li.active a {
     background: #2d2d2d
 }

 .menu li a {
     display: block;
     overflow: hidden;
     text-align: center;
     padding: 20px 0 19px
 }

 .menu li:last-child a {
     margin-right: 0
 }

 .menu li a span {
     display: block;
     overflow: hidden;
     color: #fff;
     font-size: 14px;
     line-height: 21px
 }

 .search-cart {
     float: right;
     position: relative
 }

 .search-sp {
     display: inline-block;
     vertical-align: middle;
     background: #2f3033;
     border-radius: 100%;
     padding: 10px;
     height: 40px;
     width: 40px;
     position: relative;
     cursor: pointer
 }

 .search-sp .topzone-search {
     display: block;
     margin: 2px auto
 }

 .cart {
     display: inline-block;
     vertical-align: middle;
     background: #2f3033;
     border-radius: 100%;
     padding: 10px;
     margin: 0 0 0 10px;
     position: relative;
     height: 40px;
     width: 40px
 }

 .cart i {
     display: block;
     margin: 2px auto
 }

 .cart b {
     position: absolute;
     left: 5px;
     bottom: 3px;
     color: #fff;
     width: 16px;
     height: 16px;
     background-color: #f01;
     border-radius: 50%;
     line-height: 18px;
     text-align: center;
     font-size: 10px;
     font-weight: normal;
     display: none
 }

 .view-cart {
     position: absolute;
     width: 220px;
     padding: 10px;
     background-color: #fff;
     border-radius: 4px;
     right: 0;
     top: 43px;
     z-index: 10;
     display: none
 }

 .view-cart:before {
     border-left: 6px solid transparent;
     border-right: 6px solid transparent;
     border-bottom: 6px solid #fff;
     content: '';
     height: 0;
     position: absolute;
     top: -6px;
     right: 14px;
     width: 0
 }

 .view-cart span {
     font-size: 12px
 }

 .view-cart a {
     height: 40px;
     line-height: 40px;
     text-align: center;
     border-radius: 8px;
     color: #fff;
     background-color: #0071e3;
     text-align: center;
     font-size: 15px;
     display: block;
     margin-top: 5px
 }

 .form-search {
     display: none;
     width: 600px;
     left: 0;
     right: 0;
     position: absolute;
     margin: auto;
     z-index: 9999;
     height: 60px;
     padding: 19px 0
 }

 .form-search.active {
     display: block;
     width: 600px;
     animation-name: specialFadeOut;
     transition: opacity .2s cubic-bezier(.645, .045, .355, 1)
 }

 .click-search {
     display: block;
     overflow: hidden;
     position: relative
 }

 .click-search .topzone-search {
     cursor: pointer;
     display: block;
     position: absolute;
     left: 60px;
     transition: .55s ease-out;
     opacity: .2
 }

 .click-search.active .topzone-search {
     left: 0;
     opacity: 1
 }

 .click-search .topzone-delSearch {
     position: absolute;
     right: 0;
     top: 1px;
     cursor: pointer
 }

 @keyframes specialFadeInRight {
     from {
         opacity: 0;
         transform: translate3d(10%, 0, 0)
     }

     to {
         opacity: 1;
         transform: none
     }
 }

 .spceialFadeInRight {
     animation-name: specialFadeInRight
 }

 .click-search input {
     float: right;
     width: 100%;
     padding-left: 85px;
     overflow: hidden;
     box-sizing: border-box;
     border: 0;
     background: unset;
     color: #fff;
     transition: .65s ease-out;
     opacity: .2;
     animation-name: specialFadeInRight;
     animation-duration: 400ms;
     animation-fill-mode: both;
     animation-delay: 350ms
 }

 .click-search.active input {
     padding-left: 30px;
     opacity: 1
 }

 .click-search input:placeholder {
     color: #3e3e3f
 }

 section {
     width: 100%
 }

 footer {
     width: 100%;
     background: #101010;
     position: relative
 }

 .foot {
     width: 100%;
     max-width: 1200px;
     min-width: 1024px;
     margin: auto;
     display: block;
     padding-bottom: 10px;
     position: relative;
     z-index: 2
 }

 .logo-foot {
     display: block;
     overflow: hidden;
     padding: 30px 0
 }

 .logo-foot a {
     display: inline-block;
     vertical-align: middle
 }

 .logo-foot a:first-child {
     padding: 0 10px 0 0;
     border-right: 1px solid #3b3b3b;
     margin-right: 10px
 }

 .list-foot {
     display: flex;
     justify-content: space-between;
     align-items: stretch;
     border-bottom: 1px solid #333;
     padding: 0 0 30px
 }

 .list-foot li {
     float: left;
     width: 23%
 }

 .list-foot li:first-child {
     width: 30%
 }

 .list-foot li span {
     display: block;
     overflow: hidden;
     color: #fff;
     font-size: 15px;
     line-height: 20px;
     padding: 0 0 8px;
     font-weight: 500
 }

 .list-foot li a {
     display: block;
     overflow: hidden;
     font-size: 13px;
     line-height: 18px;
     padding: 0 0 10px;
     color: #e5e5e5
 }

 .list-foot li a span {
     display: inline-block;
     width: 68px;
     padding: 0;
     font-size: 13px;
     line-height: 18px;
     overflow: unset
 }

 .list-foot li a b {
     font-weight: 400;
     color: #2997ff
 }

 .text-cpr {
     display: inline-block;
     overflow: hidden;
     padding: 22px 0;
     max-width: 57%
 }

 .text-cpr p {
     display: block;
     overflow: hidden;
     font-size: 11px;
     line-height: 14px;
     color: #666
 }

 .text-cpr p a {
     color: #2f80ed
 }

 .footer__logo {
     background-color: #222;
     padding: 15px 15px 5px;
     text-align: center
 }

 .footer__logo-hd {
     color: #757575;
     font-size: 14px;
     line-height: 21px
 }

 .footer__logo-list {
     font-size: 0;
     margin-top: 15px
 }

 .footer__logo-list li {
     display: inline-block;
     margin: 0 5px 10px
 }

 .footer__logo-list li a {
     display: block
 }

 .owl-carousel .owl-nav {
     position: absolute;
     top: 38%;
     left: 0;
     right: 0;
     margin: auto;
     width: 100%
 }

 .owl-carousel .owl-nav button span {
     font-size: 0
 }

 .owl-carousel .owl-nav button::before,
 .owl-carousel .owl-nav button::after {
     content: '';
     position: absolute
 }

 .owl-carousel .owl-nav button.owl-prev {
     left: 50px
 }

 .owl-carousel .owl-nav button.owl-next {
     right: 50px
 }

 .owl-carousel .owl-nav button.disabled {
     opacity: .4
 }

 .owl-carousel .owl-nav button {
     background: #29292a !important;
     height: 50px;
     position: absolute;
     width: 50px;
     opacity: .7;
     border-radius: 100% !important
 }

 .owl-theme .owl-nav [class*='owl-']:hover {
     background: #757575 !important;
     opacity: 1
 }

 .owl-carousel .owl-nav button.disabled:hover {
     background: #29292a !important;
     opacity: .4
 }

 .owl-carousel .owl-nav button::after {
     border-top: 2px solid #d9d9d9;
     border-left: 2px solid #d9d9d9;
     height: 8px;
     width: 8px
 }

 .owl-carousel .owl-nav button.owl-prev::after {
     left: 20px;
     top: 20px;
     transform: rotate(-45deg)
 }

 .owl-carousel .owl-nav button.owl-next::after {
     right: 19px;
     top: 20px;
     transform: rotate(135deg)
 }

 .owl-carousel .owl-nav button::before {
     background-color: #d9d9d9;
     height: 2px;
     width: 14px
 }

 .owl-carousel .owl-nav button.owl-prev::before {
     left: 20px;
     top: 24px
 }

 .owl-carousel .owl-nav button.owl-next::before {
     left: 18px;
     top: 24px
 }

 .bg-sg {
     position: fixed;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     background: #000;
     opacity: .8;
     z-index: 9998;
     display: none
 }

 .bg-sg.active {
     display: block
 }

 .sg-search {
     position: absolute;
     top: 60px;
     width: 600px;
     right: 0;
     left: 0;
     margin: auto;
     padding: 20px 25px;
     border-radius: 0 0 16px 16px;
     background: #fff;
     display: none;
     transition: .5s ease-out
 }

 .sg-search small {
     display: block;
     overflow: hidden;
     font-size: 14px;
     line-height: 21px;
     color: #888
 }

 .sg-search small.quicklink {
     padding-left: 65px;
     transition: .7s ease-out;
     opacity: .2
 }

 .sg-search.active small.quicklink {
     padding-left: 0;
     opacity: 1
 }

 .sg-search .text-search {
     display: block;
     overflow: hidden;
     border-bottom: 1px solid #dfdfdf;
     padding: 0 0 15px;
     margin: 0 0 15px
 }

 .sg-search .text-search span {
     display: block;
     overflow: hidden;
     font-size: 15px;
     line-height: 20px;
     color: #222;
     padding: 15px 0 0 65px;
     transition: .75s ease-out;
     opacity: .2
 }

 .sg-search .text-search a:nth-child(1) span {
     transition: .75s ease-out
 }

 .sg-search .text-search a:nth-child(2) span {
     transition: .8s ease-out
 }

 .sg-search .text-search a:nth-child(3) span {
     transition: .85s ease-out
 }

 .sg-search.active .text-search span {
     padding-left: 0;
     opacity: 1
 }

 .list-sg-search {
     display: block;
     overflow: hidden
 }

 .list-sg-search li {
     display: block;
     overflow: hidden;
     padding: 15px 0 0
 }

 .list-sg-search li a {
     display: block;
     overflow: hidden
 }

 .list-sg-search li a .img-search {
     float: left;
     width: 60px;
     margin: 0 17px 0 0
 }

 .list-sg-search li a img {
     display: block;
     width: 100%
 }

 .list-sg-search li a .text-img {
     display: block;
     overflow: hidden
 }

 .list-sg-search li a span {
     display: block;
     overflow: hidden;
     color: #222;
     font-size: 14px;
     line-height: 21px;
     padding: 0 0 4px
 }

 .list-sg-search li a p {
     display: block;
     overflow: hidden;
     color: #444;
     font-size: 15px;
     line-height: 20px
 }

 .list-sg-search li a b {
     font-size: 18px;
     line-height: 23px;
     color: #222
 }

 .list-sg-search li a strike {
     padding: 0 8px
 }

 .bg-popup {
     position: fixed;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     background: #000;
     opacity: .8;
     z-index: 1
 }

 @media screen and (max-width:1366px) {
     .owl-carousel .owl-nav {
         width: 96%;
         margin: auto;
         left: 0;
         right: 0
     }
 }

 @media screen and (max-width:1280px) {
     .owl-carousel .owl-nav {
         width: 80%;
         margin: auto;
         left: 0;
         right: 0
     }
 }

 @media screen and (max-width:1024px) {
     .slide-cate li a span {
         font-size: 16px
     }
 }

 .sg-search .text-search.history-txt {
     border: 0
 }

 .owl-carousel .owl-item .owl-lazy.lazyloaded {
     opacity: 1
 }

 .cart .number {
     background-color: #ff361d;
     border-radius: 50%;
     color: #fff;
     display: block;
     font-size: 10px;
     line-height: 14px;
     font-weight: 600;
     width: 14px;
     height: 14px;
     position: absolute;
     bottom: 6px;
     left: 7px;
     text-align: center
 }

 .cart:hover,
 .search-sp:hover {
     background: #5e5e60
 }

 .list-foot li a:hover {
     color: #2997ff
 }

 .list-sg-search li a p.item-txt-online {
     color: #757575;
     font-size: 14px;
     line-height: 16px;
     margin: 5px 0;
     text-align: left;
     margin-left: 77px
 }

 .list-sg-search li a p.item-txt-online.orange {
     color: #ff9f00
 }

 .certify {
     display: inline-block;
     float: right;
     padding: 10px 0 0 10px
 }

 .certify a {
     display: inline-block;
     margin-left: 22px;
     vertical-align: middle
 }

 .color-link {
     color: #2997ff !important
 }

 .survey-wrap {
     max-width: 480px;
     margin: 40px auto 0
 }

 .survey-system-question-form-AVAKids .crmsurvey-btnanswer-icon span {
     font-weight: normal
 }

 .topzone-logo.christmas {
     background: url(/images/christmas/desktop/logo_topzone.png) no-repeat;
     background-size: auto 100%;
     background-position: center;
     width: 150px;
     height: 43px
 }

 .topzone-autho.christmas {
     background: url(/images/newyear/desktop/Logo_Apple.png) no-repeat;
     background-size: auto 100%;
     background-position: center;
     width: 64px;
     height: 56px
 }

 .topzone-logo.newyear {
     background: url(/images/newyear/desktop/logo_topzone.png) no-repeat;
     background-size: auto 100%;
     background-position: right;
     width: 150px;
     height: 45px
 }

 .topzone-autho.newyear {
     background: url(/images/newyear/desktop/Logo_Apple.png) no-repeat;
     background-size: auto 50%;
     background-position: left;
     width: 80px;
     height: 45px
 }

 .footer-chris_left {
     position: absolute;
     left: 0;
     top: 0;
     z-index: 1;
     width: auto
 }

 .footer-chris_right {
     position: absolute;
     z-index: 1;
     bottom: 106px;
     right: 0
 }

 @media screen and (max-width:1366px) {
     .footer-chris_left {
         visibility: hidden;
         height: 150px;
         width: auto
     }

     .footer-chris_right {
         height: 200px;
         bottom: 155px
     }
 }

 @media screen and (max-width:1440px) {
     .footer-chris_left {
         height: 150px;
         width: auto
     }

     .footer-chris_right {
         height: 250px;
         bottom: 106px
     }
 }

 @media screen and (max-width:1680px) {
     .footer-chris_left {
         height: 280px;
         width: auto
     }

     .footer-chris_right {
         height: 310px;
         bottom: 106px
     }
 }

 @media screen and (max-width:2560px) {
     .footer-chris_left {
         height: 310px;
         width: auto
     }

     .footer-chris_right {
         height: 340px;
         bottom: 106px
     }
 }

 .footer-newyear_left {
     position: absolute;
     left: 0;
     bottom: 106px;
     z-index: 1;
     width: auto;
     height: 18vw;
     min-height: 250px
 }

 .footer-newyear_right {
     position: absolute;
     z-index: 1;
     bottom: 106px;
     right: 0;
     height: 18vw;
     min-height: 250px
 }

 @media only screen and (min-width:1440px) {
     .footer-newyear_left {
         height: 20vw;
         width: auto;
         bottom: 106px
     }

     .footer-newyear_right {
         height: 20vw;
         bottom: 106px
     }
 }

 @media only screen and (min-width:1680px) {
     .footer-newyear_left {
         height: 21vw;
         width: auto;
         bottom: 106px
     }

     .footer-newyear_right {
         height: 21vw;
         bottom: 106px
     }
 }

 @media only screen and (min-width:2560px) {
     .footer-newyear_left {
         height: 22vw;
         width: auto;
         bottom: 106px
     }

     .footer-newyear_right {
         height: 22vw;
         bottom: 106px
     }
 }

 .theme-national .topzone-logo {
     background-image: url("../../images/holiday29/logo-holiday-dt.png");
     background-repeat: no-repeat;
     background-size: 103px 35px;
     background-position: 0 0;
     height: 35px;
     width: 103px
 }

 /*  04:00:33 23/11/2023 */
 body {
     background: #3e3e3f
 }

 footer {
     clear: both
 }

 section {
     max-width: 1200px;
     width: 100%;
     min-width: 980px;
     position: relative;
     margin: auto
 }

 .toTop.show {
     display: block
 }

 .hight-light-area {
     display: block;
     width: 100%;
     height: 448px;
     border-radius: 24px;
     margin: 30px 0;
     overflow: hidden
 }

 .hight-light-area .newlist-hl li {
     float: left;
     width: 32.1%;
     position: relative
 }

 .hight-light-area .newlist-hl li.first-one {
     width: 65.6%;
     margin-right: 8px
 }

 .hight-light-area .newlist-hl li.first-one a .warpper-thumb-title {
     min-height: 447px
 }

 .hight-light-area .newlist-hl li:nth-child(2) a .warpper-thumb-title {
     border-radius: 0 20px 0 0
 }

 .hight-light-area .newlist-hl li:nth-child(3) a .warpper-thumb-title {
     border-radius: 0 0 20px 0
 }

 .hight-light-area .newlist-hl li a {
     display: block;
     cursor: pointer
 }

 .hight-light-area .newlist-hl li a .warpper-thumb-title {
     float: none;
     display: block;
     position: relative;
     width: 100%;
     height: auto;
     margin-bottom: 5px;
     overflow: hidden
 }

 .hight-light-area .newlist-hl li a .warpper-thumb-title img {
     width: 100%;
     height: auto;
     -webkit-transform: scale(1);
     transform: scale(1);
     -webkit-transition: all 500ms ease-in-out;
     -moz-transition: all 500ms ease-in-out;
     transition: all 500ms ease-in-out
 }

 .hight-light-area .newlist-hl li a .warpper-thumb-title:hover img {
     -webkit-transform: scale(1.3);
     transform: scale(1.3)
 }

 .hight-light-area .newlist-hl li a .warpper-thumb-title h3 {
     background: linear-gradient(180deg, rgba(0, 0, 0, 0) 2.68%, rgba(0, 0, 0, .72) 53.2%, rgba(0, 0, 0, .86) 69.35%, #000 86.01%);
     font-size: 18px;
     line-height: 23px;
     font-weight: 700;
     color: #fbfbfb;
     position: absolute;
     bottom: 0;
     padding: 25px
 }

 .hight-light-area .newlist-hl li.first-one a .warpper-thumb-title h3 {
     font-size: 30px;
     line-height: 39px
 }

 .newsest-area {
     display: block;
     width: 100%
 }

 .left-area {
     float: left;
     overflow: hidden;
     width: 63.334%;
     margin-right: 8px
 }

 .right-area {
     float: right;
     width: 32%;
     margin-top: 45px
 }

 .left-area .title-filter img {
     width: 121px;
     height: auto
 }

 .title-filter {
     position: relative;
     padding: 20px 10px
 }

 .title-filter:after {
     content: url(images/topnews/desktop/after-title.png);
     width: 4px;
     height: 20px;
     position: absolute;
     left: 0
 }

 .title-filter a {
     display: inline-block;
     color: #fff;
     font-weight: 300;
     font-size: 18px;
     line-height: 23px;
     padding: 0 10px;
     letter-spacing: .03em;
     text-transform: uppercase
 }

 .title-filter a.active {
     font-weight: 700
 }

 .warpper-newslist-newsest1,
 .warpper-newslist-newsest2,
 .newslist-newsest {
     display: block;
     overflow: hidden
 }

 .newslist li {
     display: block;
     overflow: hidden;
     border-bottom: 1px solid #4f4f4f;
     padding: 15px 0;
     position: relative
 }

 .newslist li:hover h3 {
     color: #2997ff
 }

 .warpper-newslist-newsest1 .newslist li:last-child,
 .warpper-newslist-newsest2 .newslist li:last-child {
     border: 0
 }

 .warpper-newslist-newsest2 {
     padding-bottom: 30px
 }

 .newslist li a {
     display: block;
     overflow: hidden;
     position: relative
 }

 .newslist li .tempvideo {
     float: left;
     position: relative;
     margin-right: 15px;
     margin-bottom: 5px;
     overflow: hidden
 }

 .newslist li .tempvideo img {
     display: block;
     width: 100%;
     height: 100%;
     border-radius: 8px;
     float: left;
     max-width: 318px
 }

 .newslist li h3 {
     line-height: 28px;
     font-size: 22px;
     color: #fbfbfb;
     font-weight: 400;
     display: -webkit-box;
     -webkit-line-clamp: 4;
     -webkit-box-orient: vertical;
     text-overflow: ellipsis;
     overflow: hidden
 }

 .newslist li .timepost {
     display: block;
     overflow: hidden;
     font-size: 12px;
     color: #999;
     margin-top: 10px
 }

 .video-area {
     display: block;
     max-width: 100%;
     height: auto;
     overflow: hidden;
     padding: 20px 0;
     margin: 40px 0;
     background: #101010;
     clear: both
 }

 .content-video {
     max-width: 1200px;
     width: 100%;
     min-width: 980px;
     position: relative;
     margin: auto
 }

 .content-video>img {
     margin-top: 10px
 }

 .viewmore-news {
     display: block;
     width: 370px;
     height: 60px;
     border-radius: 12px;
     background-color: #323232;
     color: #fff;
     text-align: center;
     font-size: 15px;
     line-height: 60px;
     margin: 20px auto
 }

 .viewmore-news:hover {
     border: 2px solid #666
 }

 .viewmore-news:after {
     content: '';
     width: 6px;
     height: 6px;
     border-right: 2px solid #fff;
     border-bottom: 2px solid #fff;
     transform: rotate(45deg);
     display: inline-block;
     vertical-align: middle;
     margin: 0 0 4px 8px
 }

 .list-cate {
     display: flex;
     width: 100%;
     margin: 5px 0 40px 0
 }

 .list-cate li {
     width: 13.2%;
     height: 60px;
     background: #323232;
     box-sizing: border-box;
     border-radius: 12px;
     margin-right: 15px;
     padding: 8px 21px
 }

 .list-cate li.active {
     background: #101010;
     border: 1px solid #101010;
     box-sizing: border-box;
     box-shadow: 4px 4px 8px rgba(35, 35, 35, .77), -3px -3px 8px rgba(157, 157, 157, .22)
 }

 .list-cate li:hover {
     box-shadow: 4px 4px 8px rgba(35, 35, 35, .77), -3px -3px 8px rgba(157, 157, 157, .22);
     box-sizing: border-box
 }

 .list-cate li:last-child {
     margin-right: 0
 }

 .list-cate li a {
     display: block;
     width: 100%;
     height: 100%
 }

 .list-cate li a img {
     float: left;
     width: 48px;
     height: 48px;
     margin-top: -3px
 }

 .list-cate li.cate-ipad a img {
     margin-top: 0
 }

 .list-cate li a h3 {
     float: right;
     font-size: 14px;
     line-height: 45px;
     color: #fff;
     margin-right: 5px
 }

 .application {
     display: flex;
     margin: 30px 0
 }

 .application .col1__ct {
     display: flex
 }

 .application a {
     color: #fbfbfb
 }

 .application .col1-big {
     width: 60%
 }

 .application .col1-big-img {
     position: relative;
     height: 405px;
     width: 720px
 }

 .application img {
     border-radius: 16px;
     width: 100%;
     height: auto
 }

 .application .ytbclick {
     background-image: url(images/topnews/desktop/fi_play-circle.png);
     background-repeat: no-repeat;
     display: inline-block;
     height: 90px;
     width: 90px;
     line-height: 40px;
     vertical-align: middle;
     background-size: 100% 100%;
     left: 50%;
     position: absolute;
     top: 50%;
     transform: translate(-50%, -50%)
 }

 .application .ytbclick.icon-ytb-simple {
     height: 33px;
     width: 33px
 }

 .application .col1-title {
     font-size: 22px;
     line-height: 31px;
     margin-top: 10px;
     overflow: hidden;
     -webkit-line-clamp: 3;
     text-overflow: ellipsis;
     display: -webkit-box;
     -webkit-box-orient: vertical
 }

 .application .col1-simple {
     margin-left: 20px;
     width: calc(38% - 9px)
 }

 .application .spl-item {
     align-items: normal;
     min-height: 90px;
     display: flex;
     margin-bottom: 10px;
     border-bottom: 1px solid #2a2a2a;
     margin-top: 22px
 }

 .application .spl-item:first-child {
     margin-top: 0
 }

 .application .spl-item:last-child {
     border: 0
 }

 .application .spl-item__img {
     position: relative;
     width: 121px;
     height: 68px
 }

 .application .spl-item__img img {
     border-radius: 8px
 }

 .application .spl-item__content {
     padding-left: 10px;
     width: calc(100% - 120px)
 }

 .application .spl-item-title {
     font-size: 16px;
     line-height: 22px;
     overflow: hidden;
     -webkit-line-clamp: 3;
     text-overflow: ellipsis;
     display: -webkit-box;
     -webkit-box-orient: vertical;
     margin-bottom: 4px
 }

 .divide-footer {
     margin-bottom: 50px
 }