@media screen and (max-width:1440px) {
  .header-box-row {
    padding-left: 20px;
    padding-right: 20px
  }
  .header-box-col.border {
    max-width: 100px
  }
}

@media screen and (max-width:1366px) {
  .header-box-row {
    padding-left: 20px;
    padding-right: 20px
  }
  .navpage {
    padding: 20px 20px 0 20px;
  }

.exp-txt {
    font-size: 50px;
}
}

@media screen and (max-width:1360px) {
  #header-inner-logo img {
    max-height: 50px
  }
  .banner-box-scale {
    padding-top: 56.25%
  }
  .header-box-col.border img {
    max-height: 40px
  }
  .index .container {
    padding: 0
  }

.peopleslide .slick-prev,.peopleslide .slick-next{
top: 40%;
transform: translateY(-40%);
}
  .peopleslide .slick-prev {
    left: -15px
  }
  .peopleslide .slick-next {
    right: -15px
  }
}

@media screen and (max-width:1024px) {

  .index .main-box,
  .main-box {
    row-gap: 0;
  }
  .logo-mobile {
    background-color: rgba(21, 23, 51, .85);
    box-shadow: none
  }
  .btn-sidemenu {
    background-color: transparent
  }
  .btn-sidemenu:before {
    color: #fff
  }
  .caseslide {
    width: 75%
  }
  #header-inner,
  .btn-sidemenu.active {
    background-color: #fff
  }
  .header-box-col.head-logo {
    width: 100%;
    order: 1;
    border-bottom: 0
  }
  .header-box-col {
    order: 2
  }
  .header-box-col.border {
    display: none
  }
  .hidelang {
    position: relative;
    display: flex;
    flex-direction: row;
    width: 100%;
    top: 0;
    right: 0;
    background-color: #fff;
    z-index: 1;
    padding: 0;
    transition: all .2s;
    box-shadow: none;
    visibility: visible;
    transform: none;
    transform-origin: top;
    opacity: 1;
    border-radius: 10px;
    column-gap: 15px
  }
  #header [class^=lang] {
    font-size: 18px;
    flex: 1;
  }
  .selectlang {
    width: 100%
  }
  .header-box-col.contact {
    justify-content: normal;
    flex-direction: column-reverse;
    row-gap: 20px;
    order: 3;
    padding: 0
  }
  .contactme {
    column-gap: 15px;
    row-gap: 20px;
    width: 100%;
    padding: 0;
    display: flex;
    flex-direction: column;
  }

  .header-box-col.follow {
    display: block;
    order: 4;
  }
  .header-box-row.submenu {
    row-gap: 30px
  }
  .index .container.case {
    padding: 40px 0
  }
  .expertise-title {
    font-size: 20px
  }

  ul.expertiselist,
  ul.newslist,
  ul.peoplelist {
    margin: 0 -5px 40px;
    row-gap: 20px
  }
  ul.expertiselist li,
  ul.newslist li,
  ul.peoplelist li {
    width: 33.33%;
    padding: 0 5px
  }
  .case-box:after,
  .case-box:before {
    width: 20px;
    height: 20px
  }
  .case-box {
    padding: 20px 20px 20px 40px
  }
  .filter-col.col1 {
    width: 100%
  }
  .filter-col.col2 {
    width: 50%
  }
  .transport-optcol {
    width: 100%
  }
  ul.flexnav li {
    font-size: 24px
  }
  .contactme .link-mail {
    border-left: 0;
    padding-left: 0
  }
  .header-box-col.head-menu {
    row-gap: 20px
  }
  ul.chklist li {
    flex: auto
  }
  .newsslide {
    display: block;
    margin: 0
  }
  .index .container.overview .row{
    flex-direction: column;
    row-gap: 40px;
  }
.index .container.overview .row [class^="col"]{ 
width: 100%;
}

