.homeBanner {
  width   : 100%;
  height  : 100vh;
  position: relative;
  overflow: hidden;
}

.homeBanner .--txt {
  position : absolute;
  top      : 0;
  left     : 0;
  width    : 100%;
  top      : 50%;
  transform: translate(0, -50%);
  z-index  : 1;
  color    : #fff;
}

.homeBanner .--txt .--title {
  font-size  : 100px;
  font-weight: 700;
  line-height: 120px;
}

.homeBanner .--txt .--note {
  opacity      : 0.8;
  margin-bottom: 44px;
  font-weight  : 500;
  font-size    : 24px;
}

.homeBanner .--listVideoImg {
  height: 100%;
}

.homeBanner .--listVideoImg .item {
  position: relative;
}

.homeBanner .--listVideoImg .item::after {
  content   : "";
  background: linear-gradient(180deg, rgba(32, 41, 58, 0.5) 0%, rgba(32, 41, 58, 0) 19.42%), linear-gradient(90deg, rgba(32, 41, 58, 0.3) 0%, rgba(32, 41, 58, 0) 100%);
  position  : absolute;
  top       : 0;
  left      : 0;
  width     : 100%;
  height    : 100%;
}

.homeBanner .--listVideoImg img {
  width             : 100%;
  height            : 100vh;
  -o-object-fit     : cover;
  object-fit        : cover;
  -o-object-position: bottom;
  object-position   : bottom;
}

.homeBanner .--listVideoImg video {
  width        : 100%;
  height       : 100%;
  -o-object-fit: cover;
  object-fit   : cover;
}

.homeBanner .--dots {
  position: absolute;
  left    : 0;
  bottom  : 30px;
  width   : 100%;
}

.homeBanner .slick-dots {
  display: flex;
  gap    : 4px;
  bottom : 30px;
}

.homeBanner .slick-dots li {
  border-radius: 4px 0px;
  background   : rgba(255, 255, 255, 0.16);
  width        : 40px;
  height       : 4px;
}

.homeBanner .slick-dots li.slick-active {
  background: #fff;
}

@media (max-width: 769px) {
  .homeBanner {
    height: auto;
  }

  .homeBanner .slick-dots {
    justify-content: center;
  }

  .homeBanner .--txt {
    text-align: center;
    bottom    : 64px;
    top       : unset;
    transform : none;
  }

  .homeBanner .--txt .--title {
    font-size  : 40px;
    line-height: 48px;
  }

  .homeBanner .--txt .--note {
    margin-bottom: 20px;
  }

  .homeBanner .--txt .btn-1 {
    width : -moz-max-content;
    width : max-content;
    margin: 0 auto;
  }

  .homeBanner .--animation {
    display: none;
  }

  .homeBanner .--listVideoImg .item::after {
    background: linear-gradient(180deg, rgba(32, 41, 58, 0.8) 0%, rgba(32, 41, 58, 0.55) 12.57%, rgba(32, 41, 58, 0) 23.87%), linear-gradient(0deg, rgba(32, 41, 58, 0.9) 0%, rgba(32, 41, 58, 0.57) 25.28%, rgba(32, 41, 58, 0) 44.7%);
  }

  .homeBanner .--listVideoImg .item img {
    height: auto;
  }

  .homeBanner .--listVideoImg .item video {
    min-height: 600px;
  }
}

.homeInfo {
  padding: 80px 0;
}

.homeInfo .segTitle {
  text-align   : center;
  line-height  : 1;
  margin-bottom: 12px;
}

.homeInfo button.active .segTitle {
  color: var(--color-1);
}

.homeInfo button .segTitle {
  color: #000;
}

.homeInfo .nav-tabs {
  justify-content: center;
  border-bottom  : none;
  gap            : 60px;
  margin-bottom  : 24px;
}

.homeInfo .nav-tabs button {
  border     : none;
  display    : flex;
  gap        : 6px;
  font-size  : 18px;
  font-weight: 600;
  align-items: center;
  padding    : 10px 0;
}

.homeInfo .nav-tabs button span {
  color: #6f7378;
}

.homeInfo .nav-tabs button.active {
  background-color: transparent;
}

.homeInfo .nav-tabs button.active span {
  color: var(--color-1);
}

.homeInfo .nav-tabs button.active img {
  display: block;
}

.homeInfo .nav-tabs button img {
  display: none;
}

.homeInfo .--slider {
  position     : relative;
  margin-bottom: 1rem;
}

