@charset "UTF-8";

@font-face {

	font-family: 'Font-Bold';

	src: url(../fonts/fonts/UTMAvoBold.woff2) format('woff2'), url(../fonts/fonts/UTMAvoBold.woff) format('woff');

	font-weight: bold;

	font-style: normal;

}

@font-face {

	font-display: block;

	font-family: 'Roboto-Regular';

	src: url(../fonts/Roboto-Regular.woff2) format('woff2'), url(../fonts/Roboto-Regular.woff) format('woff');

	font-weight: normal;

	font-style: normal;

}

@font-face {

	font-display: block;

	font-family: 'Roboto-Bold';

	src: url(../fonts/Roboto-Bold.woff2) format('woff2'), url(../fonts/Roboto-Bold.woff) format('woff');

	font-weight: bold;

	font-style: normal;

}

@font-face {

	font-display: block;

	font-family: 'Roboto-Black';

	src: url(../fonts/Roboto-Black.woff2) format('woff2'), url(../fonts/Roboto-Black.woff) format('woff');

	font-weight: 900;

	font-style: normal;

}

@font-face {

	font-family: 'UTM-HelvetIns';

	src: url('../fonts/UTMHelvetIns.woff2') format('woff2'), url('../fonts/UTMHelvetIns.woff') format('woff');

	font-weight: normal;

	font-style: normal;

	font-display: swap;

}



@font-face {

	font-family: 'Bai-Jamjuree-B';

	src: url('../fonts/BaiJamjuree-Bold.woff2') format('woff2'), url('../fonts/BaiJamjuree-Bold.woff') format('woff');

	font-weight: bold;

	font-style: normal;

	font-display: swap;

}



@font-face {

	font-family: 'Bai-Jamjuree-M';

	src: url('../fonts/BaiJamjuree-Medium.woff2') format('woff2'),

		url('../fonts/BaiJamjuree-Medium.woff') format('woff');

	font-weight: 500;

	font-style: normal;

	font-display: swap;

}



@font-face {

	font-family: 'Bai-Jamjuree-R';

	src: url('../fonts/BaiJamjuree-Regular.woff2') format('woff2'),

		url('../fonts/BaiJamjuree-Regular.woff') format('woff');

	font-weight: normal;

	font-style: normal;

	font-display: swap;

}



* {

	box-sizing: border-box;

}

:root {

	--font-regular: Bai-Jamjuree-R;

	--font-bold: Bai-Jamjuree-B;

	--font-medium: Bai-Jamjuree-M;

	--color-red: #ec2d3f;

	--color-medium-red: #cc2c32;

	--color-dark-red: #c31829;

	--color-green: #28a745;

	--color-dark-green: #207d36;

	--color-black: #212529;

	--color-gray: #6c757d;

	--bk-cart: #4b4f56;

	--bk-phone: #1182fc;

	--bk-phone-opacity: rgba(7, 41, 103, 0.35);

	--z-index-hover: 1000;

	--z-index-menu: 999;

	--z-index: 99;

}

html {

	-webkit-text-size-adjust: 100%;

}

h1,

h2,

h3,

h4,

h5,

h6 {

	font-weight: normal;

	line-height: inherit;

}

img {

	max-width: 100%;

}

a {

	text-decoration: none !important;

	color: inherit;

}

body {

	margin: 0;

	font-family: var(--font-regular);

	line-height: 1.5;

	font-size: 14px;

	background-color: #fff;

	color: #333;

}

.container {

	position: relative;

	margin: 0 auto;

	overflow: hidden;

}

.inherit {

	max-width: 1200px;

	margin: 0 auto;

}

.info-main {

	padding: 30px 0px;

}

.breadCrumbs {

	background-color: #f1f1f1;

}

.breadcrumb {

	margin-bottom: 0;

	padding: 12px 0;

	display: block;

	background-color: transparent;

}

.breadcrumb-item {

	display: inline;

}

.alert-warning-w {

	margin-top: 30px;

}

.slick-slider *,

.slick-slide {

	outline: none;

}

.flipster {

	overflow: hidden !important;

}

.fb_iframe_widget_fluid_desktop iframe {

	width: 100% !important;

}

.spinner {

	display: block;

	margin: 0 auto;

	max-height: 100px;

}

.grecaptcha-badge {

	display: none !important;

}

.wow {

	visibility: hidden;

}

.fotorama__wrap {

	margin: 15px auto 0;

}

#gallery {

	margin: 0 auto;

}

.addthis_inline_share_toolbox_qj48,

.zalo-share-button {

	display: inline-block;

	vertical-align: middle;

}

.zalo-share-button {

	margin-bottom: 5px;

}

.owl-nav-def.owl-theme .owl-nav {

	margin-top: 0;

	font-size: 45px;

	color: #ccc;

}

.owl-nav-def.owl-theme .owl-nav [class*='owl-'] {

	position: absolute;

	top: 50%;

	-moz-transform: translateY(-50%);

	-webkit-transform: translateY(-50%);

	-o-transform: translateY(-50%);

	-ms-transform: translateY(-50%);

	transform: translateY(-50%);

}

.owl-nav-def.owl-carousel .owl-nav button.owl-next {

	left: 100%;

	margin-left: 15px;

}

.owl-nav-def.owl-carousel .owl-nav button.owl-prev {

	right: 100%;

	margin-right: 15px;

}

.flipster__button {

	width: 30px;

	height: 30px;

	background-color: #fff;

}

@-webkit-keyframes slide-right {

	0% {

		-webkit-transform: translateX(-100px);

		transform: translateX(-100px);

	}

	100% {

		-webkit-transform: translateX(0px);

		transform: translateX(0px);

	}

}

@keyframes slide-right {

	0% {

		-webkit-transform: translateX(-100px);

		transform: translateX(-100px);

	}

	100% {

		-webkit-transform: translateX(0px);

		transform: translateX(0px);

	}

}

@-webkit-keyframes scale-up-ver-top {

	0% {

		-webkit-transform: scaleY(0.4);

		transform: scaleY(0.4);

		-webkit-transform-origin: 100% 0;

		transform-origin: 100% 0;

	}

	100% {

		-webkit-transform: scaleY(1);

		transform: scaleY(1);

		-webkit-transform-origin: 100% 0;

		transform-origin: 100% 0;

	}

}

@keyframes scale-up-ver-top {

	0% {

		-webkit-transform: scaleY(0.4);

		transform: scaleY(0.4);

		-webkit-transform-origin: 100% 0;

		transform-origin: 100% 0;

	}

	100% {

		-webkit-transform: scaleY(1);

		transform: scaleY(1);

		-webkit-transform-origin: 100% 0;

		transform-origin: 100% 0;

	}

}

@-webkit-keyframes scale-in-ver-top {

	0% {

		-webkit-transform: scaleY(0);

		transform: scaleY(0);

		-webkit-transform-origin: 100% 0;

		transform-origin: 100% 0;

		opacity: 1;

	}

	100% {

		-webkit-transform: scaleY(1);

		transform: scaleY(1);

		-webkit-transform-origin: 100% 0;

		transform-origin: 100% 0;

		opacity: 1;

	}

}

@keyframes scale-in-ver-top {

	0% {

		-webkit-transform: scaleY(0);

		transform: scaleY(0);

		-webkit-transform-origin: 100% 0;

		transform-origin: 100% 0;

		opacity: 1;

	}

	100% {

		-webkit-transform: scaleY(1);

		transform: scaleY(1);

		-webkit-transform-origin: 100% 0;

		transform-origin: 100% 0;

		opacity: 1;

	}

}

.ease-in {

	transition: all 500ms ease-in;

}

.ease-in-200 {

	transition: all 200ms ease-in;

}

.ease-in-400 {

	transition: all 400ms ease-in;

}

.h-a:hover {

	color: #e3031b !important;

}

.h-a-line:hover {

	text-decoration: underline !important;

}

.img-scale {

	overflow: hidden;

}

.img-scale img {

	transition: all 0.5s;

}

.img-scale:hover img {

	-moz-transform: scale(1.1);

	-webkit-transform: scale(1.1);

	-o-transform: scale(1.1);

	-ms-transform: scale(1.1);

	transform: scale(1.1);

}

.hvr-float {

	vertical-align: middle;

	-webkit-transform: perspective(1px) translateZ(0);

	transform: perspective(1px) translateZ(0);

	box-shadow: 0 0 1px transparent;

	-webkit-transition-duration: 0.3s;

	transition-duration: 0.3s;

	-webkit-transition-property: transform;

	transition-property: transform;

	-webkit-transition-timing-function: ease-out;

	transition-timing-function: ease-out;

}

.hvr-float:active,

.hvr-float:focus,

