/**
 * @Project NUKEVIET 4.x
 * @Author VINADES.,JSC <contact@vinades.vn>
 * @Copyright (C) 2014 VINADES.,JSC. All rights reserved
 * @License GNU/GPL version 2 or any later version
 * @Createdate 31/05/2010, 00:36
 */

/* Các tùy chỉnh CSS của giao diện nên để vào đây */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
*{
	font-family:'Open Sans';
}
h1{
	font-size: 22px !important;
}
h2{
	font-size: 28px !important;
}
h3{
	font-size: 18px !important;
}
h4{
	font-size: 16px !important;
}
.news-list{
	position: relative;
}
.entry-content-list{
	position:absolute;
	bottom:0px;
	width:100%;
	left:0;
	z-index:999;
	background:rgb(245 245 246 / 91%);
	padding:10px
}

.featured .entry-content-list{
	padding:20px
}

/*Hoàng Lộc*/

:root{
	--blue: #00AEEF;
	--brown: #F69320;
}
a, a:link, a:active, a:visited {
	color: #000;
}

a:hover, a:focus {
	text-decoration: none;
	color: var(--blue);
}

.h-48px{
	height: 48px;
}

.btn-inline-blue{
	font-size: 20px;
	font-weight: 700;
	line-height: 23px;
	letter-spacing: 0em;
	text-align: center;
	color: #fff !important;
	width: max-content;
	padding: 10px 25px;
	background-color: var(--blue);
	border: 1px solid var(--blue);
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.btn-outline-blue{
	font-size: 20px;
	font-weight: 700;
	line-height: 23px;
	letter-spacing: 0em;
	text-align: center;
	color: var(--blue) !important;
	width: max-content;
	padding: 10px 25px;
	border: 1px solid var(--blue);
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.btn-inline-brown{
	font-size: 20px;
	font-weight: 700;
	line-height: 23px;
	letter-spacing: 0em;
	text-align: center;
	color: #fff !important;
	width: max-content;
	padding: 10px 25px;
	background-color: var(--brown);
	border: 1px solid var(--brown);
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.black-48-700{
	font-size: 48px;
	font-weight: 700;
	line-height: 56px;
	letter-spacing: 0em;
	text-align: left;
	color: #2C2C2C;
}

input{
	width: 100%;
	height: 48px;
	border-radius: 5px;
	background-color: transparent;
	color: #808080;
	border: 0;
	font-size: 14px;
	padding: 16px;
}

input::placeholder{
	color: #808080;
}

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

.mt-100px{
	margin-top: 100px;
}

.flex-column-40px{
	display: flex;
	flex-direction: column;
	gap: 40px;
}

.flex-row-40px{
	display: flex;
	gap: 40px;
}

.p-0px-80px{
	padding: 0px 80px;
}

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

.frame-choose-course{
	padding: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	gap: 24px;
	border: 1px solid rgba(0, 0, 0, .1);
	border-radius: 8px;
	transition: 0.25s ease;
	background-color: transparent;
	width: 100%;
}

.tac{
	text-align: center !important;
}

.tar{
	text-align: right !important;
}

.tal{
	text-align: left !important;
}

.black-20-700{
	font-size: 20px;
	font-weight: 700;
	line-height: 23px;
	letter-spacing: 0em;
	text-align: left;
	color: #2C2C2C !important;
}

.icon-250px{
	width: 250px;
	height: 250px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
}

.frame-choose-course:hover{
	box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}

.grid-choose-course{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 40px;
	height: 377px;
	padding: 0px 40px;
}

header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	background-color: #fff;
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
	padding: 10px 5%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	z-index: 1000;
}

.logo {
	font-size: 24px;
	font-weight: 700;
	line-height: 36px;
	letter-spacing: 0em;
	text-align: left;
	color: var(--blue) !important;
	width: 20%;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
}

.logo img{
	width: auto;
	height: 79px;
	background-size: contain;
	background-repeat: no-repeat;
	flex-shrink: 0;
	object-fit: contain;
}

.navbar:before, .navbar:after{
	content: unset;
}

header .navbar ul {
	list-style-type: none;
	display: flex;
	align-items: center;
	gap: 10px;
}

header .navbar ul li {
	position: relative;
	float: left;
	width: 100%;
}

header .navbar ul li a {
	padding: 10px 10px;
	display: block;
	font-size: 18px;
	font-weight: 400;
	line-height: 35px;
	letter-spacing: 0em;
	text-align: left;
	color: #808080;
	white-space: nowrap;
}

header .navbar ul li a:hover {
	color: var(--blue);
}



header .navbar ul li ul li {
	border-top: 1px solid rgba(0, 0, 0, 0.1);
}

header .navbar ul li:hover > ul {
	display: initial;
}


header .navbar ul > li > ul{
	position: absolute;
	float: left;
	display: none;
	background-color: #fff;
	border: 1px solid rgba(0, 0, 0, .1);
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	padding-left: 0px;
}



header .navbar ul > li > ul > li > ul{
	position: absolute;
	float: left;
	display: none;
	left: 100%;
	top: 0px;
	background-color: #fff;
	border: 1px solid rgba(0, 0, 0, .1);
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	padding-left: 0px;
}
















#menu-bar {
	display: none;
}

header label {
	display: none;
}

.navbar {
	display: flex;
}

.p-0{
	padding: 0 !important;
}

.icon-24px{
	width: 24px;
	height: 24px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
}

.blue-18-400{
	font-size: 18px !important;
	font-weight: 400 !important;
	line-height: 35px !important;
	letter-spacing: 0em !important;
	text-align: left !important;
	color: var(--blue) !important;
}

.w-100{
	width: 100% !important;
}

.jcsb{
	justify-content: space-between !important;
}

.h-107px{
	height: 107px;
}

.banner-footer{
	width: 100%;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	position: relative;
	overflow: hidden;
	/*background-color: var(--blue);*/
	background-color: #ff323a;
	border-top-left-radius: 40px;
	border-top-right-radius: 40px;
	padding: 40px 0;
}
.footer_copyright {
	background-color: #000;
	min-height: 50px;
}

.mt-118px{
	margin-top: 118px;
}

.white-36-700{
	font-size: 36px;
	font-weight: 700;
	line-height: 42px;
	letter-spacing: 0em;
	text-align: left;
	color: #fff !important;
}

.white-16-400{
	font-size: 16px;
	font-weight: 400;
	line-height: 35px;
	letter-spacing: 0em;
	text-align: left;
	color: #fff !important;
}

.opacity-60{
	opacity: 60%;
}

.df{
	display: flex;
}

.aic{
	align-items: center;
}

.jcc{
	justify-content: center;
}

.frame-close{
	position: absolute;
	top: 10px;
	right: 10px;
}

.global-24-700{
	font-size: 24px;
	font-weight: 700;
	line-height: 28px;
	letter-spacing: 0em;
	text-align: left;
	color: var(--blue) !important;
}

.brown-28-700{
	font-size: 24px;
	font-weight: 700;
	line-height: 32px;
	letter-spacing: 0em;
	text-align: left;
	color: var(--brown) !important;
}

.black-28-700{
	font-size: 28px;
	font-weight: 700;
	line-height: 38px;
	letter-spacing: 0em;
	text-align: left;
	color: #2C2C2C !important;
}

.icon-40px{
	width: 40px;
	height: 40px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
}

.flex-column-14px{
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.flex-column-65px{
	display: flex;
	flex-direction: column;
	gap: 65px;
}

.flex-row-15px{
	display: flex;
	gap: 15px;
}

.fz-18px{
	font-size: 18px;
}

.h-60px{
	height: 60px;
}

.edit-input-email-footer{
	border-radius: 8px;
	padding: 12px 30px;
	border: 0;
	color: #fff;
	background-color: #3092C0;
	width: 380px;
	height: 60px;
}

.edit-input-email-footer::placeholder {
	color: #fff;
}

.p-20px{
	padding: 20px;
}

.flex-row-6px{
	display: flex;
	gap: 6px;
}

.w-160px{
	width: 160px;	
}

.flex-column-50px{
	display: flex;
	flex-direction: column;
	gap: 50px;
}

.flex-column-150px{
	display: flex;
	flex-direction: column;
	gap: 150px;
}

.white-24-700{
	font-size: 24px;
	font-weight: 700;
	line-height: 36px;
	letter-spacing: 0em;
	text-align: left;
	color: #fff !important;
}

.lh-21px{
	line-height: 21px;
}

.white-18-400{
	font-size: 18px;
	font-weight: 400;
	line-height: 21px;
	letter-spacing: 0em;
	text-align: left;
	color: #fff !important;
}

.img-h550px{
	width: 100%;
	height: 550px;
	position: relative;
	overflow: hidden;
	background-size: cover;
	background-repeat: no-repeat;
}

.flex-column-32px{
	display: flex;
	flex-direction: column;
	gap: 32px;
}

.content-banner-home{
	width: 45%;
	height: 100%;
	padding: 5%;
	justify-content: center;
}

.white-60-700{
	font-size: 60px;
	font-weight: 700;
	line-height: 70px;
	letter-spacing: 0em;
	text-align: left;
	color: #fff !important;
}

.w-50{
	width: 50% !important;
}

.w-70{
	width: 70% !important;
}

.w-80{
	width: 80% !important;
}

.grid-2-20{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
}

.flex-column-16px{
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.icon-12px{
	width: 12px;
	height: 12px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
}

.flex-row-14px{
	display: flex;
	gap: 14px;
}

.p-80px{
	padding: 80px;
}

.lh-28px{
	line-height: 28px;
}

.p-5{
	padding: 5%;
}

.black-36-700{
	font-size: 36px;
	font-weight: 700;
	line-height: 42px;
	letter-spacing: 0em;
	text-align: left;
	color: #2C2C2C !important;
}

.grey-24-400{
	font-size: 24px;
	font-weight: 400;
	line-height: 28px;
	letter-spacing: 0em;
	text-align: center;
	color: #808080 !important;
}

.nowrap{
	white-space: nowrap;
}

.brown-36-700{
	font-size: 36px;
	font-weight: 700;
	line-height: 42px;
	letter-spacing: 0em;
	text-align: left;
	color: var(--brown) !important;
}

.g-20px{
	gap: 20px;
}

.g-8px{
	gap: 8px;
}

.flex-column-30px{
	display: flex;
	flex-direction: column;
	gap: 30px;
}

.flex-column-20px{
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.flex-column-48px{
	display: flex;
	flex-direction: column;
	gap: 48px;
}

.grey-16-400{
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	letter-spacing: 0em;
	text-align: left;
	color: #808080 !important;
}

.avt-71px{
	width: 71px;
	height: 71px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
	border-radius: 50%;
}

.avt-45px{
	width: 45px;
	height: 45px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
	border-radius: 50%;
}

.avt-150px{
	width: 150px;
	height: 150px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
	border-radius: 50%;
	border: 2px solid #ddd;
}

.black-14-500{
	font-size: 14px;
	font-weight: 600;
	line-height: 16px;
	letter-spacing: 0em;
	text-align: left;
	color: #2C2C2C !important;
}

.black-24-700{
	font-size: 24px;
	font-weight: 700;
	line-height: 32px;
	letter-spacing: 0em;
	text-align: left;
	color: #2C2C2C !important;
}

.icon-35px{
	width: 35px;
	height: 35px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
}

.h-40px{
	height: 40px;
}

.fz-14{
	font-size: 14px;
}

.flex-column{
	display: flex;
	flex-direction: column;
}

.flex-row-12px{
	display: flex;
	gap: 12px;
}
.width_100_overlowhidden{
	width: 100%;
}
.black-18-700{
	font-size: 18px;
	font-weight: 700;
	line-height: 21px;
	letter-spacing: 0em;
	text-align: left;
	color: #2C2C2C !important;
}

.grey-12-400{
	font-size: 12px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 0em;
	text-align: left;
	color: #808080;
}

.line-grey-2px{
	width: auto;
	height: 2px;
	background-color: rgba(0, 0, 0, .1);
}

.flex-row-64px{
	display: flex;
	gap: 64px;
}

.grid-taisaochonchungtoi{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 70px;
}

.icon-50px{
	width: 50px;
	height: 50px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
}

.flex-column-8px{
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.blue-18-700{
	font-size: 18px;
	font-weight: 700;
	line-height: 21px;
	letter-spacing: 0em;
	text-align: left;
	color: var(--blue) !important;
}

.blue-24-700{
	font-size: 24px;
	font-weight: 700;
	line-height: 28px;
	letter-spacing: 0em;
	text-align: left;
	color: var(--blue) !important;
}

.text-2-row{
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
}

.text-full-row{
	
}



.text-3-row{
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}

.text-4-row{
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
	overflow: hidden;
}

.banner-course-highlight{
	width: 100%;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	position: relative;
	padding: 20px 0px;
}
.course-section-noi-bat{
	padding: 50px 0px;
}
.item-slide-course{
	height: 527px;
	border-radius: 15px;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.img-slide-course{
	width: 100%;
	height: 249px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

.content-slide-course{
	height: 436px;
	padding: 25px;
	display: flex;
	flex-direction: column;
	gap: 25px;
	background-color: #fff;
	justify-content: space-between;
}

.frame-button-slide{
	padding: 25px;
	height: 91px;
	background-color: #FAFAFA;
}

.flex-row-8px{
	display: flex;
	gap: 8px;
}

.icon-15px{
	width: 15px;
	height: 15px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
}

.frame-button-slide .btn-inline-blue{
	font-size: 14px;
	height: 40px;
	border-radius: 10px;
}

#slide-course-highlight .owl-nav{
	width: max-content;
	display: flex;
}

#slide-course-highlight .owl-prev, #slide-course-highlight .owl-next{
	position: absolute;
	top: 50%;
	padding: 25px;
	background-color: #fff;
	border: 8px solid #F3F9FB;
	border-radius: 50%;
	width: 67px;
	height: 67px;
	display: flex;
	align-items: center;
	justify-content: center;
}

#slide-course-highlight .owl-next {
	background-color: var(--blue);
}

#slide-course-highlight .owl-next .fa-long-arrow-right:before {
	color: #fff;
}

#slide-course-highlight .owl-prev{
	transform: translate(-50%,-50%);
}

#slide-course-highlight .owl-next{
	right: 20px;
	transform: translate(50%,-50%);
}

.p-0px-20px{
	padding: 0px 20px;
}

.frame-taisaonenchonchungtoi{
	display: flex;
	justify-content: space-between;
	padding: 5%;
	gap: 170px;
	overflow: hidden;
}

.frame-nangcaokienthuc{
	padding: 80px 112px 80px 123px;
	display: flex;
	gap: 25px;
	align-items: center;
	overflow: hidden;
}

.frame-dangkykhoahoc{
	padding: 0px 80px 75px 80px;
	overflow: hidden;
}

.img-nangcaokienthuc{
	width: 500px;
	height: 500px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
	position: relative;
}

.brown-48-700{
	font-size: 48px;
	font-weight: 700;
	line-height: 56px;
	letter-spacing: 0em;
	text-align: left;
	color: var(--brown) !important;
}

.grid-icon-nangcaokienthuc{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 30px;
}

.frame-icon-50px{
	width: 50px;
	height: 50px;
	background-color: #F5E8E1;
	border-radius: 50%;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	box-sizing: border-box;
}

.icon-25px{
	width: 25px;
	height: 25px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
}

.black-16-600{
	font-size: 16px;
	font-weight: 600;
	line-height: 35px;
	letter-spacing: 0em;
	text-align: left;
	color: #2C2C2C !important;
}

.w-80{
	width: 80%;
}

.banner-dangkykhoahoc{
	width: 100%;
	min-height: 250px;
	position: relative;
	padding: 70px 45px;
	gap: 200px;
	background-color: #F2E7DB;
	border-radius: 15px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.lh-54px{
	line-height: 54px;
}

.icon-60px{
	width: 60px;
	height: 60px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

.icon-52px-47px{
	width: 52px;
	height: 47px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

.banner-dangkykhoahoc .icon-60px{
	position: absolute;
	top: 0;
	left: 0;
}

.banner-dangkykhoahoc .icon-52px-47px{
	position: absolute;
	bottom: 0;
	right: 40%;
	transform: translateY(50%);
}

.frame-hocviennoigi {
	padding: 65px 80px 120px 80px;
	/*background-color: #F8F8F8;*/
	background: linear-gradient(180deg, #ffeaeb 0%, #fff 100%);
	display: flex;
	flex-direction: column;
	gap: 48px;
	align-items: center;
	justify-content: center;
}

.item-slide-hocvien {
	padding: 48px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 24px;
	border-radius: 10px;
}

.item-slide-hocvien_2 {
	padding: 20px 25px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 45px;
	border-radius: 10px;
	box-shadow: 0 8px 0 #92969e14;
	min-height: 335px !important;
}
#hocviennoigi .owl-stage-outer {
	padding: 10px 0;
}
.item-slide-hocvien_2 .tac {
	text-align: left !important;
}

input{
	border-radius: 5px;
	border: 1px solid #ddd;
	padding: 12px;
}

.owl-video-frame iframe{
	height: 100%;
}

.owl-carousel .owl-video-tn {
	background-size: auto !important;
}

.avt-75px {
	width: 75px;
	height: 75px;
	border-radius: 50%;
	background-size: cover;
	background-repeat: no-repeat;
	flex-shrink: 0;
}

.avt-200px {
	width: 200px;
	height: 200px;
	border-radius: 50%;
	background-size: cover;
	background-repeat: no-repeat;
	flex-shrink: 0;
}

.frame-hocviennoigi .owl-item.active.center .item-slide-hocvien, .frame-hocviennoigi .item-slide-hocvien_2 {
	background-color: #fff;
}

.frame-hocviennoigi .owl-item.active.center .item-slide-hocvien .line-blue-slide-hocvien {
	width: -webkit-fill-available;
	height: 5px;
	background-color: var(--blue);
	position: absolute;
	bottom: 0;
	border-radius: 24px;
}

#hocviennoigi .owl-nav {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	gap: 20px;
}

#hocviennoigi .owl-prev, #hocviennoigi .owl-next {
	position: unset;
	bottom: 0;
	padding: 25px;
	background-color: #fff;
	border: 8px solid #F3F9FB;
	border-radius: 50%;
	width: 67px;
	height: 67px;
	display: flex;
	align-items: center;
	justify-content: center;
}

#hocviennoigi .owl-next {
	background-color: var(--brown);
}

#hocviennoigi .fa-long-arrow-right:before {
	color: #fff;
}

