
:root{
  --color : #D3002D;
  --color2 : #747474;
}
.screen-project-1 .col{
  padding: 0 !important;
}
p,a,li,div,em,button,input,input::placeholder,textarea::placeholder,form input[type=submit]{
  font-family: "SF-Pro-Display-Regular.otf";
}
span{
  font-family: inherit;
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7-not-valid-tip{
  font-size: 12px !important;
}
/* [data-animate]{
  opacity: 1 !important;
} */
.h-section2 .right{
  flex-wrap: wrap;
}
.h-section1 .swiper-slide .content p span.break{
  padding-left: 10px;
  padding-right: 10px;
}
.h-section1 .swiper-slide .content p{
  margin-bottom: 5px !important;
}
.margin-0{
  margin: 0;
  line-height: 0;
}
.pd-right{
  padding-right: 10.2083333333%;
}

.pd-left{
  padding-left: 10.2083333333%;
}
.h-section6 .list .item .child:nth-child(2) p i{
  display: inline-block;
  font-size: 15px;
  color: #d3002d;
  padding-right: 3px;
}
.list-related-job .item{
  margin-bottom: 10px;
  padding:10px;
  border: 1px solid #ccc;
  color: #333;
}
.list-related-job .item .child a{
  display: flex;
  flex-wrap: wrap;
}
.list-related-job .item .child a .icon{
  width:60px;
  height:60px;
  overflow: hidden;
}
.list-related-job .item .child a .icon img{
  max-height: 100%;
}
.list-related-job .item .child a .exp{
  width: calc(100% - (60px) );
  color: #333;
  padding-left: 15px;
}
#masthead .has-dropdown .icon-angle-down{
  display: none;
}

