@charset "UTF-8";
body { font-size: 13px; color: #333; font-family: 'Montserrat', sans-serif; line-height: 1.4em; width: 100%; background: #FFF; }
img { max-width: 100%; height: auto; vertical-align: top; }
* { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; outline: none; margin: 0; }

/* box-flex */
.box-flex-end { display: flex; flex-wrap: wrap; justify-content: flex-end; }
.box-flex-center { display: flex; flex-wrap: wrap; justify-content: center; }
.box-flex-star { display: flex; flex-wrap: wrap; justify-content: flex-start; }
.box-flex { display: flex; flex-wrap: wrap; justify-content: space-between; }
.flex-end { align-items: flex-end; }
.flex-star { align-items: flex-start; }
.flex-center { align-items: center; }

/* hover */
.hvr-rotate-y img { transition: 0.9s !important; transform: rotateY(0deg); }
.hvr-rotate-y:hover img { transition: 0.9s !important; transform: rotateY(180deg); }

/* Scale IMG */
.scale-img { overflow: hidden; display: block; }
.scale-img img { -webkit-transition: 0.3s ease-out; -moz-transition: 0.3s ease-out; -o-transition: 0.3s ease-out; transition: 0.3s ease-out; -moz-transform: scale(1, 1); -webkit-transform: scale(1, 1); -o-transform: scale(1, 1); -ms-transform: scale(1, 1); transform: scale(1, 1); }
.scale-img:hover > img { -webkit-transition: 0.3s ease-out; -moz-transition: 0.3s ease-out; -o-transition: 0.3s ease-out; transition: 0.3s ease-out; -moz-transform: scale(1.1, 1.1); -webkit-transform: scale(1.1, 1.1); -o-transform: scale(1.1, 1.1); -ms-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1); }

/* Text Hide */
.text-split { overflow: hidden; text-overflow: ellipsis; white-space: normal; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 3; margin-bottom: 0; }