.hvr-float:hover {

	-webkit-transform: translateY(-8px);

	transform: translateY(-8px);

}

.hvr-sink {

	display: inline-block;

	vertical-align: middle;

	-webkit-transform: perspective(1px) translateZ(0);

	transform: perspective(1px) translateZ(0);

	box-shadow: 0 0 1px transparent;

	-webkit-transition-duration: 0.3s;

	transition-duration: 0.3s;

	-webkit-transition-property: transform;

	transition-property: transform;

	-webkit-transition-timing-function: ease-out;

	transition-timing-function: ease-out;

}

.clear:after {

	content: '';

	clear: both;

	display: block;

}

.ckeditor {

	overflow-x: auto;

}

.ckeditor:after {

	content: '';

	clear: both;

	display: block;

}

.ckeditor :not(iframe) {

	max-width: 100% !important;

	height: auto !important;

}

.ckeditor iframe {

	max-width: 100% !important;

}

.hidden-seoh,

.hidden {

	display: none;

}

.centery,

.centery-after:after,

.centery-before:before {

	-moz-transform: translateY(-50%);

	-webkit-transform: translateY(-50%);

	-o-transform: translateY(-50%);

	-ms-transform: translateY(-50%);

	transform: translateY(-50%);

}

.centerx,

.centerx-after:after,

.centerx-before:before {

	-moz-transform: translateX(-50%);

	-webkit-transform: translateX(-50%);

	-o-transform: translateX(-50%);

	-ms-transform: translateX(-50%);

	transform: translateX(-50%);

	transform: translateX(-50%);

}

.centerxy,

.centerxy-after:after,

.centerxy-before:before {

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

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

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

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

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

}

.flex-space-between {

	display: flex;

	justify-content: space-between;

	flex-wrap: wrap;

}

.flex-space-left {

	display: flex;

	justify-content: flex-start;

	flex-wrap: wrap;

}

.flex-space-right {

	display: flex;

	justify-content: flex-end;

	flex-wrap: wrap;

}

.flex-space-center {

	display: flex;

	justify-content: center;

	flex-wrap: wrap;

}

.table-resp {

	overflow: auto;

}

.table-resp table {

	min-width: 555px;

}

.singletext {

	overflow: hidden;

	text-overflow: ellipsis;

	white-space: nowrap;

}

.doubletext {

	display: -webkit-box;

	-webkit-box-orient: vertical;

	overflow: hidden;

	text-overflow: ellipsis;

}

.fixed {

	position: fixed;

	top: 0;

	left: 0;

	right: 0;

	z-index: var(--z-index-menu);

	-webkit-animation: scale-up-ver-top 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;

	animation: scale-up-ver-top 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;

}

.scrollToTop {

	position: fixed;

	z-index: var(--z-index);

	bottom: 35px;

	right: 18px;

	width: 48px;

	height: 48px;

	background: url(../images/top.png);

	cursor: pointer;

}

h3.seo,

h2.seo {

	margin: 0;

	font-size: inherit;

}

.cart-fixed {

	position: fixed;

	right: 20px;

	bottom: 390px;

	z-index: var(--z-index);

	background: var(--bk-cart);

	width: 50px;

	height: 50px;

	text-align: center;

	color: #fff !important;

	border-radius: 100%;

	display: flex;

	align-items: center;

	justify-content: center;

}

.cart-fixed i {

	font-size: 20px;

}

.cart-fixed span {

	position: absolute;

	top: 0;

	right: -5px;

	color: #fff;

	width: 25px;

	height: 25px;

	background: var(--color-red);

	text-align: center;

	line-height: 25px;

	font-size: 11px;

	border-radius: 100%;

}

.btn-frame {

	display: block;

	width: 50px;

	height: 50px;

	position: fixed;

	right: 20px;

	z-index: var(--z-index);

	cursor: pointer;

}

.btn-frame i {

	display: flex;

	display: -ms-flex;

	justify-content: center;

	align-items: center;

	-ms-flex-align: center;

	width: 50px;

	height: 50px;

	border-radius: 50%;

	background: var(--bk-phone);

	position: relative;

	z-index: 1;

}

.btn-frame i img {

	vertical-align: middle;

	width: 70%;

}

.btn-frame .animated.infinite {

	animation-iteration-count: infinite;

}

.btn-frame .kenit-alo-circle {

	width: 60px;

	height: 60px;

	top: -5px;

	right: -5px;

	position: absolute;

	background-color: transparent;

	-webkit-border-radius: 100%;

	-moz-border-radius: 100%;

	border-radius: 100%;

	border: 2px solid var(--bk-phone-opacity);

	opacity: 0.1;

	border-color: var(--bk-phone);

	opacity: 0.5;

}

.btn-frame .zoomIn {

	animation-name: zoomIn;

}

.btn-frame .animated {

	animation-duration: 1s;

	animation-fill-mode: both;

}

.btn-frame .kenit-alo-circle-fill {

	width: 70px;

	height: 70px;

	top: -10px;

	right: -10px;

	position: absolute;

	-webkit-transition: all 0.2s ease-in-out;

	-moz-transition: all 0.2s ease-in-out;

	-ms-transition: all 0.2s ease-in-out;

	-o-transition: all 0.2s ease-in-out;

	transition: all 0.2s ease-in-out;

	-webkit-border-radius: 100%;

	-moz-border-radius: 100%;

	border-radius: 100%;

	border: 2px solid transparent;

	-webkit-transition: all 0.5s;

	-moz-transition: all 0.5s;

	-o-transition: all 0.5s;

	transition: all 0.5s;

	background-color: var(--bk-phone-opacity);

	opacity: 0.4;

}

.btn-frame .pulse {

	animation-name: pulse;

}

.scrollToTop {
	bottom: 70px;
}

.btn-map{
	bottom: 140px;
}
.btn-zalo {
	bottom: 320px;
}


.btn-phone {

	bottom: 230px;

}

.js-facebook-messenger-container.closed,

.js-facebook-messenger-tooltip.closed {

	display: none !important;

}

.js-facebook-messenger-tooltip {

	bottom: 97px;

	right: 97px;

	color: #404040;

	background: #fff;

}

.js-facebook-messenger-box,

.js-facebook-messenger-button,

.js-facebook-messenger-tooltip {

	z-index: 999;

}

.js-facebook-messenger-tooltip {

	display: none;

	position: fixed;

	text-align: center;

	border-radius: 10px;

	overflow: hidden;

	font-size: 12px;

	line-height: 1;

	padding: 10px;

	border: 1px solid rgba(0, 0, 0, 0.1);

	box-shadow: rgba(0, 0, 0, 0.15) 0 2pt 10pt;

	z-index: 1e30;

}

.js-facebook-messenger-close-tooltip {

	width: 10px;

	height: 10px;

	display: inline-block;

	cursor: pointer;

	margin-left: 10px;

}

.js-facebook-messenger-box.rubberBand {

	-webkit-animation-name: rubberBand;

	animation-name: rubberBand;

}

.js-facebook-messenger-box.animated {

	-webkit-animation-duration: 1s;

	animation-duration: 1s;

	-webkit-animation-fill-mode: both;

	animation-fill-mode: both;

}

.js-facebook-messenger-box,

.js-facebook-messenger-button,

.js-facebook-messenger-tooltip {

	z-index: 999;

}

.js-facebook-messenger-box {

	display: block;

	position: fixed;

	cursor: pointer;

	bottom: 150px;

	right: 17px;

	width: 56px;

	height: 56px;

	text-align: center;

	background: var(--bk-phone);

	border-radius: 100%;

	overflow: hidden;

	z-index: 99;

	-webkit-box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.3);

	-moz-box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.3);

	box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.3);

}

.js-facebook-messenger-box.rotate svg#fb-msng-icon {

	transform: rotate(0deg);

}

.js-facebook-messenger-box svg#fb-msng-icon {

	width: 32px;

	height: 33px;

	position: absolute;

	top: 13px;

	left: 12px;

	opacity: 1;

	overflow: hidden;

	-webkit-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

	-moz-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

	-o-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

	transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

}

.js-facebook-messenger-box.rotate svg#close-icon {

	transform: rotate(-45deg);

}

.js-facebook-messenger-box svg#close-icon {

	opacity: 0;

	width: 19px;

	height: 20px;

	position: absolute;

	top: 19px;

	left: 19px;

	-webkit-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

	-moz-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

	-o-transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

	transition: opacity 160ms ease-in-out, transform 160ms ease-in-out;

}

.js-facebook-messenger-container,

.js-facebook-messenger-container-button {

	z-index: 1000;

}

