@media (max-width: 1024px){
    header .navbar-center {
        display: none;
    }
}
@media (max-width: 920px){
    h1, h2 {
        font-size: 40px;
        line-height: 46px;
    }
    h3, .sm-h3 {
        font-size: 32px;
        line-height: 42px;
    }
    h4, .font-h4, .sm-24 {
        font-size: 24px;
        line-height: 34px;
    }
    h5 {
        font-size: 20px;
        line-height: 30px;
    }
    h6 {
        font-size: 20px;
        line-height: 30px;
    }

    header .navbar-center {
        display: none;
    }
    .banner .item img {
        height: 600px;
    }

    section {
        padding: 50px 0px;
    }
    .project-box .img img {
        height: 230px;
    }
    .home-about h2 {
        width: 470px;
        max-width: 100%;
        padding: 0px 5px;
    }
    .home-about img {
        margin-top: -92px;
        height: 645px;
        object-fit: cover;
        object-position: center;
    }
    .container {
        width: 750px;
        max-width: 100%;
    }
    .container.is-628 {
        width: 628px;
    }
    .home-life {
        margin-bottom: 30px;
    }

    .article-box.is-land {
        display: block;
        margin-bottom: 10px;
    }
    .article-box.is-land img {
        width: 100%;
        height: 398px;
    }
    footer .footer-menu {
        margin-bottom: 30px;
    }

    .project-cover .row > div{
        height: 735px;
        min-height: auto;
        padding: 0px;
    }
    .project-cover h3 {
        font-size: 24px;
        line-height: 34px;
        margin-bottom: 15px;
    }
    .project-cover .logo {
        width: 150px;
        height: 60px;
    }
    .project-cover .text {
        max-width: 42vw;
    }
    .project-cover.style-2 .text {
        padding-left: 20px;
    }
    .project-vdo img {
        width: 100%;
        height: 706px;
        object-fit: cover;
        object-position: center;
    }
    .project-gallery .item .img {
        width: 100%;
        height: 428px;
        object-fit: cover;
        object-position: center;
    }
    .project-gallery-box h5 {
        padding: 35px 15px;
        font-size: 16px;
        line-height: 22px;
        font-weight: 500;
    }
    .tab-register {
        width: 630px;
        max-width: 100%;
    }
    .project-virtual .select {
        width: 412px;
    }
    .project-pro img {
        width: 100%;
        height: 168px;
        object-fit: cover;
        object-position: center;
    }
    .project-pro h6 {
        font-size: 16px;
        line-height: 24px;
        margin-top: 0px;
    }
    .project-pro .text .btn {
        margin-top: 5px;
    }
    .project-article .row > div {
        width: 520px;
        max-width: 100%;
        display: inline-block;
    }
    .project-article .row {
        display: inline-block;
    }
    .project-article .text {
        width: 100%;
        text-align: left;
    }
    .project-article h4 {
        margin: 15px 0px 20px;
    }
    .project-article .item {
        margin-top: 35px;
    }
    .project-article .item:nth-child(even) .row > div {
        float: right;
    }
    .project-article .item:nth-child(even) .row > div .text {
        text-align: right;
    }
    .tab-info .nav-tabs {
        justify-content: space-around;
        gap: 10px;    
    }
    .tab-info ul.nav-tabs li {
        padding: 5px;
        flex: 1;
        text-align: center;
    }
    .tab-info .row, .project-neigh {
        display: flex;
        flex-wrap: wrap;
    }
    .tab-info .tab-content ul {
        margin-bottom: 30px;
    }
    .project-neigh .item {
        width: 33.33%;
    }
    .progress-box {
        width: 100%;
    }
    .project-plan-box .select-result img {
        height: 428px;
    }
    .project-plan-box h4 {
        text-align: center;
    }
    .project-map {
        height: 296px;
    }
    .tab-info .nav-tabs a {
        font-weight: 300;
    }
    .tab-info .nav-tabs .active a {
        font-weight: 400;
    }
    .loan-form .form-control {
        padding: 5px 0px;
        font-size: 16px;
    }
    .input-unit {
        font-size: 16px;
        font-weight: 400;
    }
    .loan-calc {
        margin-top: 0px;
    }
    .loan-calc h2 {
        font-size: 52px;
        margin-top: 35px;
        padding-bottom: 10px;
        border-bottom: 1px solid #D9D9D9;
    }
    .project-gallery-box.style-2 {
        padding: 40px 0px 40px 35px;
    }
    .project-gallery-box.style-2 .inner {
        padding: 45px 35px;
    }
    .project-gallery-box.style-2 .item .img {
        height: 325px;
    }
    .project-gallery-box.style-2 h5 {
        margin: 0px 0px 35px;
    }
    .project-gallery-box.style-2:after {
        height: 100%;
    }

    .project-cover.style-3 .img {
        height: 550px;
    }
    .project-cover.style-3 .row > div {
        height: auto;
    }
    .project-cover.style-3 .text {
        width: 628px;
    }
    .project-cover.style-3 .logo {
        height: 90px;
    }
    .tab-info ul.col-4 {
        column-count: 2;
    }

    .project-condo-modern .project-article .item:nth-child(odd) .row > div, .project-tower .project-article .item:nth-child(odd) .row > div, .project-modern-housing .project-article .item:nth-child(odd) .row > div {
        float: right;
    }
    .project-condo-modern .project-article .item:nth-child(odd) .row > div .text, .project-tower .project-article .item:nth-child(odd) .row > div .text, .project-modern-housing .project-article .item:nth-child(odd) .row > div .text {
        text-align: right;
    }
    .project-condo-modern .project-article .item:nth-child(even) .row > div, .project-tower .project-article .item:nth-child(even) .row > div, .project-modern-housing .project-article .item:nth-child(even) .row > div {
        float: left;
    }
    .project-condo-modern .project-article .item:nth-child(even) .row > div .text, .project-tower .project-article .item:nth-child(even) .row > div .text, .project-modern-housing .project-article .item:nth-child(even) .row > div .text {
        text-align: left;
    }

    .project-tower .tab-info ul.col-4 {
        column-count: 1;
        margin-bottom: 0px;
    }

    .project-cover .text.is-hot-deal h3 {
        font-size: 32px;
        margin-bottom: 0px;
    }
    .project-cover .text.is-hot-deal h4 {
        font-size: 20px;
    }
    .project-cover .text.is-hot-deal ul li {
        margin-top: 5px;
    }
    .project-cover .text.is-hot-deal {
        width: 100%;
        padding: 45px 35px !important;
    }
    .project-cover .text.is-hot-deal .logo {
        margin: 0 auto;
        display: block;
    }

    .promotion-box .item {
        width: 523px;
        max-width: 100%;
        clear: both;
        display: inline-block;
        margin-top: 40px;
    }
    .promotion-box .item .img, .promotion-box .item .text {
        width: 100%;
    }
    .promotion-box .item .text {
        padding: 20px 0px 0px;
    }
    .promotion-box .item .text h4 {
        width: 440px;
    }
    .promotion-box .item:nth-child(even) {
        float: right;
    }

    .banner.is-pro .img, .banner.is-pro-detail .item img {
        height: 550px !important;
    }
    .banner.is-pro .item .text {
        width: 720px;
    }
    .banner.is-pro-detail .item .text {
        width: 640px;
    }

    .project-related-section .container {
        width: 100%;
        padding: 0px;
    }

    .news-highlight-section .container {
        width: 100%;
        padding: 0px;
    }
    .article-box.is-highlight .text {
        width: 767px;
        left: calc((100% - 727px) / 2);
        bottom: 50px;
    }
    .news-box .item {
        display: block;
    }
    .news-box .item .article-box {
        width: 100% !important;
        padding-bottom: 0px;
        margin-bottom: 40px;
    }
    .news-box .item .article-box img {
        display: block !important;
        height: auto;
    }

    .cover img {
        width: 100%;
        height: 550px;
        object-fit: cover;
        object-position: center;
    }
    .article-detail {
        width: 628px;
        padding: 0px 15px;
    }

    .form-construction .checkbox {
        margin-bottom: 0px;
    }
    .form-construction .form-group, .form-construction h6 {
        margin-bottom: 30px;
    }
    .form-construction table {
        font-weight: 400;
    }
    .form-construction table tr > th:first-child, .form-construction table tr > td:first-child{
        display: none;
    }
    .form-construction .input-upload {
        margin-top: 0px;
    }

    .blog.style-2 .row {
        display: block;
        width: 525px;
        max-width: 100%;
    }
    .blog.style-2 .item {
        width: 100%;
        display: inline-block;
    }
    .blog.style-2 .item img {
        width: 100%;
    }
    .blog.style-2 .item .img {
        margin-bottom: 20px;
    }
    .blog.style-2 .item:nth-child(even) .row {
        float: right;
    }

    .banner.is-height-auto .item img {
        height: 550px;
    } 
    .title:not(.sec-title) br {
        display: none;
    }
    .blog-img .text {
        width: 420px;
    }
    .blog-img .download-box {
        width: 100%;
    }

    .banner-vdo {
        height: 578px;
    }
    .banner-vdo .img {
        height: 382px;
    }
    .banner-vdo .text h2 {
        font-size: 40px;
        line-height: 50px;
    }
    .banner-vdo .img i {
        width: 82px;
        height: 82px;
    }
    .link-section {
        display: none;
    }

    .lifescape-box .head {
        width: 100%;
        white-space: nowrap;
        overflow-x: auto;
        margin-bottom: 40px;
        background: #FFFFFF;
        box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.05);
        display: inline-block;
    }
    .lifescape-box .head .item {
        width: auto;
        display: inline-block;
        padding-right: 30px;
        margin-bottom: 15px;
    }
    .lifescape-box .body {
        width: 100%;
    }
    .lifescape-box .body .item .img {
        width: 420px;
        height: 420px;
    }
    .lifescape-box .body .item .text {
        width: 250px;
    }
    .section-petscape .content {
        margin: 0px auto 30px;
    }
    .section-petscape .content p {
        margin-bottom: 25px;
    }
    .number-run {
        overflow: hidden;
    }
    .number-run .item {
        float: left;
        width: 50%;
        display: inline-block;
    }

    .logo-box .btn-box {
        margin-top: 30px;
    }
    .logo-box .btn-box .btn {
        margin-top: 0px;
        width: calc(50% - 20px);
        flex: auto;
    }

    .logo-box .row.is-reverse > div:nth-child(odd) {
        float: initial;
    }
    .logo-box .row.is-reverse {
        text-align: left;
    }
    .logo-box .img {
        width: 100%;
        margin-bottom: 25px;
    }
    .logo-box .form-group {
        margin-top: 30px;
        margin-bottom: 20px;
    }

    .row.is-middle.row.is-reverse {
        display: block;
    }
    .row.is-reverse > div:nth-child(odd) {
        float: initial;
    }
    .logo-color .img {
        margin-bottom: 40px;
    }

    .blog-icon .row {
        display: flex;
        flex-wrap: wrap;
    }

    .blog-full .item {
        width: 100%;
    }
    .blog-full .item .text {
        min-height: 480px;
    }
    .highlight-box .row {
        min-height: 170px;
    }

    .contact-map {
        height: 300px;
        width: 100%;
        object-fit: cover;
        object-position: center;
        margin-bottom: 40px;
    }

    .position-box {
        width: 100%;
    }


    .f-control {
        position: fixed !important;
        top: 0px !important;
        left: 0px !important;
        width: 100% !important;
        height: 100% !important;
        padding: 50px !important;
        background: #fff;
        z-index: 2000;
        overflow-y: auto;
        display: none;
    }
    .f-control .f-head {
        padding: 0px 0px 35px;
        border-bottom: 1px solid #d9d9d9;
        position: relative;
        text-align: center;
        margin-bottom: 20px;
    }
    .f-control .f-close {
        width: 50px;
        position: absolute;
        right: 0px;
        top: -5px;
    }
    .f-control .f-head h6 {
        font-size: 32px;
        line-height: 42px;
    }
    .f-control .checkbox label {
        padding-left: 40px;
        font-weight: 500;
    }
    .f-control .checkbox label::before {
        top: -1px;
        width: 24px;
        height: 24px;
    }
    .f-control .checkbox {
        margin-top: 12px !important;
        margin-bottom: 12px !important;
    }
    .f-control .checkbox input:checked + label::before {
        font-size: 14px;
        line-height: 19px;
    }

    .ft-control {
        border: 1px solid #D9D9D9;
        padding: 15px 15px ;
        margin-bottom: 40px;
    }
    .ft-control .ft-head {
        position: relative;
    }
    .ft-control .ft-close, .ft-control .ft-dropdown {
        position: absolute;
        right: 0px;
        top: 0px;
        padding: 5px;
    }
    .ft-control .ft-close, .ft-control .ft-body {
        display: none;
    }
    .ft-control .ft-box {
        border: 1px solid #D9D9D9;
        position: relative;
        padding: 7px 12px;
        margin-top: 15px;
    }
    .ft-control .ft-box i {
        float: right;
        width: 22px;
        height: 22px;
    }

    .position-box .position-search {
        margin-bottom: 5px;
    }
    .table-career tbody tr {
        display: inline-block;
        width: 100%;
        border-top: 1px solid #D9D9D9;
        padding: 15px 12px;
        position: relative;
        padding-right: 100px;
    }
    .table-career tbody td {
        display: inline-block;
        width: 100%;
        padding: 7.5px 0px !important;
        border: 0px !important;
    }
    .table-career tbody td:last-child {
        position: absolute;
        right: 15px;
        top: 12px;
        width: auto;
        display: inline-block;
    }
    .btn-sm-block {
        width: 100% !important;
    }

    .sec-text {
        min-height: 340px;
    }
    .sec-text.is-bg {
        min-height: 824px;
    }

    .life-section {
        margin: 0px;
    }
    .life-grid .item {
        width: calc(50% - 20px);
    }

    header .navbar-right {
        margin-right: 0px;
    }

    .article-box.is-highlight img {
        height: 550px;
    }

    header .navbar .navbar-toggle {
        margin-right: -15px;
    }
    header.for-ir .navbar-center {
        display: none;
    }

    .sum-box .item {
        width: 50%;
        border: 0px;
    }
    .section-seo {
        margin-top: 50px;
    }
    .section-seo .img {
        width: 306px;
        margin-top: -480px;
    }
    .section-seo .text {
        padding: 105px 0px 90px;
    }
    .doc-box {
        gap: 0px;
        margin-top: -60px;
    }
    .doc-box .item {
        width: 100%;
        border: 0px;
        padding: 40px 15px;
        border-top: 1px solid #000;
        margin: 0px;
    }
    .doc-box .item:first-child {
        border: 0px;
    }
    .section-seo {
        margin-top: 0px;
    }
    .section-seo .container {
        width: 750px;
    }
    .section-seo.style-2 .row.is-middle {
        display: block;
    }
    .section-seo.style-2 .text h3 {
        text-align: center;
    }
    .section-seo.style-2 .text h3 br {
        display: none;
    }
    .section-seo.style-2 .row.is-reverse-mobile > div:nth-child(odd) {
        float: initial;
    }
    .section-seo.style-2 .img {
        width: 412px;
        margin-top: -100px;
    }
    .section-seo.style-2 .text-right {
        text-align: center;
    }
    .section-seo.style-2 .text {
        padding: 60px 0px 20px;
    }
    .people-box .item {
        width: calc((50% - 15px));
    }
    .people-box .item .img {
        height: 50vw;
    }
    .sitemap > li > a, .sitemap .sub {
        width: 100%;
    }
    .sitemap .sub {
        margin-top: -20px;
        column-count: 1;
        display: flex;
        flex-wrap: wrap;
    }
    .sitemap .sub li {
        width: 50%;
    }
    .sitemap .sub a {
        padding-right: 15px;
    }
    .newslter-box {
        width: 542px;
    }

    .project-filter .select-dropdown-option:before {
        display: none;
    }
    .project-filter .select-dropdown-option, .project-filter .select-dropdown-option .radio label {
        color: #000;
    }
    .project-filter .select-dropdown-option .option {
        display: inline-block;
    }
    .project-filter .select-dropdown-option .radio:not(.is-logo) {
        margin: 0px !important;
        width: 100%;
    }
    .project-filter .select-dropdown-option .radio:not(.is-logo):first-child {
        margin-top: -20px !important;
    }
    .project-filter .select-dropdown-option .radio:not(.is-logo) label {
        width: 100%;
        padding: 30px 0px;
        text-align: left;
        border-bottom: 1px solid #d9d9d9;
        margin: 0px;
    }
    .project-filter .select-dropdown-option .radio.is-logo {
        float: left;
        width: 25%;
        margin: 15px 0px;
    }
    .project-filter .select-dropdown-option .radio.is-logo img {
        filter: brightness(0) invert(1);
    }
    .project-filter .f-body.is-logo {
        background: #25333C;
        display: inline-block;
    }
    .project-filter .f-head, .project-filter .ft-control {
        display: block;
    }

    .coming {
        font-size: 48px;
        line-height: 58px;
    }

    .search-result .img {
        width: 304px;
    }
    .search-result .text {
        width: calc(100% - 304px);
    }

    .article-box > img {
        width: 100%;
        height: 200px;
    }

    .project-virtual .select-option .item iframe {
        width: 100%;
        height: 50vw;
    }

    /* 2023-12 */
    .blog-full .item {
        min-height: 480px;
    }
}

