.kanit-thin {
  font-family: "Kanit", sans-serif;
  font-weight: 100;
  font-style: normal;
}

.kanit-extralight {
  font-family: "Kanit", sans-serif;
  font-weight: 200;
  font-style: normal;
}

.kanit-light {
  font-family: "Kanit", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.kanit-regular {
  font-family: "Kanit", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.kanit-medium {
  font-family: "Kanit", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.kanit-semibold {
  font-family: "Kanit", sans-serif;
  font-weight: 600;
  font-style: normal;
}

.kanit-bold {
  font-family: "Kanit", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.kanit-extrabold {
  font-family: "Kanit", sans-serif;
  font-weight: 800;
  font-style: normal;
}

.kanit-black {
  font-family: "Kanit", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.kanit-thin-italic {
  font-family: "Kanit", sans-serif;
  font-weight: 100;
  font-style: italic;
}

.kanit-extralight-italic {
  font-family: "Kanit", sans-serif;
  font-weight: 200;
  font-style: italic;
}

.kanit-light-italic {
  font-family: "Kanit", sans-serif;
  font-weight: 300;
  font-style: italic;
}

.kanit-regular-italic {
  font-family: "Kanit", sans-serif;
  font-weight: 400;
  font-style: italic;
}

.kanit-medium-italic {
  font-family: "Kanit", sans-serif;
  font-weight: 500;
  font-style: italic;
}

.kanit-semibold-italic {
  font-family: "Kanit", sans-serif;
  font-weight: 600;
  font-style: italic;
}

.kanit-bold-italic {
  font-family: "Kanit", sans-serif;
  font-weight: 700;
  font-style: italic;
}

.kanit-extrabold-italic {
  font-family: "Kanit", sans-serif;
  font-weight: 800;
  font-style: italic;
}

.kanit-black-italic {
  font-family: "Kanit", sans-serif;
  font-weight: 900;
  font-style: italic;
}

.noto-sans-thai-<uniquifier> {
  font-family: "Noto Sans Thai", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}
body{
    font-family: "Manrope", "Noto Sans Thai", sans-serif;
    line-height: 26px;
}
.container-xxxl{
    max-width: 1920px;
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    width: 100%;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5);
    margin-right: auto;
    margin-left: auto;
}
footer.footer {
     padding-left: 15px; 
     padding-right: 15px; 
}
@media (min-width: 1200px) {
    .container-xxxl{
        padding-left: 15px;
        padding-right: 15px;
        max-width: 1920px;
    }
}
@media (min-width: 1400px) {
    .container-xxxl{
        max-width: 1920px;
    }
}
@media (min-width: 1920px) {
    body{
        font-size: 16px;
    }
}
@media only screen and (min-width: 1520px) {
    .main-header {
         padding-left: 30px; 
         padding-right: 30px; 
    }
    footer.footer {
         padding-left: 30px; 
         padding-right: 30px; 
    }
}
@media only screen and (min-width: 1921px) {
    .main-header {
         padding-left: 100px; 
         padding-right: 100px; 
    }
    footer.footer {
         padding-left: 100px; 
         padding-right: 100px; 
    }
}
.flat-title-page {
    border-radius: 0;
}
@media only screen and (min-width: 1441px) {
    .flat-title-page {
        margin-top: 0;
        margin-left: 0;
        margin-right: 0;
        border-radius: 0;
    }
}
.listing .flat-title-page,
[data-page-id="about"] .flat-title-page {
    padding-top: 200px;
    padding-bottom: 200px;
}
[data-page-id="about"] h1{
    font-size: 32px;
}
[data-page-id="about"] .wrapper-about p{
    font-size: 16px;
    line-height: 26px;
}
[data-page-id="about"] .agents-list{
    display: flex;
    justify-content: center;
}
    [data-page-id="about"] .agents-list .box-agent{
        max-width: 300PX;
    }
        [data-page-id="about"] .box-agent .content{
            display: block;
        }
[data-page-id="about"] .flat-agents h5{
    font-size: 18px;
    line-height: 30px;
}
.flat-header-wrapper-about{
    padding-bottom: 0;
}
    .flat-header-wrapper-about .item1{
        /*bottom: -5%;*/
        /*bottom: -40%;*/
        bottom: -50%;
    }
    .flat-header-wrapper-about .item2{
        top: 0;
    }
    .icon-img-svg{
        width:150px;
    }
.text-primary {
    color: #008c8b !important;
}
.btn-line{
    border: 1px solid #008c8b;
}
.btn-line:hover {
    background-color: #008c8b;
}
.tf-btn.primary {
    background-color: #008c8b;
    border-color: #008c8b;
}
.tf-btn.primary:hover{
    background-color: #076077;
}
.tf-btn:hover{
    border-color: #008c8b;
}
.header-style-2:not(.is-fixed) .tf-btn.primary{
    color: #008c8b;
}
    .header-style-2:not(.is-fixed) .tf-btn.primary svg path{
        stroke: #008c8b;
    }
.mobile-button::before,
.mobile-button::after,
.mobile-button span{
    background-color: #008c8b;
}
.mobile-menu .navigation li:hover > a, 
.mobile-menu .navigation li.current > a, 
.mobile-menu .navigation li.current li.current > a{
    color: #008c8b;
}
[data-page-id="home"] .mobile-button::before,
[data-page-id="home"] .mobile-button::after,
[data-page-id="home"] .mobile-button span{
    background-color: #fff;
}
[data-page-id="home"] .main-header.is-fixed .mobile-button::before,
[data-page-id="home"] .main-header.is-fixed .mobile-button::after,
[data-page-id="home"] .main-header.is-fixed .mobile-button span{
    background-color: #008c8b;
}
.flat-blog-item .date-post{
    background-color: #008c8b;
}
.flag-tag.primary {
    background-color: #008c8b;
}
.flag-tag:hover {
    background-color: #008c8b;
}
.flat-tab-form .nav-tab-form.style-1 .nav-link-item.active, .flat-tab-form .nav-tab-form.style-1 .nav-link-item:hover {
    background-color: #008c8b;
    border-color: #008c8b;
}
.flat-tab-form .nav-tab-form.style-1 .nav-link-item::after{
    border-top: 6px solid #008c8b;
}
.link:hover {
    color: #008c8b !important;
}
.progress-wrap{
    bottom: 60px;
}
    .progress-wrap svg path{
        stroke: #008c8b;
    }
    .progress-wrap::after{
        color: #008c8b;
    }
.spinner{
    border-top: 3px solid #008c8b;
}
.preload-container .icon{
    color: #008c8b;
}
.nice-select .option:hover, .nice-select .option.focus, .nice-select .option.selected.focus{
    color: #008c8b;
}
.sw-pagination .swiper-pagination-bullet-active {
    background-color: #008c8b !important;
}
.sw-pagination .swiper-pagination-bullet::before{
    border: 1px solid #008c8b;
}
.body-3{
    font-size: 22px;
    font-weight: 400;
    line-height: 28px;
}
.main-header .main-menu .navigation > li > a::before{
    background: #008c8b;
}
.main-header .main-menu .navigation > li > ul > li:hover > a{
    color: #008c8b;
}
.main-header .main-menu .navigation > li > ul > li > a:before{
    color: #008c8b;
}
.main-header .main-menu .navigation > li > ul > .current > a {
    color: #008c8b;
}
.nav-tab-recommended .nav-link-item.active, .nav-tab-recommended .nav-link-item:hover{
    background-color: #008c8b;
}
.animationtext.slide span{
    display: block;
    width: 100%;
}
.animationtext.slide .item-text{
    font-size: 50px;
}
.animationtext.slide .item-text.is-visible{
    top: 15px;
}
.animationtext.clip .item-text{
    font-size: 60px;
}
.animationtext.clip .cd-words-wrapper::after{
    background-color: #008c8b;
}
.flat-slider.home-1 .slider-content .subtitle{
    padding-top: 30px;
    font-size: 22px;
}
.flat-slider.home-1.hob {
    background-image: url(../images/hob/banner.jpg);
}
    .flat-slider.home-1.hob .slider-content{
        padding: 150px 0px 80px;
    }
        .flat-slider.home-1.hob .slider-content .subtitle{
            padding: 0px 100px;
        }
.hob .intro .box-title{
    max-width: 70%;
}
    .hob .box-title p.desc{
        font-size: 18px;
        line-height: 30px;
    }
.box-icon.line:hover{
    color: #008c8b;
}
.box-location:hover .content .box-icon{
    background-color: #008c8b;
    border-color: #008c8b;
}
.box-service:hover .tf-btn {
    background-color: #008c8b;
}
.box-benefit .icon-box .icon{
    color: #008c8b;
}
.box-tes-item .icon-quote {
    color: #008c8b;
}
.box-agent:hover .content .icon {
    background-color: #008c8b;
}
.box-agent .box-img .agent-social li:hover .icon {
    color: #008c8b;
}
.partner-item:hover svg path {
    fill: #008c8b;
}
.box-icon.social:hover{
    background-color: #008c8b;
    border-color: #008c8b;
}
.footer .top-footer{
    padding: 30px 0px;
}
.navigation-menu-footer li a:hover {
    color: #008c8b;
}
.navigation-menu-footer li a::after{
    background: #008c8b;
}
.flat-slider.home-1 .overlay{
    opacity: 0.4;
}
.flat-slider.home-5 .overlay{
    background: rgb(0 0 0 / 40%);
}
.flat-slider.home-5 .thumbs-swiper-column1 .swiper-wrapper .swiper-slide{
    height: 68px !important;
}
.flat-slider.home-5 .thumbs-swiper-column1 .swiper-wrapper .image-detail{
    height: 68px;
}
.strengths-section{
    padding-top: 10px;
    /*padding-bottom: 20px;*/
    /*background-color: #eff3f4;*/
    background-color: #008c8b;
}
    .strengths-section .box-benefit{
        background-color: transparent;
    }
    .strengths-section .box-benefit:hover{
        transform: none;
    }
    .strengths-section .box-benefit .icon-box .icon{
        color: #fff;
    }
    .strengths-section .box-benefit .icon-box.icon-svg{
        width: 60px;
        height: 60px;
    }
        .strengths-section .box-benefit .icon-box svg{
            width: 100%;
            height: 100%;
            /*color: #008c8b;*/
            color: #fff;
        }
    .strengths-section .box-benefit h5{
        font-size: 22px;
        line-height: 50px;
        /*color: #008c8b;*/
        color: #fff;
    }
    .strengths-section .international-network-item:before{
        border-left: 1px solid #dbdbdb;
    }
    .strengths-section .international-network-item:after{
        border-left: 1px solid #dbdbdb;
    }
.strengths-section.home-5{
    margin-top: 114px;
    padding-bottom: 55px;
    /*background-color: #eff3f4;*/
}
    .strengths-section.home-5 .international-network-item{
        position: relative;
    }
    .strengths-section.home-5 .international-network-item:before{
        content: '';
        display: block;
        position: absolute;
        left: 0;
        top: 50%;
        transform: translate(0, -50%);
        height: 60%;
        border-left: 1px solid #088180;
    }
    .strengths-section.home-5 .international-network-item:after{
        content: '';
        display: block;
        position: absolute;
        right: 0;
        top: 50%;
        transform: translate(0, -50%);
        height: 60%;
        border-left: 1px solid #088180;
    }
    .strengths-section.home-5 .box-benefit .icon-box svg{
        color: #008c8b;
    }
        .strengths-section.home-5 .box-benefit .icon-box svg path{
            fill: #fff !important;
        }
    .strengths-section.home-5 .box-benefit h5{
        /*color: #008c8b;*/
    }
.flat-service .image.icon .icon-img-svg{
    width: 60px;
    /*height: 60px;*/
}
.flat-slider.home-5{
    /*margin-bottom: 0;*/
}
.flat-spacing-service{
    /*margin-top: 0;*/
    padding-top: 230px;
}
.main-header .logo-box .logo img.logo-white{
    display: none;
}
    [data-page-id="home"] .main-header .logo-box .logo img.logo-white{
        display: inline-block;
    }
.main-header .logo-box .logo img.logo-black{
    display: inline-block;
}
    [data-page-id="home"] .main-header .logo-box .logo img.logo-black{
        display: none;
    }
.flat-title-page h1{
    font-size: 46px;
}
.property-listing{
    padding-top: 50px;
}
.wd-navigation .nav-item:hover, .wd-navigation .nav-item.active{
    background-color: #008c8b;
}
[data-page-id="about"] .flat-header-wrapper-about .desc{
    font-size: 16px;
}
@media only screen and (max-width: 1366px) {
    .animationtext.clip.title-large{
        font-size: 50px;
        line-height: 56px;
    }
    .animationtext.clip .item-text{
        font-size: 40px;
    }
    .slider-content p.subtitle.body-3{
        font-size: 20px;
    }
}
@media only screen and (max-width: 900px) {
    .animationtext.clip .title-large{
        font-size: 44px;
        line-height: 50px;
    }
    .animationtext.clip .item-text{
        font-size: 30px;
    }
}
@media only screen and (max-width: 575px) {
    .main-header{
        height: 60px;
    }
        .main-header .close-btn{
            top: 15px;
            right: 12px;
        }
    .animationtext.slide .item-text{
        font-size: 26px;
    }
    .animationtext.clip .item-text{
        font-size: 20px;
    }
    .flat-slider.home-1.hob .slider-content .subtitle{
        padding: 0px 15px;
        font-size: 16px;
    }
    .slider-content p.subtitle.body-3{
        margin-top: 5px;
        font-size: 18px;
    }
    .flat-spacing-service{
        padding-top: 460px;
    }
    [data-page-id="about"] h1{
        font-size: 30px;
    }
}