.homeInfo .--slider .container-fluid {
  height         : 100%;
  display        : flex;
  align-items    : center;
  justify-content: space-between;
  pointer-events : none;
}

.homeInfo .--slider .arrow {
  position      : absolute;
  z-index       : 1;
  top           : 0;
  left          : 0;
  width         : 100%;
  height        : 100%;
  pointer-events: none;
}

.homeInfo .--slider .arrow .--arrow {
  background     : #fff;
  box-shadow     : 0px 4px 20px 0px rgba(0, 0, 0, 0.08);
  width          : 62px;
  height         : 62px;
  display        : flex;
  align-items    : center;
  justify-content: center;
  border-radius  : 50%;
  cursor         : pointer;
  pointer-events : auto;
  font-size      : 18px;
}

.homeInfo .itemCar {
  margin: 0 60px;
  width : 610px;
}

.homeInfo .itemCar.slick-current img {
  width        : 610px;
  transition   : width 0.3s ease;
  opacity      : 1;
  -o-object-fit: contain;
  object-fit   : contain;
}

.homeInfo .itemCar.slick-current .--infoCar {
  opacity: 1;
}

.homeInfo .itemCar.slick-current .--numberPrice {
  opacity: 1;
}

.homeInfo .itemCar .--numberPrice {
  font-weight: bold;
  font-size  : 28px;
  color      : var(--color-1);
  text-align : center;
  opacity    : 0;
  transition : all 0.3s ease;
}

.homeInfo .itemCar .--infoCar {
  display        : flex;
  justify-content: space-around;
  align-items    : center;
  opacity        : 0;
}

.homeInfo .itemCar .--name {
  font-weight   : bold;
  font-size     : 21px;
  text-transform: uppercase;
  color         : var(--color-1);
}

.homeInfo .itemCar .--price {
  font-weight: bold;
  font-size  : 21px;
  color      : var(--color-1);
}

.homeInfo .itemCar img {
  width     : 530px;
  height    : auto;
  max-height: 430px;
  transition: width 0.3s ease;
  opacity   : 0.5;
}

.homeInfo .--listText {
  margin-top: 20px;
}

.homeInfo .itemText .cardNote {
  margin-bottom: 20px;
}

.homeInfo .itemText .--name {
  font-weight: 600;
  font-size  : 24px;
}

.homeInfo .itemText .--title {
  margin-bottom: 32px;
}

.homeInfo .itemText .--content {
  display              : grid;
  grid-gap             : 100px;
  grid-template-columns: calc(35% - 66.6666666667px) calc(35% - 66.6666666667px) calc(30% - 66.6666666667px);
}

.homeInfo .itemText .--content .--item {
  position: relative;
}

.homeInfo .itemText .--content .--item::after {
  content    : "";
  position   : absolute;
  top        : 0;
  left       : calc(100% + 50px);
  border-left: 1px solid rgba(0, 0, 0, 0.36);
  opacity    : 0.16;
  height     : 100%;
}

.homeInfo .itemText .--content .--item:last-child::after {
  display: none;
}

.homeInfo .itemText .--content .--item .btn {
  margin-bottom: 12px;
}

@media (max-width: 769px) {
  .homeInfo {
    padding: 60px 0;
  }

  .homeInfo .segTitle {
    margin-bottom: 20px;
  }

  .homeInfo .itemCar {
    width      : 210px;
    margin     : 0 10px;
    display    : flex;
    align-items: center;
    flex-flow  : column;
  }

  .homeInfo .itemCar.slick-current img {
    width: 100%;
  }

  .homeInfo .itemCar .--infoCar {
    flex-flow      : column;
    align-items    : center;
    text-align     : center;
    justify-content: center;
  }

  .homeInfo .itemCar .--infoCar .--name,
  .homeInfo .itemCar .--infoCar .--price {
    font-size: 12px;
  }

  .homeInfo .itemCar .--infoCar .--name span,
  .homeInfo .itemCar .--infoCar .--price span {
    font-size: 14px;
  }

  .homeInfo .itemCar img {
    width     : 180px;
    max-height: 100%;
  }

  .homeInfo .nav-tabs {
    gap          : 20px;
    margin-bottom: 20px;
  }

  .homeInfo .--slider .arrow .--arrow {
    width    : 26px;
    height   : 26px;
    font-size: 14px;
  }

  .homeInfo .itemText .cardNote {
    margin-bottom: 12px;
  }

  .homeInfo .itemText .--title {
    margin-bottom: 16px;
  }

  .homeInfo .itemText .--name {
    font-size: 20px;
  }

  .homeInfo .itemText .--content {
    flex-flow: column;
    display  : flex;
    grid-gap : 0;
  }

  .homeInfo .itemText .--content .--item {
    padding-bottom: 16px;
    margin-bottom : 16px;
    border-bottom : 1px solid rgba(0, 0, 0, 0.36);
  }

  .homeInfo .itemText .--content .--item::after {
    display: none;
  }

  .homeInfo .itemText .--content .--item:last-child {
    padding-bottom: 0;
    margin-bottom : 0;
    border-bottom : none;
  }
}