.edit-width-modal-chon-trinh-do{
	width: 90%;
}

.modal-content{
	padding: 40px;
	border-radius: 15px;
	background-color: #fff;
}

.frame-white{
	background-color: #fff;
	padding: 24px;
	border-radius: 8px;
}

.flex-row-16px{
	display: flex;
	gap: 16px;
}

.flex-column-24px{
	display: flex;
	flex-direction: column;
	gap: 24px;
}

input[type=radio] {
	border-radius: 50%;
	margin-right: 4px;
	line-height: inherit;
	width: 24px;
	height: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	flex-shrink: 0;
}

input[type=radio]:checked:before {
	width: 10px;
	height: 10px;
}

.stt-bai-test{
	width: 24px;
	height: 24px;
	background-color: #242938;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	letter-spacing: 0em;
	text-align: center;
	color: #fff;
	flex-shrink: 0;
}

.h-header{
	height: 100px;
}

.banner-khoahoc{
	width: 100%;
	height: 550px;
	background-size: cover;
	background-repeat: no-repeat;
	position: relative;
}

.content-banner-khoahoc{
	height: 100%;
	display: flex;
	flex-direction: column;
	gap: 16px;
	align-items: center;
	justify-content: center;
}

.frame-khoahoc{
	padding: 80px;
}