h1,h2,h4,h3,strong,b,h1 span,h2 span,h4 span,h3 span,h4 span{
  font-family: "SF-Pro-Display-Bold.otf" !important;
}
.screen-project-1{
  height: 70vh;
  position: relative;
}
.screen-project-1 img{
  width: 100%;
    display: block;
    object-fit: cover;
    transition: all .5s ease;
    height: 100%;
}
.screen-project-1 h3{
  text-transform: inherit;
    font-size: 18px;
    line-height: 25px;
    font-family: "SF-Pro-Display-Regular.otf";
    font-weight: 400;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 3px;
}
.screen-project-1 h1{
  color: #fff;
  font-size: 30px;
  line-height: 35px;
  text-transform: uppercase;
  font-family: "SF-Pro-Display-Bold.otf";
  display: flex;
  z-index: 2;
  transition: all .5s ease;
  letter-spacing: 3px;
}
.screen-project-1 h1 span{
  font-family: "SF-Pro-Display-Bold.otf";
  display: inline-block;
}
.screen-project-1 h1 span.bk{
  padding: 0 5px;

}
.screen-project-1 .content{
  display: flex;
  align-items: flex-start;
  justify-content: center;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 30px;
  text-align: center;
}
.screen-project-1 .content div{
  position: relative;
  z-index: 1;
}
.screen-project-1 .content::before{
  content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    background-image: linear-gradient(to bottom, #222 0%, rgba(0, 0, 0, 0) 100%);
    opacity: 0.4;
    z-index: 1;
    transition: var(--transition);
}
.screen-project-2{
  padding: 20px 0 20px 10.2083333333%;
}
.max_width{
  padding-left: 10.2083333333%;
  padding-right: 10.2083333333%;
}
.all-project-2{
  padding: 20px 0 20px 10.2083333333% !important;
}
.screen-project-2 h3,.title-top h3{
  font-size: 40px;
  color: #D3002D;
  text-transform: uppercase;
  font-family: "SF-Pro-Display-Bold.otf";
  position: relative;
  width: -webkit-max-content;
  padding: 0 10px;
  line-height: 1;
  border-left: 3px solid  #D3002D;
  background: #fff;
  z-index: 1;
  margin-bottom: 10px;
  border-bottom: 0;
}
.title-top{
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  position: relative;
}
.screen-project-2 .title-top,.title-top h3{
  position: relative;
}
.screen-project-2 .title-top::before,.title-top::before{
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  background: #D3002D;
  left: 0;
  top: 15px;
}
.poka-breadcrumb i::before{
  content: '';
  width: 5px;
  height: 5px;
  top: 0%;
  transform: translateY(-50%) rotate(45deg);
  background: #747474;
  opacity: 1;
  transition: all .5s ease;
  display: block;
  margin: 0 5px;
}
.poka-breadcrumb{
  font-size: 17px;
  color: #747474;
  line-height: 25px;
  text-transform: capitalize;
  font-family: "SF-Pro-Display-Semibold.otf";
}
 .poka-breadcrumb-container .poka-breadcrumb i:last-child{
  display: inline-block;
}
.single-post.post-template-default .poka-breadcrumb-container .poka-breadcrumb i:last-child{
  display: none
}
.poka-breadcrumb a{
  font-family: "SF-Pro-Display-Semibold.otf";
  color: #747474;
}

.screen-project-3{
  padding: 30px 10.2083333333% 40px;
    position: relative;
    z-index: 0;
    display: flex;
    flex-wrap: wrap;
}
.screen-project-3.slider-project{
  padding: 0 !important
}
.screen-project-3.slider-project .swiper-slide{
  max-height: 450px;
  overflow: hidden;
}

.screen-project-3 .left{
  flex-basis: 35%;
  max-width: 35%;
}
.screen-project-3 .left h2{
  font-size: 24px;
  color: #D3002D;
  text-transform: uppercase;
  font-family: "SF-Pro-Display-Semibold.otf";
}
.screen-project-3 .left ul{
  margin: 0;
  list-style-type: none;
  padding:0;
}
.screen-project-3 .left ul li{
  display: flex;
  flex-wrap: wrap;
  padding: 15px 0;
  margin: 0;
  border-top: 1px solid  #747474;
}
.screen-project-3 .left ul li span{
  display: inline-block;
  width: 50px;
}
.screen-project-3 .left ul li p{
  display: inline-block;
  width: calc(100% - (50px) );
  padding-left: 15px;
  color: #747474;
  font-size: 17px;
  font-family: "SF-Pro-Display-Regular.otf";
}
.screen-project-3 .left ul li strong{
  display: block;
  line-height: 1

}
.screen-project-3 .left .share{
  margin-top: 20px;
}
.screen-project-3 .left .share strong{
  font-size: 17px;
  color: #D3002D;
  font-family: "SF-Pro-Display-Regular.otf";
}
.screen-project-3 .left .share img{
  padding: 0 5px;
}
.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after,
.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after{
  display: none;
}
.screen-project-3 .button {
    display: flex;
    position: absolute;
    bottom: -1px;
    right: 0;
    width: -webkit-max-content;
    margin: 0;
    width: auto !important;
    background: transparent !important;
    height: auto !important;
    min-width: auto !important;
    padding: 0 !important;
    width: max-content;
}
.slider-project {
  position: relative;
}
.screen-project-3 .button div{
  width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: unset;
    left: unset;
    right: unset;
    top: unset;
    opacity: 1;
    background: #fff;
}
.screen-project-3 .button div img{
  width: 22px;
}
.screen-project-3 .button div.swiper-button-next{
  background: #D3002D;
}
.screen-project-3 .swiper-slide,
.screen-project-3 .slider-project {
  height: 100%;
  position: relative;
}
.screen-project-3 .swiper-slide img{
  width: 100%;
    display: block;
    object-fit: cover;
    transition: all .5s ease;
    height: 100%;
}
.screen-project-3 .right{
  flex-basis: 65%;
  max-width: 65%;
  padding-left: 20px;
}
.screen-project-4{
  position: relative;
  display: flex;
  justify-content: flex-end;
}
.screen-project-4 img{
  width: 100%;
    display: block;
    object-fit: cover;
    transition: all .5s ease;
    height: 100%;
    position: absolute;
}
b,strong{
  font-family: "SF-Pro-Display-Bold.otf";
}
.screen-project-4 .title,
.screen-project-5 .title{
  font-size: 26px;
  color: #D3002D;
  text-transform: uppercase;
  font-family: "SF-Pro-Display-Bold.otf";
  position: relative;
  /* width: -webkit-max-content; */
  padding: 0 10px;
  line-height: 1.2;
  border-left: 3px solid #D3002D;
  z-index: 1.2;
  margin-bottom: 50px;
}
.title_related.title-top h3{
  font-size: 26px;
}
.screen-project-5 .img img{
  width: 100%;
    display: block;
    object-fit: cover;
    transition: all .5s ease;
    height: 100%;
}
.screen-project-5{
  color: #000000;
}
.screen-project-5 h4{
  font-size: 17px;
}
.screen-project-5 ul {
  margin-top: 15px;
  list-style-type: none;
  padding:0
}
.screen-project-5 ul li{
  color: #000;
  position: relative;
  padding-left: 30px;
  font-size: 17px;
  text-align: left;
}
.screen-project-5 ul li::before{
  content: '';
    width: 10px;
    height: 10px;
    top: 7px;
    transform: translateY(-50%) rotate(45deg);
    background: #747474;
    opacity: 1;
    transition: all .5s ease;
    display: inline-block;
    margin: 5px 10px;
    position: absolute;
    left: 0
}
.screen-project-4 .content{
  background: rgba(255,255,255,.8);
  padding: 150px 10.2083333333% 150px 140px;
  z-index: 1;
  width: 50%;
  color: #000;
  font-size: 17px;
  font-family: "SF-Pro-Display-Regular.otf";
}
.screen-project-4 .content p{
  margin-bottom: 20px;
  text-align: justify;
}
.screen-project-5 p{
  margin-bottom: 20px;
  color: #333;
  font-size: 17px;
  text-align: justify;
  font-family: "SF-Pro-Display-Regular.otf";
}
.screen-project-5{
  display: flex;
  flex-wrap: wrap;
  padding: 90px 0 175px 0;
  background: #f7f7f7 url('https://crevietnam.com/wp-content/uploads/2022/08/sda1-scaled.jpg') bottom left no-repeat;
  background-size: cover;
  align-items: center;
}
.screen-project-5 .content,.screen-project-5 .img{
  width: 50%;
}
.screen-project-5 .content{
  padding: 0 150px 0  10.2083333333%
}
.screen-project-5 .ab-left{

    position: absolute;
    left: -120px;
    bottom: 56px;
    transform: rotate(270deg);
}
.screen-project-5 .ab-left p{
  font-size: 19px;
  color: #848484;
  margin: 0;
  line-height: 1;
  text-transform: uppercase;
    opacity:0.2;
}
.screen-project-5 .ab-left h3{
  font-size: 40px;
  color: #848484;
  text-transform: uppercase;
    opacity:0.2;
    font-family: "SF-Pro-Display-Semibold.otf";
    margin: 0;
    line-height: 1;
}
.screen-project-5 .ab-bottom{
  position: absolute;
  bottom: -35px;
    left: -60px;
}
.screen-project-5 .ab-bottom h3{
  font-family: "SF-Pro-Display-Semibold.otf";
  color: #848484;
  font-size: 31px;
  text-transform: uppercase;
  opacity:0.2;
  letter-spacing: 3px;
  margin: 0;
  line-height: 1;
}
.related-project{
  text-align: center;
  width: 100%;
  padding: 140px  10.2083333333% 0;
}
.related-project.single_related{
  padding: 30px 0;
}
.screen-project-5 .related-project .title{
  position: relative;
  display: inline-block;
  border: none;
}
.screen-project-5 .related-project .title::before,
.screen-project-5 .related-project .title::after{
    content: '';
    width: 10px;
    height: 10px;
    top: 0%;
    transform: translateY(-50%) rotate(45deg);
    background:#D3002D;
    opacity: 1;
    transition: all .5s ease;
    display: inline-block;
    margin: 0 10px;
}
.related-project .related-project-content{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 20px;
}
.related-project .img{
  height: 405px;
  width: 100%;
}
.related-project .img img{
  width: 100%;
    display: block;
    object-fit: cover;
    transition: all .5s ease;
    height: 100%;
}
.related-project .related-project-child{
  position: relative;
}
.related-project .contents{
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: auto;
  display: flex;
  justify-content: space-between;
  padding: 0 17px 25px 17px;
}
.related-project .contents h2{
  font-size: 17px;
  color: #fff;
  font-family: "SF-Pro-Display-Semibold.otf";
  margin: 0;
line-height: 1;
overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    margin: 0;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-transform: capitalize;
}
.related-project .contents {
  z-index: 1
}
.related-project .contents .left{
  text-align: left;
  color: #fff;
}
.related-project .contents .right a{
  display: inline-block;
  color: #fff;
  padding: 10px 25px;
  background: #D3002D;
  min-width: 110px;
  height: 40px;
  font-size: 13px;
  line-height: 23px;
  display: none;
  transition: 0.5s ease-in-out;
}
.related-project .contents .right a:hover{
  background: #fff;
  color:  #D3002D;
  transition: 0.5s ease-in-out;
}
.related-project .related-project-child{
  position: relative;
  overflow: hidden;
}
.related-project .related-project-child::before{
  content: '';
    display: block;
    width: 100%;
    height: 85%;
    position: absolute;
    z-index:1;
    left: 0;
    bottom: 0;
    background-image: linear-gradient(to top, #222 0%, rgba(0, 0, 0, 0) 100%);
    opacity: 0.8;
}
.related-project .related-project-child:hover::before{
  background: linear-gradient(1turn, #ed0033 -4.09%, rgba(255, 255, 255, 0) 41.75%);
}
.related-project .related-project-child:hover img{
  transform: scale(1.1);
}
.related-project .related-project-child:hover .right a{
  display: block;
    transition: 0.5s ease-in-out;
}
/*------ banner --------*/
.section_banner p{
  position: absolute;
  bottom: 0;
  right: 0;
  font-size: 120px;
  color: #fff;
  opacity: 0.36;
  line-height: 0.7;
  margin: 0;
  font-family: "SF-Pro-Display-Heavy.otf" !important;
  text-transform: uppercase;
}
/* --------- all projects ----- */
.all-project-3 ul.nav{
    justify-content: center;
    display: flex;
    max-width: 1000px;
    margin: 0 auto;
    border-bottom: 1px solid var(--color2)
}
.all-project-3 ul.nav li a{
  color: var(--color2);
  font-size: 17px;
  padding: 15px;
text-transform: capitalize;
}
.all-project-3 ul.nav li a::after{
  position: absolute;
    content: '';
    display: block;
    height: 2px;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: var(--color);
    opacity: 0;
    visibility: hidden;
    transform: scale(0);
    transition: all 0.25s ease;
}
.all-project-3 ul.nav li.active a,
.all-project-3 ul.nav li a:hover{
  color: var(--color);
  transition: all 0.25s ease;
}
.all-project-3 ul.nav li.active a::after,
.all-project-3 ul.nav li a:hover::after{
  opacity: 1;
  visibility: visible;
  transform: scale(1);
  transition: all 0.25s ease;
}
.h-section4.all-projects .item {
  flex-wrap: wrap;
  height: auto;

}
.h-section4.all-projects{
  padding: 50px 0;
}
.h-section4.all-projects .item.hover1{
  margin: 0;
}
.h-section4.all-projects .item .child{
  width: 49% !important;
  margin-left: 2%;
  margin-bottom:2%;
  max-height: 450px;
  position: relative;
  height: auto;
}
.h-section4.all-projects .item .child:nth-child(1),
.h-section4.all-projects .item .child:nth-child(4){
  width: 100%!important;
  margin-left: 0;
  margin-right: 0;
}
.h-section4.all-projects .item .child:nth-child(2){
  margin: 0;
}
.panigation_project{
  text-align: right;
}
.panigation_project span,.panigation_project a.page-numbers:hover{
  font-size: 16px;
  color: #fff;
  width: 24px;
  height: 24px;
  background: var(--color);
  border: 1px solid var(--color);
  display: inline-block;
  text-align: center;
line-height: 24px;
margin: 0 5px;
}
.panigation_project a.page-numbers{
  width: 24px;
  height: 24px;
  background:#fff;
  color: #707070;
  border: 1px solid #707070;
  font-size: 16px;
  text-align: center;
line-height: 24px;
  display: inline-block;
  margin: 0 5px;
}
.panigation_project a.page-numbers.next,
.panigation_project a.page-numbers.prev{
  background: transparent;
  color: var(--color);
  text-transform: uppercase;
  border: none;
  width: auto;
}
/* ------- trang Vision/ Mission ---- */
.miss-scr-1 .col{
    padding: 0 !important;

}
.miss-scr-1{
  z-index: 1

}
.miss-scr-1 .medium-3{
  max-width: 305px;
  -ms-flex-preferred-size: 305px;
  flex-basis: 305px;
  width: 100%;
}
.miss-scr-1 .medium-9{
  max-width: calc(100% - (305px));
  -ms-flex-preferred-size:calc(100% - (305px));
  flex-basis: calc(100% - (305px));
  padding-left: 90px !important;
  width: 100%;
}
.miss-scr-1 ul li a{
  font-weight: 400;
  font-size: 20px;
  color: var(--color2);
  position: relative;
    display: inline-block;
    width: auto;
    flex-grow: 0;
}

.miss-scr-1 ul li a::after{
  content: '';
    position: absolute;
    right: -10px;
    width: 5px;
    height: 5px;
    top: 50%;
    transform: translateY(-50%) rotate(45deg);
    background: #d3002d;
    opacity: 0;
    transition: all .5s ease;

}
.miss-scr-1 ul li {
  border-color: #707070;
}
.miss-scr-1 ul li a:hover,
.miss-scr-1 ul li.active a{
  color: var(--color);
}
.miss-scr-1 ul li.active a::after,
.miss-scr-1 ul li a:hover::after{
  opacity: 1;
}
.miss-scr-1 .medium-9 h2{
  font-size: 26px;
  position: relative;
  color: #000;
  padding-bottom: 5px;
  text-transform: uppercase;
}
.miss-scr-1 .medium-9 h2::before{
    content: '';
    position: absolute;
    bottom: 6px;
    left: 0;
    width: 72px;
    background: #000;
    height: 3px;
}
.miss-scr-1 .medium-9 p{
  color: #000;
  font-size: 17px;
  text-align: justify;
/* font-family: "SF-Pro-Display-Semibold.otf"; */
}
.miss-scr-2 h4{
  line-height: 1;
  color: var(--color);
  font-size: 19px;
  font-weight: 400;
  font-family: "SF-Pro-Display-Regular.otf";
  padding-left: 0;
  text-transform: uppercase;
  margin-bottom: 2px;
}
.miss-scr-2 .large-4 .img-inner{
  text-align: center;
}
.miss-scr-2 .large-4 .img-inner img{
  max-height: 120px;
  width: auto;
}
.miss-scr-2 h3{
  font-size:32px;
    position: relative;
    color: var(--color);
    border-left: 5px solid #D3002D;
    padding:0 10px 0 10px;
    margin-bottom: 40px;
    line-height: 1;
    text-transform: uppercase;
}
.miss-scr-2 p{
  color: #000;
  font-size: 17px;
  margin-bottom: 30px;
}
.miss-scr-2 .col{
  padding: 0;
}
.miss-scr-2 .large-4 .col-inner{
  max-width: 380px;
  margin-left: 0;
}
.miss-scr-2 .large-4 .col-inner p{
  text-align: justify;
  /* font-family: "SF-Pro-Display-Semibold.otf"; */
}
.miss-scr-2.miss-scr-3 .large-4 .col-inner{
  margin-right: 0;
  margin-left: auto;
}
.about-3 .row-1 .title-center b{
  display: none
}
.about-3 .row-1 p{
  color: #000;
  font-size: 17px;
  /* font-family: "SF-Pro-Display-Semibold.otf"; */
  max-width: 1000px;
  margin: 0 auto 30px;
}
.title-center .section-title{
  justify-content: center;
  position: relative;
}
.title-center h3{
  font-size: 40px;
  text-transform: uppercase;
  margin: 0;
  position: relative;
}
.title-center h3::after{
  content: '';
    position: absolute;
    bottom: 0;
    width: 40px;
    background: var(--color);
    height: 3px;
  left: 50%;
   transform: translateX(-50%);
}
.title-center h3 span{
  font-family: "SF-Pro-Display-Semibold.otf";
}
.about-3 .row-2>.col>.col-inner{
  display: grid;
  grid-template-columns: 1fr 1fr  1fr 1fr 1fr;
  grid-gap: 20px;
}
.about-3 .row-2 h4{
  font-size: 22px;
  color: #000;
  font-family: "SF-Pro-Display-Semibold.otf";
}
.about-3 .row-2 p{
  font-size: 15px;
  /* font-family: "SF-Pro-Display-Semibold.otf"; */
  color: #000
}
.about-1.miss-scr-2 h3,.about-2.miss-scr-2 h3{
  font-family: "SF-Pro-Display-Semibold.otf";
}
.background_ab{
  position: absolute;
  height: 140%;
  bottom: 0;
  right: -10.2083333333%;
  left: auto;
  z-index: -1;
}
.ab_background{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.ab_background img{
  width: 100%;
    height: 100%;
    display: block;
    object-fit: fill;
    transition: all .5s ease;
    left: 0;
    right: 0;
    bottom: 0;
    position: absolute;
}
.ab_background.img .img-inner{
  height: 100%;
}
.title-history h3{
  background: transparent;
}
.title-history:before{
  left: auto;
  right: 0;
  width: calc(100% - (205px) );
}
.title-history.lang-vi:before{
   width: calc(100% - (435px) );
}
.screen-history .title .section-title{
  display: block;
  text-align: center;
  border: none;
  margin: 0;
}
.screen-history .title .section-title-container{
  margin-bottom: 40px;
  margin-top: 20px;
}
.screen-history .title .section-title .section-title-main{
  display: inline-block;
  min-width: 300px;
  margin: 0 auto;
  background: var(--color);
  font-size: 35px;
  color: #fff;
  text-align: center;
  line-height: 65px;
  height: 65px;
}
.screen-history .left,.screen-history .right{
  padding: 0 !important;
}
.screen-history .left .img,.screen-history .left .col-inner,
.screen-history .left .img-inner  {
  height: 100%;
}
.screen-history .left .img img{
  width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: all .5s ease;
}
.screen-history .right{
  padding: 40px !important;
  background: #ececec;
  box-shadow: 0 0px 10px rgb(9 9 9 / 20%);
}
.screen-history .right h3{
  font-size: 25px;
  color: #333;
  line-height: 1.2;
  position: relative;
  padding-bottom: 20px;
}
.screen-history .right h3::after{
  content: '';
    position: absolute;
    bottom: 6px;
    left: 0;
    width: 72px;
    background: var(--color);
    height: 3px;
}
.screen-history .right p{
  color: #000;
  text-align: justify;
  /* font-family: "SF-Pro-Display-Semibold.otf"; */
  margin-bottom: 15px;
}
.screen-history .row{
  margin-bottom: 65px;
  position: relative;
}
.screen-history .row::after{
  content: '';
    position: absolute;
    width: 3px;
    background: var(--color);
  height: 100%;
  left: 50%;
  transform: translateX(-50%);
  bottom: -85px;
}
.screen-history .row::before{
  content: '';
  position: absolute;
  right: -10px;
  width: 15px;
  height: 15px;
  top: 85px;
  left: 50%;
  transform: translateY(-50%) translateX(-50%) rotate(45deg);
  background: #d3002d;
  opacity: 1;
  transition: all .5s ease;
  border-top: 3px solid #fff;
    border-left: 3px solid #fff;
  z-index: 1;
}

/* ------------- service ---- */
.service_3 .title-top h3{
  background: transparent;
}
.service_3 p{
  color: #000;
    font-size: 17px;
    margin-bottom: 30px;
}
.service_3 .row-2 .col-inner{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-gap: 20px;
  margin-top: 15px;
}
.service_3 .row-2 .box-image {
  text-align: center;
  z-index: 1;
}
.service_3 .row-2 .box-image{
  overflow: visible;
  height: 195px;
}
.service_3 .row-2 .box-image>div{
  background: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 135px;
  height: 135px;
  transform: rotate(45deg);
  margin-top: 27px;
  box-shadow: 10px 10px 5px #aaaaaa;
  box-shadow: 1px 2px 3px rgb(0 0 0 / 50%);
  border: 1px solid var(--color);
}
.service_3 .row-2 .box-image img{
  width: auto;
  transform: rotate(-45deg);
}

.service_3 .row-2 .box-text{
  background: #fff;
  padding-top: 120px;
  margin-top: -100px;
  border-radius: 5px;
  min-height: calc(100% - (70px) );
}
.service_3 .row-2 .box-text h4{
  font-size: 24px;
  text-transform: capitalize;
}
.service_3 .row-2 .box-text p{
  font-size: 16px;
  margin: 0;
}
.service_3 .title-top::before{
  left: auto;
  right: 0;
  display: none;
  width: 75%;
}
.service_4 .flickity-page-dots {
  /* counter-reset: a; */
  display: none;
}

.service_4 .flickity-page-dots .dot::after {
  content: counter(a);
  counter-increment: a;
}
.service_4 .flickity-button{
  display: none;
}
.service_4 .number-doted{
  color: #000;
  font-family: "SF-Pro-Display-Semibold.otf";
  padding-right: 15px;
}
.service_4 .number-doted strong{
  color: var(--color);
  font-family: "SF-Pro-Display-Semibold.otf";
  display: inline-block;
}
.service_4 .slider {
  height: 100% !important;
}
.service_4 .action_button_slider{
  /* position: absolute;
  bottom: 0; */
  display: flex;
  margin-top: 15px;
  align-items: flex-end;
  justify-content: flex-start;
  left: 0;
}
.service_4 .action_button_slider .button-next{
  /* width: 40px;
  height: 14px; */
  display: inline-block;
  /* background:url('https://crevietnam.com/wp-content/uploads/2022/08/5.png') center center no-repeat; */
}
.service_4 .action_button_slider br{
  display: none;
}
.service_4 .action_button_slider .button-pre{
  /* width: 40px;
    display: inline-block;
  height: 14px;
  background:url('https://crevietnam.com/wp-content/uploads/2022/08/6.png') center center no-repeat; */
  margin:0 10px 0 15px;
}

.service_4 .slider .section{
  padding: 0 !important;
}
.service_4 .col-right .slider .img-inner {
  padding-top: 40% !important;
}
.service_4 .title-top{
  margin-bottom: 30px !important;
}
.service_4 .title-top::before{
  display: none;
}
.service_4 .slider h5{
  color: var(--color);
  margin: 20px 0 15px;
  font-size: 20px;
  font-family: "SF-Pro-Display-Semibold.otf";
}
.service_4 .slider p{
  color: #333;
  min-height: 0;
  align-items: center;
  display: flex;
}
.service_4 .slider p.button-action{
  height: auto;
    -webkit-line-clamp: 1;
  min-height: 0;
}
p:empty{
  display: none !important;
}
.service_4 .col-left,.service_4 .col-inner,
.service_4 .slider-wrapper{
  height: 100%;
}
.image_mobile{
  display: none;
}
.h-section6 .h-section6{
  padding: 0 !important;
}
.h-section6 .list .item .child .content_image{
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}
.h-section6 .list .item .child:nth-child(1) .exp{
  padding-right: 15px;
}
/* ------ tab-news ------ */
.tab-news .row{
max-width: 100% !important;
margin: 0 -10px !important;
}
.tab-news .row .col{
  padding: 0 10px !important;
}
.tab-news .row.big-blog{
  margin-right: 0 !important;
}
.tab-news .row.big-blog .post-item{
  padding-right: 3px !important;
}
.tab-news .row.big-blog .post-item a{
  height: 100%;
}
.tab-news .large-8 .col-inner{
  height: 100%;
  padding-bottom: 10px !important;
}
.big-blog .box-text,.big-blog .box-image,.big-blog .box {
  height: 100% !important;
}
.big-blog .col-inner,.big-blog .row,.row.big-blog{
  height: 100% !important;
}
.tab-news .large-8 .big-blog .col-inner {
  padding-bottom: 0 !important;
}
.big-blog .box-text{
  background: #f5f5f5;
  padding: 15px;
}
.row.big-blog .box-image .image-cover{
  /* padding-top: 100% !important; */
  height: 100%;
}
.big-blog .box-text h5.post-title{
  color: var(--color);
  font-size: 26px;
  margin: 15px 0 30px;
  font-family: "SF-Pro-Display-Bold.otf";
  text-transform: capitalize;
}
.big-blog .box-text p.from_the_blog_excerpt {
  color: #333;
  font-size: 17px;
}
.big-blog .box-text .post-meta{
  position: absolute;
  bottom: 15px;
  left: 15px;
}
/* .tab-news .view-blog .post-item{
  padding-left: 0 !important;
} */
.view-blog .post-item .col-inner{
  padding: 10px 0;
  border-bottom: 1px solid #707070;
}
.view-blog .box-text h5{
  font-size: 16px;
  line-height: 1.4;
    -webkit-line-clamp: 4;
    text-align: justify;
    text-transform: capitalize;
}
.view-blog .post-item:last-child .col-inner{
  border: none;
}
.bottom-blog{
  margin-top: 10px;
}
.bottom-blog h5{
  font-size: 17px;
  color: #000;
  margin: 10px 0 15px;
  min-height: 43px;
  text-transform: capitalize;
}
.tab-news .row .col.large-4{
  padding-left: 0 !important;
}
.tab-news .searchform-wrapper {
  margin-top: -55px;
    margin-bottom: 20px;
}
/* .new-screen-1 .col{
  padding: 0
} */
.archive .new-screen-1 .col{
  padding: 0 15px;
}
.archive_blog_bottom {
  margin-right: 0;
  margin-left: 0;
  width: 100%;
  max-width: 100%;
  margin-top: 30px;
}
.archive_blog_bottom .box-image img{
  transition: filter .6s,opacity .6s,transform .6s,box-shadow .3s;
}
.archive_blog_bottom .box-image:hover img{
  transition: filter .6s,opacity .6s,transform .6s,box-shadow .3s;
  transform: scale(1.1);
}
.archive_blog_bottom .box-text {
  text-align: left;
  padding: 15px .;
}
.menu-cat{
  width: auto;
}

.tab-news .nav,.menu-cat{
  border-bottom: 1px solid #333;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  margin-right: 35.5%;
}
.tab-news .nav .active,.menu-cat .active{
  border-bottom: 1px solid var(--color);
}
.tab-news li:hover{
  cursor: pointer;
}
.tab-news .nav .active span,.menu-cat .active a{
  color: var(--color) !important;;
}
/* .tab-news .nav{
  display: none
} */
.categories-new.hide{
  display: none !important;
}
.menu-cat{
  margin-bottom: 15px;
}
.menu-cat a{
  font-size: 17px;
}
.menu-cat li{
  text-align: center;
}
.tab-news h2{
  color: #747474;
  font-size: 20px;
}
.tab-news h2 img{
  width: 27px;
}
.tab-news .searchform-wrapper input{
  background: #fff;
  border-radius: 0;
  height: 40px;
}
.tab-news .searchform-wrapper button{
  height: 40px;
  background: var(--color)
}
.tab-news .nav li{
  margin: 0;
  text-align: center;
}
.tab-news .nav li span{
  text-transform: none;
  font-size: 17px;
  font-weight: 400;
}
.categories-new .title-top {
  margin-bottom: 30px !important;
}
.categories-new .title-top::before{
  width: 98%;
  background: #ccc;
}
.categories-new .row{
  margin: 0 -10px !important;
}
.categories-new .col{
  padding: 0 10px !important;
}

/* ---- single --- */
.title-single {
  margin: 0
}
.title-single h1{
  font-size: 24px;
  text-transform: capitalize;
  color: var(--color);
  border: none;
}
.all-project-2 .cat-links a{
  font-family: inherit;
  font-weight: inherit;
  color: inherit;
}
.single-post-1 .large-4 h2{
  color: #747474;
  font-size: 20px;
}
.single-post-1 .large-4 h2 img{
  width: 27px;
}
.single-post-1 .post-entry-content{
  color: #333;
  text-align: justify;
}
.single-post-1 .post-entry-content h2{
  color: #000;
  font-size: 22px;
}
.single-post-1 .post-entry-content h3{
  color: #000;
  font-size: 20px;
}
.single-post-1 .post-entry-content h4{
  color: #000;
  font-size: 18px;
}
.single-post-1 .post-entry-content h5{
  color: #000;
  font-size: 16px;
}
.post-meta-single a{
  display: inline-block;
  color: #000;
  background: #fff;
  padding-right: 10px;
  position: relative;
}
.post-meta-single {
  position: relative;
  margin-top: 20px;
}
.post-meta-single::before{
  content: "";
      position: absolute;
      width: 100%;
      height: 1px;
      background: #D3002D;
      left: 0;
      top: 12px;
}
.content-meta{
  background: #fff;
  position: relative;
  display: inline-block;
  width: auto;
}
.single-post-1 .social-icons a{
  position: relative;
}
.single-post-1 .social-icons a i{
  background: var(--color);
  color: #fff;
  width: 40px;
  height: 40px;
  text-align: center;
  line-height: 43px;
  display: inline-block;
}
.single-post-1 .social-icons a.facebook::before {
  content: "Share";
  display: inline-block;
  font-size: 17px;
  color: var(--color);
  position: absolute;
  left: -60px;
  top: -13px;
  font-family: "SF-Pro-Display-Bold.otf";
  font-weight: 600;
}
.single-post-1 .social-icons.lang-vi a.facebook::before{
  content: "Chia sẻ";
  left: -70px;
}
.single-post-1 p{
  margin: 10px 0 15px;
}
.single-post-1 .post-entry-content img{
  clear: both;
      display: block;
      margin: 0 auto;
      max-width: 80%;
}
.single-post-1 .title-top::before{
  display: none
}
.single-post-1 .title-top{
  margin-bottom:20px !important;
}
.related-post .box-text::before{
  content: '';
    display: block;
    width: 100%;
    height: 85%;
    position: absolute;
    left: 0;
    bottom: 0;
    background-image: linear-gradient(to top, #000000 0%, rgba(0, 0, 0, 0) 100%);
    opacity: 0.8;
}
.related-post .box-text{
  text-shadow: none
}
.related-post .box-text .blog-post-inner{
  position: relative;
  display: flex;
  flex-wrap: wrap;
}
.related-post .box-text .is-divider{
  display: none;
}
.related-post .box-text .post-title{
  font-size: 17px;
  border-top: 1px solid #fff;
  color: #fff;
  order: 2;
  width: 100%;
  padding-top: 10px;
  margin: 10px 0 15px;
}
.related-post .box-text .post-meta{
  order: 1;
  width: 100%;
}
.slider-button-bottom button{
  bottom: 0 !important;
}
.slider-button-bottom .flickity-prev-next-button.next{
  right:0;
  top: auto;
  bottom: 0;
  width: 40px;
  height: 40px;
  background: var(--color) url('https://crevietnam.com/wp-content/uploads/2022/08/next2.png') center center no-repeat;
  opacity: 1;
  background-size: 20px;
}
.slider-button-bottom .flickity-prev-next-button svg{
  display: none;
}
.slider-button-bottom .flickity-prev-next-button.previous{
  right:40px;
  top: auto;
  left: auto;
  bottom: 0;
  width: 40px;
  height: 40px;
  background: #fff url('https://crevietnam.com/wp-content/uploads/2022/08/prev2.png') center center no-repeat;
  opacity: 1;
  background-size: 20px;
}
.slider-service-left img{
  min-height: 487px;
}
.list_categories{
  display: flex;
  flex-wrap: wrap;
}
.list_categories .big-top{
  width: 100%;
  padding: 10px;
  display: flex;
  flex-wrap: wrap;
  overflow: hidden;
}
.list_categories .big-top .image{
  width: 66.2%;
  display: block;
  height: 100%;
  background-size: cover !important;
  overflow: hidden;
  max-height: 440px;
  transition: filter .6s,opacity .6s,transform .6s,box-shadow .3s;

}
.list_categories .big-top .image a{
  background-size: cover !important;
  height: 100%;
  display: block;
}
.list_categories .big-top .image a:hover{
  transform: scale(1.1);
  transition: filter .6s,opacity .6s,transform .6s,box-shadow .3s;
}

.list_categories .big-top .content{
  width: 33.8%;
  background: #f5f5f5;
  padding: 15px;
}
*::selection {
    background-color: #d3002d !important;
    color: #fff !important;
}
.list_categories .big-top h2{
  color: var(--color);
    font-size: 26px;
    margin: 15px 0 30px;
    font-family: "SF-Pro-Display-Bold.otf";
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-transform: capitalize;
}
.h-section5 .bottom .content .right .title,
.h-section5 .bottom .content .right .list .title2{
  text-transform: capitalize;
}
.list_categories .big-top .expert{
  text-decoration: none;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 6;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  color: #333;
  margin-bottom: 30px;
  text-align: justify;
}
.list_categories .big-top .expert p{
  text-align: justify;
}
.list_categories .small-bottom{
  width: 33.333%;
  padding: 10px;
}
.list_categories span{
  font-size: 14px;
}
.list_categories .small-bottom .image{
  height: 200px;
  background-size: cover !important;
  display: block;
  margin-bottom: 10px;
  overflow: hidden;
}
.list_categories .small-bottom .image a{
  transition: filter .6s,opacity .6s,transform .6s,box-shadow .3s;
  width: 100%;
  display: block;
  background-size: cover !important;
  height: 100%;
}
.list_categories .small-bottom .image:hover a{
  transform: scale(1.1);
transition: filter .6s,opacity .6s,transform .6s,box-shadow .3s;
}
.list_categories .small-bottom h2{
  color: #333;
  font-size: 17px;
  overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-transform: capitalize;

}
.wp-caption .wp-caption-text{
  background: #fff !important;
  font-size: 15px;
}
.date{
  font-size: 14px;
}
.top_list_cat{
  padding: 10px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.top_list_cat .action_show_cat:hover span{
  cursor: pointer;
}
.action_show_cat span img{
  max-width: 40px;
}
.panigation_list_post{
  display: none
}
/* ----- contact --- */
.contact-1 .large-4{
  padding: 30px;
  border: 1px solid #707070;
  box-shadow: 0 0px 10px rgb(9 9 9 / 20%)
}
.contact-1 .title-top h3{
  font-size: 20px;
}
.contact-1 p{
  color: #333;
}
.contact-1 .title-top::before{
  display: none;
}
.contact-1 .icon-box {
  margin-bottom: 5px;
}
.contact-1 .icon-box h4{
  color: var(--color);
  text-transform: uppercase;
  font-size: 21px;
  /* font-family: "SF-Pro-Display-Regular.otf"; */
}
.contact-1 .icon-box.phone .icon-box-img{
  width: 16px !important;
}
.contact-1 .icon-box.phone .icon-box-img img{
  padding: 0 !important;
}
.contact-1 form{
  margin-left: 15px;
}
.contact-1 form input{
  border: 1px solid #707070;
  box-shadow: 0 0px 10px rgb(9 9 9 / 20%);
  background: #fff;
  color: #000;
  border-radius: 0;
  height: 68px;
}
.contact-1 form br{
  display: none;
}
.contact-1 form .inputs{
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 20px;
  margin-bottom: 35px;
}
.contact-1 form textarea{
  height: 200px;
  border: 1px solid #707070;
  box-shadow: 0 0px 10px rgb(9 9 9 / 20%);
  background: #fff;
  border-radius: 0;
}
.contact-1 form p{
  margin: 0
}
.contact-1 form input.wpcf7-submit{
  height: 53px;
  background: var(--color);
  color: #fff;
  text-align: center;
  min-width: 140px;
  margin-top: 20px;
  border: none !important;
}
/* -- infomation_carrers -- */
.infomation_carrers .col-inner{
  padding: 30px 25px;
  background: #f5f5f5;
  color: #000;
}
.infomation_carrers h2 {
  font-size: 17px;
  color: var(--color);
  margin: 0;
}
.infomation_carrers h3{
  font-size: 17px;
  color: #000
}
.top-title-job,.content_carreres{
  padding: 35px 40px;
  border: 1px solid #b2b2b2;
  margin-right: 20px !important;
  width: auto;
  margin-bottom: 20px;
}
.content_carreres .post-entry-content h3,
.content_carreres .post-entry-content h2,
.content_carreres .post-entry-content h4{
  margin: 20px 0;
}
input.wpcf7-submit{
  font-weight: 400 !important;
}
.content_carreres .post-entry-content p{
  text-align: justify;
  color: #333;
}
.content_carreres .post-entry-content p li,.content_carreres .post-entry-content strong,.content_carreres .post-entry-content p i,
.content_carreres .post-entry-content p div,.content_carreres .post-entry-content p b,.content_carreres .post-entry-content span{
  color: #333;
}
.top-title-job h1{
  font-size: 34px;
}
.top-title-job .contents{
  display: flex;
  align-items: center;
}
.top-title-job .contents .left{
  width: 150px;
  color: #fff;
  background: var(--color);
  border-radius: 25px;
  height: 40px;
  text-align: center;
  line-height: 40px;
}
.top-title-job .contents .right{
  max-width: 450px;
  padding-left: 15px;
  display: flex;
  align-items: center;
}
.top-title-job .contents .right p{
  padding-left: 5px;
}
.job_brief{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 40px;
}
.job_brief_child{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 30px;
}
.job_brief_child img{
  width: 40px;
}
.job_brief_child .content{
  width: calc(100% - (40px) );
  padding-left: 10px;
  color: #333;
}
.job_brief_child .content h4{
  line-height: 1;
  margin: 0
}
.job_brief_child .content p{
  font-size: 15px;
}
.bottom_carrers h3{
  border: none;
  font-size: 28px;
  margin: 0;
}

.bottom_carrers form input{
  border: 1px solid #707070;
  box-shadow: 0 0px 10px rgb(9 9 9 / 20%);
  background: #fff;
  color: #000;
  border-radius: 0;
  height: 68px;
}
.hidden-url-carres{
  display: none
}
.bottom_carrers form .bottom .upload_cs input{
  border: none;
  box-shadow: none;
  height: 28px;
}
.bottom_carrers form br{
  display: none;
}
.bottom_carrers form .inputs{
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 20px;
  margin-bottom: 35px;
}
.bottom_carrers form textarea{
  height: 200px;
  border: 1px solid #707070;
  box-shadow: 0 0px 10px rgb(9 9 9 / 20%);
  background: #fff;
  border-radius: 0;
}
.bottom_carrers form p{
  margin: 0
}
.bottom_carrers form input.wpcf7-submit{
  height: 53px;
  background: var(--color);
  color: #fff;
  text-align: center;
  min-width: 140px;
  margin: 0px 0 20px 15px !important;
  border-color: var(--color);
  display: block;
}
.bottom_carrers form input.wpcf7-submit:hover{
  background: #fff;
  color: var(--color);

}
/* .bottom_carrers .wpcf7-spinner{
  display: none
} */
.upload-wp{
  display: flex;
    align-items: center;
}
.wpcf7 form .wpcf7-response-output,
.wpcf7 form.invalid .wpcf7-response-output{
  background: #fff;
  width: 100%;
      margin: 20px 0 0 0;
      position: static;

}
.upload-wp .text-upload{
  height: 30px;
    background: var(--color);
    color: #fff;
    text-align: center;
    min-width: 140px;
    border-color: var(--color);
    display: block;
    margin: 5px 5px 5px 0;
    line-height: 30px;
}
.upload-wp .text-upload:hover{
  cursor: pointer;
}
.bottom_carrers .wpcf7-file{
  display: none
}
.bottom_carrers .bottom .upload_cs label{
  display: block;
  text-align: left;
  font-weight: 600;
  color: #333;
      font-family: "SF-Pro-Display-Regular.otf";
}
.bottom_carrers .bottom .upload_cs label span{
  display: block;
  margin-top: 5px;
      font-family: "SF-Pro-Display-Regular.otf";
}
.bottom_carrers .bottom{
  text-align: right;
  display: flex;
  justify-content: space-between;
  margin-top: 30px;
}
.list_carrers .title-top h3{
  background: rgb(247, 247, 247)
}
.list_carrers .poka-breadcrumb{
  margin-bottom: 30px;
}
.list_carrers .large-5 p{
  color: #333;
  text-align: justify;
  margin: 20px 0;
}
.list_carrers .banner-grid .text-box{
  width: 100% !important;
  left: 0;
  bottom: 0;
  padding: 25px;
  transform: none !important;
}
.list_carrers .banner::before{
  content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0%;
    background: linear-gradient(1turn, rgba(0, 0, 0, 0.94902) -4.09%, rgba(255, 255, 255, 0) 41.75%);
    z-index: 1;
    height: 50%;
    width: 100%;
    transition: all 1s ease;
    opacity: 1;
}

.list_carrers .banner {
  overflow: hidden;
}
.list_carrers .banner:after{
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: -50%;
  background: linear-gradient(1turn, #ed0033 -4.09%, rgba(255, 255, 255, 0) 41.75%);
  transition: all 1s ease;
  z-index: 1;
  height: 50%;
  width: 100%;
}
.list_carrers .grid-col-1-2 .banner::before,
.list_carrers .grid-col-1-2 .banner:after{
  height: 100%;
}
.list_carrers .banner:hover:after{
  bottom: 0;
}
.list_carrers .banner-grid .text-box h4{
  color: #fff;
  margin: 0 !important;
  text-transform: uppercase;
  font-size: 30px;
  line-height: 1;
}
/* .bottom_carrers .upload_cs{
  display: inline-block;
  height: 53px;
    background: #fff;
    color: #333;
    border: 1px solid var(--color);
    text-align: center;
    line-height: 53px;
    min-width: 140px;
    margin-top: 20px;
}
.bottom_carrers .upload_cs:hover{
  cursor: pointer;
  background: var(--color);
  color: #fff;
} */
.right_carrers h3.section-title{
  border: none !important;
  font-size: 28px;
}
.list_carrers .h-section6{
  padding: 60px 0;
}
.new-screen-1 .col-inner{
  height: 100%;
}
.form_search_carrers form{
  margin: 10px 0 50px;
  display: flex;
    flex-wrap: wrap;
    display: none
}
.form_search_carrers form input{
  background: #fff;
  height: 45px;
  border: 1px solid #333;
  color: #000000;
  margin-right: 2%;
  width: 30%;
  border-radius: 0;
}
.form_search_carrers form button{
  height: 45px;
  background: #ececec;
  width: 4%;
}
