body {
  --bs-body-font-family: "Montserrat", sans-serif;
  --bs-body-color: #404040;
  background-color: #fff;
  --bs-btn-active-border-color: transparent;
  --bs-border-color: #000;
  --bs-link-color-rgb: 51, 51, 51;
  --bs-link-hover-color-rgb: 28, 67, 78;
  --red: #de1515;
  --grey: #dadada;
  --yellow: #ffce3e;
  overflow-x: hidden
}
a {
  text-decoration: none
}
a:hover, a.active {
  color: var(--red)
}
.fs-20 {
  font-size: 20px
}
.fs-30 {
  font-size: 30px
}
.fs-14 {
  font-size: 14px
}
.fs-18 {
  font-size: 18px
}
.text-b {
  color: #807c7c
}
.mb-n3 {
  margin-bottom: -1rem !important
}
.ms-n3 {
  margin-left: -1rem !important
}
.me-n3 {
  margin-right: -1rem !important
}
.mx-n3 {
  margin-left: -1rem !important;
  margin-right: -1rem !important
}
.form-control:focus {
  box-shadow: none
}
.form-control {
  border-color: #dedede
}
@media(min-width:1400px) {
  .container {
    max-width: 1170px
  }
}
.form-search input::-moz-placeholder {
  color: #a7a7a7
}
.form-search input::placeholder {
  color: #a7a7a7
}
.btn {
  --bs-btn-padding-x: 32px;
  --bs-btn-padding-y: 6px;
  --bs-btn-hover-bg: var(--bs-btn-bg);
  --bs-btn-hover-color: var(--bs-btn-color);
  --bs-btn-hover-border-color: var(--bs-btn-hover-bg);
  --bs-btn-active-color: var(--bs-btn-color);
  --bs-btn-active-bg: var(--bs-btn-hover-bg);
  --bs-btn-active-border-color: var(--bs-btn-hover-border-color)
}
.bg-none {
  background: 0 0 !important
}
.recruitments-banner {
    background-color: var(--fs-color-primary);
    min-height: 30px;
    width: 100%;
        padding-top: 356px;
}
.overlay {
    background-color: rgba(0, 0, 0, 0.77);
    height: 100%;
    left: -1px;
    pointer-events: none;
    right: -1px;
    top: 0;
    transition: transform .3s, opacity .6s;
}
.fill {
    height: 100%;
    left: 0;
    margin: 0 !important;
    padding: 0 !important;
    position: absolute;
    right: 0;
    top: 0;
}
header .top {
  background: #000;
  font-size: 14px
}
header .sologan strong {
  color: #ab0618;
  font-size: 31px;
  line-height: 1
}
header .sologan span {
  color: #585858
}
header .nav {
  --bs-nav-link-padding-x: 0;
  --bs-nav-link-padding-y: 0
}
header .nav .nav-item {
  padding: 0 .75rem
}
header .nav .nav-item .nav-link {
  color: #000;
  font-weight: 500;
  text-transform: uppercase;
  font-size: 14px;
  line-height: 17px;
  border-bottom: 1px solid rgba(0, 0, 0, 0)
}
header .nav .nav-item .nav-link.active, header .nav .nav-item .nav-link:hover {
  border-bottom: 1px solid #000
}
header .nav .nav-item:hover ul {
  display: block !important;
  position: absolute;
  top: 100%;
  background-color: #fff;
  border: 1px solid #d9d9d9;
  width: 277px;
  z-index: 999
}
header .nav .nav-item ul li {
  padding: 10px
}
header .nav .nav-item ul li a {
  text-transform: capitalize !important
}
main {
  --swiper-navigation-size: 36px;
  --swiper-navigation-sides-offset: -30px;
  --swiper-pagination-bottom: -25px;
  --swiper-pagination-bullet-width: 30px;
  --swiper-pagination-bullet-height: 10px;
  --swiper-pagination-bullet-border-radius: 60px;
  --swiper-pagination-bullet-inactive-color: #d9d9d9;
  --swiper-pagination-bullet-inactive-opacity: .6;
  --swiper-pagination-color: #fff;
  --swiper-theme-color: #fff
}
main .carousel-control-next-icon, main .carousel-control-prev-icon {
  border-radius: 63.391px;
  background-image: none;
  display: flex;
  width: 18.5px;
  height: 37px;
  justify-content: center;
  align-items: center
}
main .box-title .title {
  font-weight: 600;
  font-size: 30px;
  color: #000
}
main .box-title .title:after {
  content: "";
  border-bottom: 1px solid #ec3237;
  width: 110px;
  position: absolute;
  bottom: -3px;
  left: var(--sa-title-left, 50%);
  transform: translate(var(--sa-title-left, -50%))
}
main .box-title .intro {
  color: #404040
}
main .block-services .box-s {
  width: 886px;
  margin: 0 auto
}
main .block-services .item-ss .item-s {
  border: 1px solid #dcdcdc;
  mix-blend-mode: multiply
}
main .block-services .item-ss .item-s .fs-5 {
  font-size: 1.125rem !important
}
main .block-services .item-ss:nth-child(1n) .item-s:nth-child(2n) {
  left: -90px
}
main .block-services .item-ss:nth-child(2n) .item-s:nth-child(1n) {
  left: -175px
}
main .block-services .item-ss:nth-child(2n) .item-s:nth-child(2n) {
  left: -270px
}
main .block-services .img:before {
  content: "";
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 53.4%, rgba(0, 0, 0, .8) 100%);
  position: absolute;
  left: 0;
  right: 0;
  height: 100%;
  z-index: 1;
  border-radius: var(--sa-img-radius, 50%)
}
main .block-services .img h3 {
  bottom: 20px;
  left: 30%;
  text-align: center;
  right: 30%
}
main .block-services-detail {
  background: url(../images/bg-service-detail.jpg) center/cover no-repeat
}
main .block-project {
  background-color: #3b3c3c
}
main .block-project:before {
  content: "";
  background: url(../images/bg-project.jpg) #d3d3d3 50%/cover no-repeat;
  position: absolute;
  height: 360px;
  top: 0;
  left: 0;
  right: 0
}
main .block-project .box-title .title:after {
  border-color: #fff
}
main .block-project .nav-pills {
  --bs-nav-pills-border-radius: 50px;
  --bs-nav-pills-link-active-color: #000;
  --bs-nav-pills-link-active-bg: #fff
}
main .block-project .nav-pills .nav-link {
  --bs-nav-link-font-weight: 500;
  --bs-nav-link-color: #7d7d7d
}
main .block-project .nav-pills .nav-link:hover {
  color: var(--bs-nav-pills-link-active-color);
  background-color: var(--bs-nav-pills-link-active-bg)
}
main .block-projects-detail .nav-pills {
  --bs-nav-pills-border-radius: 50px;
  --bs-nav-pills-link-active-color: #fff;
  --bs-nav-pills-link-active-bg: #000
}
main .block-projects-detail .nav-pills .nav-link {
  --bs-nav-link-font-weight: 500;
  --bs-nav-link-color: #7d7d7d
}
main .block-projects-detail .nav-pills .nav-link:hover {
  color: var(--bs-nav-pills-link-active-color);
  background-color: var(--bs-nav-pills-link-active-bg)
}
main .block-about {
  background: #3b3c3c;
  /*background: #3b3c3c url(../images/bg-ab.png) center right no-repeat*/
}
main .block-about .box-title .title:after {
  border-color: #fff
}
main .block-mission:before {
  content: "";
  background: linear-gradient(90deg, #f1f1f1 .24%, #e4e4e4 99.76%);
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 25%;
  z-index: -1;
  margin: 3rem 0
}
main .block-news {
  background: url(../images/bg-news.jpg) #d3d3d3 50%/cover no-repeat
}
main .block-news .item-f:before {
  content: "";
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 53.4%, rgba(0, 0, 0, .8) 100%);
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
  border-radius: var(--bs-border-radius)
}
main .block-news .item-f .title {
  bottom: 1rem;
  left: 0;
  right: 0
}
main .block-news .item-f .title small {
  font-size: 14px
}
main .box-about {
  background: url(../images/bg-about.jpg) #d3d3d3 0% 0%/cover no-repeat
}
main .box-contact, main .block-recruitments {
  background: #eee url(../images/bg-contact.png) 0% 0%/cover no-repeat
}
main .breadcrumbs {
  padding: 12px 0
}
main .breadcrumbs .breadcrumb-item {
  line-height: 16px
}
main .breadcrumbs .breadcrumb-item.active {
  color: #404040
}
main .breadcrumbs .breadcrumb-item a {
  color: #404040
}
main .sidebar {
  --bs-list-group-bg: #3b3c3c;
  --bs-list-group-color: #fff;
  --bs-list-group-border-color: #fff;
  --bs-link-color-rgb: 255, 255, 255
}
main .sidebar a.active, main .sidebar a:hover {
  color: rgba(255, 255, 255, .3)
}
main .pagination {
  --bs-pagination-color: var(--bs-body-color);
  --bs-pagination-active-color: #363435;
  --bs-pagination-bg: transparent;
  --bs-pagination-active-bg: transparent;
  --bs-pagination-hover-bg: transparent;
  --bs-pagination-hover-color: #363435
}
main .pagination .page-item {
  padding: var(--bs-pagination-padding-y) var(--bs-pagination-padding-x)
}
main .pagination .page-link {
  margin: 0 1rem;
  padding: 0;
  border: 0
}
main .pagination .page-link.active {
  border-bottom: 1px solid #ab0618
}
main .detail p {
  margin-bottom: 1rem !important
}
main .detail h2 {
  font-size: 26px
}
main .detail h3 {
  font-size: 20px
}
main .detail h4 {
  font-size: 18px
}
main .detail img {
  max-width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  margin-bottom: .5rem;
  height: auto
}
main .detail table {
  max-width: 100%;
  margin-bottom: 1rem;
  vertical-align: top;
  border-color: var(--bs-border-color)
}
main .detail table > :not(caption) > * {
  border-width: var(--bs-border-width) 0
}
main .detail table > :not(caption) > * > * {
  border-width: 0 var(--bs-border-width);
  padding: .5rem
}
footer .block-meet {
  background: url(../images/bg-meet.jpg) 100%/cover no-repeat;
  font-size: 38px
}
footer .block-meet:before {
  content: "";
  background: linear-gradient(360deg, rgba(16, 19, 64, .4) 0%, rgba(0, 0, 0, 0) 36.29%);
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 1
}
footer h4 {
  font-size: 18px
}
footer h4:after {
  content: "";
  border-bottom: 1px solid #fff;
  width: 110px;
  display: block;
  margin-top: 4px
}
footer li {
  padding: 10px 0
}
footer li a {
  color: #fff
}
footer .copyright {
  background-color: #3b3c3c
}
.offcanvas {
  --bs-offcanvas-bg: #363435;
  background-image: url(../images/bg-menu.png);
  background-repeat: no-repeat;
  background-position: bottom right
}
.offcanvas .navbar-nav {
  --bs-nav-link-color: #fff;
  --bs-navbar-active-color: #fff
}
.offcanvas .navbar-nav li ul li a {
  color: #fff
}
.offcanvas .btn-close {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e")
}
@media(max-width:767.98px) {
  .container {
    max-width: 100%
  }
  header .logo {
    width: 48px
  }
  header .sologan strong {
    font-size: 25px
  }
  header .sologan span {
    font-size: 13px
  }
}
@media(max-width:767.98px)and (max-width:400px) {
  header .sologan strong {
    font-size: 21px
  }
  header .sologan span {
    font-size: 12px
  }
}
@media(max-width:767.98px) {
  main {
    --swiper-navigation-sides-offset: 0
  }
  main .block-services .box-s {
    width: auto;
    margin: 0
  }
  main .block-services .item-ss .item-s .fs-5 {
    font-size: 16px !important
  }
  main .block-services .item-ss:nth-child(1n) .item-s:nth-child(2n) {
    left: -90px
  }
  main .block-services .item-ss:nth-child(2n) .item-s:nth-child(1n) {
    left: 0
  }
  main .block-services .item-ss:nth-child(2n) .item-s:nth-child(2n) {
    left: -90px
  }
  main .block-services .img img {
    width: 49.8vw;
    height: 49.8vw
  }
  main .block-services .img h3 {
    bottom: 20px;
    left: 10%;
    text-align: center;
    right: 10%
  }
  main .block-project .nav-pills {
    flex-wrap: nowrap;
    overflow: auto
  }
  main .block-project .nav-pills .nav-item {
    display: inline-block
  }
  main .block-project .nav-pills .nav-link {
    white-space: nowrap
  }
  main .block-projects-detail .nav-pills {
    flex-wrap: nowrap;
    overflow: auto
  }
  main .block-projects-detail .nav-pills .nav-item {
    display: inline-block
  }
  main .block-projects-detail .nav-pills .nav-link {
    white-space: nowrap
  }
  main .block-mission:before {
    right: 0;
    margin: 0
  }
  main .recruitments-banner .w-75 {
    width: 100% !important;
    padding: 0 1rem
  }
  main #chinhsach .w-75 {
    width: 100% !important
  }
  main #chinhsach .nav-link {
    --bs-nav-link-padding-x: .5rem;
    font-size: .8em
  }
}
@media(max-width:767.98px) {
  footer .block-meet {
    font-size: 30px;
    background-position: center
  }
}
@media(min-width:768px)and (max-width:991.98px) {
  .btn {
    --bs-btn-padding-x: 25px
  }
  .container {
    max-width: 100%
  }
  main {
    --swiper-navigation-sides-offset: 0
  }
  main .block-services .item-ss:nth-child(1n) .item-s:nth-child(2n) {
    left: -90px
  }
  main .block-services .item-ss:nth-child(2n) .item-s:nth-child(1n) {
    left: 0
  }
  main .block-services .item-ss:nth-child(2n) .item-s:nth-child(2n) {
    left: -90px
  }
  main .block-services .img img {
    width: 49.8vw;
    height: 49.8vw
  }
}
@media(min-width:992px)and (max-width:1199.98px) {
  header .logo {
    width: 48px
  }
  header .sologan strong {
    font-size: 25px
  }
  header .sologan span {
    font-size: 13px
  }
  header .nav .nav-item {
    padding: 0 .75rem
  }
  main {
    --swiper-navigation-sides-offset: 0
  }
  main .block-services .img img {
    width: 270px;
    height: 270px
  }
}