.homeBlock .--listBlock {
  position: relative;
}

.homeBlock .--item {
  position: relative;
}

.homeBlock .subTitle {
  position : absolute;
  bottom   : 72px;
  left     : 50%;
  transform: translate(-50%, 0);
  color    : #fff;
  max-width: 80%;
}

.homeBlock .slick-dots {
  position : absolute;
  bottom   : 44px;
  left     : 50%;
  transform: translate(-50%, 0);
  z-index  : 1;
  display  : flex;
  gap      : 4px;
}

.homeBlock .slick-dots li {
  border-radius: 4px 0px;
  background   : rgba(255, 255, 255, 0.16);
  width        : 40px;
  height       : 4px;
}

.homeBlock .slick-dots li.slick-active {
  background: var(--color-1);
}

.homeBlock .--img {
  position: relative;
  width   : 100%;
}

.homeBlock .--img::after {
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.08) 0%, rgba(0, 0, 0, 0.08) 100%), linear-gradient(0deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 27.63%);
  content   : "";
  position  : absolute;
  top       : 0;
  left      : 0;
  width     : 100%;
  height    : 100%;
}

.homeBlock .--img img {
  width : 100%;
  height: auto;
}

@media (max-width: 769px) {
  .homeBlock .--img {
    height: 390px;
  }

  .homeBlock .--img img {
    height       : 100%;
    -o-object-fit: cover;
    object-fit   : cover;
  }

  .homeBlock .slick-dots {
    bottom: 24px;
  }

  .homeBlock .subTitle {
    font-size  : 24px;
    text-align : center;
    bottom     : 52px;
    line-height: 28px;
    width      : 100%;
  }
}

.homeAbout {
  position: relative;
}

.homeAbout::after {
  content       : "";
  position      : absolute;
  top           : 0;
  left          : 0;
  height        : 100%;
  background    : linear-gradient(90deg, rgba(0, 0, 0, 0.84) 3.66%, rgba(0, 0, 0, 0.51) 39.06%, rgba(0, 0, 0, 0) 83.08%);
  pointer-events: none;
  width         : 80%;
}

.homeAbout .--img {
  position: absolute;
  width   : 100%;
  height  : 100%;
}

.homeAbout .--img img {
  width             : 100%;
  height            : 100%;
  -o-object-fit     : cover;
  object-fit        : cover;
  -o-object-position: bottom;
  object-position   : bottom;
}

.homeAbout .--txt {
  padding   : 80px calc((100vw - 1270px) / 2);
  width     : -moz-max-content;
  width     : max-content;
  color     : #fff;
  position  : relative;
  z-index   : 1;
  text-align: justify;
}

.homeAbout .--txt .segTitle {
  margin-bottom: 44px;
}

.homeAbout .--txt .--content {
  width: 500px;
}

.homeAbout .--txt .btn {
  width: -moz-max-content;
  width: max-content;
}

.homeAbout .--txt article {
  margin-bottom: 52px;
  font-size    : 16px;
}

@media (max-width: 1439px) {
  .homeAbout .--txt {
    padding: 100px 85px;
  }
}

@media (max-width: 769px) {
  .homeAbout {
    display  : flex;
    flex-flow: column-reverse;
  }

  .homeAbout::after {
    display: none;
  }

  .homeAbout .--txt {
    padding: 60px 20px;
    width  : 100%;
    color  : var(--color-2);
  }

  .homeAbout .--txt .--content {
    width: 100%;
  }

  .homeAbout .--txt .segTitle {
    margin-bottom: 20px;
  }

  .homeAbout .--txt article {
    margin-bottom: 32px;
  }

  .homeAbout .--img {
    position: relative;
  }
}

