@charset "utf-8";
/* CSS Document */

/* Color */
:root {
    --clr-white: #fff;
    --clr-black: #000;
    --clr-blue1:#151733;
    --clr-blue2:#272B5F;
    --clr-gold:#C9AA6C;
    --clr-gold2:#dcb15c;
}
body{
color: #000;
}

/* body:before,body:after{
content: "";
display: block;
position: absolute;
width: 20px;
height: 100%;
background-color: rgba(255,0,0,0.15);
top: 0;
z-index: 0;
} */
body:before {
    left: 0;
}
body:after {
    right: 0;
}

a:link, a:visited {
color: #000;
}
h1, h2 {
    font-family: "Cormorant Garamond";
    font-weight: 600;
    text-transform: uppercase;
}
.txt-small{
font-size: 1.75em;
}
.txt-large{
font-size: 2.5em;
}
.txt-gold{
color: var(--clr-gold);
}
b, strong {
    font-weight: 500;
}
.index .row {
    row-gap: 40px;
}

/* Header */
#header-inner {
    background-color: transparent;
}

#header-inner-logo.active img{
max-height: 45px;
}
ul.flexnav li {
    font-family: "Cormorant Garamond";
    font-size: 26px;
    margin: 0 auto;
    font-weight: 500;
}
.header-box a:link,.header-box a:visited{
color: #FFF;
}
.header-box-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    column-gap: 40px;
    padding-left: 40px;
    padding-right: 40px;
}
.header-box-col.head-menu {
    flex: auto;
    justify-content: center;
}
.header-box-col.head-menu nav{
width: 100%;
}
.flexnav li a:link, .flexnav li a:visited {
    justify-content: center;
    color: #FFF;
}
.flexnav li a:hover{
    color: var(--clr-gold2);
}
.header-box-col.head-logo {
    width: 300px;
    flex: none;
    text-align: center;
}
.header-box-col{
flex: auto;
}
.header-box-col.border {
    flex: none;
    max-width: 200px;
}
.header-box-col.border img {
    width: 100%;
    max-height: 100%;
    object-fit: cover;
}
.header-box-col.border:first-of-type img {
    object-position: left;
}
.header-box-col.border:last-of-type img {
    object-position: right;
}
#header-inner-logo img{
transform-origin: center;
}
.selectlang img{
max-height: 16px;
}
.header-box-col.contact {
    align-items: center;
    justify-content: flex-end;
}
.selectlang {
    padding-left: 0;
    border-left: 0;
}
.hidelang {
    right: -10px;
    top: 40px;
}

/* Banner */
.banner{
    padding: 0;
color: #FFF;
}
.banner:before{
content: "";
position: absolute;
bottom: 0;
width: 100%;
height: 25%;
background: #FFF;
background: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
background: -moz-linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
background: linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#FFFFFF", endColorstr="#FFFFFF", GradientType=0);
z-index: 1;
}

.banner-box-scale {
    padding-top: 42.85%;
}
.bannerslide{
max-width: 100%;
}
.bannerslide .slick-list{
overflow: hidden;
}
.banner-box-scale-img img {
    filter: brightness(0.75);
}

/* Mainbox */
.index .main-box {
    display: flex;
    flex-direction: column;
    row-gap: 80px;
}
.index .container{
margin: 0;
}

.navpage {
    padding: 40px 0;
    width: 100%;
    max-width: 1366px;
    margin: 0 auto;
}

#header  [class^="lang"]{
color: #000;
}
.index .maintitle, .containertitle {
    font-family: "Cormorant Garamond";
    display: flex;
    margin: 0 auto 40px auto;
    gap: 20px;
    text-align: center;
    align-items: center;
    justify-content: center;
}

.index .maintitle :is(h1, h2), .containertitle :is(h1, h2) {
    text-transform: uppercase;
}
.maintitle h2 {
    font-weight: 500;
    margin: 0;
    padding: 0;
    text-transform: uppercase;
    text-align: center;
    line-height: 1;
}
.maintitle:before, .containertitle:before,
.maintitle:after, .containertitle:after {
    content: "";
    background-color: var(--clr-gold);
    position: relative;
    width: auto;
    height: 1px;
    margin: 0;
    flex: auto;
}
.maintitle .txt-title, .containertitle .txt-title {
    margin: 0;
    padding: 0;
    display: contents;
}
.maintitle .txt-title:before, .containertitle .txt-title:before {
    content: "";
    background-color: var(--clr-gold);
    position: absolute;
    bottom: -20px;
    left: 50%;
    transform: translateX(-50%);
    width: 100px;
    height: 4px;
    margin: 0 auto;
}