.frame-play-video{
	width: 84px;
	height: 84px;
	background-color: #fff;
	border-radius: 50%;
	opacity: 50%;
	filter: opacity(0.5);
	transform: translate(-15%, -15%);
}

.grid-khoahoc{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}

.grid-khoahoc .item-slide-course{
	box-shadow: 0px 0px 8px 0px #00000026;
}



.pagination.active{
	background-color: var(--brown);
	color: #fff !important;
}

.banner-users{
	width: 100%;
	position: relative;
	height: 894px;
	background-size: cover;
	background-repeat: no-repeat;
	display: flex;
	justify-content: center;
}

.content-banner-users{
	position: absolute;
	top: 10%;
	min-width: 434px;
	min-height: 294px;
	background-color: #F5F5F5;
	border-radius: 15px;
	padding: 25px;
	overflow: hidden;
}

.frame-input-users{
	position: relative;
	overflow: hidden;
}

.w-maxcontent{
	width: max-content;
}

.frame-input-users input{
	background-color: #fff;
	color: #808080;
	padding-left: 45px !important;
	padding-right: 10px !important;
	height: 48px;
	border-radius: 8px;
	border: 0;
	width: 100%;
	font-size: 14px;
}

.icon-100px{
	width: 100px;
	height: 100px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
}

.frame-input-users input::placeholder{
	color: #808080;
	font-size: 14px;
}

.frame-input-users .icon-24px{
	position: absolute;
	left: 3%;
	top: 50%;
	transform: translateY(-50%);
}

.black-12-600{
	font-size: 12px;
	font-weight: 600;
	line-height: 30px;
	letter-spacing: 0em;
	text-align: left;
	color: #2C2C2C !important;
}

.jcfe{
	display: flex;
	justify-content: flex-end;
}

.login-with-gg{
	width: 100%;
	height: 48px;
	border: 1px solid var(--blue);
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	border-radius: 8px;
	font-size: 12px;
	font-weight: 400;
	line-height: 30px;
	letter-spacing: 0em;
	text-align: left;
	color: #000 ;
}

.icon-gg{
	width: 28px;
	height: 26px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
}

.black-16-700{
	font-size: 16px;
	font-weight: 700;
	line-height: 19px;
	letter-spacing: 0em;
	text-align: left;
	color: #000 !important;
}

.grey-14-400{
	font-size: 14px;
	font-weight: 400;
	line-height: 16px;
	letter-spacing: 0em;
	text-align: left;
	color: #808080 !important;
}

.banner-detail-khoahoc{
	width: 100%;
	min-height: 550px;
	background-size: cover;
	background-repeat: no-repeat;
	position: relative;
	overflow: hidden;
}
.banner-detail-khoahoc::after{
	content:'';
	position:absolute; inset:0;
	background: rgba(0,0,0,.55);
	pointer-events:none;
}
.content-banner-detail-khoahoc {
	position: absolute;
	z-index: 2;
	justify-self: center;
	padding: 100px 250px;
}

.flex-column-64px{
	display: flex;
	flex-direction: column;
	gap: 64px;
}

.flex-around{
	display: flex;
	justify-content: space-around;
}

.white-18-700{
	font-size: 18px;
	font-weight: 700;
	line-height: 21px;
	letter-spacing: 0em;
	text-align: center;
	color: #fff !important;
}

.aife{
	align-items: flex-end;
}

.aib{
	align-items: baseline;
}

.g-5px{
	gap: 5px;
}

.icon-20px{
	width: 20px;
	height: 20px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
}

.p-60px-5{
	padding: 60px 5%;
}

.p-30px-5{
	padding: 30px 5%;
}

.grid-detail-khoahoc {
	display: grid;
	grid-template-columns: 50vw 40vw;
	gap: 20px;
}

.grid-detail-khoahoc-2{
	display: grid;
	grid-template-columns: 1fr 2fr;
	gap: 20px;
}