ul.list-exp li:first-child{
border-left: 0;
}
.index .people-title-txt h2 {
    font-size: 26px;
}
ol.list-expertise li{
flex-direction: column;
row-gap: 10px;
padding-bottom: 0;
}
.depart-txt {
    width: 100%;
padding-right: 0;
}
.depart-txt:after {
display: none;
}
.people-col {
    flex-direction: column;
    row-gap: 10px;
}
.index .people-title-txt {
    margin-bottom: 0;
}

.why-title h3{
margin-bottom: 0;
}
.container.news .row{
flex-direction: column;
}
.container.news .row [class^="col"]{
width: 100%;
}
.news-box.hilight{
padding-right: 0;
border-right: 0;
}
    .news-box {
        margin: 0 -10px;
        flex-direction: row;
    height: auto;
    }
.news-col{
flex: 1;
padding: 0 10px;
}
.header-box-col.head-menu nav {
    margin: 10px auto;
}
.followme{
display: flex;
}
.header-box img {
    max-height: 32px;
}
.index .row {
    row-gap: 20px;
}
.index .people-img, .index .people-title {
}
.index .people-img{
flex: none;
margin-bottom: 20px;
}

.index .people-title {
height: 100%;
}
.peopleslide .slick-list{
margin: 0 -20px;
}
.peopleslide .slick-slide{
padding: 0 20px;
}
.footer_contact .footer_address {
    flex: auto;
    display: flex;
    gap: 20px;
    flex-direction: column;
}
.footer-box-row {
    row-gap: 40px;
    flex-direction: column;
    justify-content: center;
}

  h1 {
    font-size: 36px
  }
  h2 {
    font-size: 30px
  }
  h3 {
    font-size: 24px
  }
  h4,
  h5,
  h6 {
    font-size: 20px
  }
  #includedheader {
    position: fixed;
    right: 0;
    top: 0;
    background-color: transparent;
    opacity: 1;
    z-index: 999
  }
  #header {
    position: absolute;
    width: 100%;
    height: 100%
  }
  #header-inner {
    height: 100%;
    padding: 20px;
    overflow: scroll
  }
  #header-inner-logo img {
    max-height: 50px
  }
  .header-box {
    height: 100%;
    justify-content: space-between;
    row-gap: 20px
  }
  .header-box-row.mainmenu {
    order: 1;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 20px
  }
  .header-box-row {
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    flex-direction: column;
    row-gap: 20px;
    order: 2
  }
  .header-box-row.submenu {
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 20px;
    background-color: transparent;
    color: var(--clr-black);
    row-gap: 10px
  }
  .header-box-col {
    width: 100%;
    padding: 0
  }
  .header-box-col.head-logo {
    width: 100%;
    text-align: center;
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 20px
  }

  .hidelang {
    order: 1
  }

  .followme i {
    font-size: 24px;
    width: auto;
    height: auto
  }
  .logo-mobile {
    background-color: #fff;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 10px 20px;
    position: fixed;
    z-index: 100;
    width: 100%;
    top: 0;
    left: 0;
    box-shadow: 0 3px 5px rgba(0, 0, 0, .15);
    transition: all .5s
  }
  .logo-mobile img {
    max-height: 40px;
transition: all 0.3s;
transform-origin: left;
  }
.logo-mobile.active img{
transform: scale(0.5);
}
  .sidemenu {
    width: 300px;
    position: fixed;
    height: 100%;
    right: -300px
  }
  .sidemenu.active {
    right: 0
  }
  .btn-sidemenu {
    background-color: #fff;
    padding: 0;
    top: 10px;
    left: -64px;
    position: absolute;
    width: 65px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .3s;
    z-index: 999;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px
  }
  .btn-sidemenu:before {
    font-family: bootstrap-icons;
    content: "\F479";
    color: #999;
    font-size: 36px
  }
  .btn-sidemenu.active {
    width: 40px;
    left: -39px
  }
  .btn-sidemenu.active:before {
    content: "\F62A";
    font-size: 30px
  }
  ul.flexnav {
    column-gap: 0;
    row-gap: 20px
  }
  ul.flexnav li {
    width: 100%
  }
  .selectlang {
    margin: 0;
    padding: 20px 0;
    border-left: 0;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc
  }
  
  ::-webkit-scrollbar {
    display: none
  }
  .selectlang [class^=btn-selectlang] {
    display: none
  }
  .gallery-txt {
    -webkit-line-clamp: 5;
    line-clamp: 5
  }
  .subscribebox-txt {
    line-height: 1.2
  }
  .subscribebox-txt h2 {
    font-size: 1.8rem
  }
  .social-box {
    display: none
  }