/* Footer */
.footer-box {
    margin-top: 80px;
    padding-top: 120px;
    background-color: var(--clr-blue1);
    color: #FFF;
    row-gap: 20px;
}
.footer-box:before {
    content:"";
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    background-image: url(../images/town-bg.svg);
    background-position: center top;
    background-repeat: repeat-x;
}

.footer-box-row {
    border: 0;
    flex-direction: column;
    align-items: center;
    row-gap: 30px;
}
.footer-box a{
color: #FFF;
}
.footer_contact {
    width: auto;
    max-width: 100%;
    flex: auto;
    display: flex;
    flex-direction: row;
    column-gap: 40px;
    justify-content: center;
    text-align: center;
}
.footer_social{
display: flex;
column-gap: 20px;
}

/* Edit */
.index .container.expertise::after,
.footer-box:before {
    height: 70px;
}
.copyright {
    border-top: 1px solid var(--clr-gold);
}

ul.chklist {
    margin: 20px 0;
    padding: 0;
    row-gap: 16px;
}
ul.chklist li{
padding: 0 10px 0 40px;
}
ul.chklist li:before {
    content: "";
    position: absolute;
    left: 0;
    top: -5px;
    width: 34px;
    height: 34px;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(../images/bullet.svg);
    background-size: 26px;
}
ol.chklist {
    display: flex;
    flex-direction: column;
    row-gap: 20px;
    margin: 20px 0;
    padding: 0;
    counter-reset: my-counter;
    list-style: decimal;
}
ol.chklist li {
    padding: 0 0 0 100px;
    width: 100%;
    column-gap: 0;
    flex-direction: column;
}
ol.chklist li::before {
    font-family: 'kanit';
    content: "0" counter(my-counter);
    counter-increment: my-counter;
    color: var(--clr-gold);
    position: absolute;
    left: 0;
    font-size: 60px;
    top: -5px;
    line-height: 1;
    font-weight: 500;
}
ol.chklist li h4,
ol.chklist li p{
margin: 0;
}
.aboutcontact {
    display: flex;
    column-gap: 40px;
    justify-content: center;
    margin: 40px auto;
}
.aboutcontact > div{
display: flex;
column-gap: 20px;
line-height: 1.2;
}
.aboutcontact > div > img {
    width: 40px;
}
.aboutcontact > div > p{
margin: 0;
}
.index .container.expertise {
    padding: 160px 40px 80px 40px;
    color: #FFF;
    background-color: var(--clr-blue1);
    overflow: hidden;
}
.index .container.expertise::after {
    content: "";
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    background-color: var(--clr-blue1);
    background-image: url(../images/town-bg.svg);
    background-position: center top;
    background-repeat: repeat-x;
}
.index .container.expertise:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: var(--clr-blue1);
    background-image: url(../images/container5.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    top: 15%;
}
.expertise-box{
display: flex;
flex-direction: column;
row-gap: 20px;
}
.expertiseslide .slick-list{
overflow: initial;
margin: 0 -10px;
}
.expertiseslide .slick-slide{
padding: 0 10px;
}
.expertise-title {
    font-family: 'Cormorant Garamond';
    font-size: 24px;
    text-align: center;
    font-weight: bold;
}
.expertise-title a:link,.expertise-title a:visited{
color: #FFF;
}
.peopleslide{
display: flex;
flex-wrap: wrap;
margin: 0 -10px;
row-gap: 20px;
}
.peopleslide > div{
width: 33.33%;
padding: 0 10px;
}

