/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: Phương Nam ViNa
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

:root{
	--cl-x: #124e94;
	--cl-y: #ed2024;
	--fs-title: clamp(1.25rem, 1.05rem + 1vw, 2.25rem);
}


body{
	font-family: "Inter", sans-serif;
	line-height: normal;
}

p:last-of-type{
	margin-bottom: 0;
}

[class*="fa-"]:not(.fab):before{
	font-family: "Font Awesome 6 Pro";
}

.row:after{
	content: unset;
}

.row-inner-full > .col > .col-inner{
	height: 100%;
}

.row-slider .flickity-slider > .col{
	padding-bottom: 0 !important;
}

.row.row-x-small{
	max-width: calc(1450px - 50px);
}

.row-x-small>.col,
.row-x-small>.flickity-viewport>.flickity-slider>.col{
	margin-bottom: 0;
    padding: 0 4px 8px;
}

.button{
	min-height: unset;
}

.button span{
	line-height: inherit;
}

.btn-custom{
	display: inline-block;
	min-height: unset;
	margin: 0;
	padding: 0.5rem 1rem;
	border: none;
	border-radius: 0.5rem;
	line-height: normal !important;
	font-size: clamp(0.75rem, 0.7rem + 0.25vw, 1rem);
	font-weight: 500;
	transition: all 1s cubic-bezier(.1,.9,.26,.91);
}

.btn-custom:hover{

}

.btn-x{
	background-color: var(--cl-x);
	color: #fff;
	border-color: var(--cl-x);
}

.btn-x:hover{
	color: #fff;
}

.button.is-outline{
	border-width: 1px;
}

.white.is-outline:hover{
	color: #000 !important;
}


.justify-content-between{
	justify-content: space-between;
}

.section.has-grd .section-bg{

}

.section.has-grd .section-bg:before,
.section.has-grd .section-bg:after{
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 100%;
}

.section.has-grd .section-bg:before{
    top: 0;
    background: linear-gradient(180deg, #FFF 0%, rgba(255, 255, 255, 0.00) 60%);
}

.section.has-grd .section-bg:after{
    bottom: 0;
    background: linear-gradient(0deg, #FFF 0%, rgba(255, 255, 255, 0.00) 60%);
}

.section-no-relative .section-content{
	position: unset !important;
}


.svg-clip-path {
    width: 0;
    height: 0;
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
    opacity: 0;
}


/*===*/
.header.on-scroll{
	position: sticky;
	left: 0;
	right: 0;
	top: 0;
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	transition: all .3s cubic-bezier(.17,.65,.13,.99);
}

#logo img{
	transition: all .3s cubic-bezier(.17,.65,.13,.99);
}

#masthead .custom-header-main{
	flex: 1;
}

#masthead .custom-header-main .flex-left ul.header-nav{
	justify-content: flex-end;
}

#masthead .custom-header-main .flex-left ul.header-nav li.menu-item{
	margin: 0 10px;
}

#masthead .custom-header-main .flex-left ul.header-nav li.menu-item a{
	font-size: clamp(0.875rem, 0.85rem + 0.125vw, 1rem);
	color: #000;
	font-weight: 500;
	line-height: normal;
}

#masthead .custom-header-main .flex-left ul.header-nav li.menu-item.active a{
	color: var(--cl-y);
}

/*===*/
#masthead .custom-header-main .flex-right ul.header-nav>li.menu-item{
	margin: 0 2rem;
}

#masthead .custom-header-main .flex-right ul.header-nav li.menu-item a{
	font-size: clamp(1rem, 0.975rem + 0.125vw, 1.125rem);
	color: #000;
	font-weight: 600;
	line-height: normal;
	position: relative;
}

#masthead .custom-header-main .flex-right ul.header-nav > li.menu-item.active > a{
	color: var(--cl-x);
}

ul.header-nav>li.menu-item>a:after{
	content: "";
	position: absolute;
	left: 0;
	bottom: 4px;
	width: 100%;
	height: 2px;
	border-radius: 5rem;
	background-color: var(--cl-x);
	transform: scaleX(0);
	transition: all .3s cubic-bezier(.17,.65,.13,.99);
}

ul.header-nav>li.menu-item.active>a:after{
	background-color: var(--cl-x);
}

ul.header-nav>li.menu-item>a:hover:after{
	transform: scaleX(1);
}

html[lang="en-GB"] .header-logo{
	display: none !important;
}

html[lang="en-GB"] .header-logo-dark{
	display: block !important;
}



.searchform-wrapper input[type=search]{
	box-shadow: none;
	border-top-left-radius: 0.5rem;
	border-bottom-left-radius: 0.5rem;
}

.searchform-wrapper:not(.form-flat) .submit-button{
	background-color: var(--cl-x);
	border-top-right-radius: 0.5rem;
	border-bottom-right-radius: 0.5rem;
	background-image: url('/wp-content/themes/flatsome-child/images/icon-search.svg');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 70%;
}

.searchform-wrapper:not(.form-flat) .submit-button i{
	opacity: 0;
}


.polylang-langswitcher{
	display: flex;
	border-radius: 0.5rem;
	background-color: #fff;
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	overflow: hidden;
	position: relative;
	z-index: 1;
	list-style: none;
}

.polylang-langswitcher li{
    margin-bottom: 0;
}

.polylang-langswitcher li a{
	display: inline-block;
    padding: 0.25rem 0.5rem;
	font-size: 1rem;
	font-weight: 700;
	color: #656565;
}

.polylang-langswitcher li.active a{
	background-color: var(--cl-x);
	color: #fff;
}

.polylang-langswitcher li.active:first-child a{
	padding-right: 1rem;
	clip-path: polygon(0 0, 80% 0%, 100% 100%, 0% 100%);
}

.polylang-langswitcher li.active:last-child a{
	padding-left: 1rem;
	clip-path: polygon(20% 0, 100% 0, 100% 100%, 0% 100%);
}


/*===*/
.main-title h2{
	margin-bottom: 0;
	font-size: var(--fs-title);
	line-height: normal;
}
.box-main-content h2{
	font-size: var(--fs-title);
	line-height: normal;
}

.main-title-underline{
	position: relative;
}

.main-title-underline h2{
	margin-bottom: clamp(1rem, 0.8rem + 1vw, 2rem);
	text-align: center;
	text-transform: uppercase;
	color: var(--cl-x);
	font-weight: 700;
	font-size: var(--fs-title);
}

.main-title-underline:before{
	content: "";
	position: absolute;
	left: 50%;
	bottom: -12px;
	width: 15rem;
	height: 2px;
	background-color: var(--cl-x);
	transform: translateX(-50%);
}

.main-title-underline:after{
	content: "";
	position: absolute;
	left: 50%;
	bottom: -14px;
	width: 5rem;
	height: 6px;
	background-color: var(--cl-y);
	transform: translateX(-50%) skewX(-20deg);
}




/*===Trang chủ*/
.img-cover{
	width: 100%;
	height: 100%;
	object-fit: cover;
}