.frame-video-detail-khoahoc{
	height: 500px;
	width: 100%;
	background-size: cover;
	background-repeat: no-repeat;
	flex-shrink: 0;
	position: relative;
	overflow: hidden;
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.frame-video-detail-khoahoc .icon-60px{
	position: absolute;
}

.bg-linear{
	width: 100%;
	height: 100%;
	background: linear-gradient(180deg, rgba(36, 93, 81, 0.13) 0%, #245D51 100%);
}

.frame-list-video-khoahoc{
	position: relative;
	overflow: hidden;
	background-color: #F5F5F5;
	border-radius: 10px;
	margin-bottom: 20px;
}

.frame-scroll-khoahoc{
	max-height: 700px;
	padding: 25px;
	overflow-y: auto;
	min-height: 700px;
	padding-bottom: 100px;
}

.frame-scroll-khoahoc::-webkit-scrollbar {
	width: 10px;
}

.frame-scroll-khoahoc::-webkit-scrollbar-track {
	background-color: #E5E5E5;
}

.frame-scroll-khoahoc::-webkit-scrollbar-thumb {
	background-color: var(--blue);
	border-radius: 24px;
}


.icon-list-video{
	width: 28px;
	height: 24px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
}

.item-list-video-khoahoc{
	width: 100%;
	
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	padding: 15px;
	overflow: hidden;
}
.a_item_video{
	border-radius: 10px;
	background-color: #fff;
	position: relative;
	padding-bottom: 35px;
}


.black-18-400 {
	font-size: 18px;
	font-weight: 400;
	line-height: 20px;
	letter-spacing: 0em;
	text-align: left;
	color: #2C2C2C !important;
	width: 367px;
	overflow: hidden;
	word-wrap: break-word;
	white-space: normal;
}

.frame-buy-khoahoc{
	width: 100%;
	height: 70px;
	border-radius: 10px;
	font-size: 20px;
	font-weight: 700;
	line-height: 23px;
	letter-spacing: 0em;
	text-align: center;
	color: #fff !important;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #1E88BB;
	position: absolute;
	bottom: 0;
	right: 0;
}

.tab-content {
	border: 0;
	padding: 0;
}

.tab-info-khoahoc ul{
	display: flex;
	align-items: center;
	gap: 16px;
	white-space: nowrap;
	flex-flow: wrap;
}

.tab-info-khoahoc ul li{
	background-color: #DDDDDD;
	border-radius: 24px;
	padding: 15px 30px;
	cursor: no-drop;
}

.tab-info-khoahoc ul li a{
	font-size: 18px;
	font-weight: 700;
	line-height: 21px;
	letter-spacing: 0em;
	text-align: center;
	color: #808080 !important;
	
}

.tab-info-khoahoc ul li.active{
	box-shadow: 0px 15px 50px 0px #245D5140;
	background-color: var(--blue);
	cursor: unset;
}

.tab-info-khoahoc ul li.active a{
	color: #fff !important;
	border: 1px solid var(--blue);
}

.tab-info-khoahoc-login ul li{
	background-color: #fff;
	border-radius: 24px;
	border: 1px solid grey;
	padding: 15px 30px;
	cursor: unset;
}

.g-120px{
	gap: 120px;
}

.frame-tab-info-khoahoc{
	width: 95%;
}

.grey-18-400{
	font-size: 18px;
	font-weight: 400;
	line-height: 28px;
	letter-spacing: 0em;
	text-align: left;
	color: #808080 !important;
}

.avt-80px{
	box-sizing: border-box;
	width: 80px;
	height: 80px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
	border-radius: 50%;
	position: relative;
}

.dot-online{
	box-sizing: border-box;
	width: 15px;
	height: 15px;
	background-color: #38C976;
	border-radius: 50%;
	position: absolute;
	top: 5px;
	right: 5px;
}

.lh-24px{
	line-height: 24px !important;
}

.frame-skill-lq{
	display: flex;
	gap: 16px;
	white-space: wrap;
	flex-flow: wrap;
}

.frame-skill-lq a{
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	letter-spacing: 0em;
	text-align: left;
	color: #2C2C2C !important;
	padding: 10px 18px;
	background-color: #fff;
	border: 1px solid #2C2C2C;
	border-radius: 10px;
}

.frame-skill-lq a.active{
	background-color: #CB8461;
	color: #fff !important;
	border: 1px solid #CB8461;
}

.icon-18px{
	width: 18px;
	height: 18px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
}

hr{
	margin: 0;
	padding: 0;
}

.aifs{
	align-items: flex-start;
}

.frame-thanhtoan-khoahoc{
	border: 1px solid #ddd;
	border-radius: 15px;
	box-shadow: 0px 0px 8px 0px #00000026;
	padding: 40px;
}

.img-khoahoc-thanhtoan{
	width: 150px;
	height: 100px;
	border-radius: 10px;
	background-size: cover;
	background-repeat: no-repeat;
	flex-shrink: 0;
	overflow: hidden;
	position: relative;
}

.frame-thanhtoan-giatien{
	padding: 30px 0px;
	border-top: 1px solid #ddd;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.frame-thanhtoan-giatien:last-child{
	padding-bottom: 0;
}

input[type="checkbox"]{
	width: 24px;
	height: 24px;
	border-radius: 5px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 0;
}

input[type=checkbox]:checked:before {
	color: #fff;
	background-color: var(--blue);
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 5px;
}

.brown-16-700{
	font-size: 16px;
	font-weight: 700;
	line-height: 19px;
	letter-spacing: 0em;
	text-align: left;
	color: var(--brown) !important;
}

.text-underline{
	text-decoration: underline;
}

.h-55px{
	height: 55px;
}

.frame-comment-thanhtoan{
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding-bottom: 24px;
	border-bottom: 1px solid #ddd;
}

.frame-comment-thanhtoan:last-child{
	border-bottom: 0;
}

.margin-comment-thanhtoan{
	margin-left: 50px;
}

.p-25px{
	padding: 25px;
}

.frame-noidung-khoahoc{
	padding: 25px;
	background-color: #F5F5F5;
	border-radius: 15px;
}

.number-chuong{
	width: 65px;
	height: 65px;
	background-color: var(--blue);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	font-size: 28px;
	font-weight: 600;
	line-height: 42px;
	letter-spacing: 0em;
	text-align: left;
	color: #fff !important;

}

.frame-number-chuong{
	padding-bottom: 24px;
	border-bottom: 1px solid #ddd;
}

.thaoluan-khoahoc{
	resize: vertical;
	border-radius: 8px;
	border: 1px solid #ddd;
	padding: 24px;
	font-size: 18px;
	font-weight: 400;
	line-height: 28px;
	letter-spacing: 0em;
	text-align: left;
	color: #808080 !important;
	height: 166px;
}

.thaoluan-khoahoc::placeholder{
	color: #808080 !important;
}

.frame-comment-thaoluan{
	padding: 24px 0px;
	border-top: 1px solid #ddd;
}

.frame-blue-comment-thaoluan{
	background-color: #F3FBFD;
	padding: 16px;
	border-radius: 8px;
}

.frame-grey-comment-thaoluan{
	background-color: #ECECEC;
	padding: 16px;
	border-radius: 8px;
}

.avt-60px-thaoluan{
	width: 60px;
	height: 60px;
	background-size: cover;
	background-repeat: no-repeat;
	flex-shrink: 0;
	position: relative;
	overflow: hidden;
	border-radius: 50%;
	border: 3px solid #D8DFE1;
}

.avt-40px-thaoluan{
	width: 40px;
	height: 40px;
	background-size: cover;
	background-repeat: no-repeat;
	flex-shrink: 0;
	position: relative;
	overflow: hidden;
	border-radius: 50%;
	border: 2px solid #D2D2D2
}

.avt-48px-header{
	width: 48px;
	height: 48px;
	background-size: cover;
	background-repeat: no-repeat;
	flex-shrink: 0;
	position: relative;
	overflow: hidden;
	border-radius: 50%;
	border: 2px solid #D2D2D2
}

.avt-60px-header{
	width: 60px;
	height: 60px;
	background-size: cover;
	background-repeat: no-repeat;
	flex-shrink: 0;
	position: relative;
	overflow: hidden;
	border-radius: 50%;
	border: 2px solid #D2D2D2
}

.avt-32px{
	width: 32px;
	height: 32px;
	background-size: cover;
	background-repeat: no-repeat;
	flex-shrink: 0;
	position: relative;
	overflow: hidden;
	border-radius: 50%;
	border: 2px solid #D2D2D2
}

.fxs0{
	flex-shrink: 0;
}

.fxs1{
	flex: 1;
}

.input-traloi-comment{
	background-color: #fff;
	color: #2C2C2C !important;
	font-size: 16px;
	font-weight: 400;
	line-height: 19px;
	letter-spacing: 0em;
	text-align: left;
	padding: 12px;
	height: 43px;
}

.input-traloi-comment::placeholder{
	font-size: 16px;
	font-weight: 400;
	line-height: 19px;
	letter-spacing: 0em;
	text-align: left;
	color: #2C2C2C;
}

.frame-traloi-thaoluan{
	padding-top: 16px;
	border-top: 1px solid #ddd;
}

.line-grey-1px{
	width: 100%;
	height: 1px;
	background-color: #ddd;
}

.upload-file{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	font-size: 24px;
	font-weight: 700;
	line-height: 28px;
	letter-spacing: 0em;
	text-align: left;
	color: var(--blue) !important;
	padding: 12px 40px;
	border-radius: 8px;
	border: 1px solid #ddd;
	width: max-content;
}

.p-13px-50px{
	padding: 13px 50px;
}

.frame-baitap-uploaded{
	padding: 16px 20px;
	display: flex;
	justify-content: space-between;
	gap: 20px;
	border-radius: 8px;
	border: 1px solid #ddd;
}

.flex-row-4px{
	display: flex;
	gap: 4px;
}

.black-16-400{
	font-size: 16px;
	font-weight: 400;
	line-height: 19px;
	letter-spacing: 0em;
	text-align: left;
	color: #2C2C2C !important;
}

.flex-column-12px{
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.icon-80px{
	width: 80px;
	height: 80px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
}

.frame-download-baitap{
	height: 324px;
	width: 100%;
	border-radius: 8px;
	border: 1px solid #ddd;
	display: flex;
	flex-direction: column;
}

.frame-blue-download{
	width: 100%;
	height: 220px;
	border-radius: 8px;
	background-color: var(--blue);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.frame-content-download-baitap{
	flex: 1;
	padding: 20px;
}

.grid-giangvien{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
}

.grid-giangvien .item-slide-course{
	box-shadow: 0px 0px 8px 0px #00000026;
}

.bg-grey{
	background-color: #F5F5F5;
	border-radius: 8px;
}

.them-danhgia{
	padding: 15px 30px;
	border-radius: 24px;
	border: 1px solid grey;
	font-size: 18px;
	font-weight: 700;
	line-height: 21px;
	letter-spacing: 0em;
	text-align: left;
	color: #808080 !important;
	position: absolute;
	right: 0;
	top: -104px;
}

#gv-danhgia{
	position: relative;
}

.btn-thanhtoan-ngay{
	background-color: #fff;
	border: 1px solid #fff;
	font-size: 20px;
	font-weight: 700;
	line-height: 23px;
	letter-spacing: 0em;
	text-align: left;
	color: var(--blue) !important;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 8px;
	padding: 10px 25px;
	width: max-content;
}

.grid-3fr-1fr-100px{
	display: grid;
	grid-template-columns: 3fr 1fr;
	gap: 100px;
}

.brown-24-700{
	font-size: 24px;
	font-weight: 700;
	line-height: 28px;
	letter-spacing: 0em;
	text-align: left;
	color: var(--brown) !important;
}

.flex-row-70px{
	display: flex;
	gap: 70px;
}

.flex-row-30px{
	display: flex;
	gap: 30px;
}

.grid-lichhoc{
	display: grid;
	grid-template-columns: 1fr 2fr;
	gap: 70px;
}

.w-30{
	width: 30%;
}

.banner-detail-khoahoc-offline{
	width: 100%;
	min-height: 382px;
	background-size: cover;
	background-repeat: no-repeat;
	position: relative;
	overflow: hidden;
	padding: 64px 100px;
}

.content-banner-offline{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 48px;
	flex-direction: column;
}

.g-100px{
	gap: 100px;
}

.grey2-16-400{
	font-size: 16px;
	font-weight: 400;
	line-height: 28px;
	letter-spacing: 0em;
	text-align: center;
	color: #A7BEB9 !important;
}

.frame-giaotrinh-item{
	padding: 16px 24px;
	border: 1px solid #ddd;
	border-radius: 10px;
	box-shadow: 0px 0px 8px 0px #00000026;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.black-18-500{
	font-size: 18px;
	font-weight: 500;
	line-height: 35px;
	letter-spacing: 0em;
	text-align: left;
	color: #2C2C2C !important;
}

.grid-giaotrinh .flex-column-20px{
	width: 100%;
}

.dot-li{
	display: inline-block;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	padding: 1px;
	background-color: #ddd;
}

.grey-18-500{
	font-size: 18px;
	font-weight: 500;
	line-height: 35px;
	letter-spacing: 0em;
	text-align: left;
	color: #808080 !important;
}

.giaotrinh-mobile{
	display: none;
}

.modal{
	padding: 0 !important;
}

.width-modal-dk-tuvan{
	max-width: 467px;
	margin: 30px auto;
}

.banner-550px{
	width: 100%;
	max-height: 550px;
	background-size: cover;
	background-repeat: no-repeat;
	position: relative;
	overflow: hidden;
}

.content-baner-tintuc{
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 200px;
}

.content-baner-chitiet-tintuc{
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 200px 100px;
}

.img-tintuc-large{
	width: 100%;
	height: 482px;
	border-radius: 20px;
	background-size: cover;
	background-repeat: no-repeat;
	flex-shrink: 0;
	position: relative;
	overflow: hidden;
}

.grid-tintuc{
	display: grid;
	grid-template-columns: 1fr 3fr;
	gap: 20px;
}

.content-img-tintuc-large{
	position: absolute;
	bottom: 30px;
	left: 30px;
	font-size: 28px;
	font-weight: 700;
	line-height: 33px;
	letter-spacing: 0em;
	text-align: left;
	color: #fff !important;
}

.flex-column-60px{
	display: flex;
	flex-direction: column;
	gap: 60px;
}

.grid-tintuc-moinhat{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}

.item-tintuc-moinhat{
	width: 100%;
	height: 368px;
	display: flex;
	flex-direction: column;
	border-radius: 16px;
	box-shadow: 0px 0px 4px 0px #00000026;
	overflow: hidden;
}

.img-item-tintuc-moinhat{
	height: 184px;
	background-size: cover;
	background-repeat: no-repeat;
	flex-shrink: 0;
	position: relative;
}

.content-item-tintuc-moinhat{
	flex: 1;
	padding: 20px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.icon-10px{
	width: 10px;
	height: 10px;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	flex-shrink: 0;
}

.brown-16-400{
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	letter-spacing: 0em;
	text-align: left;
	color: var(--brown) !important;
}

.content-baiviet{
	margin: 0px 200px;
}

.line-baiviet{
	width: 80px;
	height: 1px;
	background-color: #828282;
}

.abs-title-baiviet{
	position: absolute;
}

.grid-lienhe{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 60px;
}

.form-lienhe input{
	width: 100%;
	height: 48px;
	padding: 16px 12px;
	font-size: 14px;
	font-weight: 400;
	line-height: 16px;
	letter-spacing: 0em;
	text-align: left;
	color: #808080;
	border: 1px solid #EAEAEA;
	border-radius: 5px;
}

.form-lienhe textarea{
	padding: 12px;
	font-size: 14px;
	font-weight: 400;
	line-height: 16px;
	letter-spacing: 0em;
	text-align: left;
	color: #808080;
	border: 1px solid #EAEAEA;
	border-radius: 5px;
	resize: vertical;
	min-height: 154px;
}

textarea{
	resize: vertical;
	padding: 12px;
	border: 1px solid #ddd;
	border-radius: 8px;
}

.blue-18-600{
	font-size: 18px;
	font-weight: 600;
	line-height: 35px;
	letter-spacing: 0em;
	text-align: left;
	color: var(--blue) !important;
}

.show-collapse-avt{
	padding: 20px;
	background-color: #fff;
	box-shadow: 0px 0px 8px 0px #00000026;
	border-radius: 8px;
	min-width: 329px;
	position: absolute;
	right: 0;
	display: none;
	animation: show-collapse-avt 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
	transition: all 0.25s ease;
}

@keyframes show-collapse-avt {
	0% {
		transform: scale(0.5);
		transform-origin: 100% 0%;
	}
	100% {
		transform: scale(1);
		transform-origin: 100% 0%;
	}
}

.blue-20-700{
	font-size: 20px;
	font-weight: 700;
	line-height: 23px;
	letter-spacing: 0em;
	text-align: left;
	color: var(--blue) !important;
}

.frame-link-header-avt{
	font-size: 18px;
	font-weight: 400;
	line-height: 35px;
	letter-spacing: 0em;
	text-align: left;
	color: #2C2C2C !important;
	padding: 16px 0;
	border-top: 1px solid #ddd;
}

.frame-link-header-avt:last-child{
	padding-bottom: 0;
}

.content-baner-khoahoc-cuatoi{
	padding: 230px 80px;
}

.line-cam-banner-khoahoc-cuatoi{
	width: 55px;
	height: 8px;
	background-color: #F99349;
}

.thanhtiendo-tong{
	width: 100%;
	height: 10px;
	border-radius: 10px;
	position: relative;
	overflow: hidden;
	background-color: #D9D9D9;
}

.thanhtiendo-thucte{
	height: 10px;
	border-radius: 10px;
	background-color: #2C2C2C;
}

.brown-18-700{
	font-size: 18px;
	font-weight: 700;
	line-height: 21px;
	letter-spacing: 0em;
	text-align: left;
	color: var(--brown) !important;
}

.img-chungchi{
	width: 100%;
	max-height: 600px;
	background-size: contain;
	background-repeat: no-repeat;
	overflow: hidden;
}

.width-modal-inbang{
	max-width: 870px;
	width: 90%;
	margin: 70px auto;
}

.asb-inbang {
	position: absolute;
	top: 0;
	transform: translate(70px,15px);
	width: 90%;
}

.flex-row-24px{
	display: flex;
	gap: 24px;
}

.lh-35px{
	line-height: 35px !important;
}

.fz-18{
	font-size: 18px !important;
}

.fw-400{
	font-weight: 400 !important;
}

.readonly{
	cursor: default;
	background-color: #E3E3E3;
}

.doimatkhau-tcn{
	font-size: 16px;
	font-weight: 600;
	line-height: 30px;
	letter-spacing: 0em;
	text-align: left;
	color: #2C2C2C !important;
	text-decoration: underline;
}

.w-174px{
	width: 174px;
}

.grid-tuyendung{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
}

.item-grid-tuyendung{
	padding: 20px;
	border-radius: 8px;
	border: 1px solid #EAEAEA;
}

.logo-company{
	width: 80px;
	height: 80px;
	border-radius: 4px;
	background-size: cover;
	background-repeat: no-repeat;
	flex-shrink: 0;
	overflow: hidden;
	border: 1px solid #ddd;
}

.logo-company-detail{
	width: 120px;
	height: 120px;
	border-radius: 4px;
	background-size: cover;
	background-repeat: no-repeat;
	flex-shrink: 0;
	overflow: hidden;
	border: 1px solid #ddd;
}

.frame-dk-ungtuyen{
	display: flex;
	flex-flow: wrap;
	gap: 12px;
}

.dk-ungtuyen{
	padding: 4px 14px;
	border-radius: 24px;
	border: 1px solid #ddd;
	background-color: #fff;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	letter-spacing: 0em;
	text-align: left;
	color: #808080 !important;
	cursor: default;
}

.brown-20-700{
	font-size: 20px;
	font-weight: 700;
	line-height: 23px;
	letter-spacing: 0em;
	text-align: left;
	color: var(--brown) !important;
}

.blue-28-700{
	font-size: 28px;
	font-weight: 700;
	line-height: 33px;
	letter-spacing: 0em;
	text-align: left;
	color: var(--blue) !important;
}

.frame-upload-file-cv{
	padding: 10px 16px;
	border: 1px solid #ddd;
	border-radius: 5px;
}


.upload-file-cv{
	font-size: 20px;
	font-weight: 400;
	line-height: 23px;
	letter-spacing: 0em;
	text-align: left;
	color: var(--blue) !important;
	padding: 8px 24px;
	border-radius: 8px;
	border: 1px solid #ddd;
}
.upload-file-cv>input[type=file]{
	display: none;
}
.mota-banthan-cv{
	background-color: transparent;
	height: 140px;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
	letter-spacing: 0em;
	text-align: left;
	color: #808080;
}

.p-20px-5{
	padding: 20px 5%;
}

.grid-chitiet-tuyendung{
	display: grid;
	grid-template-columns: 2fr 1fr;
	gap: 120px;
}

.dot-brown{
	width: 8px;
	height: 8px;
	background-color: var(--brown);
	border-radius: 50%;
	flex-shrink: 0;
}

.grid-about-bussiness {
	display: flex;
	column-gap: 60px;
	row-gap: 16px;
	justify-content: space-between;
	flex-flow: wrap;
}

.text-1-row{
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	overflow: hidden;
}

.text-2-row{
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
}

.text-3-row{
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}

.p-24px{
	padding: 24px;
}

.gray-24-700{
	font-size: 24px;
	font-weight: 700;
	line-height: 32px;
	letter-spacing: -0.20000000298023224px;
	text-align: left;
	color: #505050 !important;
}

.frame-start{
	display: flex;
	align-items: center;
	gap: 30px;
}

.gray-16-400{
	font-size: 16px;
	font-weight: 400;
	line-height: 19px;
	letter-spacing: 0px;
	text-align: left;
	color: #505050 !important;
}

.minh-120px{
	min-height: 120px;
}

.radius-8px{
	border-radius: 8px;
}

.bg-f5{
	background-color: #f5f5f5;
}

.bg-white{
	background-color: #fff;
}

@media (max-width: 468px){
	.white-60-700 {
		font-size: 40px !important;
		line-height: 50px;
	}

	.grid-taisaochonchungtoi {
		grid-template-columns: 1fr;
		gap: 30px;
	}

	.modal-content{
		padding: 20px;
	}

	.img-h550px{
		height: 450px;
	}

	

	.frame-video-detail-khoahoc {
		height: 300px;
	}

	.upload-file {
		padding: 12px;
		width: 100%;
	}

	.upload-file {
		font-size: 22px;
	}

	.content-slide-course{
		padding: 15px;
	}
	.grid-tintuc-moinhat{
		grid-template-columns: 1fr;
	}

	.fxdc-468px{
		flex-direction: column;
	}

	.fxdc-re-468px{
		flex-direction: column-reverse;
	}

	.asb-inbang {
		transform: translate(20px,15px);
	}

	.aifs-468px{
		align-items: flex-start;
	}

	.grid-about-bussiness{
		flex-direction: column;
	}
}

@media (min-width: 469px) and (max-width: 767px){
	.grid-taisaochonchungtoi {
		gap: 40px;
	}

	.img-h550px{
		height: 500px;
	}

	.grid-tintuc-moinhat{
		grid-template-columns: 1fr 1fr;
	}

	.asb-inbang {
		transform: translate(30px,15px);
	}
}

@media (max-width: 767px){
	.flex-column-mobile{
		flex-direction: column;
	}

	.grid-choose-course{
		grid-template-columns: 1fr;
	}

	.fxdc-mobile{
		flex-direction: column;
	}

	.edit-input-email-footer{
		width: 350px;
	}

	.content-banner-home {
		width: 100% !important;
	}
	

	.grid-icon-nangcaokienthuc {
		grid-template-columns: 1fr;
	}

	.img-nangcaokienthuc {
		width: 300px;
		height: 300px;
	}

	.banner-footer{
		padding: 20px;
	}

	.edit-width-modal-chon-trinh-do{
		width: auto;
	}

	.grid-khoahoc{
		grid-template-columns: 1fr;
	}

	.content-banner-users {
		width: 350px;
		min-width: unset;
	}

	.banner-detail-khoahoc {
		padding: 20px !important;
	}

	.fxdc-767px{
		flex-direction: column;
	}

	.grid-giangvien{
		grid-template-columns: 1fr;
	}

	#gv-danhgia .grid-giangvien {
		margin-top: 75px;
	}

	.them-danhgia {
		top: 0;
	}

	.item-slide-hocvien{
		padding: 20px;
	}

	.grid-lichhoc{
		grid-template-columns: 1fr;
	}

	.content-banner-offline .g-100px{
		gap: 50px;
	}

	.grid-giaotrinh{
		flex-direction: column;
	}

	.giaotrinh-pc{
		display: none;
	}

	.giaotrinh-mobile{
		display: block;
	}

	.content-baner-tintuc, .content-baner-chitiet-tintuc{
		padding: 20px 0;
	}

	.content-baner-khoahoc-cuatoi {
		padding: 50px 20px;
	}
	.frame-start {
		align-items: unset;
		gap: 24px;
		flex-direction: column;
	}

}

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

	.white-60-700 {
		font-size: 52px;
	}

	.content-banner-home{
		padding: 3%;
	}

	.p-5{
		padding: 3%;
	}

	.grid-khoahoc{
		grid-template-columns: 1fr 1fr;
	}

	.content-banner-offline .g-100px{
		gap: 20px;
	}

	.asb-inbang {
		transform: translate(50px,15px);
	}
}

@media (max-width: 1024px){
	.mt-30px-mobile-tablet{
		margin-top: 30px;
	}

	.frame-taisaonenchonchungtoi{
		flex-direction: column;
		gap: 20px;
	}

	.banner-dangkykhoahoc{
		flex-direction: column;
		gap: 20px;
		align-items: unset;
	}

	.frame-dangkykhoahoc{
		padding: 20px;
		padding-bottom: 35px;
	}

	.banner-dangkykhoahoc {
		padding: 45px 20px;
	}

	.frame-nangcaokienthuc{
		flex-direction: column-reverse;
		gap: 20px;
		padding: 20px;
	}

	.frame-khoahoc{
		padding: 20px;
	}

	.frame-hocviennoigi{
		padding: 20px;
		padding-bottom: 80px;
	}

	.p-60px-5 {
		padding: 3%;
	}

	.p-30px-5{
		padding: 3%;
	}

	.grid-detail-khoahoc, .grid-detail-khoahoc-2{
		grid-template-columns: 1fr;
	}

	.frame-tab-info-khoahoc {
		width: 100%;
	}

	.margin-comment-thanhtoan{
		margin-left: unset;
	}

	.grid-3fr-1fr-100px{
		grid-template-columns: 1fr;
	}

	.banner-detail-khoahoc-offline{
		padding: 20px;
	}

	.grid-tintuc{
		grid-template-columns: 1fr;
	}

	.content-baiviet{
		margin: 0;
	}

	.abs-title-baiviet {
		position: unset; 
	}

	.grid-lienhe{
		grid-template-columns: 1fr;
	}

	.grid-tuyendung {
		grid-template-columns: 1fr;
	}

	.grid-chitiet-tuyendung {
		grid-template-columns: 1fr;
		gap: 30px;
	}

	.show-collapse-avt{
		position: unset;
	}
}

@media (max-width: 1300px) {
	header {
		padding: 10px 3%;
	}

	header label {
		font-size: 20px;
		width: 40px;
		height: 40px;
		background-color: black;
		color: white;
		padding: 10px;
		border-radius: 8px;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
	}

	header .navbar {
		position: absolute;
		top: 100%;
		right: 0;
		left: 0;
		background-color: #fff;
		border-top: 1px solid rgba(0, 0, 0, 0.1);
		transform: translateY(-150%);
		opacity: 50%;
		transition: all 1s ease;
		overflow-y: auto;
		height: 500px;
	}

	header .navbar ul li {
		width: 100%;
	}

	header .navbar ul {
		display: unset;
	}

	header .navbar ul li ul {
		position: relative;
		width: 100%;
	}

	header .navbar ul li ul li {
		background-color: #eee;
	}

	#menu-bar:checked ~ .navbar {
		transform: translateY(0);
		opacity: 100%;
	}

	.navbar{
		flex-direction: column;
	}

	.content-banner-home {
		width: 70%;
	}

	.no-wrap-mobile-tablet{
		white-space: nowrap;
		overflow-x: auto;
	}

	.h-header {
		height: 66px;
	}

	.p-0px-20px-mobie-tablet{
		padding: 0px 20px !important;
	}

	.p-0px-30px-mobie-tablet{
		padding: 0px 30px !important;
	}

	.banner-detail-khoahoc{
		padding: 100px;
	}
}























/* Container */
.course-container {
	background: #fff;
	border-radius: 6px;
	border: 1px solid #ddd;
	overflow: hidden;
	font-family: Arial, sans-serif;
}
.course-container .tabs .tab{
	font-size: 24px;
	text-transform: uppercase;
	font-weight: 600;
}
/*.frame-list-video-khoahoc{
  position: fixed;
  top: 105px;  
  right: 5px; 
  width: 42%;  
  max-height: CALC(100vh - 110px);   
  overflow-y: auto;   
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 6px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
  z-index: 999;     
}*/
.tab-info-khoahoc{
	padding: 15px 0px;
}
/* Tabs */
.tabs {
	display: flex;
	border-bottom: 1px solid #ddd;
}
.tab {
	flex: 1;
	padding: 10px;
	text-align: center;
	font-weight: bold;
	cursor: pointer;
	background: #e53935;
	color: #fff;
}
.tab.active {
	background: #fff;
	color: #e53935;
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
	border: 1px solid #ddd;
	border-bottom: none;
}

/* Course Item */
.course-item {
	border-bottom: 1px solid #eee;
}
.course-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 14px 16px;
	cursor: pointer;
}