.people-title h4{
margin: 0;
}
.people-title span {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    color: var(--clr-gold2);
    line-height: 1.2;
    margin-top: 10px;
}
.index .container.case{
background-color: var(--clr-blue1);
padding: 80px 40px;
color: #FFF;
background-image: url(../images/case-bg.jpg);
background-position: right top;
background-repeat: no-repeat;
background-size: cover;
overflow: hidden;
}
.index .container.case::before{
content: "";
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background: #151733;
background: -webkit-linear-gradient(90deg, rgba(21, 23, 51, 1) 50%, rgba(21, 23, 51, 0) 100%);
background: -moz-linear-gradient(90deg, rgba(21, 23, 51, 1) 50%, rgba(21, 23, 51, 0) 100%);
background: linear-gradient(90deg, rgba(21, 23, 51, 1) 50%, rgba(21, 23, 51, 0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#151733", endColorstr="#151733", GradientType=1);
}
.caseslide{
width: 50%;
}
.caseslide .slick-list{
margin: 0 -10px;
}
.caseslide .slick-slide{
padding: 0 10px;
}
.case-box {
    padding: 20px 40px 20px 60px;
}
.case-box::before,.case-box::after{
content: "";
background-image: url(../images/talk.svg);
background-position: center;
background-repeat: no-repeat;
position: absolute;
width: 40px;
height: 40px;
}
.case-box::before{
left: 0;
top: 0;
}
.case-box::after {
    right: 0;
    bottom: 0;
    transform: scaleX(-1);
}
.news-box{
display: flex;
margin: 0 -10px 40px -10px;
}
.news-col{
display: flex;
flex-direction: column;
row-gap: 20px;
width: 33.33%;
padding: 0 10px;
}
.news-img,.news-title{
width: 100%;
}
.news-title p{
overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    line-clamp: 4;
    -webkit-box-orient: vertical;
}
.more-news a{
display: flex;
align-items: center;
justify-content: center;
margin: 10px 0;
justify-self: flex-end;
padding: 0 30px 0 100px;
}
.more-news a::before{
content: "";
position: absolute;
width: 80px;
height: 1px;
background-color: var(--clr-gold);
left: 0;
}
.more-news a::after {
    content: "\F285";
    position: absolute;
    top: 5px;
    right: 0;
    font-family: 'bootstrap-icons';
    font-weight: 500;
    color: var(--clr-gold);
    width: 20px;
    height: 20px;
}
.whybox ol.chklist {
    flex-direction: row;
}
.whybox  ol.chklist li {
    padding: 0 20px 0 95px;
}
.index .container.aboutus{
margin-top: 40px;
}
.header-box-col.follow{
display: none;
}
ul.peoplelist,ul.expertiselist,ul.newslist{
display: flex;
flex-wrap: wrap;
margin: 0 -10px 40px -10px;
padding: 0;
row-gap: 40px;
list-style: none;
}
ul.peoplelist li,ul.expertiselist li,ul.newslist li{
width: 33.33%;
padding: 0 10px;
}
.peoplebox,.expertiselistbox{
display: flex;
flex-direction: column;
height: 100%;
}
.newslistbox{
display: flex;
flex-direction: column;
row-gap: 10px;
}
.people-img,.peoplebox-img{
transition: all 0.5s;
}
.people-img.active .imgscale,
.peoplebox-img.active .imgscale{
cursor: pointer;
}

.people-img,.peoplebox-img{
overflow: hidden;
}
.people-img a,.peoplebox-img a,.news-img a,.newslist-img a,.expertise-img a,.expertiselist-img a{
display: block;
width: 100%;
height: 100%;
}
.people-img a::before,.peoplebox-img a::before,.news-img a::before,.newslist-img a::before,.expertise-img a::before,.expertiselist-img a::before{
content: "";
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
transition: all 0.3s;
z-index: 1;
display: flex;
justify-content: center;
align-items: center;
}

.people-img.active a::before,.peoplebox-img.active a::before,.news-img.active a::before,.newslist-img.active a::before,.expertise-img.active a::before,.expertiselist-img.active a::before{
transition: all 0.3s;
background-color: rgba(23,21,51,0.75);
}

.people-img a::after,.peoplebox-img a::after,.news-img a::after,.newslist-img a::after,.expertise-img a::after,.expertiselist-img a::after{
content: "";
font-family: "bootstrap-icons";
color: #FFF;
font-size: 50px;
position: absolute;
width: 50px;
height: 50px;
top: 50%;
transition: all 0.5s;
transform: translateY(-40%);
transform-origin: center;
left: 0;
right: 0;
margin: 0 auto;
z-index: 1;
opacity: 0;
}

.people-img.active a:after,.peoplebox-img.active a::after,.news-img.active a::after,.newslist-img.active a::after,.expertise-img.active a::after,.expertiselist-img.active a::after{
transition: all 0.3s;
opacity: 1;
transform: translateY(-50%);
}
.people-img a:after,.peoplebox-img a::after{
content: "\F3D8";
}
.news-img.active a::after,
.newslist-img.active a::after{
content: "\F50F";
}
.expertise-img.active a::after,
.expertiselist-img.active a::after{
content: "\F7BF";
}
.people-title, .peoplebox-title, .expertiselist-title {
    background-color: var(--clr-blue2);
    padding: 15px 20px;
    border-top: 3px solid var(--clr-gold);
    text-align: center;
    overflow: hidden;
    color: #FFF;
    margin-bottom: 10px;
}
.expertiselist-title {
align-content: center;
}
.index .people-title{
margin-bottom: 0;
flex: auto;
}
.people-title::before,.peoplebox-title::before, .expertiselist-title:before,.people-title::after,.peoplebox-title::after, .expertiselist-title:after{
    content: "";
    position: absolute;
    width: 60px;
    height: 100%;
    top: 0;
    display: flex;
    align-items: center;
    background-image: url(../images/thaigold.svg);
    background-repeat: no-repeat;
    background-position: center;
}
.people-title::before,.peoplebox-title::before, .expertiselist-title:before{
    left: -30px;
}
.people-title::after,.peoplebox-title::after, .expertiselist-title:after{
    right: -30px;
}
.expertiselist-title {
background-image: none;
}
.peoplebox-title h4,.expertiselist-title h4{
margin: 0;
color: #FFF;
}
.people-title h4, .peoplebox-title h4, .expertiselist-title h4 {
    margin: 0;
    color: #FFF;
    font-family: "Cormorant Garamond";
    font-size: 24px;
    font-weight: bold;
}
.peoplebox-title .rank{
font-size: 16px;
color: var(--clr-gold);
}
.peoplebox-content span{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    line-clamp: 5;
    -webkit-box-orient: vertical;
}
.news-nav{
margin: 20px 0;
}
.news-nav ul {
    display: flex;
    padding: 0;
    flex-direction: row;
    margin: 0 -5px;
    list-style: none;
    align-items: center;
    justify-content: center;
}
.news-nav li{
padding: 0 5px;
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
}
.news-nav li a{
display: flex;
align-items: center;
justify-content: center;
width: 30px;
height: 30px;
}
.news-nav li a.active{
border-radius: 100%;
background-color: var(--clr-blue1);
color: #FFF;
}
.news-nav li i::before {
    font-weight: bold !important;
}
.staff-title {
    display: inline-block;
    margin-bottom: 20px;
    border-bottom: 3px solid var(--clr-gold);
    padding-bottom: 10px;
}
.staff-title h2{
margin: 0;
}
.staff-content,.expertise-content{
margin: 20px 0;
padding: 0 40px;
}
.expertise-content{
font-size: 20px;
text-align: center;
}
.staff-content::before,.staff-content::after,.expertise-content::before,.expertise-content:after{
    content: "";
    background-image: url(../images/talk.svg);
    background-position: center;
    background-repeat: no-repeat;
    position: absolute;
    width: 24px;
    height: 24px;
}
.staff-content::before ,.expertise-content::before{
    left: 0;
    top: 0;
}
.staff-content::after{
    right: 0;
    bottom: 0;
    transform: scaleX(-1);
}
.expertise-content:after {
    right: 0;
    top: 0;
    transform: scaleX(-1);
}
ul.stafflist ,ul.expertise-contentlist{
    display: flex;
    padding: 0;
    margin: 40px 0;
    flex-direction: column;
    list-style: none;
    align-items: flex-start;
    row-gap: 16px;
}
ul.stafflist dt ,ul.expertise-contentlist dt{
    font-family: "Cormorant Garamond";
    width: auto;
    font-size: 24px;
    font-weight: bold;
    border-bottom: 2px solid var(--clr-gold);
    margin-bottom: 10px;
    padding-bottom: 10px;
}
ul.stafflist li ,ul.expertise-contentlist li{
    width: 100%;
    padding: 0 0 0 40px;
    margin: 0;
}
ul.stafflist li::before,ul.expertise-contentlist li::before{
content: "";
position: absolute;
left: 0;
top: -5px;
width: 34px;
height: 34px;
background-position: center;
    background-repeat: no-repeat;
    background-image: url(../images/bullet.svg);
    background-size: 26px;
}
.newslist-title h4{
margin-bottom: 0;
overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}
.expertiselist-content span,.newslist-content span {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
}
.container.about ol.chklist dt {
    font-size: 26px;
    font-weight: 400;
}
.container.about ol.chklist li {
    padding: 0;
    width: 100%;
    column-gap: 0;
    flex-direction: row;
    align-items: center;
    column-gap: 20px;
}
.container.about ol.chklist li::before {
    width: 50px;
    position: relative;
    font-size: 40px;
    top: 0;
}
ul.expertise-contentlist li ul {
    display: flex;
    flex-direction: column;
    list-style: none;
    padding: 0;
    margin: 20px 0;
    row-gap: 10px;
}
ul.expertise-contentlist li ul li{
padding: 0 0 0 30px;
}
ul.expertise-contentlist li ul li::before{
    content: "●";
    top: 0;
    background: none;
    color: var(--clr-gold);
}
.people-col, .people-img {
    display: flex;
    flex-direction: column;
}
.people-col{
height: 100%;
}
.navpage ul{
    display: flex;
    overflow: auto;
    flex: none;
    width: auto;
    flex-flow: row nowrap;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    margin: 0;
    padding: 0;
    -webkit-appearance: none;
    align-items: center;
    column-gap: 10px;
}
.navpage ul li {
    display: flex;
    padding: 0 25px 0 0;
    margin: 0;
    position: relative;
    scroll-snap-align: start;
    flex: none;
    color: #222;
    align-content: flex-start;
    width: auto;
    text-align: center;
}
.filter-box{
border: 1px solid #CCC;
margin-bottom: 40px;
}
.filter-row{
display: flex;
flex-wrap: wrap;
margin: 0 ;
padding: 10px;
}
.filter-col{
display: flex;
flex-direction: column;
row-gap: 10px;
}
.filter-title,
.filter-col{
padding: 10px;
}
.filter-title{
    background-color: #EEE;
    border-bottom: 1px solid #CCC;
    font-weight: 400;
}
.filter-col.col1,
.filter-col.col2{
width: 33.33%;
}

.filter-btn{
display: flex;
gap: 20px;
justify-content: center;
align-items: center;
padding: 20px;
}
.filter-btn button{
padding: 15px 20px;
width: 100%;
max-width: 300px;
}

.btn-search{
background-color: var(--clr-blue2);
color: #FFF;
width: 100%;
max-width: 300px;
}
.btn-clear{
background-color: #999;
color: #FFF;
}
.search-resualt {
    margin-bottom: 40px;
    display: flex;
    gap: 20px;
    justify-content: space-between;
    align-items: center;
}
.total-resualt,
.sort-resualt{
display: flex;
gap: 10px;
align-items: center;
}
.total-resualt label,
.sort-resualt label{
font-weight: 400;
}
.sort-resualt a {
padding: 5px 10px;
transition: all 0.3s;
}
.sort-resualt a.active{
background-color: var(--clr-blue2);
color: #FFF;
}
.filter-box select {
    background-position: 98% 50%;
    background-repeat: no-repeat;
    background-size: 14px;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-chevron-down" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708"/></svg>');
}

/* Responsive */
@media screen and (max-width:1440px) {
.header-box-row {
    column-gap: 20px;
    padding-left: 20px;
    padding-right: 20px;
}
.header-box-col.border {
    max-width: 100px;
}
ul.flexnav {
    column-gap: 20px;
}
}

@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;
}
.navpage ul li:first-child{
padding-left: 20px;
}
}

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