.section-about .section-bg{
	background-size: contain !important;
	background-position: right center;
}

.wrapper-slide-about{
	display: flex;
	gap: clamp(0.75rem, 0.6rem + 0.75vw, 1.5rem);
}


.wrapper-slide-about .slide-about-main{
	flex: 1;
	border-radius: 0.5rem;
}

.wrapper-slide-about .slide-about-main .about-next,
.wrapper-slide-about .slide-about-main .about-prev{
	color: #fff;
	font-size: clamp(1rem, 0.95rem + 0.25vw, 1.25rem);
}

.wrapper-slide-about .slide-about-main .about-next:after,
.wrapper-slide-about .slide-about-main .about-prev:after{
	font-size: 1.5rem;
}

.wrapper-slide-about .slide-about-cover{
	width: 20%;
	padding-top: 1.5rem;
	padding-bottom: 1.5rem;
	opacity: 0.5;
}

.wrapper-slide-about .slide-about-cover .swiper-slide{
	border-radius: clamp(1rem, 0.8rem + 1vw, 2rem);
	overflow: hidden;
}


.img-icon-about{
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: 10;
	transform: translate(50%, 50%);
	transition: all .3s cubic-bezier(.84,.06,.54,.78);
}

.img-icon-about:after{
	content: "\f178";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(-30deg);
	font-family: "Font Awesome 6 Pro";
	color: var(--cl-x);
	font-size: 2rem;
	font-weight: 300;
	transition: all .5s cubic-bezier(.84,.06,.54,.78);
}

.img-icon-about .img-inner{
	animation: spin 5s linear infinite;
}


@keyframes spin {
  	0% {
    	transform: rotate(0deg);
  	}
  	100% {
    	transform: rotate(360deg);
  	}
}

.col-slide-about:hover .img-icon-about{
	transform: translate(50%, 50%) scale(1.05);
}

.col-slide-about:hover .img-icon-about:after{
	transform: translate(-50%, -50%) rotate(0deg);
}


/*===*/

.col-item-icon-achievement{
    position: relative;
}

.col-item-icon-achievement + .col-item-icon-achievement:before{
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 2rem;
    height: 100%;
    background-color: var(--cl-x);
    clip-path: polygon(69% 0, 0% 100%, 100% 0);
}

.box-icon-achievement{
    display: flex;
    gap: 0.5rem;
    padding: 15%;
    font-weight: 500;
    color: #fff;
}

.box-icon-achievement .icon-box-img{
	--w-icon: 60px;
	width: var(--w-icon) !important;
	height: var(--w-icon);
}

.box-icon-achievement .icon-box-img .icon,
.box-icon-achievement .icon-box-img .icon-inner{
	height: 100%;
}

.box-icon-achievement .icon-box-img img{
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding-top: 0;
}

.box-icon-achievement h3{
    margin-bottom: 0.25rem;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
}


/*===*/
.tabs-category-product{
	list-style: none;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	row-gap: 0.5rem;
	column-gap: 2rem;
}

.tabs-category-product .tab-item{
	position: relative;
	margin: 0;
	padding: 0.5rem 0;
	font-size: clamp(1rem, 0.95rem + 0.25vw, 1.25rem);
	font-weight: 600;
	text-transform: uppercase;
	color: #000;
	cursor: pointer;
	transition: all .3s ease-in-out;
}

.tabs-category-product .tab-item.active,
.tabs-category-product .tab-item:hover{
	color: var(--cl-y);
}

.tabs-category-product .tab-item:before{
	content: "";
	position: absolute;
	left: 50%;
	bottom: 0;
	width: 1rem;
	height: 1rem;
	border: 4px solid #fff;
	border-radius: 50%;
	background-color: var(--cl-y);
	transform: translate(-50%, 50%) scale(0);
	z-index: 1;
	transition: all .3s cubic-bezier(.36,.76,.45,.93);
}

.tabs-category-product .tab-item:after{
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 2px;
	background-color: var(--cl-y);
	transform: scaleX(0);
	transition: all .3s cubic-bezier(.36,.76,.45,.93);
}

.tabs-category-product .tab-item.active:before,
.tabs-category-product .tab-item:hover:before{
	transform: translate(-50%, 50%) scale(1);
}

.tabs-category-product .tab-item.active:after,
.tabs-category-product .tab-item:hover:after{
	transform: scaleX(1);
}


.tabs-content .tab-content{
	display: none;
}

.tabs-content .tab-content.active{
	display: block;
}


/*===*/
.box-category{
	position: relative;
}

.box-category .box-content{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	transition: all .3s ease-in-out;
}

.box-category .box-content .title{
	color: var(--cl-x);
	text-align: center;
}

.box-category .box-content-cover{
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 10%;
	background-color: rgba(0, 0, 0, 0.5);
	color: #fff;
	transition: all .3s ease-in-out;
	opacity: 0;
	font-size: 14px;
}

.box-category .box-content-cover .title{
	color: #fff;
}

.box-category .box-content-cover p{
	font-size: clamp(0.75rem, 0.725rem + 0.125vw, 0.875rem);
}


.box-content-cover .view-more{
	position: absolute;
	bottom: 1.5rem;
	right: 1.5rem;
	font-size: 0.875rem;
	font-size: 0.0625rem;
	font-size: clamp(0.75rem, 0.725rem + 0.125vw, 0.875rem);
	text-decoration: underline;
}


.box-category:hover .box-content{
	transform: translateY(100%);
}

.box-category:hover .box-content-cover{
	opacity: 1;
}



/*====*/
.project-slide{
	--w-slide: 60%;
	border-radius: clamp(0.75rem, 0.6rem + 0.75vw, 1.5rem);
}

.project-slide .swiper-slide{
	width: var(--w-slide);
}


.box-project-absolute{
	position: relative;
	border-radius: clamp(0.75rem, 0.6rem + 0.75vw, 1.5rem);;
	overflow: hidden;
}

.box-project-absolute .inner-thumbnail{
	padding-top: 62.5%;
}

.box-project-absolute .box-title-fixed-left{
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	padding: 1rem 0.5rem;
	background: rgba(255, 255, 255, 0.78);
	transform: rotate(180deg) translateX(0);
	writing-mode: vertical-lr;
    text-orientation: sideways-right;
	font-size: clamp(1rem, 0.95rem + 0.25vw, 1.25rem);
	font-weight: 500;
	color: var(--cl-x);
	text-align: center;
	transition: all .3s ease-in-out;
}

.box-project-absolute .box-content{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 1rem clamp(1rem, 0.8rem + 1vw, 2rem);
	background: rgba(255, 255, 255, 0.78);
	/*backdrop-filter: blur(7px);*/
	transition: all .5s ease-in-out;
	transform-origin: bottom;
	transform: translateY(100%);
	opacity: 0;
}

.box-project-absolute .box-content .title{
	font-size: clamp(1rem, 0.95rem + 0.25vw, 1.25rem);
	color: var(--cl-x);
}