@media (max-width: 767px){
    h1, h2, .xs-h1, .xs-h2 {
        font-size: 32px;
        line-height: 42px;
    }
    h3, .xs-h3 {
        font-size: 32px;
        line-height: 42px;
    }
    h4, .xs-h4, .f-control .f-head h6 {
        font-size: 24px;
        line-height: 34px;
    }
    h5, .xs-h5 {
        font-size: 20px;
        line-height: 30px;
    }
    h6, .xs-h6 {
        font-size: 20px;
        line-height: 30px;
    }

    #cookie .row {
        display: block;
        text-align: center;
    }
    #cookie .text-right {
        text-align: center;
    }
    #cookie .btn {
        margin-top: 20px;
    }

    header .navbar-brand img {
        height: 24px;
    } 
    header {
        padding: 4px 0px !important;
    }
    header .navbar-brand, header.scroll .navbar-brand {
        padding-top: 4px;
        padding-bottom: 4px;
    }
    header .navbar {
        min-height: auto;
    }
    header #bar {
        display: block;
        position: fixed;
        right: 0px;
        top: 0px;
        border: 0px;
        height: 40px;
        margin: 0px;
        border: 0px;
        box-shadow: none;
    }
    header #bar > .navbar-right {
        display: flex;
        margin: 0px;
    }
    header .navbar .navbar-nav>li>a {
        padding: 10px 10px !important;
        font-size: 14px;
        line-height: 18px;
    }
    header .navbar .navbar-toggle .icon-bar {
        width: 34px;
    }
    header .navbar .navbar-toggle {
        padding: 8px 0px 10px 10px !important;
    }
    header .navbar .icon-bar+.icon-bar {
        margin-top: 7px;
    }
    header #menu {
        top: auto;
        bottom: 0px;
        border: 0px;
        width: 100vw;
        margin: 0px;
        height: calc(100vh - 40px) !important;
        padding-bottom: 60px;
        box-shadow: none !important; 
    }
    header .navbar .navbar-toggle:not(.collapsed) {
        top: 20px;
    }
    header .navbar .navbar-toggle:not(.collapsed) .icon-bar {
        background: #fff;
    }

    body.open header .nav-search, body.open header .nav-lang {
        display: none;
    }

    .m-icon {
        width: 16px;
        height: 16px;
    }

    .banner .item img {
        height: 100vh;
    }
    .banner .item .text {
        width: 358px;
        max-width: 100%;
        top: 62%;
    }
    .scroll-down {
        background: transparent;
    }

    section, .sec-blog {
        padding: 50px 0px;
    }
    .project-box .img img {
        height: 68vw;
    }
    .home-about img {
        margin-top: -138px;
    }
    .home-pet .img {
        margin-bottom: 20px;
    }
    .home-life .title {
        padding: 0px 15px;
    }
    .life-slide {
        padding-left: 15px;
    }
    .life-box .text .btn {
        padding: 8.5px 20px;
        min-width: 150px;
    }
    .life-box .text h5 {
        font-size: 16px;
        margin-bottom: 0px;
    }
    .article-box {
        margin-bottom: 15px;
    }
    .article-box .text {
        padding: 15px 0px 10px;
    }

    footer .footer-contact {
        text-align: center;
    }
    footer .footer-social {
        justify-content: center;
        margin-top: 20px;
    }
    footer .footer-social a i{
        width: 24px;
        height: 24px;
    }
    footer .footer-menu {
        margin-top: 20px;
    }
    footer .copyright {
        margin: 35px 0px 0px;
    }
    footer .copyright, footer .copyright > * {
        text-align: center;
    }
    footer .copyright ul {
        justify-content: center;
        margin-bottom: 20px;
    }

    .project-cover.style-2 .row > div:nth-child(odd) {
        float: left;
    } 
    .project-cover .row > div {
        width: 100%;
        height: auto;
        display: inline-block;
    }
    .project-cover .img {
        width: 100%;
        height: 465px;
    }
    .project-cover .text {
        width: 305px;
        max-width: initial;
        padding: 50px 0px;
    }
    .project-vdo img {
        height: 358px;
    }
    .project-vdo i {
        width: 66px;
        height: 66px;
    }
    .project-gallery .item .img {
        height: 285px;
    }
    .project-gallery .owl-nav button.owl-next, .project-gallery .owl-nav button.owl-prev {
        width: 24px;
        margin-top: -20px;
    }
    .project-gallery-box h5 {
        padding: 20px 10px;
    }
    .tab-register .nav-tabs>li.active>a {
        font-weight: 500;
        color: #425563;
    }
    .btn-social-box {
        gap: 0px;
    }
    .btn-social-box .btn {
        width: 100%;
    }
    .project-pro {
        margin-left: -15px;
        max-width: calc(100% + 30px);
    }
    .project-pro img {
        height: 292px;
    }
    .project-pro .container {
        justify-content: center;
    }
    .project-article .row > div {
        width: 100%;
    }
    .project-article .item .text {
        text-align: left !important;
    }

    .tab-info .nav-tabs {
        white-space: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        justify-content: unset;
    }
    .tab-info .nav-tabs li {
        padding-left: 0px;
        padding-right: 0px;
    }
    .form-brochure {
        padding-bottom: 20px;
    }
    .form-brochure .btn {
        width: 100%;
    }
    .project-plan-box {
        padding-bottom: 0px;
    }
    .project-plan-box .select-result img {
        height: 308px;
    }
    .project-plan-box .form-control {
        margin-bottom: 15px;
    }
    .tab-loc .nav-tabs {
        justify-content: space-between;
        gap: 0px;
    }
    .tab-loc .nav-tabs li {
        width: 50%;
        text-align: center;
    }
    .project-map {
        height: 265px;
    }
    .tab-loc .tab-content {
        padding: 35px 0px;
    }

    .tab-loan ul.nav-tabs {
        white-space: normal;
        overflow-x: hidden;
        flex-wrap: wrap;
        width: 100%;
    }
    .tab-loan ul.nav-tabs li {
        width: 50%;
        min-width: initial;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .tab-loan .btn {
        width: 100%;
    }
    .loan-calc {
        column-count: 1;
        text-align: left;
    }
    .loan-calc h2 {
        margin-top: 30px;
    }
    .loan-calc .item:not(:last-child) {
        margin-bottom: 35px;
    }
    
    .project-gallery-box.style-2 {
        padding: 15px 0px 15px 15px;
    }
    .project-gallery-box.style-2 .inner {
        padding: 35px 20px;
    }
    .project-gallery-box.style-2:after {
        height: 100%;
    }
    .project-gallery-box.style-2 h5 {
        font-size: 20px;
        text-align: center;
        margin-bottom: 25px;
    }
    .project-gallery .owl-nav button.disabled {
        display: none !important;
    }
    .project-gallery-box.style-2 .item .img {
        height: 264px;
    }
    .project-gallery.style-2 .owl-nav button.owl-next {
        right: -10px;
    }
    .project-gallery.style-2 .owl-nav button.owl-prev {
        left: -10px;
    }

    .project-neigh .item {
        width: 50%;
    }

    .project-cover.style-3 .img {
        height: 465px;
    }
    .project-cover.style-3 .text {
        padding: 60px 40px 70px;
    }

    .tab-info ul.col-4 {
        column-count: 1;
    }

    .banner.is-pro .item .img, .banner.is-pro-detail .item .img {
        height: 348px !important;
    }
    .banner.is-pro .item .text {
        width: 100%;
        padding: 15px;
    }
    .banner.is-pro .item .text h2 {
        font-size: 24px;
        line-height: 34px;
    }
    .banner.is-pro-detail .item .text {
        width: 355px;
    }
    .banner .owl-dots .owl-dot {
        width: 70px;
    }

    .font-h4 {
        font-size: 32px;
        line-height: 42px;
    }
    .mobile-no-margin-top {
        margin-top: 0px;
    }
    .mobile-no-margin-bottom {
        margin-bottom: 0px;
    }
    .mobile-no-margin {
        margin: 0px;
    }
    .promotion-box {
        margin-bottom: 40px;
    }
    .promotion-box .item {
        margin-top: 30px;
        text-align: left !important;
    }

    .news-box {
        margin-top: 35px;
    }
    .news-box .item .article-box {
        margin-bottom: 35px;
    }
    .article-box .type {
        margin-bottom: 5px;
    }
    .cover img {
        height: 348px;
    }

    .banner.is-height-auto .item img {
        height: 348px;
    }
    .banner.is-height-auto .item .text {
        top: 50%;
    }
    .blog-list .item {
        padding: 40px 0px 10px;
    }
    .blog-list ul {
        column-count: 1;
        font-size: 16px;
        line-height: 22px;
        font-weight: 400;
    }
    .blog-list ul li {
        margin-bottom: 10px;
    }
    .tree {
        padding: 0px;
        margin-top: 30px;
    }
    .tree .item {
        padding: 0px !important;
        text-align: left !important;
        margin-bottom: 30px;
    }
    .tree::before {
        display: none;
    }
    .tree .no {
        font-size: 32px;
        line-height: 42px;
        font-weight: 500;
    }

    .input-upload ul {
        width: 100%;
        margin-top: 10px;
        margin-bottom: 0px;
        padding-left: 0px;
    }

    .blog.style-2 .row {
        width: 100%;
        display: inline-block;
        margin: 0px;
    }
    .blog.style-2 .detail > .row.is-small {
        margin-left: -10px;
        width: calc(100% + 20px);
        margin-top: 5px;
    }
    .blog.style-2 .item {
        margin-bottom: 30px;
    }
    .blog.style-2 .item:nth-child(even) .row {
        float: initial;
        text-align: left;
    }

    .download-box {
        justify-content: center;
    }
    .download-box .item {
        width: 235px;
        max-width: 100%;
    }

    .banner-vdo {
        height: 100vh;
    }
    .banner-vdo .text h2 {
        font-size: 32px;
        line-height: 42px;
        padding: 0px 20px;
    }
    .banner-vdo .img {
        height: 70vh;
    }
    .banner-vdo .img img {
        object-fit: cover;
    }
    .banner-vdo .text {
        top: 30%;
    }
    .lifescape-box .body .item .img {
        width: 100%;
        height: calc(100vw - 30px);
    }
    .lifescape-box .body .item .text {
        position: relative;
        width: 100%;
        margin-top: -130px;
    }
    .lifescape-box .body .item .text h2 {
        font-size: 52px;
        line-height: 56px;
    }
    .number-run .item {
        width: 100%;
    }
    .logo-box .form-group {
        margin-top: 20px;
    }
    .logo-box .btn-box .btn {
        margin-top: 0px;
        width: calc(100% - 20px);
        flex: auto;
    }

    .blog-icon .item {
        width: 50%;
    }
    .blog-icon .item img {
        width: 100px;
        height: 100px;
    }
    .blog-icon .row  {
        display: flex;
        flex-wrap: wrap;
    }

    .highlight-box {
        padding: 60px 0px;
        margin-left: -15px;
        width: calc(100% + 30px);
    }
    .highlight-box .row {
        display: inline;
    }
    .highlight-box h4 {
        font-size: 16px;
        line-height: 24px;
    }
    .highlight-box .btn {
        min-width: 200px;
        margin-top: 10px;
    }

    .mobile-no-padding-bottom {
        padding-bottom: 0px;
    }

    .content-h645 {
        height: auto;
        display: block;
        padding: 70px 20px;
    }

    .title {
        margin-bottom: 30px;
    }

    .job-content {
        margin-top: 30px;
    }
    .job-content .job-ul {
        column-count: 1;
    }
    .job-content .img {
        margin-top: 30px;
    }

    body.is-head #wrapper {
        padding-top: 40px;
    }
    body.is-head section {
        padding: 30px 0px 0px;
    }

    .career-content ul li {
        margin-bottom: 22px;
    }
    .career-form {
        margin-top: -20px;
        width: 100%;
    }
    .career-form .form-group {
        width: auto;
        display: block;
    }
    .career-form .form-group .radio {
        margin-top: 0px !important;
    }
    .career-form .form-group > label {
        margin-bottom: 12px;
        margin-top: 5px;
    }

    .input-upload.is-xs-full, .input-upload.is-xs-full .btn-box {
        width: 100%;
    }
    .sec-text {
        min-height: 392px;
    }

    .blog.style-2 .item .img {
        margin-bottom: 5px;
    }
    .blog.style-2 .row > div {
        padding: 0px;
    }
    .sec-text.is-bg {
        min-height: 645px;
    }
    .sec-title h3, .sec-title h4, .sec-title h2, .sec-title h4 {
        margin-top: 0px;
    }
    .sec-title {
        margin-bottom: 50px;
    }
    .life-grid {
        gap: 30px;
    }
    .life-grid .item {
        width: calc(100%);
    }

    .article-box.is-highlight {
        margin-top: 30px;
    }
    .article-box.is-highlight img {
        height: 348px;
    }
    .article-box.is-highlight .text {
        width: 100%;
        left: 0px;
        bottom: 30px;
        padding: 0px 15px;
    }

    .tab-news .nav-tabs {
        flex-wrap: nowrap;
        white-space: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        justify-content: start;
        margin-left: -15px;
        margin-right: -15px;
    }

    header.for-ir #bar {
        position: fixed;
    }
    header .navbar .navbar-toggle {
        margin-right: 0px;
    }
    .row.is-reverse-mobile > div:nth-child(odd) {
        float: initial;
    }
    .sum-box h3 {
        font-size: 40px;
        line-height: 46px;
        margin-bottom: 25px;
    }
    .sum-box .item {
        width: 100%;
    }
    .section-seo .text-right {
        text-align: center;
    }
    .section-seo .row {
        display: block;
    }
    .section-seo .img {
        margin-top: -50px;
        margin-bottom: 50px;
    }
    .section-seo .text {
        padding: 0px 0px 165px;
    }
    .doc-box {
        margin-top: -40px;
    }
    .download-list .row.is-middle {
        display: block;
    }
    .download-list .select {
        margin: 30px 0px 20px;
    }
    .table-responsive {
        margin-left: -15px;
        width: calc(100% + 30px);
        padding: 15px;
        border: 0px;
    }
    .section-seo.style-2 .img {
        width: 235px;
        margin-top: -60px;
        margin-bottom: 0px;
    }
    .people-box .item {
        width: 100%;
    }
    .people-box .item .img {
        height: 272px;
        width: 234px;
    }
    .section-seo.style-2 {
        padding-bottom: 180px !important;
    }
    .section-director {
        margin-top: -180px;
        padding: 0px;
    }
    .section-director .title {
        margin-bottom: 50px;
    }
    .section-director-map {
        padding: 10px 0px 40px;
    }

    .contact-call .item {
        width: 100%;
        border: 0px;
        margin-bottom: 0px;
    }
    .sitemap {
        font-size: 14px;

    }
    .search-box {
        padding: 30px 0px 100px;
    }
    .search-box input.input-keyword {
        padding: 10px 0px;
    }
    .search-box input.input-keyword, .search-box input.input-keyword::placeholder {
        font-size: 20px;
        line-height: 30px;
        font-weight: 400;
    }
    .search-option {
        gap: 20px 15px;
    }
    .newslter-box {
        margin: -30px auto 50px;
    }
    .project-filter .select-dropdown-option .radio.is-logo {
        width: 50%;
    }
    .f-control {
        padding: 35px 15px 100px !important;
    }

    .coming {
        font-size: 32px;
        line-height: 42px;
    }

    .search-result .img {
        width: 100%;
    }
    .search-result .text {
        width: 100%;
        padding: 20px 0px;
    }

    .popup .control .icon-close {
        right: 5px;
        top: 5px;
        width: 35px;
    }

    .article-box > img {
        width: 100%;
        height: 225px;
    }

    #totop {
        bottom: 15px;
        right: 15px;
    }
}

@media (max-width: 520px){
    .thankyou-box {
        padding: 0px 20px;
        word-break: break-word;
        word-wrap: break-word;
        margin-top: -30px;
    }
    .thankyou-box br {
        display: none !important;
    }
    .add-line {
        margin-top: 20px;
        margin-bottom: 40px;
    }
    .add-line > div {
        padding: 12px 12px;
    }
}

@media (min-width:768px){
    .modal-xl {
        width: 632px;
    }
}

@media (min-width:1050px){
    .modal-xl {
        width: 1080px;
    }
}

@media (min-width:1300px){
    .container{width:1300px}
}