.js-facebook-messenger-container {

	position: fixed;

	opacity: 0;

	transform: translateY(50px);

	bottom: 110px;

	right: 90px;

	border-radius: 10px;

	pointer-events: none;

	box-shadow: 0 1px 6px rgba(0, 0, 0, 0.06), 0 2px 32px rgba(0, 0, 0, 0.16);

	-webkit-transition: transform 160ms ease-in-out, opacity 160ms ease-in-out;

	-moz-transition: transform 160ms ease-in-out, opacity 160ms ease-in-out;

	-o-transition: transform 160ms ease-in-out, opacity 160ms ease-in-out;

	transition: transform 160ms ease-in-out, opacity 160ms ease-in-out;

}

.js-facebook-messenger-top-header {

	width: 220px;

	color: #fff;

	background: #1182fc;

	display: block;

	position: relative;

	width: 220px;

	background: #1182fc;

	color: #fff;

	text-align: center;

	line-height: 1;

	padding: 10px;

	font-size: 14px;

	border-top-left-radius: 10px;

	border-top-right-radius: 10px;

}

.js-facebook-messenger-container iframe,

.js-facebook-messenger-container-button iframe {

	border-bottom-left-radius: 10px;

	border-bottom-right-radius: 10px;

}

.js-facebook-messenger-box,

.js-facebook-messenger-button,

.js-facebook-messenger-tooltip {

	z-index: 999;

}

.js-facebook-messenger-container,

.js-facebook-messenger-container-button {

	z-index: 1000;

}

.js-facebook-messenger-top-header {

	color: #fff;

	background: #1182fc;

}

.js-facebook-messenger-top-header {

	width: 220px;

}

.js-facebook-messenger-tooltip {

	color: #404040;

	background: #fff;

}

.js-facebook-messenger-container.open {

	transform: translateY(0px);

	opacity: 1;

	pointer-events: all;

}

.js-facebook-messenger-tooltip {

	bottom: 97px;

	right: 97px;

}

.js-facebook-messenger-box.open svg#fb-msng-icon {

	opacity: 0;

}

.js-facebook-messenger-box.rotate.open svg#close-icon {

	transform: rotate(0deg);

}

.js-facebook-messenger-box.open svg#close-icon {

	opacity: 1;

}

.btnsearch {

	display: block;

	cursor: pointer;

	text-align: center;

	width: 40px;

	height: 40px;

	line-height: 40px;

	background: #6dbe45;

	color: #fff !important;

	font-size: 22px;

}

.fsearch-but {

	display: none;

	position: absolute;

	z-index: var(--z-index-hover);

	margin-top: 15px;

	top: 100%;

	right: 0;

	width: 330px;

	background-color: #fff;

	padding: 30px;

	border-radius: 12px;

	box-shadow: 0 0 5px #333;

}

.fsearch-but form {

	border-radius: 50px;

	border: 1px solid #e6e6e6;

}

.fsearch-but input[type='search'] {

	border: none;

	box-sizing: border-box;

	font-size: 14px;

	font-family: var(--font-regular);

	height: 50px;

	float: left;

	background-color: transparent;

	padding: 0 5px 0 15px;

	width: calc(100% - 49px);

	width: -moz-calc(100% - 49px);

	width: -webkit-calc(100% - 49px);

}

.fsearch-but button {

	border: none;

	border-radius: 50%;

	margin-right: 4px;

	width: 45px;

	height: 45px;

	background: #ffa426;

	color: #fff;

	font-size: 18px;

}

.fsearch-but.active {

	display: block;

	animation: fadeInUp 1s;

}

.fsearch-but input {

	outline: none;

}

.fsearch-but form:focus-within {

	border-color: #ffa426;

}
.icon-search{
	display: none;
	font-size: 18px;
	position: relative;
}
.search{
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 250px;
}
.search input{
	border:1px solid #ddd;
	border-radius: 5px;
	height: 40px;
	width: 100%; 
}

.search p{
    position: absolute;
    right: 10px;
    top: 7px;
    cursor: pointer;
    font-size: 18px;
    margin: 0px;
}
.fsearch-show {

	width: 270px;

	height: 43px;

	background-color: #fff;

	border-radius: 50px;

	overflow: hidden;

}

.fsearch-show input[type='search'],

.fsearch-show button {

	border: none;

	height: 100%;

	background: none;

}

.fsearch-show input[type='search'] {

	padding: 0 15px;

	width: calc(100% - 35px);

	width: -moz-calc(100% - 35px);

	width: -webkit-calc(100% - 35px);

}

.fsearch-show button {

	width: 35px;

	padding: 0;

	text-align: left;

	color: #459c27;

}

.chansearch::-webkit-input-placeholder {

	color: #7d7d7d;

}

.chansearch:-moz-placeholder {

	color: #7d7d7d;

}

.chansearch::-moz-placeholder {

	color: #7d7d7d;

}

.chansearch:-ms-input-placehold {

	color: #7d7d7d;

}

.chanmail::-webkit-input-placeholder {

	color: #333;

}

.chanmail:-moz-placeholder {

	color: #333;

}

.chanmail::-moz-placeholder {

	color: #333;

}

.chanmail:-ms-input-placehold {

	color: #333;

}

.menu {

	text-align: center;

	width: 100%;

	background: #17468a;

}

.menu ul {

	list-style: none;

	margin: 0;

	padding: 0;

}

.menu ul ul {

	background-color: #fff;

	outline: 1px solid #00000014;

	display: none;

	position: absolute;

	width: 100%;

	min-width: 220px;

	height: auto;

	left: 0;

	top: 100%;

	z-index: var(--z-index-hover);

	text-align: left;

	box-shadow: 3px 3px 3px #0000004d;

	-moz-box-shadow: 3px 3px 3px #0000004d;

	-o-box-shadow: 3px 3px 3px #0000004d;

	-webkit-box-shadow: 3px 3px 3px #0000004d;

	-ms-box-shadow: 3px 3px 3px #0000004d;

}

.menu ul ul ul {

	left: 100%;

	top: 0;

}

.menu ul > li {

	display: inline-block;

	position: relative;

}

.menu > ul > li {

	vertical-align: middle;

}

.menu li.active > a,

.menu li:hover > a:not(.btnsearch) {

	color: #ff0;

}

.menu li a {

	display: block;

	color: #fff;

	text-transform: uppercase;

	font-family: var(--font-bold);

	font-size: 15px;

	line-height: 45px;

}

.menu > ul > li > a:not(.btnsearch) {

	position: relative;

	padding: 12px 0;

	text-transform: uppercase;

}

.menu ul ul a {
    padding: 0px 10px;
    color: #333;
    line-height: 23px;
    font-size: 14px;
    padding: 5px;

}

.menu ul ul a:hover {

	color: #f00 !important;

}

.menu ul > li:hover > ul {

	display: block;

}

.menu ul ul li {

	display: block;

	position: relative;

}

.menu ul ul li:not(:last-child) {

	border-bottom: 1px solid #00000014;

}

.menu ul ul > li:hover {

	background-color: #00000014;

}

.menu > ul > li > ul {

	opacity: 0;

}

.menu ul li:hover > ul {

	-webkit-animation: scale-in-ver-top 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) both;

	animation: scale-in-ver-top 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) both;

}

.main:after {

	content: '';

	display: block;

	clear: both;

}

.main-left {

	width: 22%;

	float: left;

}

.main-right {

	width: 78%;

	float: right;

}

.main-title {

	margin-bottom: 5px;

	font-family: 'Oswald-Bold';

	font-size: 20px;

	text-transform: uppercase;

	text-align: center;

	color: #fff;

}

.contact {

	margin-top: 15px;

}

.contact .col {

	box-sizing: border-box;

	width: 49%;

	margin-top: 25px;

}

.contact .col.col-1 {

	background-color: #fff;

	box-shadow: 0 0 5px #00000042;

	padding: 20px;

}

.contact .col.col-2 h3 {

	margin: 0 0 25px;

	font-family: var(--font-bold);

	font-size: 35px;

	text-transform: uppercase;

}

.contact .col.col-2 .td {

	box-sizing: border-box;

	float: left;

	margin-bottom: 15px;

}

.contact .col.col-2 .td1 {

	margin-right: 15px;

	width: calc(((100% + 15px) / 2 - 15px));

	width: -moz-calc(((100% + 15px) / 2 - 15px));

	width: -o-calc(((100% + 15px) / 2 - 15px));

	width: -webkit-calc(((100% + 15px) / 2 - 15px));

	width: -ms-calc(((100% + 15px) / 2 - 15px));

}

.contact .col.col-2 .td1:nth-child(2n) {

	margin-right: 0;

}

.contact .col.col-2 .td2 {

	width: 100%;

}

.contact .col.col-2 label {

	display: block;

	font-family: var(--font-bold);

	margin-bottom: 12px;

}