.swiper-slide-active .box-project-absolute .box-title-fixed-left{
	transform: rotate(180deg) translateX(100%);
}

.swiper-slide-prev .box-project-absolute .box-title-fixed-left{
	left: calc(var(--w-slide) + 10% - 1px);
	transition: all 1.3s ease-in-out;
}


.swiper-slide-active .box-project-absolute .box-content{
	transform: translateY(0);
	opacity: 1;
}

.box-project-absolute .item-info .label{
	text-transform: capitalize;
}


.project-slide .project-next,
.project-slide .project-prev{
	width: clamp(2rem, 1.8rem + 1vw, 3rem);
	height: clamp(2rem, 1.8rem + 1vw, 3rem);
	background-color: rgba(0, 0, 0, 0.65);
	border-radius: 50%;
	cursor: pointer;
	top: 50%;
	transform: translateY(-50%);
	margin: 0;
}

.project-slide .project-next{
	right: calc((100% - var(--w-slide)) / 2 + 2%);
}

.project-slide .project-prev{
	left: calc((100% - var(--w-slide)) / 2 + 2%);
}

.project-slide .project-next:after,
.project-slide .project-prev:after{
	font-size: clamp(0.75rem, 0.65rem + 0.5vw, 1.25rem);
	color: #fff;
}



/*===*/
.section-home-blog .box-blog-post .box-image{
	border-radius: 0.5rem;
}

.section-home-blog .box-blog-post .box-text-inner{

}

.section-home-blog .box-blog-post .box-text{
	margin-top: 0.5rem;
	padding: 0;
}

.section-home-blog .box-blog-post .post-title{
	margin: 0;
	font-size: clamp(1rem, 0.975rem + 0.125vw, 1.125rem);
}

.section-home-blog .box-blog-post .post-meta{
	margin-bottom: 0.5rem;
	font-size: 0.875rem;
	font-size: clamp(0.75rem, 0.725rem + 0.125vw, 0.875rem);
}

.section-home-blog .box-blog-post .is-divider{
	display: none;
}

.section-home-blog .box-blog-post .from_the_blog_excerpt{
	color: #000;
}

.section-home-blog .row-blog-right .box-blog-post .box-text-inner{
	display: flex;
	flex-direction: column;
}

.section-home-blog .row-blog-right .box-blog-post .post-title{
	margin: 0;
	font-size: 1rem;
}

.section-home-blog .row-blog-right .box-blog-post .box-text-inner .post-meta{
	order: -1;
	margin-bottom: 0;
}

.section-home-blog .row-blog-left .dot{
	border-radius: 0;
	transform: rotate(45deg);
}



/*===*/
.section-form-home-contact .section-content{
	position: unset !important;
}

.col.wrapper-text-home-contact{
	position: absolute;
	top: 50px;
}


.col.wrapper-form-home-contact{
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
}