.homeValue {
  position   : relative;
  height     : 100vh;
  padding-top: 44px;
  color      : #fff;
  overflow   : hidden;
}

.homeValue .--listValue {
  display: flex;
  gap    : 36px;
}

.homeValue .--background {
  position: absolute;
  top     : 0;
  left    : 0;
  width   : 100%;
  height  : 100%;
}

.homeValue .--background img {
  width        : 100%;
  height       : 100%;
  -o-object-fit: cover;
  object-fit   : cover;
}

.homeValue .subTitle {
  cursor       : pointer;
  margin-bottom: 24px;
  opacity      : 0.5;
  font-size    : 28px;
  line-height  : 32px;
}

.homeValue .--item {
  flex: 1;
}

.homeValue .--item.active .--img {
  z-index  : 1;
  transform: none;
}

.homeValue .--item.active .subTitle {
  opacity: 1;
}

.homeValue .--item.active article {
  opacity       : 1;
  pointer-events: auto;
  transform     : translate(0, 0);
}

.homeValue .--item.active .--txt::before {
  opacity: 1;
}

.homeValue .--img {
  position  : absolute;
  top       : 0;
  left      : 0;
  width     : 100%;
  height    : 100vh;
  transform : translate(80vw, 0);
  transition: all 1s ease;
}

.homeValue .--img::after {
  content   : "";
  position  : absolute;
  top       : 0;
  left      : 0;
  width     : 100%;
  height    : 100%;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 67.82%);
}

.homeValue .--img img {
  width             : 100%;
  height            : 100%;
  -o-object-fit     : cover;
  object-fit        : cover;
  -o-object-position: bottom;
  object-position   : bottom;
}

.homeValue .--txt {
  position: relative;
  z-index : 2;
}

.homeValue .--txt::before {
  content    : "";
  top        : 0;
  left       : -20px;
  border-left: 3px solid #fff;
  height     : 100%;
  position   : absolute;
  opacity    : 0;
}

.homeValue article {
  opacity       : 0;
  transition    : all 0.3s ease;
  pointer-events: none;
  transform     : translate(100px, 0);
}

@media (max-width: 769px) {
  .homeValue {
    padding-top: 0;
    height     : auto;
  }

  .homeValue .--background {
    display: none;
  }

  .homeValue .--img {
    position : relative;
    top      : unset;
    left     : unset;
    transform: none;
    height   : auto;
  }

  .homeValue .--item {
    position: relative;
  }

  .homeValue .slick-dots {
    position : absolute;
    bottom   : 20px;
    left     : 50%;
    transform: translate(-50%, 0);
    z-index  : 1;
    display  : flex;
    gap      : 4px;
  }

  .homeValue .slick-dots li {
    border-radius: 4px 0px;
    background   : rgba(255, 255, 255, 0.16);
    width        : 40px;
    height       : 4px;
  }

  .homeValue .slick-dots li.slick-active {
    background: var(--color-1);
  }

  .homeValue .container-fluid {
    width: 100%;
  }

  .homeValue .--txt {
    position: absolute;
    top     : 44px;
    left    : 0;
    padding : 0 20px 0 40px;
    color   : #fff;
  }

  .homeValue .--txt::before {
    content    : "";
    position   : absolute;
    top        : 0;
    left       : 20px;
    top        : 0;
    border-left: 3px solid #fff;
    opacity    : 1;
    z-index    : 1;
  }

  .homeValue .subTitle {
    font-size: 28px;
    color    : #fff;
    opacity  : 1;
  }

  .homeValue article {
    opacity  : 1;
    transform: none;
  }

  .homeValue .--listValue {
    display: block;
  }
}

.homeService {
  background: #111722;
  padding   : 100px 0;
}

.homeService .--left {
  padding: 100px 70px 100px 0;
  color  : #fff;
}

.homeService .--left .segTitle {
  margin-bottom: 44px;
}

.homeService .--left .--des {
  opacity: 0.6;
}

.homeService .--right {
  width : 100%;
  height: 100%;
}

.homeService .--right img {
  width        : 100%;
  height       : 100%;
  -o-object-fit: cover;
  object-fit   : cover;
}

.homeService .--listService {
  margin-top: 44px;
}

@media (max-width: 769px) {
  .homeService {
    padding: 60px 0;
  }

  .homeService .--listService {
    margin-top: 32px;
  }

  .homeService .--left {
    margin-bottom: 44px;
    padding      : 0;
  }

  .homeService .--left .segTitle {
    margin-bottom: 20px;
  }

  .homeService .itemService {
    margin-bottom: 32px;
  }

  .homeService .col-md-4:last-child .itemService {
    margin-bottom: 0;
  }
}