.contact .col.col-2 textarea,

.contact .col.col-2 .txtcontact,

.contact .col.col-2 select {

	box-sizing: border-box;

	width: 100%;

	border: 1px solid #e4e4e4;

	padding: 0 15px;

	font-family: var(--font-regular);

	border-radius: 5px;

}

.contact .col.col-2 .txtcontact,

.contact .col.col-2 select {

	height: 50px;

}

.contact .col.col-2 textarea {

	padding: 15px;

	height: 150px;

}

.contact .col.col-2 button,

.contact .col.col-2 input[type='submit'] {

	float: left;

	border: 3px solid #ededed;

	padding: 15px 25px;

	margin-right: 15px;

	background-color: #ecc800;

	font-family: var(--font-bold);

	font-size: 18px;

	text-transform: uppercase;

	border-radius: 50px;

	cursor: pointer;

}

.contact .col.col-2 button:hover,

.contact .col.col-2 input[type='submit']:hover {

	background-color: #000;

	color: #ecc800;

}

.pro-detail-left {

	width: 40%;

	float: left;

	text-align: center;

}

.pro-detail-right {

	list-style: none;

	margin: 0;

	padding: 0;

	box-sizing: border-box;

	padding-left: 30px;

	width: 60%;

	float: left;

}

.gallery-thumb-pro {

	margin: 15px 20px 0 15px;

}

.owl-thumb-pro a {

	display: block;

	border: 1px solid #ccc;

	border-radius: 5px;

	padding: 5px;

}

.owl-thumb-pro img {

	display: block;

	margin: auto;

	border-radius: 5px;

}

.owl-thumb-pro .owl-prev,

.owl-thumb-pro .owl-next {

	position: absolute;

	border: none;

	background-color: transparent !important;

	color: #333 !important;

	top: 0;

	bottom: 0;

	font-size: 25px !important;

}

.owl-thumb-pro .owl-next {

	left: 100%;

}

.owl-thumb-pro .owl-prev {

	right: 100%;

}

.pro-detail-right li {

	margin-bottom: 15px;

}

.pro-detail-right li:last-child {

	margin-bottom: 0;

}

.pro-detail-right label {

	font-family: var(--font-bold);

	margin-right: 5px;

}

.pro-detail-right a.check-cart {

	position: relative;

	cursor: pointer;

	text-align: center;

	display: inline-block;

	min-width: 100px;

	padding: 8px;

	margin: 2px 4px 2px 0;

	text-transform: uppercase;

	background-color: #f5f5f5;

	border: 1px solid transparent;

}

.pro-detail-right a.check-cart.fix-bx {

	min-width: 40px;

	height: 40px;

}

.pro-detail-right a.check-cart i {

	display: none;

	position: absolute;

	font-size: 11px;

	padding: 7px 2px 0 7px;

	right: -1px;

	bottom: 0;

	clip-path: polygon(100% 0, 100% 0, 100% 100%, 0% 100%);

	background-color: #fab0b8;

	color: #fff;

}

.pro-detail-right a.check-cart.active {

	border-color: #fab0b8;

}

.pro-detail-right a.check-cart.active i {

	display: block;

}

.desc-pro-detail-bg {

	padding: 10px;

	background: #c8f191;

	border-radius: 3px;

}

.pro-detail-label {

	font-family: var(--font-bold);

}

.title-pro-detail {

	font-family: var(--font-bold);

	font-size: 27px;

	display: block;

}

.price-new-pro-detail {

	font-family: 'Font-Bold';

	font-size: 25px;

	color: var(--color-red);

}

.price-old-pro-detail {

	margin-left: 15px;

	font-size: 18px;

	color: var(--color-gray);

	text-decoration: line-through;

}

.cart-pro-detail {

	margin-bottom: 1rem;

	display: flex;

	align-items: stretch;

	justify-content: flex-start;

}

.cart-pro-detail a {

	width: auto;

	text-align: center;

	color: #fff !important;

	cursor: pointer;

	padding: 8px 15px;

	text-transform: uppercase;

	border-radius: 3px;

}

.cart-pro-detail a.addnow {

	margin-right: 10px;

	background: #fd6e1d;

	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fd6e1d), to(#f59000));

	background: -webkit-linear-gradient(top, #f59000, #fd6e1d);

	background: -moz-linear-gradient(top, #f59000, #fd6e1d);

	background: -ms-linear-gradient(top, #f59000, #fd6e1d);

	background: -o-linear-gradient(top, #f59000, #fd6e1d);

}

.cart-pro-detail a.buynow {

	background-color: var(--color-green);

}

.cart-pro-detail a.buynow:hover {

	background-color: var(--color-dark-green);

}

.cart-pro-detail a i {

	vertical-align: top;

	margin-top: 3px;

	margin-right: 8px;

}

.tabs-pro-detail {

	margin: 35px 0;

}

.tabs-pro-detail .ul-tabs-pro-detail {

	padding: 0;

	list-style: none;

	margin-bottom: 15px;

	border-bottom: 1px solid #e7e7e7;

}

.tabs-pro-detail .ul-tabs-pro-detail li {

	cursor: pointer;

	float: left;

	margin-right: 5px;

	margin-bottom: 5px;

	background: #eee;

	padding: 5px 10px;

}

.tabs-pro-detail .ul-tabs-pro-detail li.active {

	background: #333;

	color: #fafafa;

}

.tabs-pro-detail .ul-tabs-pro-detail li:last-child {

	margin-right: 0;

}

.tabs-pro-detail .content-tabs-pro-detail {

	display: none;

}

.tabs-pro-detail .content-tabs-pro-detail.active {

	display: block;

}

.quantity-pro {

	display: inline-block;

}

.quantity-pro-detail {

	width: 100%;

	max-width: 110px;

	line-height: normal;

	display: flex;

	align-items: center;

	justify-content: space-between;

	text-align: center;

}

.quantity-pro-detail span {

	line-height: 25px;

	padding: 0;

	width: 30px;

	height: 30px;

	color: #5f5f5f;

	cursor: pointer;

	font-size: 22px;

	border: 1px solid #ccc;

}

.quantity-pro-detail span.quantity-plus-pro-detail {

	border-left: 0;

}

.quantity-pro-detail span.quantity-minus-pro-detail {

	border-right: 0;

}

.quantity-pro-detail input {

	height: 30px;

	border: 1px solid #ccc;

	width: calc(100% - 60px);

	text-align: center;

	font-size: 14px;

	padding: 5px;

}

.quantity-pro-detail input::-webkit-outer-spin-button,

.quantity-pro-detail input::-webkit-inner-spin-button {

	-webkit-appearance: none;

	margin: 0;

}

.quantity-pro-detail input[type='number'] {

	-moz-appearance: textfield;

}

.title-in {

	font-family: var(--font-bold);

	font-size: 27px;

}

.time-in {

	margin-top: 5px;

	color: #999;

}

.time-in i {

	vertical-align: top;

	margin: 3px 7px 0 0;

}

.time-in span {

	vertical-align: top;

	display: inline-block;

}

.content-in {

	margin: 15px 0;

}

.post-more {

	list-style: none;

	padding: 0;

	margin: 0;

}

.post-more i {

	font-size: 5px;

	margin-right: 5px;

	vertical-align: middle;

}

.post-more li {

	margin-bottom: 5px;

}

.flienquan {

	margin-top: 30px;

}

.title-lienquan {

	text-transform: uppercase;

	font-size: 17px;

	font-family: var(--font-bold);

	color: #3e3e3e;

	border-bottom: 1px solid #ddd;

	padding-bottom: 10px;

	margin-bottom: 10px;

}

.pagination-ajax,

.pagination1 {

	list-style: none;

	margin: 0;

	padding: 0;

	text-align: center;

	color: #444;

}

.pagination-ajax li,

.pagination1 li {

	display: inline-block;

}

.pagination-ajax a,

.pagination1 a {

	cursor: pointer;

	display: inline-block;

	margin: 2px 4px 2px 0;

	padding: 10px 14px;

	background-color: #f2f2f2;

	line-height: 1;

}

.pagination-ajax .current,

.pagination-ajax a:hover,

.pagination1 a:hover,

.pagination1 .active a {

	background-color: #4a4a4a;

	color: #fff;

	text-decoration: underline !important;

}

.pagination-ajax {

	margin-top: 15px;

}

#popup .fancybox-close-small {

	border-radius: 50%;

	right: -17px;

	top: -17px;

}

#popup {

	padding: 0 !important;

	display: none;

}

#popup img {

	display: block;

}

#btnpopup {

	position: fixed;

	z-index: var(--z-index);

	bottom: 25%;

	left: 0;

	cursor: pointer;

	color: #fff;

	text-align: center;

}