.hilight .newslist-title {
    font-size: 20px;
}
.news-box.hilight .news-col {
    height: auto;
}
.index .newslist-img .imgscale {
    padding-top: 0;
    height: 100%;
}
.newslist-title {
    font-size: 20px;
}
.index .maintitle a{
font-size: 16px;
}
    .navpage {
        padding: 20px 0 0 0;
    }
.navpage ul li:first-child{
padding-left: 20px;
}
.people-pimg{
max-width: 375px;
margin: 0 auto;
}
.depart-txt i:before {
    top: -40px;
    position: relative;
}
    .depart-title {
        padding-right: 30px;
        width: auto;
        max-width: 100%;
    }
}

@media screen and (max-width:768px) {
  .index .row [class^=col] {
    width: 100%
  }
  .news-box {
    row-gap: 20px;
    flex-wrap: nowrap
  }
  .news-col {
    width: 100%;
    flex-direction: row;
    column-gap: 20px
  }
  .news-img,
  .news-title {
    width: auto
  }
  .news-img {
    width: 30%;
    flex: none
  }
  .whybox ol.chklist {
    flex-direction: column
  }
  .footer-box-row {
    align-items: flex-start;
    padding: 0
  }
  .footer-box-col {
    flex: auto;
    width: auto;
    padding: 0;
    border: 0;
    text-align: left
  }
  .footer-box-col.footer_logo,
  .footer-box-col.footer_social {
    align-self: center
  }
  .footer-box-col.footer_contact {
    flex-direction: column;
    row-gap: 20px
  }
  .aboutcontact>div {
    display: flex;
    column-gap: 20px;
    line-height: normal;
    flex-direction: column;
    row-gap: 20px;
    flex: 1;
    text-align: center;
    align-items: center
  }
  .chklist li {
    width: 100%;
    padding: 0 0 0 30px
  }
  ul.expertiselist li,
  ul.newslist li,
  ul.peoplelist li {
    width: 50%
  }
  .container.about [class^=col],
  .container.people [class^=col] {
    width: 100%
  }
  .contactbox-colimg,
  .contactbox-coltxt {
    width: 100%;
    flex: auto
  }
  .location-scale,
  .prod-img {
    padding-top: 75%
  }
  ol.chklist.num {
    flex-wrap: wrap
  }
  .chklist.num li {
    flex: auto
  }
  ol.chklist li.whybor {
    padding: 0;
    flex: none;
    height: 40px
  }
  ol.chklist li.whybor:before {
    background-image: url(../images/whybor-h.svg);
    background-position: 50%;
    width: 100%;
    background-size: cover
  }

.container.aboutus .imgscale{
        padding-top: 75%;
        height: auto;
    }
.newslistbox {
    display: flex;
    flex-direction: column;
}
.index .newslistbox {
    display: flex;
    flex-direction: column;
    gap: 20px;
    height: 100%;
    border: 0;
}
.hilight .newslistbox {
        flex-direction: row;
    }

  .footer-box-row {
    display: flex;
    column-gap: 0;
    width: 100%;
    max-width: 1406px;
    flex-direction: column
  }
  .footer-box-col,
  .footer_contact {
    flex: auto;
    width: 100%
  }

  .gallery-txt {
    -webkit-line-clamp: 3;
    line-clamp: 3
  }
  .row [class^=col] {
    width: 50%
  }
  .row .col12 {
    width: 100%
  }
    .newslist-img .imgscale {
        padding-top: 75%;
        height: auto;
    }
.index .newslist-img .imgscale {
        padding-top: 75%;
        height: auto;
    }
.hilight .newslist-img .imgscale {
        padding-top: 0;
        height: 100%;
    }
.depart-title{
max-width: 100%;
}
ol.chklist.num li:after{
display: none;
}
ol.chklist li {
    padding: 120px 0 30px 0;
}
ol.chklist li:before {
    top: 30px;
}
    .whylist {
        flex-direction: column;
        row-gap: 40px;
    }
.people-contact-row {
    align-items: center;
    flex-direction: row;
}
}