@media screen and (max-width:1024px) {
.container {
    margin: 0 auto;
}
.main-box {
    row-gap: 40px;
}
    .logo-mobile {
        background-color: transparent;
        box-shadow: none;
    }
    .btn-sidemenu {
        background-color: transparent;
    }
.btn-sidemenu:before{
color: #FFF;
}
.caseslide {
    width: 75%;
}
#header-inner ,.btn-sidemenu.active{
    background-color: var(--clr-blue1);
}
.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: auto;
        top: 0;
        right: 0;
        background-color: transparent;
        z-index: 1;
        padding: 0;
        transition: all 0.2s;
        box-shadow: none;
        visibility: visible;
        transform: none;
        transform-origin: top;
        opacity: 1;
        border-radius: 10px;
        column-gap: 20px;
    }
#header [class^="lang"] {
    color: #FFF;
}
    .selectlang {
        width: 100%;
    }
    .header-box-col.contact {
        justify-content: initial;
        flex-direction: column;
        row-gap: 15px;
        order: 1;
    }
    .contactme, .followme {
        column-gap: 15px;
        width: 100%;
        padding: 0;
        order: 2;
    }
    .header-box-col.follow {
    display: block;
        order: 2;
    }
    .header-box-row.submenu {
        row-gap: 30px;
    }