#btnpopup i {

	position: relative;

	z-index: 1;

	width: 50px;

	height: 50px;

	background-color: #eaa500;

	font-size: 33px;

	line-height: 50px;

	border-bottom-right-radius: 5px;

	border-top-right-radius: 5px;

}

#btnpopup span {

	position: absolute;

	display: none;

	border-bottom-right-radius: 5px;

	border-top-right-radius: 5px;

	padding: 0 20px 0 0;

	top: 0;

	bottom: 0;

	left: 100%;

	white-space: nowrap;

	background-color: #eaa500;

	font-family: 'UTMAlexander';

	font-size: 18px;

	line-height: 50px;

}

#btnpopup:hover span {

	display: block;

	-webkit-animation: slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;

	animation: slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;

}

#btnpopup:hover i {

	border-bottom-right-radius: 0;

	border-top-right-radius: 0;

}

.plogo {

	display: block;

	margin: 5px auto;

}

#fpopup {

	max-width: 400px;

	width: 100%;

	box-sizing: border-box;

	padding: 0 0 30px;

	border-radius: 5px;

}

#fpopup .title {

	background-color: #caa966;

	color: #fff;

	text-transform: uppercase;

	text-align: center;

	text-transform: uppercase;

	font-family: 'Roboto-Bold';

	font-size: 25px;

	padding: 6px 20px;

}

#fpopup {

	padding: 20px;

}

#fpopup select,

#fpopup .txtnhanmail {

	border: none;

	display: block;

	width: 100%;

	height: 40px;

	background-color: #e7e7e7;

	margin-bottom: 10px;

	padding: 0 15px;

	font-size: 16px;

}

#fpopup input[type='submit'] {

	font-size: 16px;

	margin-top: 25px;

	display: block;

	width: 100%;

	height: 48px;

	text-transform: uppercase;

	color: #fff;

	background: linear-gradient(200deg, rgba(227, 196, 127, 1) 0%, rgba(147, 109, 48, 1) 100%);

	border: none;

	cursor: pointer;

}

.hdanhmucdrops {

	position: relative;

	width: 270px;

	z-index: var(--z-index-menu);

}

.hdanhmucdrops.ver1 > .nicescl {

	display: none;

	top: 100%;

}

.hdanhmucdrops .title {

	padding: 0 18px;

	height: 100%;

	cursor: pointer;

	font-family: 'Roboto-Bold';

	font-size: 15px;

	text-transform: uppercase;

	text-align: center;

	color: #030303;

}

.hdanhmucdrops .title i {

	font-size: 25px;

	margin-right: 15px;

	color: red;

}

.hdanhmucdrops ul {

	padding: 0;

	margin: 0;

	list-style: none;

	text-align: left;

	background-color: #fff;

}

.hdanhmucdrops .nicescl {

	position: absolute;

	box-sizing: border-box;

	width: 100%;

	left: 0;

	top: 100%;

}

.hdanhmucdrops ul.content {

	overflow: hidden;

	height: 424px;

	border: 1px solid #e6e6e6;

}

.hdanhmucdrops ul img {

	margin-right: 10px;

}

.hdanhmucdrops li a {

	position: relative;

	display: block;

	padding: 7px 15px;

}

.hdanhmucdrops ul ul {

	-webkit-transform: scaleX(0);

	transform: scaleX(0);

	width: 100%;

	display: none;

	position: absolute;

	z-index: var(--z-index-hover);

	left: calc(100% - 7px);

	left: -moz-calc(100% - 7px);

	left: -webkit-calc(100% - 7px);

}

.hdanhmucdrops ul ul li {

	position: relative;

}

.hdanhmucdrops ul > li:hover > ul {

	display: block;

	-webkit-animation: scale-up-hor-left 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;

	animation: scale-up-hor-left 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;

}

.hdanhmucdrops ul > li:last-child {

	border-bottom: none;

}

.hdanhmucdrops ul ul ul {

	left: 100%;

	top: 0 !important;

}

.hdanhmucdrops li:hover > a {

	background-color: #00000008;

}

@-webkit-keyframes scale-up-hor-left {

	0% {

		-webkit-transform: scaleX(0);

		transform: scaleX(0);

		-webkit-transform-origin: 0 0;

		transform-origin: 0 0;

	}

	100% {

		-webkit-transform: scaleX(1);

		transform: scaleX(1);

		-webkit-transform-origin: 0 0;

		transform-origin: 0 0;

	}

}

@keyframes scale-up-hor-left {

	0% {

		-webkit-transform: scaleX(0);

		transform: scaleX(0);

		-webkit-transform-origin: 0 0;

		transform-origin: 0 0;

	}

	100% {

		-webkit-transform: scaleX(1);

		transform: scaleX(1);

		-webkit-transform-origin: 0 0;

		transform-origin: 0 0;

	}

}

ul.danhmucleft,

ul.danhmucleft ul {

	box-sizing: border-box;

	list-style: none;

	margin: 0;

	padding: 0;

}

ul.danhmucleft {

	font-size: 16px;

}

ul.danhmucleft li {

	position: relative;

}

ul.danhmucleft li a {

	display: block;

}

ul.danhmucleft > li > a {

	padding: 7px 0;

}

ul.danhmucleft ul > li > a {

	padding: 7px 0;

}

ul.danhmucleft li.no-border > a,

ul.danhmucleft > li:last-child li:last-child > a {

	border-bottom: none !important;

}

ul.danhmucleft ul {

	display: none;

	border-left: 1px solid #e7e7e7;

	padding-left: 20px;

}

.drop-danhmucleft {

	position: absolute;

	right: 0;

	top: 0;

	height: 38px;

	line-height: 38px;

	cursor: pointer;

}

.drop-danhmucleft:hover {

	color: #db3c96;

}

.bgtinvi .col {

	box-sizing: border-box;

}

.bgtinvi .col-1 {

	width: 64%;

	float: left;

}

.bgtinvi .col-2 {

	width: 33%;

	float: right;

}

.ftintuc {

	width: 47%;

	float: left;

}

.ftintuc .thumb {

	display: block;

	position: relative;

	overflow: hidden;

}

.ftintuc .tieude {

	-webkit-line-clamp: 2;

	font-family: 'Roboto-Bold';

	font-size: 15px;

	margin-top: 15px;

	text-transform: uppercase;

}

.ftintuc .desc {

	-webkit-line-clamp: 2;

	line-height: 2;

	margin: 5px 0 25px;

}

.ftintuc .lk {

	display: inline-block;

	font-family: 'Roboto-Bold';

	text-transform: uppercase;

	font-size: 13px;

	padding: 15px;

	border: 2px solid #333;

}

ul.tintuc {

	padding: 0;

	margin: 0;

	list-style: none;

}

ul.tintuc li.bt {

	float: left;

	margin: 15px 30px 15px 0;

	width: calc((100% + 30px) / 2 - 30px);

	width: -moz-calc((100% + 30px) / 2 - 30px);

	width: -webkit-calc((100% + 30px) / 2 - 30px);

}

ul.tintuc li.bt:nth-child(2n) {

	margin-right: 0;

}

ul.tintuc li.bt:nth-child(2n + 1) {

	clear: both;

}

ul.tintuc .thumb {

	float: left;

	width: 39%;

	overflow: hidden;

}

ul.tintuc .thumb img {

	display: block;

	width: 100%;

}

ul.tintuc .content {

	float: right;

	width: 61%;

	padding-left: 20px;

}

ul.tintuc .tieude {

	-webkit-line-clamp: 1;

	font-family: var(--font-bold);

	text-align: left;

	text-transform: uppercase;

}

ul.tintuc .desc {

	-webkit-line-clamp: 2;

	margin-top: 5px;

	line-height: 2;

	font-size: 13px;

	color: #666;

}

ul.tintuc span {

	font-size: 13px;

	color: #666;

	display: inline-block;

	margin-top: 10px;

}

ul.tintuc span:last-child {

	margin-left: 30px;

}

.video-main {

	height: 267px;

}

.video-main iframe {

	display: block;

	width: 100%;

	height: 100%;

}

.subvideo {

	margin-top: 10px;

}

.subvideo img {

	display: block;

}

.asubvideo {

	cursor: pointer;

	position: relative;

}

.asubvideo:after {

	content: '';

	position: absolute;

	z-index: 1;

	top: 0;

	bottom: 0;

	left: 0;

	right: 0;

	background: url(../images/icon-youtube.png) no-repeat center;

}

.listVideo {

	width: 100%;

	margin-top: 20px;

	height: 48px;

	border: none;

	padding: 0 25px;

	background-color: #fe92ab;

	color: #fff;

}

