/* ==========================================================================
   Nakayoshi – template.css v2 (Joomla 6)
   Tái hiện giao diện production (T3/Bootstrap 3) – CSS trích từ các rule THỰC SỰ được dùng
   trên 9 trang nakayoshi.vn (10/11/2026), đổi tiền tố t3- -> nk-, ảnh -> WebP, bỏ font icon.
   Phần "STATE" cuối file thay JS T3 (megamenu, affix, off-canvas, slideshow).
   ========================================================================== */

/* ---------- normalize (bootstrap 3) ---------- */
html { font-family: sans-serif; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; }
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }
a { background-color: transparent; }
a:active, a:hover { outline: 0; }
b, strong { font-weight: bold; }
small { font-size: 80%; }
img { border: 0; }
figure { margin: 1em 40px; }
button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; }
button { overflow: visible; }
button, select { text-transform: none; }
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; appearance: button; cursor: pointer; }
table { border-collapse: collapse; border-spacing: 0; }
td, th { padding: 0; }

/* ---------- scaffolding ---------- */
* { box-sizing: border-box; }
::before, ::after { box-sizing: border-box; }
html { font-size: 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
body { font-family: "Open Sans", sans-serif; font-size: 16px; line-height: 1.5; color: #667780; background-color: #fff; }
input, button, select, textarea { font-family: inherit; font-size: inherit; line-height: inherit; }
a { color: #73bfe6; text-decoration: none; }
a:hover, a:focus { color: #406a80; text-decoration: underline; }
a:focus { outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; }
figure { margin: 0; }
img { vertical-align: middle; }
.img-responsive, .thumbnail > img, .thumbnail a > img { display: block; max-width: 100%; height: auto; }

/* ---------- grid ---------- */
.container { margin-right: auto; margin-left: auto; padding-left: 50px; padding-right: 50px; }
@media (min-width: 768px) { .container { width: 720px; } }
@media (min-width: 939px) { .container { width: 940px; } }
@media (min-width: 1280px) { .container { width: 1280px; } }
.row { margin-left: 5px; margin-right: 5px; }
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 { position: relative; min-height: 1px; padding-left: 10px; padding-right: 10px; }
.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 { float: left; }
.col-xs-12 { width: 100%; } .col-xs-8 { width: 66.6667%; } .col-xs-6 { width: 50%; } .col-xs-4 { width: 33.3333%; } .col-xs-3 { width: 25%; }
@media (min-width: 768px) {
	.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 { float: left; }
	.col-sm-12 { width: 100%; } .col-sm-8 { width: 66.6667%; } .col-sm-6 { width: 50%; } .col-sm-4 { width: 33.3333%; } .col-sm-3 { width: 25%; }
}
@media (min-width: 939px) {
	.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 { float: left; }
	.col-md-12 { width: 100%; } .col-md-9 { width: 75%; } .col-md-8 { width: 66.6667%; } .col-md-6 { width: 50%; } .col-md-4 { width: 33.3333%; } .col-md-3 { width: 25%; }
}
@media (min-width: 1280px) {
	.col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 { float: left; }
	.col-lg-12 { width: 100%; } .col-lg-10 { width: 100%; } .col-lg-6 { width: 50%; } .col-lg-4 { width: 33.3333%; } .col-lg-3 { width: 25%; } .col-lg-2 { width: 16.6667%; }
}

/* ---------- tables / buttons (bootstrap 3) ---------- */
table { background-color: transparent; }
th { text-align: left; }
.table { width: 100%; max-width: 100%; margin-bottom: 24px; }
.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td { padding: 8px; line-height: 1.5; vertical-align: top; border-top: 1px solid #ddd; }
.table > thead > tr > th { vertical-align: bottom; border-bottom: 2px solid #ddd; }
.table > caption + thead > tr:first-child > th, .table > colgroup + thead > tr:first-child > th, .table > thead:first-child > tr:first-child > th, .table > caption + thead > tr:first-child > td, .table > colgroup + thead > tr:first-child > td, .table > thead:first-child > tr:first-child > td { border-top: 0; }
.table-hover > tbody > tr:hover { background-color: #f5f5f5; }
.btn { display: inline-block; margin-bottom: 0; font-weight: normal; text-align: center; vertical-align: middle; touch-action: manipulation; cursor: pointer; background-image: none; border: 1px solid transparent; white-space: nowrap; padding: 6px 12px; font-size: 16px; line-height: 1.5; border-radius: 4px; user-select: none; }
.btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus { outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; }
.btn:hover, .btn:focus, .btn.focus { color: #a3becc; text-decoration: none; }
.btn:active, .btn.active { outline: 0; background-image: none; box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125); }
.btn-primary { color: #73bfe6; background-color: #ecf6fc; border-color: #73bfe6; }
.btn-primary:hover, .btn-primary:focus, .btn-primary.focus, .btn-primary:active, .btn-primary.active { color: #fff; background-color: #fd8e00; border-color: #fd8e00; }
.collapse { display: none; }
.caret { display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle; border-top: 4px dashed; border-right: 4px solid transparent; border-left: 4px solid transparent; }
.dropup, .dropdown { position: relative; }
.dropdown-toggle:focus { outline: 0; }
.dropdown-menu { position: absolute; top: 100%; left: 0; z-index: 1000; display: none; float: left; min-width: 160px; padding: 5px 0; margin: 2px 0 0; list-style: none; font-size: 16px; text-align: left; background-color: #fff; border: 1px solid rgba(0, 0, 0, .15); border-radius: 4px; box-shadow: 0 6px 12px rgba(0, 0, 0, .176); background-clip: padding-box; }
.nav { margin-bottom: 0; padding-left: 0; list-style: none; }
.nav > li { position: relative; display: block; }
.nav > li > a { position: relative; display: block; padding: 10px 15px; }
.nav > li > a:hover, .nav > li > a:focus { text-decoration: none; background-color: #ecf0f1; }
.nav-pills > li { float: left; }
.nav-pills > li > a { border-radius: 4px; }
.nav-pills > li + li { margin-left: 2px; }
.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus { color: #fff; background-color: #73bfe6; }
.nav-stacked > li { float: none; }
.nav-stacked > li + li { margin-top: 2px; margin-left: 0; }
.navbar { position: relative; min-height: 40px; margin-bottom: 24px; border: 1px solid transparent; }
@media (min-width: 1280px) { .navbar { border-radius: 4px; } .navbar-header { float: left; } }
.navbar-collapse { overflow-x: visible; padding-right: 50px; padding-left: 50px; border-top: 1px solid transparent; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1); }
@media (min-width: 1280px) {
	.navbar-collapse { width: auto; border-top: 0; box-shadow: none; }
	.navbar-collapse.collapse { padding-bottom: 0; display: block !important; height: auto !important; overflow: visible !important; }
}
.navbar-nav { margin: 4px -50px; }
.navbar-nav > li > a { padding-top: 10px; padding-bottom: 10px; line-height: 24px; }
@media (min-width: 1280px) {
	.navbar-nav { float: left; margin: 0; }
	.navbar-nav > li { float: left; }
	.navbar-nav > li > a { padding-top: 8px; padding-bottom: 8px; }
}
.navbar-nav > li > .dropdown-menu { margin-top: 0; border-top-right-radius: 0; border-top-left-radius: 0; }
.navbar-default { background-color: transparent; border-color: rgba(0, 0, 0, 0); }
.navbar-default .navbar-nav > li > a { color: #7a8f99; }
.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus { color: #73bfe6; background-color: transparent; }
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus { color: #73bfe6; background-color: transparent; }
.navbar-default .navbar-collapse { border-color: rgba(0, 0, 0, 0); }
.thumbnail { display: block; padding: 4px; margin-bottom: 24px; line-height: 1.5; background-color: #fff; border: 1px solid #ddd; border-radius: 4px; transition: border .2s ease-in-out; }
.thumbnail > img, .thumbnail a > img { margin-left: auto; margin-right: auto; }
.thumbnail .caption { padding: 5px; color: #667780; }
.close { float: right; font-size: 24px; font-weight: bold; line-height: 1; color: #000; text-shadow: 0 1px 0 #fff; opacity: .2; }
.close:hover, .close:focus { color: #000; text-decoration: none; cursor: pointer; opacity: .5; }
button.close { padding: 0; cursor: pointer; background: transparent; border: 0; -webkit-appearance: none; appearance: none; }
.clearfix::before, .clearfix::after, .container::before, .container::after, .row::before, .row::after, .nav::before, .nav::after, .navbar::before, .navbar::after, .navbar-header::before, .navbar-header::after, .navbar-collapse::before, .navbar-collapse::after { content: " "; display: table; }
.clearfix::after, .container::after, .row::after, .nav::after, .navbar::after, .navbar-header::after, .navbar-collapse::after { clear: both; }
.pull-right { float: right !important; }
.pull-left { float: left !important; }
.affix { position: fixed; }
@media (max-width: 767px) { .hidden-xs { display: none !important; } }
@media (min-width: 768px) and (max-width: 938px) { .hidden-sm { display: none !important; } }
@media (min-width: 1280px) { .hidden-lg { display: none !important; } }

/* ---------- logo ---------- */
@media (max-width: 1279px) {
	.nk-header span { margin: 0; padding: 0; display: none !important; }
	.logo-image small { display: none !important; }
	.logo-control .logo-img-sm { display: block; }
	.logo-control .logo-img { display: none; }
}
@media (min-width: 1280px) {
	.logo-control .logo-img-sm { display: none; }
	.nk-header.affix .logo-img-sm { display: block; }
	.logo-control .logo-img { display: block; }
	.logo { margin-left: 0; }
}
th, td { line-height: 1.5; text-align: left; vertical-align: top; }
th { font-weight: bold; }
td, tr td { border-top: 1px solid #ddd; }
.wrap { width: auto; clear: both; }
@media screen and (max-width: 1279px) {
	.container { padding-left: 20px; padding-right: 20px; }
	.row { margin-left: -20px; margin-right: -20px; }
	.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 { padding-left: 20px; padding-right: 20px; }
	.logo { margin-left: 0; }
}

/* ---------- typography ---------- */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: "Open Sans", sans-serif; font-weight: 500; line-height: 1.1; color: #406a80; }
h1, .h1, h2, .h2, h3, .h3 { margin-top: 5px; margin-bottom: 8px; }
h1, .h1 { font-size: 30px; }
h2, .h2 { font-size: 25px; }
h3, .h3 { font-size: 20px; }
h4, .h4 { font-size: 18px; }
p { margin: 0 0 12px; }
small, .small { font-size: 85%; }
ul, ol { margin-top: 0; margin-bottom: 12px; }
ul ul, ol ul, ul ol, ol ol { margin-bottom: 0; }

/* ---------- theme ---------- */
.btn { border: 2px solid transparent; border-radius: 6px; font-family: Montserrat, sans-serif; font-size: 13px; text-transform: uppercase; padding: 8px 24px; }
.btn-primary { background: #fecd37; color: #fff; border-radius: 4px; font-family: Montserrat, sans-serif; font-size: 13px; text-transform: uppercase; padding: 3px 5px; }
.dropdown-menu { background: #2c3236; border-radius: 0; font-size: 14px; padding: 20px; margin-top: 0; }
.nav > li > a:hover, .nav > li > a:focus { background: none; }
.nav-pills > li { border-bottom: 1px solid #e1e4e6; }
.nav-pills > li > a { color: #667780; font-size: 14px; padding: 14px 0; }
.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus { background: none; color: #73bfe6; }
.nav .caret { border-top-color: #73bfe6; border-bottom-color: #73bfe6; }
.nav a:hover .caret { border-top-color: #406a80; border-bottom-color: #406a80; }
@media screen and (max-width: 939px) {
	.home-images img { width: 100%; padding: 5px 0; }
	.row-feature-ct { margin: 5px 0 -33px; }
	.col-8s, .col-4s { padding: 0; width: 100%; }
	.custom.home-images { margin: 0; }
}
.navbar-header { margin-left: 12px; }
.navbar-nav { margin: 4px -50px; }
@media (min-width: 1280px) { .navbar-nav { margin: 0; } }
.navbar-nav > li > .dropdown-menu, .navbar-nav > li.open > .dropdown-menu { background: #fec20b; border-radius: 10px; font-size: 13px; min-width: 220px; padding: 20px; border: 0; }
.navbar-default { background-color: transparent; border-color: rgba(0, 0, 0, 0); font-size: 14px; font-weight: bold; padding-left: 10px; }
.navbar-default .navbar-nav > .dropdown > a:hover .caret, .navbar-default .navbar-nav > .dropdown > a:focus .caret { border-top-color: #73bfe6; border-bottom-color: #73bfe6; }
.navbar-default .navbar-nav > .dropdown > a .caret { border-top-color: #7a8f99; border-bottom-color: #7a8f99; }
.nk-mainnav { border: 0; margin-bottom: 0; border-radius: 0; min-height: 0; float: right; }
.bg-sunshine { background: url("../images/slideshow-bg.webp") no-repeat; margin: 0 !important; }
.nk-mainnav .nk-navbar { padding-left: 0; padding-right: 0; }
.nk-mainnav .nk-navbar .navbar-nav { float: right; text-transform: uppercase; }
.nk-mainnav .nk-navbar .navbar-nav > li { margin: 0 9px; }
.nk-mainnav .nk-navbar .navbar-nav > li > a { border-bottom: 2px solid transparent; padding: 15px 5px 21px; }
.nk-mainnav .nk-navbar .navbar-nav > li > a:hover, .nk-mainnav .nk-navbar .navbar-nav > li > a:focus { color: #73bfe6; }
.nk-mainnav .nk-navbar .navbar-nav > .active > a, .nk-mainnav .nk-navbar .navbar-nav > .active > a:hover, .nk-mainnav .nk-navbar .navbar-nav > .active > a:focus { background: #47bcc6; padding: 4px 15px; margin: 10px 0; border-radius: 5px; color: #fff; font-weight: 600; }
#nk-mainnav { float: right; padding-top: 7px; }
.nk-module { background: transparent; color: inherit; margin-bottom: 24px; }
@media screen and (min-width: 768px) { .nk-module { margin-bottom: 10px; } }
.nk-module .module-inner { padding: 0; position: relative; }
.module-title { background: transparent; color: #406a80; font-family: Montserrat, sans-serif; font-size: 16px; margin: 0 0 12px; padding: 0; }
@media screen and (min-width: 768px) { .module-title { margin-bottom: 5px; } }
.module-ct { background: transparent; color: inherit; padding: 0; font-size: 14px; }
.module-ct::before, .module-ct::after { content: " "; display: table; }
.module-ct::after { clear: both; }
.module-ct > ul, .module-ct .custom > ul, .module-ct > ol, .module-ct .custom > ol { margin-left: 20px; padding-left: 0; }
.module-ct > ul.nav, .module-ct .custom > ul.nav, .module-ct > ol.nav, .module-ct .custom > ol.nav { padding-left: 0; margin-left: 0; }
.article-intro, .article-content { line-height: 1.875em; }
.article-intro img, .article-content img { display: block; max-width: 100%; height: auto; }
@media (max-width: 768px) { .article-content iframe { width: 100% !important; height: auto; } }
.row-feature { padding: 0; text-align: justify; }
.row-feature.nk-module { margin-bottom: 0; }
.row-feature-ct { margin: 18px 0 0; }
.custom.home-images { margin: 20px 0 0; }
.row-feature-ct img { width: 100%; }
.nk-header { position: absolute; width: 100%; background: url("../images/cloud_up.webp") repeat-x; height: 91px; z-index: 99; }
.nk-header.affix { position: fixed; width: 100%; background: #fff; z-index: 9999; box-shadow: 3px 2px 15px 0; height: 76px; }
.nk-header.affix .logo-img { display: none; }
@media (max-width: 320px) {
	.row-feature-ct { margin: 28px 0 0; }
	.nk-header #nk-mainnav { padding-left: 0; }
}
.logo { text-align: left; z-index: 9999; position: absolute; margin-left: -250px; }
@media (min-width: 1280px) { .logo { padding-bottom: 0; } }
.logo a { display: inline-block; line-height: 1; margin: 0; text-decoration: none; }
.logo-image span, .logo-image small { display: block; margin-top: -178px; color: #7a8f99; padding-left: 85px; font-weight: 500; font-size: 20px; }
.nk-sl { padding-bottom: 15px; padding-top: 20px; }
@media screen and (min-width: 768px) {
	.nk-sl { padding-bottom: 15px; padding-top: 20px; background-image: url("../images/pat2.webp"); background-repeat: no-repeat; background-position: 119% 34%; }
	.wrap.features-intro { background-image: url("../images/pat2.webp"); background-repeat: no-repeat; background-position: -22% 19%; }
}
.nk-mainbody { padding-top: 24px; padding-bottom: 24px; }
.nk-content { padding-top: 1px; padding-bottom: 24px; }
.nk-sidebar { padding-top: 5px; padding-bottom: 5px; }
.nk-footer { background: none; color: #6b7c88; }
.nk-footer::before, .nk-footer::after { content: " "; display: table; }
.nk-footer::after { clear: both; }
.nk-footer a:hover, .nk-footer a:active, .nk-footer a:focus { text-decoration: none; color: #fff; }
#back-to-top { position: fixed; right: 24px; top: auto; bottom: 48px; z-index: 999; display: none; }
#back-to-top .btn { background: #2690ab; color: #fff; height: 60px; width: 60px; border-radius: 50%; line-height: 60px; opacity: .7; padding: 0; text-align: center; transition: .2s; }
#back-to-top .btn:hover, #back-to-top .btn:active, #back-to-top .btn:focus { background: #fd8e00; opacity: 1; }
@media (min-width: 768px) { #back-to-top.affix { display: block; } }
#back-to-top svg { width: 30px; height: 30px; vertical-align: middle; fill: currentColor; }
.nk-footnav::before, .nk-footnav::after { content: " "; display: table; }
.nk-footnav::after { clear: both; }
@media screen and (min-width: 768px) { .nk-footnav { padding: 10px 0; } }
.nk-footnav .nk-module { background: none; color: #6b7c88; margin-top: 2px; margin-bottom: 2px; }
.nk-footnav .nk-module .module-title { color: #73bfe5; font-size: 16px; margin-bottom: 5px; padding: 10px; background: #2690ab; margin-left: -3px; }
.module-title span { color: #fff; font-weight: 600; }
.background_footer { background: url("../images/footer.webp") repeat-x; height: 143px; }
.mapss h3.module-title { top: -45px; }
.nk-copyright { background: url("../images/dots-pattern.webp") #0d3f4b; font-size: 13px; padding: 10px 0; text-align: center; }
.nk-copyright::before, .nk-copyright::after { content: " "; display: table; }
.nk-copyright::after { clear: both; }
.nk-copyright small { margin-bottom: 5px; color: #fff; font-size: 110%; }
.copyright { margin-bottom: 24px; font-size: 12px; color: #525f66; height: 30px; }
@media screen and (min-width: 939px) { .copyright { margin-bottom: 0; text-align: left; } }
.masshead { text-align: center; padding: 115px; background: url("../images/bg-masthead.webp") 0 0 / cover no-repeat; }
@media screen and (max-width: 938px) { .masshead { padding: 68px; } }
.masshead .masshead-title { color: #fff; font-weight: 300; font-size: 40px; margin: 0; }
@media screen and (max-width: 938px) { .masshead .masshead-title { font-size: 28px; margin-top: 20px; } }
.masshead .masshead-description { color: #7a8f99; line-height: 1.8; width: 500px; margin: 24px auto auto; }
@media screen and (max-width: 938px) { .masshead .masshead-description { font-size: 14px; margin: 12px auto auto; width: auto; } }
.module_groupposition { background: #47bcc6; color: #fff; border-radius: 5px; }
.module_groupposition h3 { text-align: center; font-weight: bold; padding-top: 15px; color: #fff; }
.ict-slideshow .container { background: url("../images/grass.webp") 0 547px no-repeat; margin-top: 59px; }
.container-11:hover .image-11 { opacity: .8; }
.container-11:hover .middle-11 { opacity: 1; }
.module_groupfooter .module-inner { border: 3px solid #ccc; max-height: 555px; }
.module_groupfooter .module-ct { overflow-y: hidden; max-height: 555px; }
.module_groupfooter h3::after, .module_groupfooter h3::before { content: ""; position: absolute; border-bottom: 42px solid #2690ab; border-right: 60px solid transparent; left: 100%; margin-top: -10px; height: 42px; }
.module_groupfooter h3 { position: absolute; padding: 0 1.5em; top: -15%; color: #fff; height: 42px; }
.module_slidebar h3, .module_menubar h3 { background: url("../images/bg-titles.webp") -95px -8px no-repeat; height: 50px; padding: 15px 0 0 11px; border-radius: 6px; }
.module_groupfooter { max-height: 306px; }
ul.social-list li a { color: #fff; font-size: 22px; }
ul.social-list svg { width: 22px; height: 22px; fill: currentColor; vertical-align: -3px; }
.social-list li { display: inline-block; margin-left: 20px; }
.module_menubar li { background: #fafadf; border-radius: 5px; padding: 0 5px 0 11px; }
.module_menubar li:hover, .module_menubar li:focus { background: #fff; border-radius: 5px; padding: 0 5px 0 11px; }
.module_menubar li a { font-weight: 600; padding: 9px 0 9px 2px !important; }
.col-lg-6.col-md-6.col-sm-12.col-xs-12 { width: 100%; padding: 25px 1px !important; }
.article-content h3 { background: url("../images/dots-pattern.webp") #1c6f84; color: #fff; font-weight: bold; padding: 8px; }
.fix-anchor { width: 1px; height: 1px; overflow: hidden; position: relative; top: -110px; visibility: hidden; }
.nk-header.affix span { display: none; margin: 0; padding: 0; }

/* ---------- slideshow (thay mod_ictslideshow, giữ markup ict-ss) ---------- */
.ict-slideshow { background: url("../images/dots-pattern.webp") #26b4d7; }
@media screen and (max-width: 1350px) { .ict-slideshow .container { padding-left: 84px; padding-right: 84px; } }
.ict-ss-wrap { position: relative; width: 100%; }
.ict-ss-items { overflow: hidden; position: relative; width: 100%; }
.ict-ss-item { display: block; float: left; margin: 0; overflow: hidden; position: absolute; right: 0; left: 0; width: 100%; min-height: 260px; z-index: 1; backface-visibility: hidden; }
.ict-ss-item-ghost { position: relative !important; visibility: hidden; }
.ict-ss-item.curr { z-index: 2; }
.ict-ss-item img { max-width: 100%; width: 100%; }
.ict-ss-mask { position: absolute; left: 0; top: 0; z-index: 2; }
.ict-ss-btns { z-index: 10; transform: none !important; }
.ict-ss-btns button { background: url("../images/bc-lr.webp") left top no-repeat; border: 0; color: #fff; cursor: pointer; display: block; float: left; height: 60px; margin-top: -30px; padding: 0; position: absolute; text-indent: -999em; overflow: hidden; top: 50%; width: 60px; z-index: 100; }
.ict-ss-btns .ict-ss-prev { background-position: 0 0; left: -84px; }
.ict-ss-btns .ict-ss-prev:hover, .ict-ss-btns .ict-ss-prev:focus-visible { background-position: left bottom; }
.ict-ss-btns .ict-ss-next { background-position: right 0; right: -84px; }
.ict-ss-btns .ict-ss-next:hover, .ict-ss-btns .ict-ss-next:focus-visible { background-position: right bottom; }
.ict-ss-thumbs-wrap { height: 16px; width: 100%; clear: both; position: absolute; bottom: 30px; overflow: hidden; z-index: 1000; line-height: 1; }
.ict-ss-thumbs { margin: 0; padding: 0; position: absolute; top: 0; text-align: center; width: 100%; white-space: nowrap; }
.ict-ss-thumbs .ict-ss-thumb { display: inline-block; overflow: hidden; margin: 0 3px; padding: 0; text-align: center; vertical-align: bottom; cursor: pointer; border: 2px solid #aaa; height: 10px; width: 10px; text-indent: -999em; border-radius: 10px; background: transparent; background-clip: padding-box; }
.ict-ss-thumbs .ict-ss-thumb.active { border-color: #73bfe6; background: #73bfe6; }
.ict-ss-sprite { text-align: right; }
.ict-ss-sprite img { width: 70%; background: none; display: inline-block; }
@media (min-width: 1280px) { .ict-ss-sprite img { width: 100%; } }
.ict-ss-item-bg { position: relative; z-index: 1; }
.ict-ss-sprite, .ict-ss-desc { position: absolute; z-index: 2; opacity: 0; }
.leftright .ict-ss-sprite.first { bottom: 13%; left: -10%; }
.leftright .ict-ss-sprite.second { bottom: 10%; left: 110%; }
.active.leftright .ict-ss-sprite.second { left: 45%; }
.active .ict-ss-sprite { opacity: 1; }
.custom .ict-ss-item { opacity: 0; }
.custom .ict-ss-item.curr { opacity: 1; }
.custom .ict-ss-item.prev { left: -100%; }
.custom .ict-ss-item.next { left: 100%; }
.custom .ict-ss-item.curr { left: 0; top: 26px; }
.second img { border-radius: 50%; width: 94%; border: 5px solid #fafcfb; margin-right: 1px; }
.first img { margin-left: 0; margin-bottom: 109px; border: 3px solid #fff; }
.animate { transition: all 1200ms cubic-bezier(.25, .1, .25, 1) 1000ms; backface-visibility: hidden; }
.duration500 { transition-duration: 500ms; }
.delay500 { transition-delay: 500ms; }
.active .adelay2000 { transition-delay: 2000ms; }
.active .adelay1500 { transition-delay: 1500ms; }
@media (max-width: 1350px) {
	.ict-slideshow .ict-ss-btns .ict-ss-prev { left: 0; }
	.ict-slideshow .ict-ss-btns .ict-ss-next { right: 0; }
	.ict-slideshow .bg-sunshine .container { padding-left: 0; padding-right: 0; }
}
.ict-ss-item .ict-ss-sprite { transition: .4s; }
@media (min-width: 1280px) { .ict-ss-item .first img { margin-bottom: 15px; } }
@media (max-width: 1366px) { .ict-ss-item .first img { margin-bottom: 40px; } }
@media (max-width: 550px) {
	.ict-ss-items .leftright .ict-ss-sprite.first { left: auto; right: 0; transition: .4s; }
	.ict-ss-item .first img { width: 100%; }
	.leftright .ict-ss-sprite.second { right: 0; left: auto !important; bottom: 19% !important; }
	.ict-ss .ict-ss-btns .ict-ss-next { width: 30px; height: 30px; background-size: 57px auto; background-position: -28px 1px; margin-top: 0; right: 0; background-color: rgba(150, 151, 151, .66); border-radius: 100%; }
	.ict-ss .ict-ss-btns .ict-ss-next:hover { background-position: -28px -29px; }
	.ict-ss .ict-ss-btns .ict-ss-prev { width: 30px; height: 30px; background-size: 57px auto; background-position: 1px 1px; margin-top: 0; left: 0; background-color: rgba(150, 151, 151, .66); border-radius: 100%; }
	.ict-ss .ict-ss-btns .ict-ss-prev:hover { background-position: 1px -29px; }
	.ict-slideshow .bg-sunshine .container { padding-left: 0; padding-right: 0; }
	.ict-ss .ict-ss-thumbs-wrap { bottom: 5px; }
	.home-images img { width: 100%; padding: 5px 0; }
	.row-feature-ct { margin: 5px 0 -33px; }
	.col-8s, .col-4s { padding: 0; }
	.custom.home-images { margin: 0; }
}
@media (max-width: 320px) { .home-images img { width: 100%; padding-left: 0; } }
.ict-slideshow .ict-ss .ict-ss-item .ict-ss-sprite { bottom: 0; left: 10px !important; right: 10px !important; }
.ict-slideshow .ict-ss .ict-ss-item .ict-ss-sprite .ict-ss-item-img { border-radius: 0; width: 100%; border: 0 solid transparent; margin-bottom: 0; }
.ict-slideshow .ict-ss-item { top: 0 !important; }
@media (max-width: 1279px) {
	.ict-slideshow .ict-ss .ict-ss-item .ict-ss-sprite .ict-ss-item-img { margin-bottom: 0; }
	.ict-slideshow .ict-ss-thumbs-wrap { bottom: 3px; }
}
@media (max-width: 938px) {
	.home-images img { width: 100%; padding: 5px 0; }
	.row-feature-ct { margin: 5px 0 -33px; }
	.col-8s, .col-4s { padding: 0; width: 100%; }
	.custom.home-images { margin: 0; }
}
@media (max-width: 552px) { .ict-slideshow .ict-ss .ict-ss-item .ict-ss-sprite { bottom: 0 !important; left: 0 !important; right: 0 !important; } }
@media (max-width: 480px) {
	.logo-control .logo-img-sm { max-width: 115px; }
	header.nk-header { height: 65px; background-size: cover; }
	nav .off-canvas-toggle { margin-top: 0; }
}
@media (max-width: 415px) { .ict-slideshow .ict-ss-item { min-height: 232px; } }
@media (max-width: 375px) {
	.ict-slideshow .ict-ss-btns button { top: 60%; }
	.ict-slideshow .ict-ss-item { min-height: 220px; }
}
@media (max-width: 320px) { .ict-slideshow .ict-ss-item { min-height: 200px; } }
.ict-slideshow .ict-ss-item-bg { max-height: 600px; }

/* ---------- home ---------- */
.home_image_tex { align-items: center; display: flex; flex-wrap: wrap; margin-bottom: 30px; }
.home_image_tex .col-md-6 { padding-left: 0; padding-right: 0; }
.home_image_tex { background: #47bcc6; color: #fff; }
.home_image_tex .entry-text { padding: 15px; border: 2px dashed #fff; }
.home_image_tex img { padding-left: 0; max-width: 100%; width: 100%; }
.home_image_tex .col-text { padding: 15px; }
.home_image_tex.reverse { flex-direction: row-reverse; }
.nk-sl-1 .nk-spotlight-1 .module_groupposition .custom_groupposition img { width: 100%; height: auto; }
@media (max-width: 1600px) { .logo { margin-left: 0; } }

/* ---------- megamenu ---------- */
.nk-megamenu .mega-inner::before, .nk-megamenu .mega-inner::after { content: " "; display: table; }
.nk-megamenu .mega-inner::after { clear: both; }
.nk-megamenu .mega > .mega-dropdown-menu { min-width: 200px; display: none; }
.nk-megamenu .mega-nav, .nk-megamenu .dropdown-menu .mega-nav { margin: -15px 0 0; padding: 0; list-style: none; }
.nk-megamenu .mega-nav > li, .nk-megamenu .dropdown-menu .mega-nav > li { list-style: none; margin-left: 0; color: #fff; border-bottom: 1px solid; }
.nk-megamenu .mega-nav > li a, .nk-megamenu .dropdown-menu .mega-nav > li a { white-space: normal; display: block; padding: 5px; }
.nk-megamenu .mega-nav > li a:hover, .nk-megamenu .dropdown-menu .mega-nav > li a:hover, .nk-megamenu .mega-nav > li a:focus, .nk-megamenu .dropdown-menu .mega-nav > li a:focus { text-decoration: none; color: #fff; }
.nk-megamenu .nav .caret { display: none; }
.nk-megamenu .nav > .dropdown > .dropdown-toggle .caret { display: inline-block; }
@media (min-width: 1280px) { .nk-megamenu.animate .mega > .mega-dropdown-menu { backface-visibility: hidden; opacity: 0; } }
@media (max-width: 1279px) {
	.nk-megamenu .row, .nk-megamenu .mega-dropdown-menu, .nk-megamenu .row [class*="col-xs-"] { width: 100% !important; min-width: 100% !important; left: 0 !important; margin-left: 0 !important; transform: none !important; }
}
.nk-megamenu .mega-inner { padding: 0; }
.nk-megamenu .row { margin-left: auto; margin-right: auto; }
.nk-megamenu .mega-dropdown-menu { background: #2c3236; border-radius: 0; font-size: 13px; border: 0; }
.nk-megamenu li.mega .mega-dropdown-menu { min-width: 235px; padding: 20px 0; }
.nk-megamenu .mega-nav > li a, .nk-megamenu .dropdown-menu .mega-nav > li a { background: none; color: #fff; padding: 6px 0; }
.nk-megamenu .mega-nav > li a:hover, .nk-megamenu .dropdown-menu .mega-nav > li a:hover, .nk-megamenu .mega-nav > li a:active, .nk-megamenu .mega-nav > li a:focus { color: #73bfe6; background: none; }

/* ---------- off-canvas ---------- */
.off-canvas-toggle { z-index: 100; }
html, body { height: 100%; }
.nk-wrapper { background: #fff; position: relative; left: 0; z-index: 99; transition: transform .5s; overflow: visible; }
.nk-wrapper::after { position: absolute; top: 0; right: 0; width: 0; height: 0; background: rgba(0, 0, 0, .2); content: ""; opacity: 0; transition: opacity .5s, width .1s .5s, height .1s .5s; z-index: 100; }
.off-canvas-toggle { border-radius: 4px; border: 2px solid #406a80; color: #406a80; font-size: 14px; padding: 0; margin-top: 15px; width: 40px; height: 40px; line-height: 40px; margin-left: 12px; }
.off-canvas-toggle:hover { border-color: #73bfe6; color: #fff; }
.off-canvas-toggle:focus { outline: none; }
.off-canvas-toggle svg { width: 14px; height: 14px; fill: currentColor; vertical-align: -1px; }
.nk-off-canvas { position: fixed; top: 0; right: 0; z-index: 1; visibility: hidden; width: 250px; height: 100%; overflow-y: auto; transition: transform .5s, visibility .5s; transform: translate3d(50%, 0, 0); background: #2c3236; color: #667780; }
.nk-off-canvas .nk-off-canvas-header { background: #1a1f22; padding: 0 0 0 24px; height: 35px; position: relative; }
.nk-off-canvas .nk-off-canvas-header h2 { color: #667780; margin: 0; line-height: 35px; font-size: 15px; font-weight: bold; text-transform: uppercase; }
.nk-off-canvas .close { margin: 0; height: 35px; line-height: 35px; width: 35px; background: #3b474d; position: absolute; top: 0; right: 0; opacity: 1; color: #000; text-align: center; }
.nk-off-canvas .nk-off-canvas-body { font-size: 14px; padding: 0; text-transform: uppercase; }
.nk-off-canvas .nk-off-canvas-body a { color: #7a8f99; text-decoration: none; }
.nk-off-canvas .nk-off-canvas-body a:hover, .nk-off-canvas .nk-off-canvas-body a:focus { background: none; color: #73bfe6; text-decoration: none; }
.nk-off-canvas .nk-off-canvas-body .nav-pills > li { border: none; }
.nk-off-canvas .nk-off-canvas-body .nav-pills > li > a { border-bottom: 1px solid #242a2e; padding: 10px 24px; }
.nk-off-canvas .nk-off-canvas-body .nk-module { margin-bottom: 24px; }
.nk-off-canvas .nk-off-canvas-body .nav-pills > li.active > a { color: #73bfe6; }
.nk-off-canvas .nk-off-canvas-body .nav-stacked > li + li { margin-top: 0; }

/* ==========================================================================
   STATE – thay cho JS của T3 (megamenu, affix, off-canvas)
   ========================================================================== */
/* Megamenu: mở khi hover / focus bàn phím (desktop >= 1280px) */
@media (min-width: 1280px) {
	.nk-megamenu .mega > .mega-dropdown-menu { display: block; visibility: hidden; transition: opacity .4s, visibility .4s; }
	.nk-megamenu .mega:hover > .mega-dropdown-menu, .nk-megamenu .mega:focus-within > .mega-dropdown-menu { opacity: 1; visibility: visible; }
}
/* Off-canvas mở: đẩy toàn trang sang trái 250px (hiệu ứng effect-4 của T3) */
body.off-canvas-open { overflow: hidden; }
body.off-canvas-open .nk-wrapper { transform: translate3d(-250px, 0, 0); }
body.off-canvas-open .nk-wrapper::after { width: 100%; height: 100%; opacity: 1; transition: opacity .5s; }
body.off-canvas-open .nk-off-canvas { visibility: visible; transform: none; }
body.off-canvas-open .off-canvas-toggle { background: #fd8e00; border-color: #fd8e00; color: #fff; }
/* Skip link + reduced motion */
.nk-skip { position: absolute; left: 8px; top: -100px; z-index: 100000; background: #0d3f4b; color: #fff; padding: 8px 14px; border-radius: 4px; }
.nk-skip:focus { top: 8px; color: #fff; }
.nk-visually-hidden { position: absolute !important; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition-duration: 0s !important; transition-delay: 0s !important; } }
/* Thông báo hệ thống Joomla */
joomla-alert { display: block; margin: 0 0 20px; }
@media print {
	#nk-footer, #nk-header, #back-to-top, .nk-sidebar, .nk-masthead, .nk-off-canvas { display: none !important; }
	.nk-content { width: 100%; }
}
.logo-image img { height: auto; }

/* Slideshow: giữ tỉ lệ ảnh (không kéo giãn); ảnh nền cao quá 600px thì cắt phần trên (nằm dưới mây header) */
.ict-ss-item img { height: auto; }
.ict-slideshow .ict-ss-item-bg { height: auto; max-height: 600px; object-fit: cover; object-position: 50% 100%; }

/* Bản đồ khít khung viền: bỏ dòng   phía trên iframe và khoảng hở dưới (nội dung module cũ) */
.mapss #map-canvas { height: auto !important; font-size: 0; line-height: 0; }
.mapss #map-canvas iframe { display: block; width: 100%; height: 300px; }
.mapss table { margin-top: 8px !important; }

/* ===== FOCUS (2.1.2): bỏ viền đen khi bấm chuột/chạm; giữ viền khi dùng bàn phím (Tab) cho accessibility ===== */
a, button, .btn, [tabindex] { -webkit-tap-highlight-color: transparent; }
a:focus:not(:focus-visible), button:focus:not(:focus-visible), .btn:focus:not(:focus-visible),
[tabindex]:focus:not(:focus-visible), .dropdown-toggle:focus:not(:focus-visible) { outline: 0; box-shadow: none; }
a:focus-visible, button:focus-visible, .btn:focus-visible { outline: 2px solid #5b9dd9; outline-offset: 2px; }