.course-summary {
	font-size: 13px;
	font-weight: normal;
	color: #777;
	margin-top: 4px;
}
.course-header span {
	font-size: 16px;
}

/* Lesson List */
.lesson-list {
	display: none;
	padding: 0 16px 12px;
	animation: fadeIn 0.3s ease-in-out;
	cursor: pointer;
	transition: max-height 0.4s ease;
}
.lesson-list.active {
	display: block;
}

.lesson {
	margin: 8px 0;
	padding: 10px;
	border-radius: 6px;
	background: #fafafa;
}
.lesson-title {
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 6px;
}

/* Lesson Type */
.lesson-type {
	display: inline-block;
	font-size: 13px;
	padding: 4px 10px;
	border-radius: 20px;
	font-weight: bold;
}
.lesson-type--video {
	background: #e8f5e9;
	color: #2e7d32;
}
.lesson-type--article {
	background: #e3f2fd;
	color: #1565c0;
}

/* Animation */
@keyframes fadeIn {
	from {opacity: 0;}
	to {opacity: 1;}
}
.video-js .vjs-big-play-button {
	top: 50% !important;
	left: 50% !important;
	transform: translate(-50%, -50%) !important;
	margin: 0 !important;
	position: absolute !important;
	width: 68px;   /* bạn chỉnh theo ý */
	height: 68px;  /* bạn chỉnh theo ý */
	border-radius: 50%;
	background-color: rgba(0, 0, 0, 0.5); /* nền mờ */
	border: none;
}
#videojs-player,
#videojs-player_html5_api,
.video-js {
	width: 100% !important;
	height: auto !important;
	max-height: 700px; /* giới hạn chiều cao */
	object-fit: cover;
}
.video-js .vjs-tech{
	position: relative !important;
}
.time-box {
	display: inline-flex;
	align-items: center;
	background-color: #f1f1f1;   /* nền xám nhạt */
	padding: 3px 7px;
	border-radius: 6px;          /* bo góc */
	font-family: Arial, sans-serif;
	font-size: 14px;
	font-weight: 600;
	color: #333;
	gap: 6px;
}