.box-pro:after {

	display: block;

	clear: both;

	content: '';

}

.box-pro .box {

	position: relative;

	box-sizing: border-box;

	text-align: center;

	background-color: #fff;

	padding: 7px 7px 20px;

}

.box-pro .box.bt {

	float: left;

	margin: 10px 20px 10px 0;

	width: calc((100% + 20px) / 5 - 20px);

	width: -moz-calc((100% + 20px) / 5 - 20px);

	width: -webkit-calc((100% + 20px) / 5 - 20px);

}

.box-pro .box.bt:nth-child(5n) {

	margin-right: 0;

}

.box-pro .box.bt:nth-child(5n + 1) {

	clear: both;

}

.box-pro .thumb {

	position: relative;

	overflow: hidden;

	display: block;

}

.box-pro .tieude {

	margin-top: 20px;

	font-family: 'Muli-Bold';

	text-transform: capitalize;

	-webkit-line-clamp: 2;

	color: #272727;

}

.box-pro .giaban,

.box-pro .giacu {

	display: inline-block;

	margin-top: 5px;

}

.box-pro .giacu {

	margin-left: 15px;

	color: #848484;

	text-decoration: line-through;

}

.box-pro .giaban {

	color: #323232;

}

.box-pro .giaban span {

	color: #d70000;

	font-family: 'Muli-Bold';

}

.box-pro .km {

	position: absolute;

	right: 0;

	top: 0;

	width: 40px;

	height: 39px;

	line-height: 39px;

	font-size: 12px;

	background: url(../images/km.png);

	color: #fff;

}

.box-photobox:after {

	display: block;

	clear: both;

	content: '';

}

.box-photobox a {

	float: left;

	overflow: hidden;

	position: relative;

	background-color: #000;

}

.box-photobox a.bt {

	margin: 5px 10px 5px 0;

	border-radius: 5px;

	width: calc((100% + 10px) / 4 - 10px);

	width: -moz-calc((100% + 10px) / 4 - 10px);

	width: -webkit-calc((100% + 10px) / 4 - 10px);

}

.box-photobox a.bt:nth-child(4n) {

	margin-right: 0;

}

.box-photobox a.bt:nth-child(4n + 1) {

	clear: both;

}

.box-photobox a:hover img {

	opacity: 0.6;

}

.box-photobox .icon {

	position: absolute;

	display: none;

	font-size: 40px;

	top: 50%;

	left: 50%;

	color: #fff;

}

.box-photobox a:after {

	content: '';

	display: none;

	position: absolute;

	top: 15px;

	bottom: 15px;

	left: 15px;

	right: 15px;

	border: 1px dashed #fff;

	border-radius: 5px;

}

.box-photobox a:hover .icon,

.box-photobox a:hover:after {

	display: block;

}

.box-news:after {

	display: block;

	clear: both;

	content: '';

}

.box-news .box {

	position: relative;

	text-align: center;

}

.box-news .box.bt {

	float: left;

	margin: 15px 30px 15px 0;

	width: calc((100% + 30px) / 3 - 30px);

	width: -moz-calc((100% + 30px) / 3 - 30px);

	width: -webkit-calc((100% + 30px) / 3 - 30px);

}

.box-news .box.bt:nth-child(3n) {

	margin-right: 0;

}

.box-news .box.bt:nth-child(3n + 1) {

	clear: both;

}

.box-news .thumb {

	position: relative;

	overflow: hidden;

	display: block;

}

.box-news .tieude {

	font-family: 'SVN-ProductSans';

	font-size: 20px;

	text-transform: capitalize;

	-webkit-line-clamp: 2;

	color: #333;

	margin-top: 12px;

}

.box-news .desc {

	margin-top: 5px;

	line-height: 2;

	-webkit-line-clamp: 3;

	font-size: 13px;

}

.box-camnhan:after {

	display: block;

	clear: both;

	content: '';

}

.box-camnhan .box {

	position: relative;

	text-align: center;

}

.box-camnhan .box.bt {

	margin: 15px 30px 15px 0;

	width: calc((100% + 30px) / 3 - 30px);

	width: -moz-calc((100% + 30px) / 3 - 30px);

	width: -webkit-calc((100% + 30px) / 3 - 30px);

}

.box-camnhan .box.bt:nth-child(3n) {

	margin-right: 0;

}

.box-camnhan .box.bt:nth-child(3n + 1) {

	clear: both;

}

.box-camnhan .thumb {

	position: relative;

	display: inline-block;

	border: 10px solid #ffa426;

	border-radius: 50%;

}

.box-camnhan .thumb:before {

	content: '';

	position: absolute;

	top: -8px;

	bottom: -1px;

	left: -7px;

	right: -2px;

	background-color: #fff;

	border-radius: 50%;

}

.box-camnhan .hid {

	position: relative;

	z-index: 3;

	border-radius: 50%;

	overflow: hidden;

}

.box-camnhan .tieude {

	font-family: 'SVN-ProductSans';

	font-size: 20px;

	text-transform: capitalize;

	-webkit-line-clamp: 2;

	color: #1a1a1a;

	margin-top: 12px;

}

.box-camnhan .desc {

	margin-top: 15px;

	line-height: 2;

	-webkit-line-clamp: 3;

}

.box-video:after {

	display: block;

	clear: both;

	content: '';

}

.box-video .box {

	position: relative;

	box-sizing: border-box;

	text-align: center;

	color: #393939;

}

.box-video .box.bt {

	float: left;

	margin: 15px 30px 15px 0;

	width: calc((100% + 30px) / 3 - 30px);

	width: -moz-calc((100% + 30px) / 3 - 30px);

	width: -webkit-calc((100% + 30px) / 3 - 30px);

}

.box-video .box.bt:nth-child(3n) {

	margin-right: 0;

}

.box-video .box.bt:nth-child(3n + 1) {

	clear: both;

}

.box-video .thumb {

	position: relative;

	overflow: hidden;

	display: block;

}

.box-video .thumb img {

	display: block;

	width: 100%;

}

.box-video i {

	position: absolute;

	z-index: 1;

	top: 50%;

	left: 50%;

	color: #fff;

	font-size: 70px;

	opacity: 0.6;

}

.box-video .box:hover i {

	opacity: 1;

	color: red;

}

.box-video .box:hover i:before {

	position: relative;

	z-index: 1;

}

.box-video .box:hover i:after {

	content: '';

	position: absolute;

	margin: auto;

	top: 0;

	bottom: 0;

	left: 0;

	right: 0;

	width: 50%;

	height: 50%;

	background-color: #fff;

}

.box-video .tieude {

	margin-top: 10px;

	font-family: 'Roboto-Bold';

	font-size: 16px;

	text-transform: uppercase;

	-webkit-line-clamp: 2;

}

.box-album:after {

	display: block;

	clear: both;

	content: '';

}

.box-album .box {

	position: relative;

	box-sizing: border-box;

	text-align: center;

	background-color: #000;

	overflow: hidden;

}

.box-album .box.bt {

	float: left;

	margin: 15px 30px 15px 0;

	width: calc((100% + 30px) / 3 - 30px);

	width: -moz-calc((100% + 30px) / 3 - 30px);

	width: -webkit-calc((100% + 30px) / 3 - 30px);

}

.box-album .box.bt:nth-child(3n) {

	margin-right: 0;

}

.box-album .box.bt:nth-child(3n + 1) {

	clear: both;

}

.box-album .box img {

	display: block;

	width: 100%;

}

.box-album .tieude {

	display: none;

	position: absolute;

	bottom: 15px;

	left: 10px;

	right: 10px;

	color: #fff;

	font-family: 'Roboto-Bold';

	font-size: 18px;

	text-transform: uppercase;

	-webkit-line-clamp: 2;

}

.box-album .box:hover img {

	opacity: 0.6;

}

.box-album .box:hover .tieude {

	display: block;

	-webkit-animation: tracking-in-expand-fwd 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) both;

	animation: tracking-in-expand-fwd 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) both;

}

@-webkit-keyframes tracking-in-expand-fwd {

	0% {

		letter-spacing: -0.5em;

		-webkit-transform: translateZ(-700px);

		transform: translateZ(-700px);

		opacity: 0;

	}

	40% {

		opacity: 0.6;

	}

	100% {

		-webkit-transform: translateZ(0);

		transform: translateZ(0);

		opacity: 1;

	}

}

@keyframes tracking-in-expand-fwd {

	0% {

		letter-spacing: -0.5em;

		-webkit-transform: translateZ(-700px);

		transform: translateZ(-700px);

		opacity: 0;

	}

	40% {

		opacity: 0.6;

	}

	100% {

		-webkit-transform: translateZ(0);

		transform: translateZ(0);

		opacity: 1;

	}

}