.homeNews {
  background: #1a2130;
  padding   : 80px 0;
}

.homeNews .--title {
  display        : flex;
  align-items    : center;
  justify-content: space-between;
  color          : #fff;
  margin-bottom  : 60px;
}

.homeNews .--newsHot {
  position: relative;
}

.homeNews .--newsHot .timeCate {
  color     : rgba(255, 255, 255, 0.6);
  margin-top: 24px;
}

.homeNews .--newsHot .timeCate .--cate {
  color: rgba(255, 255, 255, 0.6);
}

.homeNews .--newsHot .--img {
  width : 100%;
  height: 360px;
}

.homeNews .--newsHot .--img img {
  width        : 100%;
  height       : 100%;
  -o-object-fit: cover;
  object-fit   : cover;
}

.homeNews .--newsHot .--name {
  color             : #fff;
  font-weight       : 600;
  margin-top        : 8px;
  transition        : all 0.3s ease;
  overflow          : hidden;
  text-overflow     : ellipsis;
  line-height       : 32px;
  -webkit-line-clamp: 2;
  font-size         : 24px;
  height            : 64px;
  display           : -webkit-box;
  -webkit-box-orient: vertical;
}

.homeNews .--newsHot .--name:hover {
  color: var(--color-1);
}

.homeNews .--newsHot .--viewdetail {
  margin-top             : 24px;
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter        : blur(2px);
  color                  : rgba(255, 255, 255, 0.6);
  display                : flex;
  align-items            : center;
  gap                    : 6px;
  font-weight            : 600;
  text-transform         : uppercase;
}

.homeNews .--newsHot .gifCate {
  position: absolute;
  top     : 8px;
  left    : 8px;
}

.homeNews .itemNews1 {
  padding-bottom: 20px;
  margin-bottom : 20px;
  border-bottom : 1px solid rgba(255, 255, 255, 0.16);
}

.homeNews .itemNews1:nth-child(2) {
  padding-bottom: 0;
  border-bottom : none;
  margin-bottom : 44px;
}

.homeNews .itemNews1 .timeCate .--cate {
  color: rgba(255, 255, 255, 0.6);
}

.homeNews .itemNews {
  display        : flex;
  position       : relative;
  justify-content: space-between;
  margin-bottom  : 16px;
  padding-bottom : 16px;
  border-bottom  : 1px solid rgba(255, 255, 255, 0.16);
  gap            : 12px;
  color          : #fff;
  transition     : all 0.3s ease;
  padding-left   : 16px;
}

.homeNews .itemNews::before {
  position  : absolute;
  content   : "";
  top       : 8px;
  left      : 0;
  width     : 4px;
  height    : 4px;
  background: #767676;
}

.homeNews .itemNews:hover {
  color: var(--color-1);
}

.homeNews .itemNews .--nameNews {
  font-weight       : 600;
  overflow          : hidden;
  text-overflow     : ellipsis;
  line-height       : 22px;
  -webkit-line-clamp: 2;
  display           : -webkit-box;
  font-size         : 16px;
  -webkit-box-orient: vertical;
}

.homeNews .itemNews .timeCate .--cate {
  color: rgba(255, 255, 255, 0.6);
}

.homeNews .itemNews:last-child {
  margin-bottom : 0;
  padding-bottom: 0;
  border-bottom : none;
}

@media (max-width: 769px) {
  .homeNews {
    padding: 60px 0;
  }

  .homeNews .--title {
    margin-bottom: 20px;
  }

  .homeNews .--title .btn-4 {
    padding                : 0;
    border-radius          : unset;
    flex                   : 0 0 auto;
    font-size              : 14px;
    border                 : none;
    -webkit-backdrop-filter: unset;
    backdrop-filter        : unset;
    background             : transparent;
  }

  .homeNews .--newsHot {
    margin-bottom: 32px;
  }

  .homeNews .--newsHot .--img {
    height: auto;
  }

  .homeNews .--newsHot .--name {
    font-size  : 16px;
    line-height: 22px;
    height     : 44px;
  }

  .homeNews .--newsHot .--viewdetail {
    margin-top: 16px;
  }

  .homeNews .itemNews h6 {
    font-size: 14px;
  }
}

/*# sourceMappingURL=home.css.map */