.index .container.expertise {
    padding: 120px 0 40px 0;
}
.index .container.case{
padding: 40px 0;
}
.expertise-title{
font-size: 20px;
}
.index .maintitle, .containertitle {
}
.peopleslide {
    display: block;
    flex-wrap: wrap;
    margin: 0;
    row-gap: 20px;
}
.peopleslide > div {
    width: auto;
    padding: 0;
}
.peopleslide .slick-list{
margin: 0 -5px;
}
.peopleslide .slick-slide{
padding: 0 5px;
}
.expertiseslide .slick-list {
    margin: 0 -5px;
}
.expertiseslide .slick-slide {
    padding: 0 5px;
}
.news-box {
    margin: 0 -5px 40px -5px;
}
.news-col{
padding: 0 5px;
}
ul.peoplelist, ul.expertiselist, ul.newslist {
    margin: 0 -5px 40px -5px;
    row-gap: 20px;
}
ul.peoplelist li, ul.expertiselist li, ul.newslist li {
    padding: 0 5px;
}
.people-title h4, .peoplebox-title h4, .expertiselist-title h4 {
    font-size: 22px;
}
.case-box::before, .case-box::after {
    width: 20px;
    height: 20px;
}
.case-box {
    padding: 20px 20px 20px 40px;
}
.filter-col.col1{
width: 100%;
}
.filter-col.col2{
width: 50%;
}
}