/* Product */

.info-product-list {

	padding: 30px 0px;

}

.box-list a {

	position: relative;

	display: flex;

	justify-content: space-between;

}

.img-list {

	width: calc(100% - 25px);

	position: relative;

}
.img-list .name{

	position: absolute;

	left: 0px;

	bottom: 0px;

	padding: 10px 20px 10px 20px;

	background: #17468a;
	width: 80%;

	clip-path: polygon(0 0, 93% 0, 100% 100%, 0% 100%);
}
.img-list h3 {


	color: #fff;

	text-transform: uppercase;

	margin: 0px;

	font-size: 20px;

	font-family: Bai-Jamjuree-B;

	-webkit-line-clamp: 1;



}

.line-list {

	width: 25px;

	background: #ffcf00;

	display: flex;

	justify-content: space-between;

	align-items: center;

	color: #17468a;

	font-family: var(--font-bold);

	font-size: 20px;

	text-transform: uppercase;

	padding: 5px;

}

.line-list p {

	margin: 0px;

	-moz-transform: translateX(-50%) translateY(-50%) rotate(-90deg);

	-webkit-transform: translateX(-50%) translateY(-50%) rotate(-90deg);

	transform: translateX(-50%) translateY(-50%) rotate(-90deg);

	position: absolute;

	top: 105px;

	left: 12px;

	font-size: 18px;

}

.line-list span {

	-moz-transform: translateX(-50%) translateY(-50%) rotate(-90deg);

	-webkit-transform: translateX(-50%) translateY(-50%) rotate(-90deg);

	transform: translateX(-50%) translateY(-50%) rotate(-90deg);

	position: absolute;

	bottom: 0px;

	left: 12px;

}

/* Project */

.info-project {

	padding: 30px 0px;

	background: url(../images/bg_project.png) no-repeat;

	background-size: 100% 100%;

}

.title-list-project {

	display: flex;

	justify-content: center;

	flex-wrap: wrap;

	align-items: center;

	margin: 10px 0px 20px;

	gap: 10px;

	cursor: pointer;

}

.title-list-project span {

	border: 1px solid #fff;

	padding: 10px;

	color: #fff;

	text-transform: uppercase;

	font-family: var(--font-bold);

}

.title-list-project span.active,

.title-list-project span:hover {

	background: #ffcf00;

	color: #17468a;



	border: 1px solid #ffcf00;

}

.box-project {

	position: relative;

}

.box-project .name-project {

	position: absolute;

	left: 10px;

	right: 10px;

	bottom: 10px;

	padding: 10px;

	background: #000000a4;

	text-align: center;

}

.box-project h3 {

	color: #fff;

	-webkit-line-clamp: 1;

	margin: 0px;

	font-size: 16px;

}


/* product */
.grid-product{
	display: grid;

	grid-template-columns: repeat(4, 1fr);

	gap: 20px;

	text-align: center;
}
.box-product h3{
    margin: 10px 0px;
    font-family: Bai-Jamjuree-B;
}
.box-product h3:hover{
	color: #f00;
}
.giaban span{
	color: #f00;
}
/* Project */

.grid-news {

	display: grid;

	grid-template-columns: repeat(3, 1fr);

	gap: 20px;

}

.info-news {

	padding: 30px 0px;

}

.title-list-news {

	display: flex;

	justify-content: center;

	flex-wrap: wrap;

	align-items: center;

	margin: 10px 0px 20px;

	gap: 10px;

	cursor: pointer;

}

.title-list-news span {

	border: 1px solid #17468a;

	padding: 10px;

	color: #17468a;

	text-transform: uppercase;

	font-family: var(--font-bold);

}

.title-list-news span.active,

.title-list-news span:hover {

	background: #17468a;

	color: #fff;

	border: 1px solid #17468a;

}

/* News */

.flex-news {

	display: flex;

	justify-content: space-between;

}

.news-left {

	width: 49%;

}

.news-right {

	width: 49%;

}

.img-news {

	border: 1px solid #f1f1f1;

}

.box-news h3 {

	font-size: 16px;

	font-family: var(--font-medium);

	margin: 10px 0px;

	-webkit-line-clamp: 2;

}

.box-news p {

	color: #17468a;

}

.news-left h3 {

	font-family: var(--font-medium);

	font-size: 20px;

	margin: 10px 0px;

}

.view-news {

	position: relative;

	color: #f00;

	font-family: var(--font-bold);

	padding-left: 60px;

}

.view-news:after {

	content: '';

	position: absolute;

	left: 0px;

	width: 50px;

	border: 1px solid #f00;

	top: 10px;

}

.box-news:hover h3,

.news-left:hover h3 {

	color: #f00;

}

/* About */

.info-about {

	padding: 30px 0px;

}

.flex-about {

	display: flex;

	justify-content: space-between;

	align-items: center;

	flex-wrap: wrap;

}

.photo-about {

	width: 42%;

	max-width: 505px;

	position: relative;

	z-index: 1;

}



.content-about {

	width: 56%;

}



.photo-about:after {

	content: '';

	position: absolute;

	z-index: -1;

	left: 15px;

	right: 15px;

	top: -15px;

	bottom: -15px;

	background: url(../images/line_about.png) no-repeat;

	background-size: 100% 100%;

}
.flex-all{
	display: flex;
	gap: 20px;
}

.title-about {

	position: relative;

	margin-bottom: 20px;

	padding-bottom: 15px;

}

.title-about:after {

	content: '';

	position: absolute;

	bottom: 0px;

	left: 0px;

	width: 100px;

	height: 3px;

	background: #f00000;

	border-radius: 5px;

}

.title-about:before {

	content: '';

	position: absolute;

	bottom: -3px;

	width: 9px;

	height: 9px;

	background: #f00000;

	border-radius: 50%;

	left: 10px;

}

.title-about h2 {

	color: #17468a;

	font-size: 34px;

	text-transform: uppercase;

	font-family: UTM-HelvetIns;

	margin-bottom: 0px;

}

.title-about p {

	font-size: 20px;

	font-family: Bai-Jamjuree-B;

	margin: 0px;

}

.title-about img{margin-bottom: 20px;}

.grid-about {

	display: grid;

	grid-template-columns: repeat(2, 1fr);

	gap: 20px;

}

.about h3,

.about p {

	-webkit-line-clamp: 2;

}