.time-icon {
	font-size: 16px;             /* kích thước icon */
}








.course-section {
	padding: 40px 20px;
	background: #fff5f5;
	font-family: Arial, sans-serif;
}

.course-badge {
	display: inline-block;
	background: #ffe6e6;
	color: #b30000;
	padding: 6px 12px;
	border-radius: 12px;
	font-size: 14px;
	font-weight: bold;
}
.course-title {
	font-size: 16px;
	font-weight: 600;
}

.title_h2{
	font-size: 28px;
	margin: 15px 0;
	text-transform: uppercase;
}
.course-title span {
	color: #e60023;
}

.course-desc {
	max-width: 800px;
	margin: 0 auto 30px;
	color: #555;
	line-height: 1.6;
}

/* Card */
.course-card {
	border-radius: 12px;
	overflow: hidden;
	margin-bottom: 20px;
	box-shadow: 0 4px 10px rgba(0,0,0,0.1);
	transition: all .3s ease;
	background: #fff;
}
.course-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 20px rgba(0,0,0,0.2);
}

.card-top {
	background-size: cover;
	background-position: center;
	height: 220px;
	position: relative;
	color: #fff;
	display: flex;
	align-items: flex-end;
}
.card-overlay {
	width: 100%;
	padding: 15px;
	background: linear-gradient(to top, rgba(0,0,0,0.6), transparent);
}
.card-overlay h3 {
	margin: 0 0 5px;
	font-size: 18px;
	font-weight: bold;
}
.card-overlay p {
	margin: 0 0 8px;
	font-size: 14px;
}
.course-label {
	background: #fff;
	color: #d40000;
	padding: 4px 8px;
	border-radius: 6px;
	font-size: 12px;
	font-weight: bold;
}