@media screen and (max-width:767px) and (orientation:portrait) {
  .banner-box-scale {
    padding-top: 100%
  }
  .index .row {
    row-gap: 20px
  }
  .aboutcontact {
    row-gap: 20px;
    justify-content: flex-start;
    flex-direction: column;
    margin: 0 auto
  }
  .aboutcontact>div {
    display: flex;
    column-gap: 20px;
    line-height: normal;
    flex-direction: row;
    row-gap: 20px;
    flex: auto;
    text-align: left;
    align-items: flex-start
  }
  .caseslide,
  .people-col {
    width: 100%
  }
  .footer-box:before,
  .index .container.expertise:after {
    height: 40px
  }
  .containertitle .txt-title,
  .maintitle .txt-title {
    padding: 0;
    margin: 0 auto
  }
  .containertitle:after,
  .containertitle:before,
  .maintitle:after,
  .maintitle:before {
    display: none
  }
  .news-col {
    flex-direction: column
  }
  .filter-col.col1,
  .filter-col.col2,
  .news-img,
  .news-title,
  ul.expertiselist li,
  ul.newslist li,
  ul.peoplelist li {
    width: 100%
  }
  .sort-resualt,
  .total-resualt {
    flex-direction: column;
    align-items: flex-start
  }
  .transport-optdetail {
    flex-direction: column;
    row-gap: 20px
  }
  .transport-optdetail-img {
    margin: 0 auto
  }
  .location-scale,
  .prod-img {
    padding-top: 100%
  }
  .footer-box:before,
  .index .container.expertise:after {
    background-size: cover
  }
 
  .banner-box-scale {
    padding-top: 75%
  }
  .gallerybox-content {
    padding: 0
  }
  .gallery-txt {
    -webkit-line-clamp: 5;
    line-clamp: 5
  }
  .subscribebox {
    flex-direction: column;
    row-gap: 20px;
    align-items: flex-start
  }
  .row [class^=col] {
    width: 100%
  }
  .gallerybox .col6 {
    width: 50%
  }
.firm-title{
flex-direction: column;
row-gap: 10px;
align-items: start;
}
ul.list-exp {
    flex-direction: column;
row-gap: 10px;
margin-bottom: 10px;
}
ul.list-exp li {
    flex: auto;
    padding: 0;
    flex-direction: row;
    border-left: 0;
    column-gap: 20px;
}
    ol.list-expertise li {
        padding: 100px 0 20px 0;
    }
ol.list-expertise li:last-child{
padding-bottom: 0;
}
ol.list-expertise li:before{
top: 20px;
}
.newslistbox,.hilight .newslistbox{
flex-direction: column;
height: auto;
}
.newslist-content, .newslist-img {
    flex: initial;
}
.hilight .newslist-img .imgscale {
    padding-top: 75%;
    height: auto;
}
    .news-box {
        flex-direction: column;
    }
.containertitle, .index .maintitle {
    display: flex;
    gap: 15px;
    text-align: center;
    align-items: center;
    justify-content: start;
    color: var(--clr-gold);
}

ol.list-expertise li:after {
    left: 80px;
    width: 100px;
}
    .index .container.overview .row {
        row-gap: 20px;
    }
.people-contact-row{
align-items: start;
flex-direction: column;
}
}