.about h3 {

	font-size: 18px;

	color: #17468a;

	font-family: Bai-Jamjuree-B;

	margin-top: 10px;

}
.about h3:hover{color: #f00;}
.view-about {

	width: 140px;

	display: block;

	line-height: 48px;

	background: #17468a;

	color: #fff;

	text-align: center;

	font-family: Bai-Jamjuree-M;

	font-size: 16px;

}
.view-about:hover{background: #f00;}
.view-about span {

	color: #ff0;

}

/* Letter */

.info-letter {

	background: #17468a;

	padding: 20px 0px;

}

.inherit-letter {
	width: 1000px;
	max-width: 90%;
	margin: 0px auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.title-letter h2 {

	font-size: 34px;

	text-transform: uppercase;

	color: #fff;

	font-family: UTM-HelvetIns;

}



.title-letter p {

	color: #ffcf00;

	font-size: 18px;

	font-family: Bai-Jamjuree-B;

	text-transform: uppercase;

	margin: 0px;

}

#FormLetter {

	width: 678px;

	display: flex;

	justify-content: space-between;

	align-items: center;

	position: relative;

}

#FormLetter .email-letter {

	width: 100%;

	height: 60px;

	border-radius: 5px;

	padding: 0px 10px;

	background: none;

	border: 1px solid #ffff;

	color: #fff;

}



.email-letter::-webkit-input-placeholder {

	color: #fff;

}

.email-letter:-moz-placeholder {

	color: #fff;

}

.email-letter::-moz-placeholder {

	color: #fff;

}

.email-letter:-ms-input-placehold {

	color: #fff;

}



.submit-letter {

	background: #ffcf00;

	line-height: 45px;

	border: none;

	border-radius: 30px 0px 0px 30px;

	position: absolute;

	right: 5px;

	font-family: var(--font-bold);

	width: 85px;

}

.text-split {

	overflow: hidden;

	text-overflow: ellipsis;

	white-space: normal;

	-webkit-box-orient: vertical;

	display: -webkit-box;

	-webkit-line-clamp: 3;

}



.album_mansory {

	margin-top: 15px;

}

.album_mansory .box {

	padding: 5px;

	width: 25%;

}

.album_mansory .item {

	position: relative;

	display: inline-block;

	background-color: #fff;

}

.album_mansory .item:hover img {

	opacity: 0.8;

}

.album_mansory i {

	display: none;

	position: absolute;

	left: 50%;

	top: 50%;

	font-size: 30px;

	color: #fff;

}

.album_mansory .item:hover i {

	display: block;

}

.related .title-related {

	color: #333;

	text-transform: uppercase;

	font-family: var(--font-bold);

}

.related ul {

	margin: 0;

	padding: 0 0 0 25px;

	background: #f9f9f9;

}

.related li a {

	padding: 6px 0;

	display: block;

}

.related span {

	-webkit-line-clamp: 1;

}

.related li {

	padding-left: 15px;

}



.box-doitac {

	padding: 0 50px;

}

.box-doitac .box img {

	display: block;

	margin: auto;

	border: 1px solid #e5e5e5;

}

.logo {

	position: relative;

}

.logo img {

	display: block;

}

.title-big {

	font-family: var(--font-bold);

	font-size: 22px;

	text-transform: uppercase;

	margin-bottom: 15px;

}

.title-big a {

	font-family: var(--font-regular);

	font-size: 14px;

	text-transform: none;

}

.title-big a:hover {

	color: #e3031b;

}

.sub-l:after {

	content: '';

	display: block;

	margin-top: 15px;

	width: 100px;

	height: 2px;

	background-color: #ffa426;

}

.bgtop {

	margin-top: 60px;

}

.marb10 {

	margin-bottom: 10px;

}

.marb30 {

	margin-bottom: 30px;

}

.banner-seo {

	margin-bottom: 15px;

}

.intro {

	position: relative;

	height: 100vh;

}

.box-slider {

	position: relative;

}

.box-slider img {

	width: 100%;

}

.menu-intro {

	position: absolute;

	z-index: 10;

	left: 0;

	right: 0;

	top: 0;

	bottom: 0;

	text-align: center;

	font-family: var(--font-bold);

	font-size: 18px;

	text-transform: uppercase;

	color: #fff;

}

.menu-intro .col {

	width: calc(100% / 6);

	width: -moz-calc(100% / 6);

	width: -webkit-calc(100% / 6);

	padding-bottom: 5%;

}

.menu-intro .col:not(:last-child) {

	border-right: 1px solid #ffffff6b;

}

.menu-intro .col:hover {

	background-color: #0000005c;

}

.intro-logo {

	position: absolute;

	z-index: 11;

	top: 40px;

	left: 0;

	right: 0;

	margin: auto;

}

.intro-slogan {

	position: absolute;

	z-index: 11;

	top: 45%;

	left: 5%;

	font-family: var(--font-bold);

	font-size: 30px;

	color: #fff;

	text-transform: uppercase;

	text-align: center;

}

.intro-slogan span {

	color: #e3031b;

}

.bgheadertop {

	background-color: #dedede;

	padding: 10px 0;

}
.flex-head{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.company-header {

	font-family: var(--font-bold);

	text-transform: uppercase;

}
.logo{max-width: 175px;background-color: #fff;}
.title-list {

	display: flex;

	justify-content: center;

	align-items: center;

	flex-wrap: wrap;

	gap: 10px;

	margin-bottom: 20px;

}

.title-list a {

	display: inline-block;

	padding: 10px;

	border: 1px solid #ddd;

	font-family: var(--font-bold);

}

.title-list a.active, .title-list a:hover {

	background: #17468a;

	color: #fff;

}

.title-main {

	text-align: center;

	margin-bottom: 20px;

}

.title-main h2 {

	color: #17468a;

	font-size: 34px;

	text-transform: uppercase;

	font-family: UTM-HelvetIns;

	margin-bottom: 0px;

}



.title-main p {

	font-size: 18px;

	margin: 0px;

}

.title-main-project h2 {

	color: #ffcf00;

}

.title-main-project p {

	color: #fff;

}

.bgheader {
	position: relative;
	padding: 10px 0px 5px;

	background-color: #fff;

}

.email {

	background: url(../images/email.png) no-repeat left center;

	padding-left: 54px;

	background-size: 46px;

}

.hotline {

	background: url(../images/hotline.png) no-repeat left center;

	padding-left: 54px;

	background-size: 46px;

}

.email p,

.hotline p {

	margin: 0px;

	font-size: 15px;

}

.email a,

.hotline a {

	color: #17468a;

	font-family: var(--font-bold);

}

.info-dt {

	padding: 30px 0px;

	background: #ededed;

}

.bgfooter {

	color: #fff;

	background: #17468a;

	padding: 30px 0 0;

}

.bgfooter .title {

	font-family: UTM-HelvetIns;

	text-transform: uppercase;

	margin-bottom: 10px;

	font-size: 34px;

	color: #ffcf00;

}

.bgfooter .col {

	box-sizing: border-box;

}

.bgfooter .col-1 {

	width: 35%;

}

.bgfooter .col-2 {

	width: 18%;

}

.bgfooter .col-3 {

	width: 35%;

}

.wr-cn {

	border: 1px solid #ffffff59;

	border-radius: 10px;

	padding: 20px;

	margin-top: 20px;

}

.title-cn {

	font-size: 18px;

	text-transform: uppercase;

	margin-bottom: 10px;

	font-family: Bai-Jamjuree-B;

}

.link-map {

	background: #ffcf00;

	text-transform: uppercase;

	color: #17468a;

	padding: 5px 10px;

	border-radius: 20px;

	font-family: Bai-Jamjuree-B;

}

.bgcopy {

	position: relative;

	padding: 15px 0;

	background-color: #17468a;

	color: #fff;

	font-size: 13px;

	text-align: center;

}

.mxh img,

.title-mxh {

	display: inline-block;

	vertical-align: middle;

}

.mxh img {

	padding: 2px;

}

#footer-map {

	margin-top: 35px;

}

#footer-map iframe {

	display: block;

	width: 100% !important;

	height: 420px !important;

}

ul.thongtincongty {

	margin: 0;

	padding: 0;

	list-style: none;

}

ul.thongtincongty li {

	display: block;

	box-sizing: border-box;

	padding-left: 30px;

	margin-bottom: 17px;

}

ul.thongtincongty li:last-child {

	margin-bottom: 0;

}

ul.thongtincongty li.map {

	background: url(../images/map.png) no-repeat left center;

}

ul.thongtincongty li.phone {

	background: url(../images/phone.png) no-repeat left center;

}

ul.thongtincongty li.email {

	background: url(../images/email.png) no-repeat left center;

}

ul.thongtincongty li.website {

	background: url(../images/website.png) no-repeat left center;

}

.company {

	text-align: center;

}

.footer-map-tabs {

	position: relative;

}

.tabs-map {

	list-style: none;

	padding: 0;

	position: absolute;

	z-index: 5;

	left: 0;

	right: 0;

	top: 10px;

	text-align: right;

}

.tabs-map li {

	display: inline-block;

}

.tabs-map a {

	display: block;

	padding: 10px 30px;

	color: #fff !important;

	background-color: #999;

	cursor: pointer;

}

.tabs-map a.active,

.tabs-map a:hover {

	background-color: red;

}

.a-tabs-map iframe {

	display: block;

	width: 100% !important;

	height: 400px !important;

}

.a-tabs-map {

	display: none;

}

.a-tabs-map.active {

	display: block;

}

.sitemap {

	list-style: none;

	margin: 0;

	padding: 0;

}

.sitemap li {

	margin-bottom: 15px;

}

.sitemap li:last-child {

	margin-bottom: 0;

}

.sitemap li a {

	display: block;

	background: url(../images/list-type.png) no-repeat left center;

	padding-left: 25px;

}



/* NL */

.info-nl {

	padding: 30px 0px;

	background: url(../images/bg_nl.png) no-repeat;

	background-size: cover;

}



.flex-nl {

	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;

	align-items: center;

}

.nl-left {

	width: 40%;

}



.nl-right {

	width: 58%;

}

.flex-nl-t{
    display: flex;
    justify-content: center;
    gap: 15px;
    position: relative;
    top: 25px;
}

.flex-nl-b{
	display: flex;
	justify-content: center;
	gap: 15px;
	position: relative;
    bottom: 25px;
}

.box-nl{
	position: relative;
	width: calc(33.3% - 15px);
	background: #fff;
	clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
	padding: 5px;
	overflow: hidden;
}

.box-nl img{
	width: 100%;
	clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
}
.box-nl .name{
	position: absolute;
    left: 0px;
    right: 0px;
    bottom: -8px;
    padding: 10px 30px 41px 30px;
    text-align: center;
	background: #0000009e;
}
.box-nl h3{
 
    color: #fff;
    text-transform: uppercase;
    font-family: var(--font-bold);
    font-size: 14px;
	-webkit-line-clamp: 2;
}
.box-nl:hover .name{
	background: #17478ad0;
}