@media screen and (max-width:768px) {
.index .row [class^="col"] {
        width: 100%;
    }
    .news-box {
        flex-direction: column;
        row-gap: 20px;
    }
.news-col {
width: 100%;
    flex-direction: row;
    gap: 20px;
}
.news-img, .news-title {
    width: auto;
}
.news-img {
    width: 30%;
    flex: none;
}
.whybox ol.chklist {
    flex-direction: column;
}
.footer-box {
    margin-top: 40px;
}
    .footer-box-row {
        row-gap: 20px;
        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.peoplelist li, ul.expertiselist li, ul.newslist li {
        width: 50%;
    }
.container.people [class^="col"]{
width: 100%;
}
.container.about [class^="col"]{
width: 100%;
}
.contactbox-colimg,.contactbox-coltxt{
width: 100%;
flex: auto;
}
}

@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 {
        width: 100%;
    }
    .people-col {
        width: 100%;
    }
.index .container.expertise::after, .footer-box:before {
    height: 40px;
}
.maintitle .txt-title, .containertitle .txt-title {
    padding: 0;
    margin: 0 auto;
}
.maintitle:before, .containertitle:before,.maintitle:after, .containertitle:after{
display: none;
}
    .news-col {
        flex-direction: column;
    }
    .news-img, .news-title {
        width: 100%;
    }
ul.peoplelist li, ul.expertiselist li, ul.newslist li {
        width: 100%;
    }
.filter-col.col1,
.filter-col.col2{
width: 100%;
}
    .total-resualt, .sort-resualt {
        flex-direction: column;
        align-items: flex-start;
    }

}