/* social-header */
.info-header { background: #f2f2f2; font-size: 14px; color: #555555; padding: 7px 0; }
.social-header { display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; }
.social-header p { margin-right: 50px; }

/* banner-header */
.banner-header { position: relative; padding: 5px 0px; }
.hotline { position: relative; border: 2px solid #454545; border-radius: 50px; padding: 4px 20px; padding-left: 55px; }
.hotline:after { position: absolute; content: ''; background: url(images/hotline.png) no-repeat; width: 50px; height: 60px; left: 0; top: 0; }
.hotline p:nth-child(1) { font-size: 12px; font-weight: 400; background: #454545; color: #fff; padding: 1px 10px 1px 35px; border-radius: 50px; text-align: right; display: table; margin-left: -30px; }
.hotline p:nth-child(2) { font-size: 18px; font-weight: 700; color: #de1820; margin-top: 4px; }

/* timkiem */
#timkiem { position: relative; width: 420px; max-width: 80%; }
.frm_timkiem { position: relative; width: 100%; }
.frm_timkiem input { color: #9b9b9b; background: #fff; padding: 0 20px; width: 100%; outline: none; border: 1px solid #f2f2f2; border-radius: 50px; font-weight: 100; font-size: 14px; z-index: 5; height: 40px; font-style: italic; }
.frm_timkiem input.show { width: 250px; opacity: 1; }
.frm_timkiem button { cursor: pointer; outline: none; border: none; padding: 0 10px; position: absolute; top: 0; right: 0; height: 40px; line-height: 40px; background: #454545; color: #fff; font-size: 14px; text-transform: uppercase; border-radius: 0px 50px 50px 0px; padding-right: 20px; }
.frm_timkiem button i { margin-right: 5px; }
.frm_timkiem input::-webkit-input-placeholder { color: #9b9b9b; font-weight: 100; }
.frm_timkiem input:-moz-placeholder { color: #9b9b9b; font-weight: 100; }
.frm_timkiem input::-moz-placeholder { color: #9b9b9b; font-weight: 100; }
.frm_timkiem input:-ms-input-placeholder { color: #9b9b9b; font-weight: 100; }

/* box-product-list */
.box-product-list { position: relative; padding: 10px 0px; }
.box-product-list .container { max-width: 1350px; }
.slick-product-list { display: none; margin: 0px -5px; }
.slick-product-list .slick-slide { margin: 0px 5px; }

/* title-h2 */
.title-h2 { position: relative; text-align: center; line-height: 50px; display: flex; justify-content: center; align-items: center; margin-bottom: 40px; overflow: hidden; }
.title-h2:before, .title-h2:after { position: relative; content: ''; background: url(images/title.png) no-repeat right; flex: auto; height: 11px; }
.title-h2:after { transform: scaleX(-1); }
.title-h2 h2 { font-size: 38px; color: #1b1b1b; font-weight: normal; font-family: 'DFVN-Salute-Regular'; line-height: inherit; display: block; padding: 0 30px; text-transform: uppercase; }

/* tab-type */
.tab-type { list-style: none; margin: 0; text-align: center; padding: 0; margin-bottom: 30px; }
.tab-type li { display: inline-block; font-size: 16px; color: #2d2d2d; border: 1px solid #f2f2f2; border-radius: 50px; padding: 15px 39px; cursor: pointer; background: transparent; }
.tab-type li.active, .tab-type li:hover { background: #454545; color: #fff; transition: 0.3s all; }

/* Paging ajax */
.text-center{text-align:center;}
.pagination{display:inline-block;}
.pages_ajax  li.active, .pages_ajax  li.inactive:hover {/* cursor: default; */ }
.pages_ajax { text-align: center; width: 100%; margin: 15px 0 0 0; display: block; }
.pages_ajax  { display: inline-block; list-style: none; padding: 0; }
.pages_ajax  li.inactive { cursor: default; }
.data  li { list-style: none; font: normal 13px verdana; }
.pages_ajax  li { list-style: none; float: left; border-radius: 2px; margin: 10px 3px; font: bold 10px arial; color: #fff; background: #999; width: 30px; height: 30px; line-height: 30px; font-size: 15px; font-weight: 400; cursor: pointer; }
.pages_ajax  li a { text-decoration: none; cursor: pointer; }
.pages_ajax  li:hover, .pages_ajax  li.actived { color: #ffffff; background: #333; }
.pages_ajax  li:hover a, .pages_ajax  li.actived a { color: #ffffff; }
.go_button { background-color: #DB2E66; border: 1px solid #fff; color: #cc0000; padding: 2px 6px; cursor: pointer; position: absolute; margin-top: -1px; }
.total { float: right; font-family: arial; color: #999; display: none }

/* box-product */
.box-product { position: relative; padding: 40px 0px; }
.grid-product { display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 20px; }
.item-product:hover h3 a { color: #de1820; }
.item-product .content { position: relative; text-align: center; padding: 10px; }
.item-product .desc-product { max-height: 38px; overflow: hidden; }
.item-product:hover .desc-product { overflow: auto; }
.item-product .desc-product::-webkit-scrollbar-track { background-color: #F5F5F5; }
.item-product .desc-product::-webkit-scrollbar { width: 5px; background-color: #F5F5F5; }
.item-product .desc-product::-webkit-scrollbar-thumb { background-color: #000000; }
.item-product h3 a { font-size: 14px; color: #1c1c1c; font-weight: 400; text-transform: uppercase; line-height: 25px; }
.price-product { position: relative; margin-top: 10px; font-family: 'DFVN-Salute-Regular'; }
.price-product .price { font-size: 16px; color: #de1820; font-weight: normal; display: inline-block; }
.price-product .price-old { display: inline-block; font-size: 13px; color: #acacac; margin-left: 10px; text-decoration: line-through; }

/* box-tieuchi */
.box-tieuchi { position: relative; padding: 40px 0; background: url(images/bg-ql.jpg) repeat; }
.slick-tieuchi { display: none; margin: 0px -20px; }
.slick-tieuchi .slick-slide { margin: 0px 20px; }
.item-tieuchi { background: #fff; position: relative; border: 1px solid #ebebeb; padding: 25px; overflow: hidden; border-radius: 80px 80px 80px 0px; }
.item-tieuchi > a { display: table; margin-left: auto; margin-bottom: 10px; }
.item-tieuchi h3 { position: relative; margin-bottom: 10px; padding-bottom: 10px; }
.item-tieuchi h3:after { position: absolute; content: ''; background: #ebebeb; width: 35px; height: 2px; bottom: 0; left: 0; }
.item-tieuchi h3 a { font-size: 16px; font-family: 'DFVN-Salute-Regular'; text-transform: uppercase; color: #242424; line-height: 25px; -webkit-line-clamp: 2; }
.item-tieuchi p { font-size: 14px; line-height: 25px; color: #696969; }
.item-tieuchi .readnews { display: inline-block; background: #454545; font-size: 13px; color: #fff; padding: 11px 38px; border-radius: 50px; margin-top: 15px; }
.item-tieuchi .readnews:hover { background: #0b0b0b; }

/* box-video */
.box-video { position: relative; padding: 40px 0; }
.slick-video { margin: 0px -15px; display: none; }
.slick-video .slick-slide { margin: 0px 15px; }
.item-video h3 { font-size: 14px; color: #191919; position: relative; margin-top: 20px; }
.item-video a.scale-img { position: relative; }
.item-video a.scale-img img { width: 100%; }
.item-video a.scale-img:after { background: url(images/vi.png) no-repeat; position: absolute; content: ''; width: 54px; height: 54px; top: 50%; left: 50%; transform: translate(-50%, -50%); }

/* slick-banner */
.slick-banner { display: none; }
.slick-banner img { width: 100%; }

/* slick-feedback */
.box-feedback { position: relative; padding: 40px 0px; background: url(images/bg-feedback.jpg) no-repeat; background-size: cover; }
.slick-feedback { margin: 0px -20px; display: none; }
.slick-feedback .slick-slide { margin: 30px 30px; }
.box-title-feedback { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; margin-top: -100px; position: relative; margin-left: -20px; z-index: 2; }
.box-title-feedback a.scale-img { border-radius: 50%; display: table; }
.box-title-feedback .title { width: calc(100% - 120px); }
.box-title-feedback h3 { font-size: 14px; font-weight: 700; -webkit-line-clamp: 1; color: #1b1b1b; text-transform: uppercase; line-height: 25px; }
.box-title-feedback p { font-size: 13px; color: #949494; font-weight: 400; -webkit-line-clamp: 1; }
.item-feedback { position: relative; margin: 0px auto; padding: 0; }
.circle-feedback { margin: 0px auto; position: relative; width: 325px; height: 325px; text-align: left; color: #ffff; display: flex; align-items: flex-start; justify-content: center; }
.article-feedback { text-align: center; color: #333333; padding: 50px 40px; text-align: center; }
.circle-feedback i { margin-bottom: 20px; font-size: 41px; color: #9b9b9b; }
.circle-feedback p { font-size: 14px; font-weight: 400; -webkit-line-clamp: 5; line-height: 25px; width: 100%; }
.circle-feedback .circle { border: 2px solid #e1e1e1; position: absolute; width: 100%; height: 100%; -webkit-transition: all .5s ease; transition: all .5s ease; border-radius: 72% 92% 100% 78%; }
.circle-feedback h3 { color: #000000; font-size: 15px; font-weight: 700; text-align: left; -webkit-line-clamp: 2; padding-left: 50px; line-height: 20px; height: 40px; }
.circle-feedback .circle:nth-child(1) { -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-animation: spin1 6s linear infinite; animation: spin1 6s linear infinite; }
.circle-feedback .circle:nth-child(2) { -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-animation: spin2 6s linear infinite; animation: spin2 6s linear infinite; }
.circle-feedback .circle:nth-child(3) { -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-animation: spin3 6s linear infinite; animation: spin3 6s linear infinite; }
.circle-feedback .circle:nth-child(4) { -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-animation: spin4 6s linear infinite; animation: spin4 6s linear infinite; }
@-webkit-keyframes spin1 {
  0% { -webkit-transform: rotate(0); transform: rotate(0); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
@keyframes spin1 {
  0% { -webkit-transform: rotate(0); transform: rotate(0); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
@-webkit-keyframes spin2 {
  0% { -webkit-transform: rotate(72deg); transform: rotate(72deg); }
  100% { -webkit-transform: rotate(-288deg); transform: rotate(-288deg); }
}
@keyframes spin2 {
  0% { -webkit-transform: rotate(72deg); transform: rotate(72deg); }
  100% { -webkit-transform: rotate(-288deg); transform: rotate(-288deg); }
}
@-webkit-keyframes spin3 {
  0% { -webkit-transform: rotate(-144deg); transform: rotate(-144deg); }
  100% { -webkit-transform: rotate(216deg); transform: rotate(216deg); }
}
@keyframes spin3 {
  0% { -webkit-transform: rotate(-144deg); transform: rotate(-144deg); }
  100% { -webkit-transform: rotate(216deg); transform: rotate(216deg); }
}
@-webkit-keyframes spin4 {
  0% { -webkit-transform: rotate(216deg); transform: rotate(216deg); }
  100% { -webkit-transform: rotate(-144deg); transform: rotate(-144deg); }
}
@keyframes spin4 {
  0% { -webkit-transform: rotate(216deg); transform: rotate(216deg); }
  100% { -webkit-transform: rotate(-144deg); transform: rotate(-144deg); }
}

/* box-news */
.box-news { position: relative; padding: 40px 0px; }
.news-left { position: relative; border-radius: 200px 200px 0px 0px; overflow: hidden; width: 39%; }
.news-left h3 { position: absolute; left: 0; right: 0; bottom: 0; color: #fff; text-transform: uppercase; background: rgb(255, 255, 255); background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0.4374124649859944) 75%, rgba(0, 0, 0, 0.44021358543417366) 100%); padding: 30px; font-size: 26px; font-weight: 700; line-height: 35px; padding-bottom: 10px; }
.news-right { width: 58%; display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 30px; }
.item-news a.scale-img { border-radius: 0px 30px 0px 30px; }
.item-news a.scale-img img { width: 100%; }
.item-news .content { position: relative; margin-top: 10px; }
.item-news h3 a { font-size: 17px; color: #2d2d2d; -webkit-line-clamp: 2; line-height: 25px; height: 50px; }
.item-news p { font-size: 14px; color: #999; margin-top: 10px; }
.item-news:hover h3 a { color: #de1820; }

/* title-footer */
.title-footer { margin-bottom: 20px; font-size: 30px; line-height: 40px; color: #0d0d0d; }
.title-footer-2 { font-size: 15px; font-weight: 500; color: #0e0e0e; margin-bottom: 15px; line-height: initial; }

/* box-newsletter */
.box-newsletter { position: relative; margin-top: 25px; }
.box-newsletter #nhanemail { position: relative; }
.box-newsletter .bgmail { width: 100%; height: 46px; border-radius: 50px; background: #fff; padding: 20px; font-size: 13px; color: #8f8f8f; font-weight: 400; border: 1px solid #898989; }
.box-newsletter .btn1 { position: absolute; border: 0; height: 44px; top: 50%; transform: translateY(-50%); right: 0; background: #454545; color: #fff; border-radius: 0px 50px 50px 0px; font-size: 14px; font-weight: 700; text-transform: uppercase; width: 65px; cursor: pointer; }

/* footer-powered */
.footer-powered { background: #212121; color: #fff; font-size: 14px; font-weight: 400; padding: 15px 0; }
.footer-statistic { flex-wrap: wrap; display: flex; justify-content: space-between; align-items: center; }
.footer-statistic p { border-left: 1px solid #fff; line-height: 1; padding: 0 20px; }
.footer-statistic p:first-child { border: 0; padding-left: 0; }

/* hien_sp */
#hien_sp { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; }
@media screen and (max-width:1220px) {
  section#show_product_index { display: block; }
  div#tt-nav ul li h2 a { padding: 16px 20px; }
}
@media screen and (max-width:1068px) {
  div#tt-nav ul li h2 a { padding: 16px 15px; }
}
@media screen and (max-width:940px) {
  div#tt-nav ul li h2 a { padding: 16px 5px; }
}
@media screen and (max-width:900px) {
  div.box_an { display: none; }
  div.box_hien { display: block; }
  div#tt-nav { display: none; }
  div#tt-menu-mobile { display: block; margin: 0; }
  .container { padding: 0px 5px; max-width: unset; width: 100%; }
  .banner-header #timkiem, .banner-header .hotline { display: none; }
  .banner-header .container { justify-content: center; }
  .slick-video, .slick-product-list, .slick-tieuchi, .slick-feedback { margin: 0; }
  .box-title-feedback { margin-left: 0; }
  .box-feedback { overflow: hidden; }
  section#tt-content { padding: 0px 20px; }
}
@media screen and (max-width:880px) {
  div.tt-banner-top { display: none; }
}
@media screen and (max-width:768px) {
  .support_bt { display: block; }
  .footer-powered { margin-bottom: 40px; }
  .footer-powered .container { justify-content: center; }
  div.item_ft1 { width: 100%; }
  div.item_ft3, div.item_ft4 { width: 100%; margin-top: 30px; }
  .news-left { display: none; }
  .news-right { width: 100%; grid-gap: 10px; }
  .slick-video .slick-slide, .slick-tieuchi .slick-slide { margin: 0px 5px; }
  .grid-product { grid-gap: 10px;    grid-template-columns: repeat(2, 1fr); }
  div.tt-contact-left, div.tt-contact-right { width: 100%; }
  div.tt-ig-item2 { width: 33%; }
}
@media screen and (max-width:600px) {
  .grid-product { grid-template-columns: repeat(3, 1fr); }
  .info-header p { width: 100%; text-align: center; }
  .social-header { width: 100%; justify-content: center; display: none; }
  .tab-type li { margin: 0 0 10px 10px; }
  div.item_news_s { width: 100%; border-width: 5px; }
  div.tt-detail-right, div.tt-detail-left { width: 100%; border-width: 5px; }
}
@media screen and (max-width:480px) {
  .title-h2 h2, .title-footer { font-size: 25px; }
  .grid-product { grid-template-columns: repeat(2, 1fr); }
  .footer-statistic { justify-content: center; }
  footer#tt-footer p { margin: 2px; }
  div.tt-ig-item2 { width: 50%; border-width: 5px }
}
@media screen and (max-width:350px) {
  div.tt-product-item { width: 100%; }
  div.img_news_s { width: 100%; }
  div.img_news_s img { max-height: 100% !important; height: auto !important; }
  div.img_news_desc { width: 100%; }
  div.item_ft1 { width: 100%; }
  div.item_ft2 { width: 100%; box-sizing: border-box; border-left: 10px solid transparent; border-right: 10px solid transparent; margin-top: 20px; }
  div.tt-ig-item2 { width: 100%; }
  .grid-product { grid-template-columns: repeat(1, 1fr); }
  div.tt-ig-item2 { width: 100%; }
}