/* Bottom */
.card-bottom {
	padding: 15px;
	text-align: left;
}
.card-bottom p {
	margin: 0 0 10px;
	font-weight: bold;
}
.btn-detail {
	text-decoration: none;
	color: #d40000;
	font-weight: bold;
}
.btn-detail .arrow {
	margin-right: 6px;
}
.btn-detail:hover {
	text-decoration: underline;
}
.course-card .card-bottom >h3{
	min-height: 55px;
}
.course-card .card-bottom .arrow{
	color: #50ACEC;
}












.login-required-box {
	background: #fff;
	border: 2px dashed #ccc;
	border-radius: 8px;
	padding: 40px 20px;
	max-width: 700px;
	margin: 40px auto;
	box-shadow: 0 4px 12px rgba(0,0,0,0.05);
	padding: 50px;
	min-height: 500px;
}

.login-required-box .login-icon {
	font-size: 40px;
	margin-bottom: 15px;
}

.login-required-box h3 {
	font-size: 20px;
	margin-bottom: 10px;
	color: #d40000;
}

.login-required-box p {
	color: #555;
	margin-bottom: 20px;
}



























.document-box {
	background: #fff;
	border: 1px solid #e0e0e0;
	border-radius: 8px;
	padding: 25px;
	box-shadow: 0 4px 15px rgba(0,0,0,0.05);
	max-width: 800px;
	margin: 0 auto;
	min-height: 500px;
}

.document-header {
	display: flex;
	align-items: center;
	margin-bottom: 15px;
}

.document-header .doc-icon {
	font-size: 30px;
	margin-right: 10px;
}
.document-header h3 {
	margin: 0;
	color: #d32f2f;
	font-size: 22px;
	font-weight: bold;
}

.document-intro {
	margin-bottom: 20px;
	color: #555;
}

.document-list {
	list-style: none;
	padding: 0;
	margin: 0;
}
.document-list li {
	display: flex;
	align-items: center;
	padding: 12px;
	margin-bottom: 10px;
	border: 1px solid #eee;
	border-radius: 6px;
	background: #fafafa;
	transition: background 0.2s;
}
.document-list li:hover {
	background: #f1f1f1;
}

.doc-item-icon {
	font-size: 20px;
	margin-right: 10px;
}
.doc-title {
	flex: 1;
	font-weight: 500;
}

.btn-view, .btn-download {
	margin-left: 10px;
	font-size: 13px;
	padding: 5px 10px;
	border-radius: 4px;
	text-decoration: none;
	color: #fff !important;
}

.btn-view {
	background: #1976d2;
	color: #fff;
}
.btn-download {
	background: #43a047;
	color: #fff;
}
.btn-view:hover {
	background: #125a9c;
}
.btn-download:hover {
	background: #2e7031;
}




#modal_chung .modal-dialog{
	width: 90%;
}
.course-list-cat .h2_cat {
	font-size: 24px;
	font-weight: bold;
	color: #333;
	text-align: center;
	position: relative;
	margin: 30px 0 40px;
	padding-bottom: 10px;
}

