@charset "utf-8";



@font-face {

    font-family: "Muli";

    font-weight: 300;

    font-style: normal;

    src: url("../fonts/Muli-Light.ttf");

}

@font-face {

    font-family: "Muli";

    font-weight: 400;

    font-style: normal;

    src: url("../fonts/Muli-Regular.ttf");

}





@font-face {

    font-family: "Muli";

    font-weight: 600;

    font-style: normal;

    src: url("../fonts/Muli-SemiBold.ttf");

}



@font-face {

    font-family: "Muli";

    font-weight: 700;

    font-style: normal;

    src: url("../fonts/Muli-Bold.ttf");

}



@font-face {

    font-family: "SFUGoudyMedium";

    font-weight: 400;

    font-style: normal;

    src: url("../fonts/SFUGoudyMedium.ttf");

}





:root {

    --d-transition: all 0.5s cubic-bezier(0.65, 0, 0.35, 1);

    --d-gradient:  radial-gradient(108.15% 5708.45% at 100% 100%, #FFEAA2 0%, #DEB05E 22.4%, #FCE3A3 48.96%, #FFECA7 75.52%, #DEB05E 96.87%);

    --d-gutter: 10.68vw;



}

@media (max-width:1699px) {

    :root {



    }



}

@media (max-width:1199px) {

    :root {

        --d-gutter: var(--bs-gutter-x,.75rem);

    }



}



html::-webkit-scrollbar {

    width: 8px;

    background-color: #fffbf8;

}

html::-webkit-scrollbar-thumb {

    background-color: #a50d20;

    border-radius: 0px;

}



iframe {

    display: block;

    margin: auto;

}



/*FOR IE*/

html {

    scrollbar-base-color: #a50d20;

    scrollbar-face-color: #a50d20;

    scrollbar-3dlight-color: #a50d20;

    scrollbar-highlight-color: #a50d20;

    scrollbar-track-color: #fffbf8;

    scrollbar-arrow-color: #a50d20;

    scrollbar-shadow-color: #a50d20;

    scrollbar-dark-shadow-color: #a50d20;

}

/*FOR FF*/

html{

    scrollbar-color: #a50d20 #fffbf8;

    scrollbar-width: 8px;

    font-size: 17px;

}

.scroll-1 {

    scrollbar-base-color: #a50d20;

    scrollbar-face-color: #a50d20;

    scrollbar-3dlight-color: #a50d20;

    scrollbar-highlight-color: #a50d20;

    scrollbar-track-color: #fffbf8;

    scrollbar-arrow-color: #a50d20;

    scrollbar-shadow-color: #a50d20;

    scrollbar-dark-shadow-color: #a50d20;

    scrollbar-color: #a50d20 #fffbf8;

    scrollbar-width: 5px;

}



body { font-family: 'Muli', sans-serif;  margin: 0px; padding: 0px; font-size: 16px; line-height: 1.6; overflow-x: hidden; font-weight: 400; color: #212224;

    background: #fffbf8;

}



/*----------------------

1.1. Typography

------------------------------*/

h1, h2, h3, h4, h5, h6 { font-family: 'Muli', sans-serif;  margin: 0 auto 15px; font-weight: 700; line-height: 1.4; }

h1 { font-size: 50px; }

h2,h1.sm { font-size: 39px; }

h2.xxl{font-size: 24px;}

h2.lg,h3.xxl{ font-size: 20px;}

h3,h2.md { font-size: 20px; }

h4,h2.sm,h3.md { font-size: 18px; margin-bottom: 15px; }

h5 { font-size: 15px; margin-bottom: 15px; }

h6 { font-size: 14px; margin-bottom: 10px; }

p { /*font-size: 15px;

margin-bottom: 20px;*/ }

a {transition: var(--d-transition);  text-decoration: none; color: #474747; }

a:hover, a:focus { text-decoration: none; outline: none; color: #a50d20; }

ul, ol { margin: 0 auto 20px; }

ul li, ol li { margin: 0 auto 10px; }

blockquote { background: #f5f5f5; }

*:focus,button:focus {

    outline: none;

}

.white-text,

.white-text h1,

.white-text h2,

.white-text h3,

.white-text h4,

.white-text h5,

.white-text h6,

.white-text p,

.white-text.section-header p { color: #fff; }

.uppercase { text-transform: uppercase; }

.underline { text-decoration: underline; }

.divider { border-bottom: 1px solid #dcd9d9; clear: both; margin: 40px auto; }

img { max-width: 100%; height: auto; }



@media(min-width:1399px) {

    .gutter-40 { margin-left: -20px; margin-right: -20px; }

    .gutter-40 > [class*='col-'] { padding-right: 20px; padding-left: 20px; }

}



@media(min-width:1601px) {

    .gutter-40 { margin-left: -40px; margin-right: -40px; }

    .gutter-40 > [class*='col-'] { padding-right: 40px; padding-left: 40px; }

}



.gutter-10 { margin-left: -10px; margin-right: -10px; }

.gutter-10 > [class*='col-'] { padding-right: 10px; padding-left: 10px; }

.gutter-5 { margin-left: -5px; margin-right: -5px; }

.gutter-5 > [class*='col-'] { padding-right: 5px; padding-left: 5px; }

.gutter-2 { margin-left: -2px; margin-right: -2px; }

.gutter-2 > [class*='col-'] { padding-right: 2px; padding-left: 2px; }

.gutter-0 { margin-left: 0px; margin-right: 0px; }

.gutter-0 > [class*='col-'] { padding-right: 0px; padding-left: 0px; }

.relative{position: relative;}

.absolute{position: absolute;}

.overflow-hide{overflow: hidden;}

/* =WordPress Core

-------------------------------------------------------------- */

.alignnone { margin: 5px 20px 20px 0; }

.aligncenter,

div.aligncenter { display: block; margin: 5px auto 1em auto; }

.alignright { float: right; margin: 5px 0 20px 20px; }

.alignleft { float: left; margin: 5px 20px 20px 0; }

.aligncenter { display: block; margin: 5px auto 5px auto; }

a img.alignright { float: right; margin: 5px 0 20px 20px; }

a img.alignnone { margin: 5px 20px 20px 0; }

a img.alignleft { float: left; margin: 5px 20px 20px 0; }

a img.aligncenter { display: block; margin-left: auto; margin-right: auto; }

.wp-caption { max-width: 100%; /* Image does not overflow the content area */ text-align: center; }

.wp-caption.alignnone { margin: 5px 20px 20px 0; }

.wp-caption.alignleft { margin: 5px 20px 20px 0; }

.wp-caption.alignright { margin: 5px 0 20px 20px; }

.wp-caption img { border: 0 none; height: auto; margin: 0; max-width: 100%; padding: 0; width: auto; }

.wp-caption p.wp-caption-text { font-size: 13px; margin: 0; padding: 5px 5px 0px; }



/*End core*/

.editor-content img { max-width: 100%; height: auto; }

.editor-content img.media-object { max-width: none; }

.editor-content h2, .editor-content h3, .editor-content h4 { font-weight: 700; color: #fff; }

.editor-content h4 { font-size: 16px; }

.editor-content h3 { font-size: 18px; }

.editor-content h2 { font-size: 20px; color: #fff;}



/*-----------------

1.2. Button.title.bullet-1:before

-------------------------*/

.btn { border-radius: 0px; background: transparent; border: solid 1px #97958d; color: #fff; font-size: 17px;margin: auto; padding: 8px 25px 8px; transition: var(--d-transition);

    text-decoration: none; font-weight: 400;

}

.btn.btn-icon{padding-left: 60px;}

.btn.btn-primary,

.btn.btn-default{

    border-radius: 0px; background:transparent; font-size: 0.85em; text-transform: uppercase; font-weight: 400;

    color: #666666;

}

.btn.btn-primary:hover,

.btn.btn-default:hover,

.btn.btn-default.active{background: #a50d20; color: #fff; border-color: #a50d20;}





.btn.btn-primary.md{padding: 10px 35px 8px;}



.btn .fa { font-size: 22px; margin-right: 5px; vertical-align: text-top; }

.btn.btn-lg { font-size: 24px; line-height: 30px; padding: 22px 50px; }

.btn.btn-sm { font-size: 16px; padding: 8px 25px; }

.btn:hover, .btn:focus { color: #FACD57; outline: none; box-shadow: none; /*background: transparent;*/ }

.btn.btn-icon:hover{}

.btn-link { font-weight: 800; font-size: 17px; color: #602314; }

.btn.outline-btn { background: none; color: #006838; border: #602314 solid 1px; padding: 5px 25px 5px 10px; font-weight: 400; position: relative;}

.btn.outline-btn:after{position: absolute; right: 6px; top: 12px; content: "\f103"; font: normal normal normal 14px/1 FontAwesome;}

.btn.outline-btn:hover { background: #602314; color: #FACD57; }

.btn-transparent { background: transparent; border: solid 1px #602314; color: #602314; font-size: 14px; }

.btn-transparent:hover { background: #f7e5cb; border: solid 1px #f7e5cb; }

.btn-back-home{}

/*-------------------------

1.3. dark-overlay

---------------------------------*/

.div_zindex { position: relative; z-index: 3; }

.div_zindex > * { position: relative; z-index: 1; }

.dark-overlay { background: rgba(0, 0, 0, 0.85) none repeat scroll 0 0; content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; }

.color-overlay { background: rgba(205, 56, 96, 0.9) none repeat scroll 0 0; content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; }

/*-------------------------------------

1.4. Space margins and padding

------------------------------------------------*/

.padding_none { padding: 0px; }

.padding_top_20 { padding-top: 20px; }

.padding_50px { padding: 50px 0; }

.padding_4x4_30 { padding: 30px; }

.padding_4x4_40 { padding: 40px; }

.padding_right { padding-right: 60px; }

.padding_left { padding-left: 60px; }

.space-20 { width: 100%; height: 20px; clear: both; }

.space-30 { width: 100%; height: 30px; clear: both; }

.space-40 { width: 100%; height: 40px; clear: both; }

.space-60 { width: 100%; height: 60px; clear: both; }

.space-80 { height: 80px; width: 100%; }

.margin-btm-20 { margin-bottom: 20px; clear: both; }

.margin-top-20 { margin-top: 20px; clear: both; }

.margin-top-40 { margin-top: 40px; clear: both; }

.margin-btm-40 { margin-bottom: 40px; clear: both; }

.margin-top-60 { margin-top: 60px; clear: both; }

.margin-btm-60 { margin-bottom: 60px; clear: both; }

.margin-none { margin: 0px; }

.margin-top-15 { margin-top: 15px; }

.d-inline-block { display: inline-block; }

/*-----------------

1.5. Form

---------------------------*/

.form-group { margin-bottom: 20px; position: relative; }

.form-group.has-error .help-block{color: #FCE3A3; opacity: 0.6;}

.form-label { color: #111111; font-size: 14px; font-weight: 400; margin: 0 auto 8px; }

.form-control { background: transparent; border: 0 none; border-radius: 3px; border: #ccc solid 0px; box-shadow: none; color: #fff; font-size: 16px; height: 34px; line-height: 30px; padding: 0 15px; }

textarea.form-control { padding: 15px 20px; }

.form-control:hover { box-shadow: none; outline: none; }

.form-control:focus { box-shadow: none;  background: transparent; border-color: #8dba3f; outline: none; color: #fff; }

.select { position: relative; }

.select select { appearance: none; -moz-appearance: none; -o-appearance: none; -webkit-appearance: none; -ms-appearance: none; }

.select::after { color: #878787; content: ""; cursor: pointer; font-family: fontawesome; font-size: 15px; padding: 12px 0; pointer-events: none; position: absolute; right: 15px; top: 0; }

.form-control option { padding: 10px; }

.control-label { color: #555; font-size: 15px; font-weight: 700; }

.radio label, .checkbox label { cursor: pointer; font-size: 14px; font-weight: 400; padding-left: 26px; position: relative; }

.radio input[type=radio],

.checkbox input[type=checkbox] { display: none; }

.radio label:before { background-color: transparent; border-style: solid; border-width: 1px; border-radius: 50%; content: ""; display: inline-block; height: 15px; left: 0; top: 4px; position: absolute; width: 15px; }

.checkbox label::before { background-color: rgba(0, 0, 0, 0); border: 1px solid #111111; content: ""; display: inline-block; height: 16px; left: 0; position: absolute; top: 4px; width: 16px; }

.radio input[type=radio]:checked + label:before { content: "\2022"; font-size: 15px; text-align: center; line-height: 11px; }

.checkbox input[type=checkbox]:checked + label:before { content: "\2713"; font-size: 12px; text-align: center; line-height: 14px; }

.black_input .form-control { background: #222; border-radius: 3px; color: #fff; border: #222 solid 1px; font-size: 17px; }

.checkbox, .radio { padding-top: 5px; }

/*-----------------

1.6. Table

---------------------------*/

table { margin: 0 0 30px; width: 100%; }

table th, table td { border: 1px solid #cccccc; padding: 15px; padding: 18px; }

table th img, table td img { max-width: 100%; }

table thead { background: #eee; }

table thead th, table thead td { text-transform: uppercase; font-weight: 900; color: #111; }

/*-----------------

1.7. Accordion

---------------------------*/

.panel-group .panel { background: #fff; border: 0 none; border-radius: 0; box-shadow: none; margin-bottom: 25px; }

.panel-title { color: #fff; font-size: 24px; margin-bottom: 0; margin-top: 0; }

.panel-title a { display: block; padding: 10px 25px; position: relative; background: #cca759; font-size: 18px;}

.panel-title a.collapsed {  }

.panel-title a .question { width: 85px; height: 100%; content: ""; color: #fff; font-size: 39px; line-height: 1; text-align: center; position: absolute; top: 0px; left: 0px; background: #602314; }

.panel-title a.collapsed .question { background: #252930; transition-duration: 0.3s; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; -webkit-transition-duration: 0.3s; }

.panel-title a .question span { position: absolute; top: 45%; left: 0px; right: 0px; transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -webkit-transform: translateY(-50%); }

.panel-default > .panel-heading { background: rgba(0, 0, 0, 0) none repeat scroll 0 0; border: 0px; border-radius: 0; box-shadow: none; color: #474747; padding: 0; }

.panel-heading:hover .panel-title a .question { background: #602314; }

.panel-heading:hover .panel-title a { border-color: #602314; }

.panel-body { border: 0px solid rgba(255, 255, 255, 0.2); margin-top: -1px; padding: 15px 0px; }

.panel-body p { font-size: 17px; line-height: 30px; font-weight: 400; }



.disable-fullpage .section-padding{padding: 60px 0px;}

.p-left{padding-left: var(--d-gutter);}

.p-right{padding-right: var(--d-gutter);}

.padding-right{padding-right: 4.95vw;}



.section-title{font-weight: 700; font-size: 26px; text-transform: uppercase; margin-bottom: 15px;

    color: #a50d20;

}

.section-title small{color: #4b4e53; font-size: 0.5em; font-weight: 400; display: block; margin-bottom: 0.5em;}

.section-title.lg{font-size: 24px;}

.section-title-xs{font-size: 17px;}

.ellips{    text-overflow: ellipsis;display: -webkit-box; -webkit-box-orient: vertical;    overflow: hidden;}



.fit-res{position: relative; height: 0px; padding-top: calc(100% * 10 / 16);

    overflow: hidden;

}

.fit-res img,

.fit-res .img{position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; object-fit: cover;



}



.page-background .vegas-animation-kenburns { animation: kenburns_custom ease-out; }

.page-background.zoom-out .vegas-animation-kenburns { animation: kenburns_zoom_out ease-in; }



@keyframes kenburns_custom {

    0% { transform: scale(1); }

    100% { transform: scale(1.1); }

}



@keyframes kenburns_zoom_out {

    0% { transform: scale(1.1); }

    100% { transform: scale(1); }

}





.social-logos{list-style: none; margin: 0px; padding: 0;}

.social-logos li {margin-top: 15px;}

.social-logos a{display: block; text-align: center;}

.social-logos a img,

.social-logos a svg{max-width: 22px; max-height: 25px;}

.social-logos a svg path{fill: #fff;}

.show-nav .social-logos a svg path,

.child-page .social-logos a svg path{fill: #97958d;}

.social-logos .language {display: flex; align-items: center; margin-top: 36px;

    justify-content: center;

}

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

    .social-logos .language {

        display: none;

    }

}

.social-logos .language a{margin-right: 5px;}

.social-logos .language a:last-child{margin-right: 0px;}

.sidebar-menu .logo-icon{position: absolute; top: 50%; left: 50%;

    transform: translate(-50%,-50%);

    padding: 0px 12%;

    width: 100%; opacity: 0;

    transition: var(--d-transition);

    transition-delay: 0.3s;

}

.fp-viewing-doi-tac .sidebar-menu,

.fp-viewing-su-kien .sidebar-menu{background: rgba(0,0,0,0.1);}

.show-nav .sidebar-menu .logo-icon,

.child-page .sidebar-menu .logo-icon{opacity: 1;}

.bg{position: absolute; width: 55%; height: 100%; left: 0px; top: 0px;

    background: url('../images/bg-menu.svg') no-repeat center right;

    background-size: auto 100%; pointer-events: none;

    opacity: 0.2;

}

.bg.right{left: auto; right: 0; background-position: center left; transform: translateX(35.65%);}

.bg.center{left: 50%; right: auto; background-position: center center; transform: translateX(-50%); width: 100%; }





.sidebar-menu .navbar-toggler{border: 0px;

    color: #fff; text-transform: uppercase;

    font-size: 12px; font-weight: 600;

    padding: 0; position: relative;

    margin-left: 0px;

    display: flex; flex-direction: column;

    align-items: center;

    width: 100%;

    padding-top: 20px;

}

.sidebar-menu .navbar-toggler:focus{outline: none;box-shadow: none;}





header .navbar-toggler-icon {

    background: transparent;

    width: 26px;

    height: 17px;

    cursor: pointer;

    transition: 0.3s ease all;

    position: relative;

    margin-bottom: 10px;



}

header .navbar-toggler-icon > span {



    display: block;

    width: 100%;

    height: 2px;

    border-radius: 0px;

    background-color: #fff;

    position: absolute;

    transition: 0.3s ease all;

}



header .navbar-toggler-icon > span:nth-of-type(1) {

    width: 100%;

    top: 0;

    left: 50%;

    transform: translateX(-50%);

}

header .navbar-toggler-icon > span:nth-of-type(2) {

    width: 100%;

    top: 50%;

    left: 0;

    transform: translateY(-50%);

}

header .navbar-toggler-icon > span:nth-of-type(3) {

    width: 100%;

    top: 100%;

    left: 0;

    transform: translateY(-100%);

}

header .navbar-toggler-icon:hover > span {

    width: 100%;

    transition: 0.3s ease all;

}

body.menu-open header .navbar-toggler .navbar-toggler-icon {

    margin: 0;

    width: 20px;

    height: 20px;

    transform: rotate(180deg) translateY(50%);

    transition: 0.3s ease all;

    opacity: 1;

}

body.menu-open header .navbar-toggler .navbar-toggler-icon > span {

    width: 100%;

    height: 2px;

    background-color: #fff;

    transition: 0.3s ease all;

}

body.menu-open header .navbar-toggler .navbar-toggler-icon > span:nth-child(1) {

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%) rotate(45deg);

}

body.menu-open header .navbar-toggler .navbar-toggler-icon > span:nth-child(2) {

    opacity: 0;

}

body.menu-open header .navbar-toggler .navbar-toggler-icon > span:nth-child(3) {

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%) rotate(-45deg);

}



body header.sidebar-menu:before{

    content: ''; position: absolute; pointer-events: none;

    left: 0px; top: 0px; width: 100%; height: 0px;

    transition: var(--d-transition);

    background: #a50d20;

    transition-delay: 0s;

}

body.menu-open header.sidebar-menu:before{height: 100%; }

body.menu-open .sidebar-menu .logo-icon{opacity: 1;}

body.menu-open .nav-content{

    transform: translateX(0);

    pointer-events: auto;

}



body.opened header.sidebar-menu:before{ transition-delay: 0.5s;}

body.opened .nav-content{transition-delay: 0s; background-color: #fff7e5;}



/*.show-nav header .navbar-toggler-icon > span{background: #97958d;}*/

/*.show-nav:not(.menu-open) .sidebar-menu .navbar-toggler{color: #97958d;}*/

.social-logos a img{}



.social-logos a path {

    transition: all .3s ease;

}



.social-logos a:hover path {

    fill: #a50d20 !important;

}



.nav-content{height: calc(var(--vh, 1vh) * 100); position: fixed; top: 0px; right: 0px; width: 100%;

    transform: translateX(100%);

    pointer-events: none;

    transition: var(--d-transition);

    transition-delay: 0.5s;

    display: flex;z-index: 9;

}

.nav-content .nav-list{

    width: auto;

    flex: auto;

    background:  #fff7e5;

    order: 2;

    display: flex; align-items: center; position: relative;

}

.nav-content .nav-list:before{

    content: '';     position: absolute; left: 0px; top: 0px; width: calc(100% - 96px) ; height: 100%;

    background: url('../images/bg-menu.svg') no-repeat center left;

    background-size: 200%; opacity: 0.35;

    pointer-events: none;

}

.nav-content .nav-list ul{list-style: none; padding-left: 0px;    margin-right: 0;}

.nav-content .nav-list li{text-align: right;}

.nav-content .nav-list li a{color: #333333; font-size: 30px; font-weight: 300;}

.nav-content .nav-list li.accordion-parent{padding-right: 30px; background: url('../images/arrow-down.svg') no-repeat top 15px right;

    background-size: 14px auto;

}

.nav-content .nav-list li ul{display: none; list-style: none; padding: 0;}

.nav-content .nav-list li.open ul{display: block;}

.nav-content .menu-project{width: 66%; flex: 0 0 66%; display: flex; align-items: center;}

.nav-content .menu-project .items{width: 100%;}



.menu-project{background: #fff; padding-right: 64px;}

.menu-project .swiper-slide h3{text-align: center; margin: 0px; padding: 20px 5px 0px; text-transform: uppercase;

    font-weight: bold;

    font-size: 0.95em;

}



.page-background{height:  calc(var(--vh, 1vh) * 100) !important; }

.page-background .section-content{position: absolute;

    left: var(--d-gutter); top: 45%; transform: translateY(-50%);

    max-width: 40vw; z-index: 9;

}

.page-background .section-content .title{ font-family: 'SFUGoudyMedium'; font-size: 2.75rem;

    color: #fff; margin: 3.5rem 0px;

}

.page-background .section-content .btn{color: #fff; border-color: #fff;}

.icon-scroll{position: absolute; bottom: 0; left: 50%;

    color: #fff; text-transform: uppercase;

    z-index: 9;



    transform: translateX(-50%);

}



.section-about{color: #212224;}

.section-about .description{text-align: justify;}

.section-about .thumb-wrapper{display: flex;}

.section-about .thumb-wrapper .col-left{width: 180px; flex: 0 0 180px; background: #4b4e53;

    border-top: solid 4px #fbb612; padding: 50px 20px 40px ;

}

.section-about .thumb-wrapper .col-right{flex-grow: 1;}

.section-about .thumb-wrapper .col-right .thumb{height: 100%;}

.section-about .thumb-wrapper .col-right .thumb img{width: 100%; height: 100%; object-fit: cover; object-position: top right;}

.section-about .thumb-wrapper .col-left{position: relative;}

.section-about .thumb-wrapper .col-left .swiper-slide{text-align: center;}

.section-about .thumb-wrapper .col-left h3{color: #fff; text-transform: uppercase; font-size: 0.75em; text-transform: uppercase;

    margin: 20px 0px;

    font-weight: 400;

    max-height: 215px;

    overflow: auto;

    text-overflow: ellipsis;

    padding-right: 5px;

}



.awards-slide {

    padding-bottom: 50px !important;

}



.section-about .thumb-wrapper .col-left .thumb {

    width: 100%;

    height: 100px;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

}

.swiper-default.center .swiper-button-next{left: 50%; margin-left: 5px;}

.swiper-default.center .swiper-button-prev{left: auto; right: 50%; margin-right: 5px;}



.swiper-default .swiper-button-next,

.swiper-default .swiper-button-prev{bottom: 50px; top: auto;margin-top: 0;

    width: 40px; height: 41px;

    background-image: url('../images/navigate/trai-nomal.png');

    background-size: cover;

    background-position: center center;

}

.swiper-default .swiper-button-next:hover,

.swiper-default .swiper-button-prev:hover{

    background-image: url('../images/navigate/trai-hover.png')

}

.swiper-default .swiper-button-next{

    background-image: url('../images/navigate/phai-nomal.png')

}

.swiper-default .swiper-button-next:hover{

    background-image: url('../images/navigate/phai-hover.png')

}



.swiper-default .swiper-button-next:after,

.swiper-default .swiper-button-prev:after{display: none;}



.feature-project-slide .swiper-slide .row{align-items: center;}

.feature-project-slide .swiper-slide a{display: block; position: relative;    padding: 15% 3% 9.9% 9.18%;}

.feature-project-slide .main-img{

    position: relative;

    left: 0px;

    top: 100px;

    width: 100%;

    height: calc(100% * 500 / 855);

    object-fit: cover;

    z-index: 2;

    opacity: 0;

    transition: top 1s,opacity 1s,-webkit-transform .4s ease-in-out;

    transition: top 1s,opacity 1s,transform .4s ease-in-out;

    transition: top 1s,opacity 1s,transform .4s ease-in-out,-webkit-transform .4s ease-in-out;

}



.feature-project-slide .hover-img {

    position: absolute;

    display: block;

    /*top: 12.8%;

    left: 7.14%;

    bottom: 10%;

    width: calc(100%);*/

    top: 15%;

    left: 9.18%;

    bottom: 9.9%;

    right: 3%;



    z-index: 10;

    overflow: hidden;

    opacity: 0;

    background: rgba(118,106,98,.9) no-repeat center center;

    background-size: cover;

    transition: opacity .4s ease-in-out,-webkit-transform .4s ease-in-out;

    transform: scale(1);

}

.feature-project-slide  .swiper-slide a:hover .hover-img{

    opacity: 1; transform: scale(1.1);

}



.feature-project-slide  .swiper-slide div {

    background-position: top;

    background-repeat: no-repeat;

    background-size: cover;

}



.feature-project-slide  .swiper-slide .top-img {

    position: absolute;

    top: 100px; opacity: 0;

    left: 17%;

    right: 42%;

    height: 50%;

    transition: top .6s,opacity .6s;

}

.feature-project-slide  .swiper-slide .left-img {

    position: absolute;

    top: 26%;

    left: 0;

    margin-top: 100px;

    width: 50%;

    bottom: calc(12% + 38px);

    background-position: top left;



    -webkit-transition: margin-top .8s,bottom .8s,opacity .8s;

    -o-transition: margin-top .8s,bottom .8s,opacity .8s;

    transition: margin-top .8s,bottom .8s,opacity .8s;

}

.feature-project-slide  .swiper-slide .bottom-img {

    position: absolute;

    right: 4%;



    height: 50%;

    left: 38%;

    background-position: bottom right;

    bottom: 100px; opacity: 0;

    -webkit-transition: bottom .8s,opacity .8s;

    -o-transition: bottom .8s,opacity .8s;

    transition: bottom .8s,opacity .8s;

}





.feature-project-slide  .swiper-slide.swiper-slide-active .main-img{

    top: 0px; opacity: 1;

}

.feature-project-slide  .swiper-slide.swiper-slide-active .top-img{

    top: 0px; opacity: 1;

}

.feature-project-slide  .swiper-slide.swiper-slide-active .left-img{

    margin-top: 4%; opacity: 1;

}

.feature-project-slide  .swiper-slide.swiper-slide-active .bottom-img{

    bottom: 0px;opacity: 1;

}

.feature-project-slide  .swiper-slide:not(.swiper-slide-active) {

    overflow: hidden;

}



.section-project .section-heading{position: absolute;    z-index: 3;}

.section-project .thumb-wrapper {position: relative; }

.section-project .thumb-wrapper {}

.section-project .thumb-wrapper .swiper-button-next,

.section-project .thumb-wrapper .swiper-button-prev{bottom: 0px; left: calc(50% - 50px);}

.section-project .thumb-wrapper .swiper-button-next{right: auto; left: calc(50%);}



.section-news { padding-top: 15px; }

.section-news .section-heading{position: absolute; right: 0px; z-index: 3;}

.section-news .swiper-slide .item{padding-right: 30px;}

.section-news .swiper-slide .item .thumb{}

.section-news .swiper-slide .item h3{

    font-size: 0.85em;

    font-weight: bold;

    margin: 0;

    -webkit-line-clamp: 3;

    padding: 5px 0;

}

.section-news .title {font-size: 20px; margin: 0px 0px 20px ; padding-bottom: 20px; border-bottom: solid 1px #dbdbda;}

.section-news .new-top-content{padding: 30px 50px; background: #f5f0ec;    margin-bottom: 190px;}



.section-news .new-top-thumb{margin-bottom: 15px;}

.section-news .new-top-thumb img{width: 100%;}

.section-news .thumb-wrapper{position: relative; padding-bottom: 40px;}

.section-news .swiper-default.center .swiper-button-next,

.section-news .swiper-default.center .swiper-button-prev{bottom: 0;}





.section-utilities .col-left{position: relative;}

.section-utilities .col-right{padding-left: calc(var(--bs-gutter-x) * .5);}

.section-utilities .slide-control-child {position: absolute; left: calc(100% + var(--bs-gutter-x));

    bottom: 50px;     min-width: 100px;

}

.section-utilities .utilities-slide .item{}

.section-utilities .utilities-slide .item .thumb{padding-top: calc(100% * 346 / 465);}

.section-utilities .utilities-slide .item h3{text-align: center; text-transform: uppercase; padding: 10px 0px;

    margin: 0; height: 50px; overflow: hidden;

    white-space: nowrap; text-overflow: ellipsis;

}

.section-utilities .slide-control-child .swiper-button-next,

.section-utilities .slide-control-child .swiper-button-prev,

.section-events .slide-control-child .swiper-button-next,

.section-events .slide-control-child .swiper-button-prev{bottom: 0px;}



.section-events .slide-control-child {position: relative; padding-top: 90px;}

.section-events .section-content img{}



.section-partner {position: relative; background: #fffbf8;}

.section-partner:before{content: ''; position: absolute; left: 0px; top: 0px; width: 100%; height: calc(var(--vh, 1vh) * 50);

    background: url('../images/bg-partner.jpg') no-repeat center center; background-size: cover;

}

.section-partner .fp-tableCell{position: relative; z-index: 2;}

.section-partner .section-content{display: flex; flex-direction: column; padding: 60px; background: #fffbf8; margin-top: 15%;

}

.section-partner .swiper-default{position: relative;}

.section-partner .swiper-default .swiper-button-prev,

.section-partner .swiper-default .swiper-button-next{bottom: 50%; transform: translateY(50%);}

.section-partner .swiper-default .swiper-button-prev{left: -15px;}

.section-partner .swiper-default .swiper-button-next{right: -15px; left: auto;}

.section-partner .section-content .btn{margin-top: 60px;}

.section-partner .section-heading{



}



.section-partner .swiper-slide {

    display: flex;

    -webkit-box-pack: center;

    -ms-flex-pack: center;

    -webkit-justify-content: center;

    justify-content: center;

    -webkit-box-align: center;

    -ms-flex-align: center;

    -webkit-align-items: center;

    align-items: center;

}





.section-footer{

    position: relative;

    background: rgb(254,229,173);

    background: -moz-linear-gradient(0deg, rgba(254,229,173,1) 0%, rgba(254,238,195,1) 51%, rgba(255,251,248,1) 100%);

    background: -webkit-linear-gradient(0deg, rgba(254,229,173,1) 0%, rgba(254,238,195,1) 51%, rgba(255,251,248,1) 100%);

    background: linear-gradient(0deg, rgba(254,229,173,1) 0%, rgba(254,238,195,1) 51%, rgba(255,251,248,1) 100%);

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#fee5ad",endColorstr="#fffbf8",GradientType=1);

}

.section-footer:before{

    content: '';

    position: absolute;

    left: 0px; bottom: 0px;

    width: 100%; height: 50%;

    background: url('../images/bg-footer.png') no-repeat center bottom; background-size: 100% auto;

}

.section-footer .fp-tableCell{position: relative; vertical-align: text-bottom; padding-top: 90px;}

.section-footer .section-title{position: relative;}

.section-footer .section-title a{color: #a50d20;}

.section-footer .section-title:before{content: ''; width: 1px; height: 58px;

    position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%);

    background: #fbb612; margin-bottom: 30px;

}

.section-footer .section-content{display: flex;}

.section-footer .section-content .col-left,

.section-footer .section-content .col-right{width: 20%; flex: 0 0 20%;}

.section-footer .section-content .col-mid{flex-grow: 1;}

.section-footer .section-content .col-left{    padding-right: 2rem;}

.section-footer .section-content .col-right{padding-left: 2rem;}

.footer-content .item h4,

.footer-app h3{color: #e8a40c; text-transform: uppercase; font-weight: 700; margin-bottom: 10px;}

.footer-content .row .col-lg-6:last-child .item{padding-left: 2rem;}

.footer-app h3{}

.footer-app .items{margin-top: 15px;}

.footer-app .item{margin-bottom: 12px;    display: block;}

.section-footer .section-content-bottom {text-align: center; padding-top: 25px; margin-top: 60px;

    border-top: solid 1px #d6b153;

}

.footer-nav{margin-bottom: 1.5rem;}

.footer-nav ul{list-style: none;}

.footer-nav ul li{list-style: none; display: inline;}

.footer-nav ul li a{display: inline-block; padding: 0px 2rem; text-transform: uppercase; font-weight: 700;}

.copyright{}



.fullpage-nav-wrapper{position: fixed; right: 94.5px ;  z-index: 6; display: flex; flex-direction: column;

    top: 0px; height: 100%;

    opacity: 0;



}

.fullpage-nav-wrapper:before,

.fullpage-nav-wrapper:after{

    content: '';

    flex-grow: 1;

    border-right: solid 1px #ffc32d;

    margin-right: 1px;

}



.show-nav .fullpage-nav-wrapper{opacity: 1; }



.fullpage-nav{

    margin: auto 0px;

    line-height: normal; padding: 0px;



    top: 50%;

}

.fullpage-nav li{

    padding: 0px;

    margin: 5px 0px;

    list-style: none;

    border-right: solid 3px #bfbfbf;



}

.fullpage-nav li a {

    color: #fbb612;

    text-transform: uppercase;

    opacity: 0.5;

    display: flex;

    font-weight: 600;

    font-size: 15px;

    justify-content: flex-end;

    align-items: center;

    min-height: 36px;

    padding-right: 9px;



}

.fullpage-nav li a .title{ transform: translateX(110%); opacity: 0;

    transition: var(--d-transition);

    text-transform: uppercase; color: #fbb612;

}

.fullpage-nav li:hover a,

.fullpage-nav li.active a  { opacity: 1;}

.fullpage-nav li:hover a .title,

.fullpage-nav li.active a .title{transform: translateX(0); opacity: 1;}





.fullpage-nav li:hover,

.fullpage-nav li.active  { border-right-color: #fbb612; }



.fullpage-nav li span:not(.title) {

    display: block;

    text-align: center;

}





/*About*/

.section-heading{margin-bottom: 45px;}

.section-aboutus .items{margin-top: 45px;}

.section-aboutus .items .item{display: flex;}

.section-aboutus .items .item .media-image{flex: 0 0 calc(100%/3); width: calc(100%/3); margin-right: 45px;}

.section-aboutus .items .item .media-body{flex-grow: 1;}

.section-aboutus .items .item .media-body ul{list-style: none; padding: 0;}

.section-aboutus .items .item .media-body ul li{    margin-bottom: 5px;}

.page-category {background: #feeec3; border: solid 1px #fbb612; margin-top: 40px; }

.page-category .item .title{padding: 12px 0px 10px; margin: 0px 35px; text-transform: uppercase; position: relative;

    color: #4b4e53; font-weight: 700; display: inline-block;font-size: 1rem;

}

.page-category .item.active .title:after{content: ''; position: absolute; bottom: -1px; left: 0px; background: #a50d20; height: 3px; width: 100%;



}

.title.bullet-1{font-size: 1.3rem;color: #a50d20; position: relative; padding-left: 32px; padding-top: 4px;}

.title.bullet-1:before{content: ''; position: absolute; left: 0px; top: 8px; width: 22px; height: 22px; background: url('../images/bullet-1.svg') no-repeat center center; }



.section-aboutus-other .items .item{padding: 15px 0px; position: relative;}

.section-aboutus-other .items .item:first-child{}

.section-aboutus-other .items .item:nth-child(odd):before{content: ''; position: absolute;

    left: 0px; bottom: 0px; background: #fff4e1; z-index: -1; width: 100%; height: 600px; max-height: 50%; pointer-events: none;

}



.overview-content .items-1{margin-bottom: 1rem;}

.overview-content .items-1 .item{ height: 100%; padding: 30px 45px; text-align: center;background: #fff; border: solid 1px #fbb612;}

.overview-content .items-1 .item .thumb{height: 80px; display: flex; align-items: center; justify-content: center; margin: 30px 0px;}

.overview-content .items-1 .item .thumb img{max-height: 100%; width: auto;}



.overview-content .items-2 .item{display: flex; align-items: center; text-align: left;}

.overview-content .items-2 .item .thumb{width: 100px; flex: 0 0 100px; margin-right: 20px;}

.overview-content .items-2 .item h5{margin:0;}



.block-route{display: flex; align-items: center;}

.block-route .section-title{width: 28%; flex: 0 0 28%; text-transform: none;}

.block-route .section-title small{text-transform: uppercase;}

.block-route .nav{position: relative; border-left: solid 2px #cecece; padding-left: 17px; min-width: 225px; position: relative;}

.block-route .nav:before,

.block-route .nav:after{content: ''; position: absolute; width: 17px; height: 17px;

    background: url('../images/bullet-2.svg') no-repeat center center;

    left: -10px; top: -8px;

}

.block-route .nav:after{bottom: -8px; top: auto;}

.block-route .nav a{font-weight: 700; margin: 25px 0px; display: block; position: relative; }

.block-route .nav a.active:before{content: ''; position: absolute; width: 4px; height: 26px; background: #a50d20; left: -20px; top: 0px;}

.block-route .nav a.active{ font-size: 20px; color:#a50d20; }

.block-route .tab-content{}

.block-route .tab-content .tab-pane{padding-top: 25px;}

.block-route .tab-content h2,

.block-route .tab-content h3{font-size: 24px; color: #a50d20; }

.block-route .tab-content ul{padding: 0px; list-style: none; margin: 0px;}

.block-route .tab-content ul li{position: relative;padding-left: 20px;}

.block-route .tab-content ul li:before{content: ''; position: absolute; left: 0px; top: 8px; width: 12px; height: 12px; background: url('../images/bullet-1.svg') no-repeat center center; background-size: 100%;}



.section-overview-number .items{background: #fee6b3;}

.section-overview-number .items .item{text-align: center;}

.section-overview-number .items .item .thumb{height: 65px; margin-bottom: 20px; display: flex; align-items: center; justify-content: center;}

.section-overview-number .items .item .thumb img{max-height: 100%; width: auto;}

.section-overview-number .items .item .title{}

.section-overview-number .items .item .number{font-weight: 700; color: #a50d20; font-size: 35px;}



.section-value .items .item{display: flex; margin-bottom: 50px; align-items: flex-start;}

.section-value .items .item .item-left{width: 36%; flex: 0 0 36%;}

.section-value .items .item .item-right{flex-grow: 1; padding: 30px 60px; background: #fff7ea;}

.section-value .items .item .title{color: #a50d20; font-weight: 700; text-transform: uppercase; margin-bottom: 30px; position: relative;}

.section-value .items .item .title:after{content: ''; position: absolute;}





@media(min-width:1199px) {

    .container-fluid{padding: 0px var(--d-gutter);}

}



@media(min-width:1201px) {



    .sidebar-menu {

        position: fixed;

        display: block;

        top: 0;

        right: 0;

        width: 96px;

        height: calc(var(--vh, 1vh) * 100);

        color: #fff;

        border-left: 1px solid rgba(168, 168, 168, .6);

        overflow: hidden;

        z-index: 450;

        background-color: rgba(0,0,0,.05);



    }

    .show-nav .sidebar-menu{border-left: 0;}



    .sidebar-menu .desktop-only {

        display: block

    }



    .sidebar-menu .mask-fixed {

        position: fixed;

        top: 0;

        left: 0;

        width: 73px;

        height: 100vh

    }



    .sidebar-menu .social-container{position: absolute; bottom: 25px;

        padding: 0px 15px;     width: 100%;

    }





}



@media (max-width:1600px) {

    body,

    .btn.btn-primary, .btn.btn-default{font-size: 15px;}

    h1, h2, h3, h4, h5, h6 {}

    h1 { font-size: 42px; }

    h2,h1.sm { font-size: 32px; }

    h2.lg,h3.xxl{ font-size: 18px;}

    h3,h2.md { font-size: 18px; }

    h4,h2.sm,h3.md { font-size: 16px; margin-bottom: 10px; }

    h5 { font-size: 15px; margin-bottom: 10px; }

    h6 { font-size: 14px; margin-bottom: 10px; }

    .sidebar-menu{    width: 80px;}

    .fullpage-nav-wrapper{    right: 80.5px;}

    .padding-right{padding-right: 3vw;}

    .section-title{    font-size: 30px; margin-bottom: 15px;}

    .section-title.lg{font-size: 20px;}

    .page-background .section-content .logo img{width: 200px;}

    .page-background .section-content .title{font-size: 2rem;    margin: 2.5rem 0px;}



    .section-footer .section-content .col-left,

    .section-footer .section-content .col-right{width: 18%; flex: 0 0 18%;}

    .section-footer .section-content-bottom{    margin-top: 30px;}

}

@media (max-width:1399px) {

    .sidebar-menu{    width: 70px;}

    .fullpage-nav-wrapper{    right: 70.5px;}



    html,

    body,

    .btn.btn-primary, .btn.btn-default{font-size: 14px;}

    h1, h2, h3, h4, h5, h6 {}

    h1 { font-size: 38px; }

    h2,h1.sm { font-size: 30px; }

    h2.lg,h3.xxl{ font-size: 16px;}

    h3,h2.md { font-size: 16px; }

    h4,h2.sm,h3.md { font-size: 14px; margin-bottom: 10px; }

    h5 { font-size: 14px; margin-bottom: 10px; }

    h6 { font-size: 14px; margin-bottom: 10px; }

}

@media (max-width:1199px) {

    .page-background .section-content{left: 3vw;}

    .section-padding {padding: 60px 0px ;}

    .section-news .new-top-content{padding: 20px;}

    .section-footer .fp-tableCell{padding-top: 0;}

    .icon-scroll{display: none;}

    .sidebar-menu{position: fixed; top: 0px; width: 100%; z-index: 10;}

    .sidebar-menu .navbar-toggler{width: auto; margin-left: auto; z-index: 9; margin-right: var(--d-gutter);}

    .video_header{min-height: 100%;}

    .sidebar-menu .social-container,

    .sidebar-menu .logo-icon,

    body header.sidebar-menu:before,

    .fullpage-nav-wrapper{display: none;}



}

@media (max-width:991px) {

    .container-fluid{   padding-right: var(--bs-gutter-x,.75rem);}



    .page-background .section-content .title{    font-size: 1.5rem;}

    .page-background .section-content .logo img{width: 120px;}



    .section-about .thumb-wrapper{margin-bottom: 30px;}

    .section-project .section-heading{position: static;     margin-bottom: 30px;}

    .feature-project-slide .swiper-slide > div{text-align: right; padding-bottom: 5px;}

    .section-project .thumb-wrapper .swiper-button-prev{    left: calc(10%);}

    .section-project .thumb-wrapper .swiper-button-next{    left: calc(10% + 50px);}



    .section-utilities .col-left{padding-bottom: 90px;}

    .section-utilities .slide-control-child{

        left: 50%;

        transform: translateX(-50%);

    }

    .section-news .section-heading{position: static;   margin-bottom: 30px;}

    .section-utilities .slide-control-child,

    .section-news .swiper-default.center .swiper-button-next,

    .section-news .swiper-default.center .swiper-button-prev,

    .section-events .slide-control-child .swiper-button-next,

    .section-events .slide-control-child .swiper-button-prev{bottom: 30px;}

    .section-partner .swiper-default .swiper-button-next{    right: -45px;}

    .section-partner .swiper-default .swiper-button-prev{left: -45px;}

    .section-partner .section-content{padding: 30px 60px;}



    .section-footer .section-content{flex-direction: column;}

    .section-footer .section-content .col-left, .section-footer .section-content .col-right{width: 100%;

        flex: 0 0 100%;

    }

    .section-footer .section-content .col-left img{width: 120px;}

    .section-footer .section-content .col-left{padding-right: 0; text-align: center; margin-bottom: 30px;}

    .section-footer .section-content .col-mid{margin-bottom: 30px;}

    .section-footer .section-content .col-right{padding-left: 0;}

    .footer-app{display: flex; flex-wrap: wrap;}

    .footer-app h3{width: 100%;}

    .footer-app h3 br{display: none;}

    .footer-app .qrcode{margin-right: 15px;}

    .footer-app .items{}



}

@media (max-width:767px) {

    .btn.btn-primary, .btn.btn-default{

        padding: 7px 15px;

        font-weight: bold;

    }

    .page-background .section-content {

        left: 0;

        bottom: 0;

        padding: 15px 15px 50px;

        top: auto;

        transform: unset;

        width: 100%;

        max-width: unset;

        text-align: center;

    }

    .nav-content .nav-list{width: 100%;     flex: 1;}

    .nav-content .menu-project{display: none;}

    .page-background .section-content .logo img{    width: 80px;}

    .page-background .section-content .title{

        margin-bottom: 1em;

    }

    .section-about .thumb-wrapper{flex-direction: column;}

    .section-about .thumb-wrapper .col-left{width: 100%; flex: 0 0 100%;}

    .section-news .new-top-thumb{margin-bottom: 20px;}

    .section-news .swiper-slide .item .thumb img{width: 100%; height: auto;}

}



/*For Video*/

.video_header {

    background-size: cover;

    width: 100%;

    height: 100%;

    position: relative;

    left: 0;

    top: 0;

    margin: 0;

    padding: 0;

    z-index: 3;

    overflow: hidden;

    cursor: pointer;

}

.video_header video {

    position: absolute;

    object-fit: cover;

    width: 100%;

    height: 100%;

}





.video-cover-inline{

    width: 100%;

    height: 100%;

    position: relative;

    display: block;

}



.bgvideo{

    position: absolute;

    left: 50%;

    top: 50%;

    width: 100px;

    height: 100px;

    max-width: 7vw; max-height: 7vw;

    transform: translate(-50%,-50%);

    background: url('../images/icon-video-play.svg') no-repeat center center; background-size: auto 100%;

}



/*--------------*/