.col.wrapper-form-home-contact .col-inner{
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.wpcf7-form{
	margin-bottom: 0;
}

.col.wrapper-form-home-contact .wpcf7-form .form-control{
	padding: 0.75rem 1rem;
	height: unset;
	border: 1px solid #fff;
	border-radius: 0.25rem;
}

.col.wrapper-form-home-contact .wpcf7-form textarea.form-control{
	background-color: transparent;
	color: #fff;
}

.col.wrapper-form-home-contact .wpcf7-form textarea.form-control::placeholder{
	color: #fff;
}



/*===*/
.slide-partner .gallery-box .box-image{
	border-radius: 0.5rem;
	box-shadow: 0px 0px 10.9px 0px rgba(0, 0, 0, 0.15);
	overflow: hidden;
	transition: all .3s ease-in-out;
	padding: 0.5rem;
}

.slide-partner .gallery-box .box-image:hover{
	box-shadow: 0px 0px 14px 0px rgba(0, 0, 0, 0.3);
}

.slide-partner .gallery-col .image-lightbox{
	padding: 0.5rem;
}


/* pagination =================*/
.nav-pagination{
	display: flex;
	justify-content: center;
}

.nav-pagination .page-number{
	display: flex;
	justify-content: center;
	align-items: center;
	border: 1px solid var(--primary-color);
	border-radius: 50%;
	line-height: 1;
	font-size: 0.875rem;
}

/* banner page =================*/
.banner-page{
	height: clamp(7rem, 3.4000000000000004rem + 18vw, 25rem);
}

.banner-page .bg-fill{
	
}

.banner-page .title-banner-page{
	margin-top: 0;
	margin-bottom: 0;
	font-weight: 700;
	font-size: clamp(1rem, 0.7rem + 1.5vw, 2.5rem);
	text-transform: uppercase;
}

/* breadcrumb =================*/
.breadcrumb{
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.breadcrumb span{
	font-size: clamp(0.625rem, 0.575rem + 0.25vw, 0.875rem);
	font-weight: 500;
	white-space: nowrap;
}

.breadcrumb span.current-item{
	color: #fff;
	white-space: wrap;
	display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.breadcrumb span.post{
	margin-bottom: 0;
}

.breadcrumb span a{
	color: #fff;
}

.breadcrumb i{
	color: #fff;
	font-size: 0.75rem;
}


/*===*/
.col-footer h3{
	margin-bottom: 1rem;
	font-size: clamp(1rem, 0.95rem + 0.25vw, 1.25rem);
	white-space: nowrap;
	font-weight: 500;
}

.col-footer ul{
    list-style: none;
    margin-bottom: 0;
    padding-left: 0px;
}

.col-footer ul li{
	margin-left: 0;
}

.col-footer ul li a{
    position: relative;
}

.col-footer ul li a::before{
    content: '';
    position: absolute;
    width: 100%;
    height: 1px;
    background-color: #fff;
    bottom: -4px;
    left: 0;
    transform-origin: right;
    transform: scaleX(0);
    transition: transform .2s ease-in-out;
}

.col-footer ul li a:hover::before{
  transform-origin: left;
  transform: scaleX(1);
}

.col-footer ul li{
    transition: transform .2s ease-in-out;
}

.col-footer ul li:hover{
    transform: translateX(5px);
}

.col-footer ul li + li{
    margin-top: 0.7rem;
}

.col-footer ul li i{
    margin-right: 6px;
}

.grecaptcha-badge{
	opacity: 0;
	pointer-events: none;
}


/*====== Page About*/
.child-pages-list{
	display: flex;
	justify-content: center;
	gap: 0.75rem;
	list-style: none;
	margin-bottom: 0;
}

.child-pages-list li{
	width: 20%;
	margin: 0 !important;
}

.child-pages-list li a{
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 1.25rem;
	background: #FFF;
	box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.15);
	text-align: center;
	color: var(--cl-x);
	font-weight: 600;
	text-transform: uppercase;
	transition: all .3s cubic-bezier(.36,.76,.27,.99);
}

.child-pages-list li.active a,
.child-pages-list li a:hover{
	background-color: var(--cl-x);
	color: #fff;
}

.child-pages-list li a:hover{
	transform: translateY(-0.5rem);
}





/*===*/
.box-icon-achievement.about{
	padding: 10%;
	flex-direction: column;
	align-items: center;
	color: var(--cl-x);
	cursor: pointer;
}

.box-icon-achievement.about .icon-box-img{
	--w-icon: 100px;
	padding: 1.25rem;
	background-color: #E2E2E2;
	border: 0.5rem solid #fff;
	border-radius: 50%;
	box-shadow: 0px 0px 29.3px rgba(0, 0, 0, 0.15);
	transition: all .3s cubic-bezier(.36,.76,.45,.93);
}

.box-icon-achievement.about .icon-box-img img{
	filter: brightness(0) saturate(100%) invert(17%) sepia(83%) saturate(2379%) hue-rotate(201deg) brightness(92%) contrast(86%);
}

.box-icon-achievement.about .icon-box-text{
	text-align: center;
	transition: all .3s cubic-bezier(.36,.76,.45,.93);
}

.box-icon-achievement.about .icon-box-text h3{
	color: var(--cl-x);
}

.box-icon-achievement.about:hover .icon-box-img{
	transform: translateY(-0.5rem);
	box-shadow: 0px 0px 29.3px rgba(0, 0, 0, 0.3);
	border-color: var(--cl-x);
}

.box-icon-achievement.about:hover .icon-box-text{
	transform: translateY(-0.25rem);
}


/*===*/
.section-about-video .section-bg-overlay{
	top: 70%;
}



/*=== Tầm nhìn & sứ mệnh*/
.icon-box .icon-box-img img{
	padding-top: 0;
}

.box-icon-vision-mision{
	height: 50%;
	display: flex;
}

.box-icon-vision-mision .icon-box-img{
	--w-icon: clamp(6rem, 5.6rem + 2vw, 8rem);
	width: var(--w-icon) !important;
	display: flex;
	align-items: center;
	padding: 1.5rem;
	position: relative;
	z-index: 1;
	filter: drop-shadow(3px 0px 4px rgba(0, 0, 0, 0.25));
}

.box-icon-vision-mision .icon-box-img:before{
	content: "";
	position: absolute;
	inset: 0;
	right: -2rem;
	background-color: #fff;
	z-index: -1;
	clip-path: polygon(0 0, 75% 0, 100% 50%, 75% 100%, 0 100%);
}

.box-icon-vision-mision .icon-box-img:after{
	content: "";
	position: absolute;
	inset: 0;
	right: -2rem;
	background-color: var(--cl-x);
	z-index: -1;
	clip-path: polygon(0 0, 75% 0, 92% 50%, 75% 100%, 0 100%);
}

.box-icon-vision-mision .icon-box-text{
	padding-left: clamp(3rem, 2.8rem + 1vw, 4rem) !important;
	align-self: center;
}

/*===*/
.icon-core-value{
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

.icon-core-value .icon-box-text{
	padding-left: 0 !important;
}

.icon-core-value .icon-box-text h3{
	font-size: clamp(1rem, 0.975rem + 0.125vw, 1.125rem);
}


.box-icon-quality-standards{
	
}

/*===*/
.milestones-slide{
	padding: 0.5rem !important;
}

.line-milestones{
	width: 100%;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	border-bottom: 1px dashed var(--cl-x);
}

.box-milestones{
	position: relative;
	height: 100%;
}

.box-milestones .box-thumbnail{
	filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
}

.box-milestones .inner-thumbnail{
	padding: clamp(0.25rem, 0.2rem + 0.25vw, 0.5rem);
	clip-path: url('#clip-path-milestones');
	background-color: #fff;
}

.box-milestones .inner-thumbnail .image-cover{
	padding-top: 75%;
	clip-path: url('#clip-path-milestones');
}

.milestones-slide-bottom .box-milestones .inner-thumbnail,
.milestones-slide-bottom .box-milestones .inner-thumbnail .image-cover{
	clip-path: url('#clip-path-milestones-bottom');
}

.box-milestones .box-content{
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	padding: clamp(0.5rem, 0.4rem + 0.5vw, 1rem);
	text-align: center;
	font-weight: 300;
}

.milestones-slide-top .box-milestones .box-content{
	display: flex;
	flex-direction: column-reverse;
	height: 100%;
}

.box-milestones .box-content .title{
	margin-bottom: 0;
	font-size: clamp(1.25rem, 1.2rem + 0.25vw, 1.5rem);
	font-weight: 700;
	color: var(--cl-x);
}

.box-milestones .dot-milestones{
	position: absolute;
	left: 50%;
	top: 0;
	width: 1rem;
	height: 1rem;
	background-color: var(--cl-x);
	border: 0.25rem solid #fff;
	border-radius: 50%;
	transform: translate(-50%, -100%);
	z-index: 1;
}

.milestones-slide-top .box-milestones .dot-milestones{
	top: 100%;
	transform: translate(-50%, 0);
}




/*=== Page Catalogue*/
.icon-file-catalogue{
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0.75rem;
	background-color: var(--cl-x);
	border-radius: 1.5rem;
	color: #fff;
}

.icon-file-catalogue .icon-box-text{
	flex: unset;
}

.icon-file-catalogue h2{
	color: #fff;
}





/*=== Page NHÀ MÁY & CÔNG NGHỆ*/
.box-counter-factory h3{
	margin-bottom: 1rem;
	font-size: clamp(2.5rem, 2.3rem + 1vw, 3.5rem);
	font-weight: 700;
}

/*===*/
.box-technology{
	height: 100%;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}

.box-technology .box-thumbnail .inner-thumbnail{
	padding-top: 50%;
	border-radius: 0.5rem;
}

.box-technology .box-content{
	flex: 1;
	display: flex;
	flex-direction: column;
}

.box-technology .box-content .title{
	font-weight: 500;
	font-size: clamp(1rem, 0.95rem + 0.25vw, 1.25rem);
}

.box-technology .description{
	margin-bottom: 1rem;
}

.box-technology .view-more{
	margin-top: auto;
	text-align: right;
	color: var(--cl-x);
}


.box-technology.box-equipment .box-thumbnail .inner-thumbnail{
	border: 1px solid #E3E3E3;
}


/*===*/
.factory-gallery-slide{
	--w-slide: 60%;
}

.factory-gallery-slide .swiper-slide{
	width: var(--w-slide);
	filter: brightness(0.5);
	transition: all .3s ease-in-out;
	transform: scale(0.95) !important;
}

.factory-gallery-slide .swiper-slide-active{
	filter: brightness(1);
	transform: scale(1) !important;
}

.factory-gallery-slide .factory-next,
.factory-gallery-slide .factory-prev{
	width: clamp(2rem, 1.8rem + 1vw, 3rem);
	height: clamp(2rem, 1.8rem + 1vw, 3rem);
	background-color: rgba(0, 0, 0, 0.65);
	border-radius: 50%;
	cursor: pointer;
	top: 50%;
	transform: translateY(-50%);
	margin: 0;
}

.factory-gallery-slide .factory-next{
	right: calc((100% - var(--w-slide)) / 2 + 2%);
}

.factory-gallery-slide .factory-prev{
	left: calc((100% - var(--w-slide)) / 2 + 2%);
}

.factory-gallery-slide .factory-next:after,
.factory-gallery-slide .factory-prev:after{
	font-size: clamp(0.75rem, 0.65rem + 0.5vw, 1.25rem);
	color: #fff;
}

.box-img-factory .inner-img{
	padding-top: 50%;
	border-radius: 0.5rem;
}

.box-img-factory.video{
	position: relative;
}

.box-img-factory.video:after{
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 3rem;
	height: 3rem;
	background-color: rgba(0, 0, 0, 0.5);
	background-image: url('/wp-content/themes/flatsome-child/images/play.svg');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 40%;
	border-radius: 50%;
	border: 1px solid #fff;
}






/*==== Archive Project*/
.box-project .box-thumbnail{
	border-radius: 0.5rem;
	overflow: hidden;
}
.box-project .box-thumbnail .inner-thumbnail{
	padding-top: 75%;
	transition: all .5s cubic-bezier(.36,.76,.27,.99);
}

.box-project .box-content{
	padding: 0.75rem;
}

.box-project .box-content .title{
	text-align: center;
	font-weight: 600;
	font-size: clamp(1rem, 0.975rem + 0.125vw, 1.125rem);
	transition: all .5s cubic-bezier(.36,.76,.27,.99);
}

.box-project:hover .box-thumbnail .inner-thumbnail{
	transform: scale(1.1);
}

.box-project:hover .box-content .title{
	color: var(--cl-x);
}



.single-project{
	padding-top: 70px;
	padding-bottom: 70px;	
}

.title-single-project h2{
	color: var(--cl-x);
}


.box-info-detail-project{
	background-color: #F4F4F4;
	padding: 2rem;
}

.box-info-detail-project .item + .item{
	margin-top: 1rem;
	padding-top: 1rem;
	border-top: 1px solid #d5d5d5;
}

.box-info-detail-project .item .label{
	margin-bottom: 0.25rem;
	font-weight: 500;
	font-size: clamp(1rem, 0.975rem + 0.125vw, 1.125rem);
}

.box-info-detail-project .item .value{
	color: #333333;
}



/*==== Page Kênh Phân Phối*/
.child-distribution-channel{
	display: flex;
	column-gap: clamp(1.5rem, 1.2rem + 1.5vw, 3rem);
	margin: 0;
	list-style: none;
}

.child-distribution-channel li{
	margin: 0 !important;
}

.child-distribution-channel li a{
	font-size: clamp(1rem, 0.975rem + 0.125vw, 1.125rem);
	font-weight: 600;
	color: #919191;
}

.child-distribution-channel li.active a{
	color: var(--cl-x);
}

.child-distribution-channel li.active a:before{
	content: url('/wp-content/themes/flatsome-child/images/star.svg');
	margin-right: 0.25rem;
}


.child-distribution-channel li:first-of-type{
	margin-right: auto !important;
}

.child-distribution-channel li:first-of-type a{
	color: var(--cl-x);
	text-decoration: underline;
}






/*==== Archive Recruitment*/
.box-recruitment{
	display: flex;
	padding: 0.5rem;
	border-radius: 0.75rem;
	background: #FFF;
	box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.25);
	transition: all .5s cubic-bezier(.36,.76,.27,.99);
}

.box-recruitment .box-thumbnail{
	width: 40%;
	border-radius: 0.5rem;
	overflow: hidden;
}

.box-recruitment .box-thumbnail .inner-thumbnail{
	padding-top: 75%;
}

.box-recruitment .box-content{
	flex: 1;
	padding: 0.75rem;	
}

.box-recruitment .box-content .title{
	font-size: clamp(1rem, 0.975rem + 0.125vw, 1.125rem);
	transition: all .5s cubic-bezier(.36,.76,.27,.99);
}

.box-recruitment .box-meta{
	display: flex;
	gap: 1.5rem;
	margin-top: 0.5rem;
	color: #7C7C7C;
}

.box-recruitment .box-meta span{
	color: #000;
}

.box-recruitment:hover{
	box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

.box-recruitment:hover .box-content .title{
	color: var(--cl-x);
}


.title-single-recruitment{
	margin-bottom: 0.5rem;
}

.recruitment-meta{
	display: flex;
	flex-wrap: wrap;
	row-gap: 0.5rem;
	column-gap: 2rem;
	margin-bottom: 1rem;
	color: #6C757D;
}

.recruitment-meta i{
	color: var(--cl-x);
	font-size: 1.25rem;
}

.recruitment-tag{
	margin-top: 2rem;
}

.list-tag-recruitment{
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	list-style: none;
	margin-top: clamp(1rem, 0.9rem + 0.5vw, 1.5rem);
}

.list-tag-recruitment li{
	margin-bottom: 0;
}

.list-tag-recruitment li a{
	display: inline-block;
	padding: 0.5rem 1rem;
	background-color: #EEF5FB;
	border-radius: 0.5rem;
	color: var(--cl-x);
}


.recruitment-share{
	display: flex;
	align-items: center;
	gap: 1.5rem;
	margin-top: 2rem;
}

.recruitment-share h3{
	width: unset;
	margin-bottom: 0;
}

.social-icons{
	display: flex;
	gap: 0.75rem;
}


.social-icons a{
	width: 2rem;
	height: 2rem;
	display: inline-flex !important;
	justify-content: center;
	align-items: center;
	margin: 0 !important;
	min-width: unset !important;
	color: #000;
	line-height: normal;
	border: 1px solid #000 !important;
}

.social-icons a i{
	top: 0;
}



.layout-form-recruitment{
	margin-top: 1.5rem;
	padding: 1.5rem;
	background-color: #EEF5FB;
	border-radius: 1rem;
}

.layout-form-recruitment .form-group{
	display: flex;
	background-color: #fff;
	margin-bottom: 0.75rem;
	padding: 0.625rem;
	border-radius: 0.5rem;
}

.layout-form-recruitment .form-group .form-control{
	height: unset;
	margin-bottom: 0;
	padding: 0 0.75rem;
	border: 0;
	box-shadow: none;
	background-color: transparent;
}

.layout-form-recruitment .form-group i{
	margin-top: 0.25rem;
}

.wpcf7-not-valid-tip{
	margin-top: 0.75rem;
	font-size: 0.75rem;
}


.btn-apply-now{
	width: 100%;
	padding: 0.75rem 1rem;
}



/*==== Archive Blog*/
.box-blog{
	position: relative;
	box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
	border-radius: 0.5rem;
	overflow: hidden;
}

.box-blog .box-thumbnail{
	border-radius: 0.5rem;
	overflow: hidden;
}

.box-blog .box-thumbnail .inner-thumbnail{
	padding-top: 75%;
	transition: all .8s cubic-bezier(.36,.76,.27,.99);
	transform: scale(1.1);
}

.box-blog .box-content{
	position: absolute;
	left: 0;
	bottom: 0;
	right: 1rem;
	padding: 0.75rem;
	background: linear-gradient(270deg, rgba(255, 255, 255, 0.75) 0%, #EAEAEA 100%);
	border-radius: 0.5rem;
}

.box-blog .box-content .date{
	font-size: 0.875rem;
}

.box-blog .box-content .title{
	font-size: 1rem;
	font-weight: 600;
	display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: all .8s cubic-bezier(.36,.76,.27,.99);
}

.box-blog .box-content .view-more{
	text-align: right;
	color: var(--cl-x);
	font-weight: 500;
	font-size: 0.875rem;
}

.box-blog:hover .box-thumbnail .inner-thumbnail{
	transform: scale(1);
}

.box-blog:hover .box-content .title{
	color: var(--cl-x);
}


/*===*/
.wrapper-child-category{
	list-style: none;
}

.wrapper-child-category > li{
	margin-bottom: 0.25rem;
	background-color: #f5f5f5;
	position: relative;
}

.wrapper-child-category > li.active{
	background-color: var(--cl-x);
}

.wrapper-child-category > li > a{
	padding: 0.75rem 1rem;
	display: block;
}

.wrapper-child-category > li.active > a{
	background-color: var(--cl-x);
	color: #fff;
}

.wrapper-child-category > li.has-child > a{
	margin-right: 2rem;
}

.wrapper-child-category > li.has-child:after{
	content: "\f107";
	position: absolute;
	right: 1rem;
	top: 1rem;
	font-family: "Font Awesome 6 Pro";
	transition: all .2s ease-in-out;
	cursor: pointer;
}

.wrapper-child-category > li.has-child.active:after{
	color: #fff;
	transform: rotate(-180deg);
}


.sub-child-category{
	margin: 0;
	list-style: none;
	background-color: #fff;
}

.sub-child-category > li{
	margin-bottom: 0;
	padding: 0.25rem 1rem;
}

.sub-child-category > li.active a{
	color: var(--cl-x);
}


/*===*/
.box-knowledge .box-thumbnail{
	border-radius: 0.5rem;
	overflow: hidden;
}
.box-knowledge .inner-thumbnail{
	padding-top: 62.5%;
	transition: all 1s cubic-bezier(.36,.76,.27,.99);
}

.box-knowledge .box-content{
	margin-top: 0.75rem;
	transition: all .5s cubic-bezier(.36,.76,.27,.99);
	background-color: #fff;
}

.box-knowledge .box-content .title{
	font-size: 1rem;
	transition: all .5s cubic-bezier(.36,.76,.27,.99);
}

.box-knowledge .box-content .date{
	margin-bottom: 0.25rem;
	font-size: 0.875rem;
	color: #7C7C7C;
}

.first .box-knowledge .inner-thumbnail{
	padding-top: 50%;
}

.box-knowledge:hover .inner-thumbnail{
	transform: scale(1.1);
}

.box-knowledge:hover .box-content .title{
	color: var(--cl-x);
}



/*====*/
.wrapper-form-page-contact .form-control{
	height: unset;
	margin-bottom: 0;
	padding: 0.75rem 1rem;
	box-shadow: none;
	border: 1px solid #d3d3d3;
	border-radius: 0.25rem;
}

.wrapper-form-page-contact label{
	font-weight: 500;
}


.box-iframe iframe{
	width: 100%;
}





/*==== Archive Product*/
.box-img-category{
	padding-top: 75%;
}

.box-info-category{
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 7%;
	background: rgba(14, 78, 145, 0.72);
	color: #fff;
}

.box-info-category .title{
	color: #fff;
	font-weight: 700;
	font-size: 1.5rem;
	text-transform: uppercase;
}

.child-category-list{
	list-style: none;
	margin-bottom: 0;
}

.child-category-list li{
	margin-bottom: 0;
	padding: 0.75rem 0;
	border-bottom: 1px solid  #fff;
}

.child-category-list li a{
	display: flex;
	color: #fff;
}

.child-category-list li a .label{
	flex: 1;
	transition: all .5s cubic-bezier(.36,.76,.27,.99);
}

.child-category-list li a .icon{
	transform: rotate(45deg);
	transition: all .5s cubic-bezier(.36,.76,.27,.99);
}

.child-category-list li a:hover .label{
	transform: translateX(10px);
}

.child-category-list li a:hover .icon{
	transform: rotate(90deg);
}


.category-page-row .term-description{
	display: none;
}


/*===*/
.product-small .box-image{

}

.product-small .box-text{
	margin-top: 0.5rem;
	padding: 0;
}

.product-small .product-title{
	margin-bottom: 0.5rem;
	font-size: clamp(1rem, 0.975rem + 0.125vw, 1.125rem);
	font-weight: 600;
}

.product-small .price-wrapper{
	display: none;
}

.product-small .box-excerpt{
	font-size: 0.875rem;
	color: #000;
	display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.product-small .button{
	margin-top: 1rem;
}


/*product*/
.product-main{
	padding-top: 1.5rem;
	padding-bottom: 0;
}

.product-images,
.product-thumbnails a{

}

.product-container .flickity-viewport .flickity-slider img{
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.product-summary  .woocommerce-breadcrumb,
.product-info .is-divider{
	display: none;
}

.product-summary .product-title,
.product-quick-view-container .product-info h1{
	margin-bottom: clamp(1rem, 0.95rem + 0.25vw, 1.25rem);
	font-size: clamp(1.25rem, 1.1rem + 0.75vw, 2rem);
	font-weight: 700;
	color: var(--cl-x);
} 


.product-info .price-wrapper{
	margin-bottom: clamp(1rem, 0.95rem + 0.25vw, 1.25rem);
}

.product-info .price{
	font-size: 1.125rem;
	font-weight: 400 !important;
}

.product-page-price bdi{
	color: var(--cl-y);
}

.price-on-sale del .woocommerce-Price-amount.amount bdi{
	color: var(--cl-y)D8A61E;
}

.price-on-sale ins .woocommerce-Price-amount.amount bdi,
.price-on-sale ins .woocommerce-Price-amount.amount bdi{
	color: var(--cl-y)D8A61E;
}


.product-sku{
	margin-bottom: clamp(0.75rem, 0.7rem + 0.25vw, 1rem);
	color: rgba(0, 0, 0, 0.50);
}

.product-short-description{
	margin-top: 1rem;
	margin-bottom: 1rem;
}

.single_product_div{
	margin-top: 1rem;
}

.single_product_div img{
	margin-left: 0;
}

form.variations_form{
	flex-direction: column;
	align-items: flex-start !important;
}

form.cart:not(.variations_form){
	display: flex;
	align-items: unset !important;
	gap: 0.5rem;
}

.woocommerce-variation{
    display: none !important;
}

.product-info .variations_button{
	display: flex;
	gap: 0.5rem;
	padding: 0 0;
}

.ux-swatch--label{
	border-radius: 0.25rem;
}

table.variations{
	margin-bottom: 0.5rem;
}

table.variations .label{
	padding-right: 0.5rem;
	font-size: clamp(0.875rem, 0.85rem + 0.125vw, 1rem);
}

table.variations .label label{
	margin-top: 0;
	margin-bottom: 0;
	font-weight: 700;
}

table.variations select{
	display: inline-block;
	width: auto;
	height: unset;
	margin: 0;
	padding: 0.325rem 1.5rem 0.325rem 0.625rem;
	border: 1px solid rgba(0, 0, 0, 0.30);
	box-shadow: none !important;
	font-size: clamp(0.875rem, 0.85rem + 0.125vw, 1rem);
}

.label-choose-size{
	margin-left: 1rem;
	color: rgba(0, 0, 0, 0.50);
}


/*===*/
.product-info .quantity{
	margin: 0;
}

.quantity-label{
	font-weight: 700;
	font-size: clamp(0.875rem, 0.85rem + 0.125vw, 1rem);
	align-self: center;
}

.ux-quantity{
	margin: 0;
	padding: 0.25rem;
	border: 1px solid rgba(0, 0, 0, 0.30);
	background: #FFF;
}

.ux-quantity input[type="button"]{
	width: 1.5rem;
	height: clamp(1.75rem, 1.725rem + 0.125vw, 1.875rem);
	min-height: unset;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0;
	background-color: transparent;
	border: 0;
	border-radius: 50% !important;
	color: var(--primary-color);
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 0;
	box-shadow: none;
}

.ux-quantity input[type="number"]{
	box-shadow: none !important;
	border: 0;
	font-weight: 700;
	width: 1.5rem;
	height: unset;
}

.single_add_to_cart_button{
	margin-bottom: 0;
	font-size: clamp(0.75rem, 0.7rem + 0.25vw, 1rem);
}

.contact-product-button{
	display: flex;
	align-items: center;
	margin: 0 !important;
	font-size: clamp(0.75rem, 0.7rem + 0.25vw, 1rem);
}


/**/
.product-footer{
	display: none;
	margin-bottom: 1.5rem;
}

.product-page-accordian .accordion .accordion-item .accordion-title{
	font-size: clamp(0.875rem, 0.85rem + 0.125vw, 1rem);
	font-weight: 600;
}

.product-page-accordian .accordion .accordion-item .accordion-title.active{
	background-color: transparent;
	color: #000;
}

.product-page-accordian .accordion .accordion-item .toggle{
	width: 2rem;
	height: 2rem;
	margin: 0;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	opacity: 1;
}

.product-page-accordian .accordion .accordion-item .accordion-title.active>.toggle{
	transform: translateY(-50%) rotate(180deg);
}

.product-page-accordian .accordion .accordion-item .icon-angle-down{
	font-size: 1rem;
	color: #000;
}

.product-page-accordian .accordion .accordion-item .icon-angle-down:before{
	content: "\f055";
	font-family: "Font Awesome 6 Pro";
	font-weight: 700;
	line-height: normal;
}

.product-page-accordian .accordion .accordion-item .accordion-title.active>.toggle .icon-angle-down:before{
	content: "\f056";
}

.product-page-accordian .accordion .accordion-item .accordion-inner{
	padding-right: 0;
}


.list-tab-product-custom{
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	row-gap: 0.5rem;
	column-gap: 1rem;
	list-style: none;
	margin-bottom: 0;
	background-color: var(--cl-x);
}

.list-tab-product-custom li{
	margin: 0 !important;
}

.list-tab-product-custom li a{
	display: inline-block;
	padding: 0.75rem 1rem;
	color: #fff;
	position: relative;
	z-index: 1;
}

.list-tab-product-custom li.active a:before{
	content: "";
	position: absolute;
	inset: -2px 0;
	z-index: -1;
	background-color: var(--cl-y);
	transform: skewX(10deg);
}




.box-iframe-video-product iframe{
	width: 100%;
	height: 500px;
}


/*===*/
.box-certification .content{
	margin-top: 0.5rem;
}

.box-certification .content .title{
	font-weight: 400;
	text-align: center;
}


.certification-slide,
.project-used-slide{
	padding-bottom: 2rem;
}

.certification-slide .swiper-pagination,
.project-used-slide .swiper-pagination{
	bottom: 0;
}

.certification-slide .swiper-pagination-bullet,
.project-used-slide .swiper-pagination-bullet{
	width: 0.75rem;
	height: 0.75rem;
	border: 1px solid var(--cl-x);
	background-color: transparent;
	opacity: 1;
}

.certification-slide .swiper-pagination-bullet-active,
.project-used-slide .swiper-pagination-bullet-active{
	background-color: var(--cl-x);	
}


.project-used-next,
.project-used-prev{
	width: 2rem;
	height: 4rem;
	background: rgba(255, 255, 255, 0.75);
}

.project-used-next{
	right: 0;
}

.project-used-prev{
	left: 0;
}

.project-used-next:after,
.project-used-prev:after{
	font-size: 1.5rem;
	color: #000;
}





.accordion-custom-left .accordion-item + .accordion-item{
	margin-top: 0.5rem;
}
 
.accordion-custom-left .accordion-item .accordion-title{
	padding: 0.75rem 1rem;
	border-top: unset;
	background-color: #F4F4F4;
	color: #000;
}

.accordion-custom-left .accordion-item .accordion-title.active{
	background-color: #F4F4F4;
	font-weight: 400;
}

.accordion-custom-left .accordion-item .accordion-title.active + .accordion-inner{
	background-color: #F4F4F4;
}

.accordion-custom-left .accordion-item .accordion-title button.toggle{
	width: 2rem;
	height: 2rem;
	min-height: unset;
	display: flex;
	justify-content: center;
	align-items: center;
	left: unset;
	right: 0.5rem;
	top: 50%;
	margin: 0;
	transform: translateY(-50%);
	transform-origin: center center;
	transition: all .3s ease-in-out;
	opacity: 1;
	line-height: normal;
	letter-spacing: unset;
	font-size: 1.25rem;
}

.accordion-custom-left .accordion-item .accordion-title.active button.toggle{
	transform: translateY(-50%) rotate(180deg);
}


.accordion-custom-left .accordion-item .accordion-title button.toggle i{
	line-height: normal;
	top: unset;
	font-size: inherit;
}

.accordion-custom-left .accordion-item .accordion-title button.toggle i:before{
	content: '\f055';
	font-family: "Font Awesome 6 Pro";
	font-weight: 700;
	color: var(--cl-x);
}

.accordion-custom-left .accordion-item .accordion-title.active button.toggle i:before{
	content: "\f056";
	color: #999;
}

.accordion-custom-left .accordion-inner{
	padding: 1rem 1rem 0;
}



.accordion-tab-product .accordion-item .accordion-title{
	font-size: clamp(1.25rem, 1.2rem + 0.25vw, 1.5rem);
	color: var(--cl-x);
	font-weight: 700 !important;
	background-color: transparent !important;
	padding: 0.75rem 0;
	border-bottom: 1px solid #e3e3e3;
}

.accordion-tab-product .accordion-inner{
	background-color: transparent !important;
	padding: 1rem 0 0;
}


.box-file-support{
	display: flex;
	gap: 0.5rem;
	padding: 0.5rem 0;
	border-bottom: 1px solid #e3e3e3;
}

.box-file-support .box-title{
	flex: 1;
}

.box-file-support .box-title .title{
	margin-bottom: 0.25rem;
	font-size: clamp(1rem, 0.975rem + 0.125vw, 1.125rem);
	font-weight: 500;
}

.box-file-support .box-title .date{
	font-size: 0.875rem;
}

.box-file-support .button{
	border: 1px solid #000;
	border-radius: 0;
	background-color: transparent;
	color: #000;
}


/*====*/
#post-list .row .post-item{
	padding-bottom: 1.5rem;
}

.infor-single-post ul {
    list-style: none;
    margin-bottom: 0;
    display: flex;
    gap: .75rem;
    color: #7c7c7c;
    font-size: 15px
}

.blog-share{
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin-top: 1.5rem;
	font-weight: 700;
}

.blog-share .social-icons a{
	background-color: #000;
	color: #fff;
	margin: 0;
}

.blog-share .social-icons a i{
	top: unset;
}

.blog-tag{
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin-top: 1rem;
}

.blog-tag a{
	padding: 0.125rem 0.5rem;
	border-radius: 0.25rem;
	background-color: #e3e3e3;
	font-size: 0.875rem;
	line-height: normal;
}

.blog-single .single-page{
	padding-top: 0;
	padding-bottom: 0;
}

.blog-single .single-page .row{
	max-width: unset !important;
}

.blog-single .post.type-post{
	margin-bottom: 0;
}

/*===*/
.widget .widget-title {
	display: block;
	margin-bottom: 0.75rem;
	font-size: clamp(1.125rem, 1.05rem + 0.375vw, 1.5rem);
	color: #000;
}

.widget .is-divider{
	display: none;
}

.recent-blog-posts-li + .recent-blog-posts-li{
	border-top: 1px dashed #ccc;
}

.recent-blog-posts-li .recent-blog-posts{
	padding-top: 0.375rem;
	padding-bottom: 0.375rem;
}

.recent-blog-posts-li .badge{
	width: 5rem;
	height: 4rem;
	border-radius: 0.25rem;
	overflow: hidden;
}

.recent-blog-posts a{
	font-size: 0.875rem;
	font-weight: 600;
}

/*===*/
ul.product_list_widget li + li{
	margin-top: 0.375rem;
	border-top: 1px dashed #ccc;
}

ul.product_list_widget li{
	min-height: unset;
	padding-top: 0.375rem;
	padding-left: 6rem;
	font-size: 0.75rem;
}

ul.product_list_widget li img{
	width: 5rem;
	height: 4rem;
	top: unset;
	margin-bottom: 0;
	border-radius: 0.25rem;
}

.product_list_widget .product-title{
	font-size: 0.875rem;
	font-weight: 600;
}

.product_list_widget ins span.amount,
.product_list_widget > li > span.amount{
	color: #ce2e2e;
}

/*===*/
.phone-bar a{
	background-color: #e60808;
	font-size: 1.25rem;
}


/*button contact*/
.button-contact-fixed{
    position: fixed;
    bottom: 2%;
    right: 1%;
    z-index: 30;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
}

.box-ring {
    width: clamp(4rem, 3.8rem + 1vw, 5rem);
    height: clamp(4rem, 3.8rem + 1vw, 5rem);
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: visibility .5s;
    position: relative;
}

.box-ring-outline {
    position: absolute;
    width: clamp(4rem, 3.8rem + 1vw, 5rem);
    height: clamp(4rem, 3.8rem + 1vw, 5rem);
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    transform-origin: 0 0;
    border: 2px solid rgba(30, 30, 30, 0.5);
    background-color: transparent;
    border-radius: 50%;
    opacity: .5;
    transition: all .5s;
    animation: coccoc-alo-circle-anim 1.2s infinite ease-in-out;
}

.box-ring-inline {
    position: absolute;
    left: 50%;
    top: 50%;
    width: clamp(3rem, 2.8rem + 1vw, 4rem);
    height: clamp(3rem, 2.8rem + 1vw, 4rem);
    transform: translate(-50%, -50%);
    transform-origin: 0 0;
    border: 2px solid transparent;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.5);
    transition: all .5s;
    animation: coccoc-alo-circle-fill-anim 2.3s infinite ease-in-out;
}

.box-ring-image{
    width: clamp(2.5rem, 2.4rem + 0.5vw, 3rem);
    height: clamp(2.5rem, 2.4rem + 0.5vw, 3rem);
    padding: 6px;
    border: 2px solid transparent;
    border-radius: 50%;
    background-color: #000;
    opacity: 1;
    animation: coccoc-alo-circle-img-anim 1s infinite ease-in-out;
}

.box-ring-image img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.box-ring-label{
	position: absolute;
	right: 2rem;
	height: 2.25rem;
	z-index: -1;
	padding: 0.25rem 3rem 0.25rem 1rem;
	border-radius: 50rem;
	white-space: nowrap;
	color: #fff;
	display: flex;
	align-items: center;
}



@keyframes coccoc-alo-circle-anim {
    0% {
        transform: rotate(0) scale(.5) skew(1deg) translate(-50%, -50%);
        opacity: .1
    }
    30% {
        transform: rotate(0) scale(.7) skew(1deg) translate(-50%, -50%);
        opacity: .5
    }
    100% {
        transform: rotate(0) scale(1) skew(1deg) translate(-50%, -50%);
        opacity: .1
    }
}

@keyframes coccoc-alo-circle-fill-anim {
    0% {
        transform: rotate(0) scale(.7) skew(1deg) translate(-50%, -50%);
    }
    50% {
        transform: rotate(0) scale(1) skew(1deg) translate(-50%, -50%);
    }
    100% {
        transform: rotate(0) scale(.7) skew(1deg) translate(-50%, -50%);
    }
}

@keyframes coccoc-alo-circle-img-anim {
    0% {
        transform: rotate(0) scale(1) skew(1deg)
    }
    10% {
        transform: rotate(-25deg) scale(1) skew(1deg)
    }
    20% {
        transform: rotate(25deg) scale(1) skew(1deg)
    }
    30% {
        transform: rotate(-25deg) scale(1) skew(1deg)
    }
    40% {
        transform: rotate(25deg) scale(1) skew(1deg)
    }
    50% {
        transform: rotate(0) scale(1) skew(1deg)
    }
    100% {
        transform: rotate(0) scale(1) skew(1deg)
    }
}