.course-list-cat .h2_cat::after {
	content: "";
	display: block;
	width: 80px;
	height: 4px;
	background: linear-gradient(to right, #ff7e5f, #feb47b);
	margin: 8px auto 0;
	border-radius: 2px;
}
.box_mua_view {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	font-size: 14px;
	color: #555;
}

.box_mua_view .arrow {
	color: #007bff;
	font-weight: bold;
}
.button_mua {
	background-color: #007bff;  /* xanh dương */
	color: #fff !important;
	padding: 6px 14px;
	border-radius: 5px;
	font-size: 14px;
	text-decoration: none;
	transition: all 0.2s ease;
}

.button_mua:hover {
	background-color: #0056b3;
	text-decoration: none;
}
.card-bottom h3{
	min-height: 55px;
}
.price-box {
	align-items: center;
	gap: 10px;
	justify-content: center; /* căn giữa, bỏ nếu không cần */
}

.price-old {
	color: #888;
	font-size: 14px;
	text-decoration: line-through;
}

.price-new {
	color: #e53935;  /* đỏ nổi bật */
	font-size: 18px;
	font-weight: bold;
}
.button_da_mua{
	background-color: red; 
	color: #fff !important;
	padding: 6px 14px;
	border-radius: 5px;
	font-size: 14px;
	text-decoration: none;
	transition: all 0.2s ease;
}




























































/* Layout tổng */
.nav-wrap {
	background: #fff;
	border-bottom: 1px solid #eee;
}

.nav-root {
	display: flex;
	gap: 18px;
	list-style: none;
	margin: 0;
	padding: 10px 16px;
}

.nav-link {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 10px 8px;
	font-weight: 600;
	color: #111;
	text-decoration: none;
}

.nav-link:hover {
	color: #0a58ca;
}

.nav-item {
	position: relative;
	list-style: none;
}

/* Dropdown nhỏ (menu thường) */
.has-drop > .nav-drop {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 220px;
	background: #fff;
	border: 1px solid #e8e8e8;
	border-radius: 10px;
	box-shadow: 0 12px 28px rgba(0,0,0,.06);
	list-style: none;
	padding: 8px 6px;
	display: none;
	z-index: 40;
}

.nav-drop li a {
	display: block;
	padding: 8px 10px;
	color: #222;
	border-radius: 6px;
	text-decoration: none;
}

.nav-drop li a:hover {
	background: #f3f6ff;
	color: #0a58ca;
}

/* Mega menu */
.has-mega > .mega {
	position: absolute;
	left: 0;
	top: 100%;
	width: max(60vw, 860px);
	min-width: 760px;
	background: #fff;
	border: 1px solid #e8e8e8;
	border-radius: 12px;
	box-shadow: 0 16px 36px rgba(0,0,0,.08);
	padding: 18px;
	display: none;
	z-index: 45;
	gap: 12px;
}

.mega {
	display: flex;
}

.mega-col {
	flex: 1 1 0;
	min-width: 220px;
	padding: 6px 12px;
}

.mega-title {
	margin: 0 0 10px;
	font-size: 13px;
	letter-spacing: .02em;
	color: #666;
}

h4.mega-title > a {
	text-transform: uppercase;
}

.mega-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.mega-list li {
	margin: 6px 0;
}

.mega-list a {
	color: #222;
	text-decoration: none;
	padding: 6px 0;
	display: block;
}

.mega-list a:hover {
	color: #0a58ca;
}

.mega-feature {
	background: #fafbff;
	border: 1px dashed #dfe6ff;
	border-radius: 10px;
}

.mega-cta {
	display: inline-block;
	margin-top: 8px;
	padding: 8px 12px;
	border-radius: 8px;
	background: #0a58ca;
	color: #fff;
	text-decoration: none;
}

/* Hover desktop mở menu */
@media (min-width: 993px) {
	.has-drop:hover > .nav-drop,
	.has-drop:focus-within > .nav-drop {
		display: block;
	}

	.has-mega:hover > .mega,
	.has-mega:focus-within > .mega {
		display: flex;
	}
}

/* Mobile */
.nav-toggle {
	display: none;
	margin: 8px 12px;
	padding: 8px 12px;
	border: 1px solid #ddd;
	border-radius: 8px;
	background: #fff;
}
.content-banner-khoahoc h2{
	font-size: 50px !important;
}




































.tab-menu {
	background: #f7f7f7;
	padding: 20px 10px;
}

.tab-menu ul {
	display: flex;
	flex-wrap: wrap;
	list-style: none;
	margin: 0;
	padding: 0;
	justify-content: center;
}

.tab-menu li {
	flex: 1 1 auto;
	text-align: center;
	min-width: 150px;
	padding: 5px 0px;
}

.tab-menu a {
	display: inline-block;
	padding: 10px 15px;
	font-size: 15px;
	font-weight: 500;
	color: #a11c1c; /* đỏ như ảnh */
	text-decoration: none;
	border-radius: 6px;
	transition: all 0.3s ease;
}

.tab-menu a:hover {
	background: #a11c1c;
	color: #fff;
	box-shadow: 0 4px 10px rgba(161, 28, 28, 0.2);
}
.target-section {
	text-align: center;
	padding: 50px 20px;
	background: #fff;
}

.target-title {
	font-size: 24px;
	font-weight: 700;
	color: #f69320;
	margin-bottom: 25px;
	position: relative;
	padding-left: 15px;
}

.target-list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 30px;
	margin-bottom: 40px;
}

.target-item {
	flex: 1 1 220px;
	max-width: 240px;
	text-align: center;
}

.target-icon {
	width: 100px;
	height: 100px;
	/*background: #c62828;*/
	border-radius: 50%;
	margin: 0 auto 15px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.target-icon img {
	width: 100%;
	/*filter: brightness(0) invert(1);*/
}

.target-item p {
	font-size: 15px;
	line-height: 1.5;
	color: #111;
}

.btn-register {
	display: inline-block;
	background: #c62828;
	color: #fff !important;
	font-size: 16px;
	font-weight: 600;
	padding: 12px 30px;
	border-radius: 8px;
	text-decoration: none;
	transition: all 0.3s ease;
}

.btn-register:hover {
	background: #a11c1c;
	box-shadow: 0 4px 10px rgba(161, 28, 28, 0.3);
}
.target-btn{
	text-align: center;
}
.target-title::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 4px;
	height: 70%; /* chiều cao gạch */
	background: #f69320; /* cùng màu chữ */
	border-radius: 2px;
}
.course-overview {
	background: #f7f7f7;
	padding: 40px 20px;
	border-radius: 6px;
	color: #00acec;
}

.course-overview .section-header {
	/*background: linear-gradient(90deg, #e92d60, #f15a29);*/
	background: linear-gradient(90deg, #00acec, #7fd5f5);
	padding: 18px;
	text-align: center;
	border-radius: 8px 8px 0 0;
}

.course-overview .section-header h2 {
	margin: 0;
	color: #fff;
	font-size: 22px;
	font-weight: 700;
	letter-spacing: .5px;
	text-transform: uppercase;
}

.course-overview .section-body {
	background: #fff;
	padding: 24px;
	margin-top: 0;
	border-radius: 0 0 6px 6px;
}

.course-overview .section-body h3 {
	color: #00acec;
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 15px;
	text-transform: uppercase;
}

.course-overview .section-body p {
	color: #00acec;
	line-height: 1.6;
	margin-bottom: 15px;
}

.course-overview .section-body ul {
	padding-left: 20px;
	color: #00acec;
}

.course-overview .section-body ul li {
	margin-bottom: 12px;
	line-height: 1.6;
}

.faq-section {
	background: #f7f7f7;
	padding: 20px;
	border-radius: 6px;
	font-family: sans-serif;
}

.faq-item {
	border-bottom: 1px solid #ddd;
	margin-bottom: 10px;
	padding-bottom: 10px;
}

.faq-question {
	display: flex;
	justify-content: flex-start; /* căn trái */
	align-items: center;
	gap: 10px; /* khoảng cách giữa chữ và mũi tên */
	cursor: pointer;
	font-size: 18px;
	color: #333;
}
.faq-question .arrow {
	margin-left: auto; /* mũi tên tự động đẩy về phải */
}
.faq-question .bullet {
	color: #b22222;
	margin-right: 6px;
}

.faq-question .arrow {
	transition: transform 0.3s;
	font-size: 20px;
	color: #b22222;
}

.faq-item.active .arrow {
	transform: rotate(90deg);
}

.faq-answer {
	display: none;
	margin-top: 10px;
	background: #fff;
	padding: 12px;
	border-radius: 6px;
	color: #555;
	line-height: 1.6;
}

.faq-item.active .faq-answer {
	display: block;
}

.expandable{
  position: relative;
  overflow: hidden;
  max-height: 420px;
  transition: max-height .5s ease;
  border-radius: 12px;
  background: #fff;
}
.expandable__fade{
  pointer-events: none;
  position: absolute; inset: auto 0 0 0; height: 80px;
  background: linear-gradient(to bottom, rgba(255,255,255,0), #fff);
  opacity: 1; transition: opacity .3s;
}
.expandable.is-open .expandable__fade{ opacity: 0; }
.expandable__btn{
  margin-top: 12px;
  padding: 10px 16px;
  border: 0; border-radius: 10px;
  background: linear-gradient(90deg,#22c1c3,#2ec7ff);
  color:#fff; font-weight:700; cursor:pointer;
  transition: transform .15s ease;
}
.expandable__btn:active{ transform: translateY(1px); }

/* tuỳ chọn: đổi max-height nhỏ hơn trên mobile */
@media (max-width: 768px){
  .expandable{ max-height: 320px; }
}

.gap-30 {
    gap: 30px;
}

.box_nhom_footer {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}
.footer-brand img {
    margin-bottom: 10px;
    max-width: 170px;
}
.box_footer {
	padding: 0 80px;
}

.footer_2 {
	display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.banner-footer .heading-footer {
	font-weight: 700;
	font-family: "Exo","Exo Placeholder",sans-serif;
	font-style: normal;
	font-size: 16px;
}
.footer_2  .menu-footer li a {
	color: #fff;
	font-size: 16px;
	transition: all 0.3s ease;
	font-weight: 400;
}
.footer_2  .menu-footer li a:hover {
	text-decoration: underline;
	text-decoration-color: #fff;
}

.banner-footer .iso {
	padding: 8px;
	background: #fff;
	border-radius: 50%;
	width: 47px;
	height: 47px;
	display: -webkit-inline-box;
}
.copyright, .copyright span a {
	color: #fff;
	font-size: 13px;
}

.copyright_img  img {
	margin-bottom: 5px;
	width: 10%;
}