a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
	display: block
}

body {
	line-height: 1
}

ol,
ul {
	list-style: none
}

blockquote,
q {
	quotes: none
}

blockquote:after,
blockquote:before,
q:after,
q:before {
	content: "";
	content: none
}

table {
	border-collapse: collapse;
	border-spacing: 0
}

.text-media-500 {
	color: #7c0fd1
}

.text-media-800 {
	color: #270147
}

.text-media-900 {
	color: #340658
}

.text-amber-300 {
	color: #fb0
}

.text-amber-400 {
	color: #fbbf24
}

.bg-media-50 {
	background-color: #f2e7fa
}

.text-media-500 {
	color: #7c0fd1
}

.text-media-800 {
	color: #270147
}

.text-media-900 {
	color: #340658
}

.text-amber-300 {
	color: #fb0
}

.text-amber-400 {
	color: #fbbf24
}

.bg-media-50 {
	background-color: #f2e7fa
}

* {
	box-sizing: border-box
}

html {
	font-size: 10px
}

@media (min-width:2000px) {
	html {
		font-size: 80%
	}
}

@media (min-width:2500px) {
	html {
		font-size: 100%
	}
}

@media screen and (max-width:2000px) {
	html {
		scroll-behavior: smooth
	}
}

@media (max-width:1580px) {
	html {
		font-size: 8px
	}
}

@media (max-width:1200px) {
	html {
		font-size: 10px
	}
}

body {
	font-family: Inter, sans-serif;
	font-size: 1.8rem;
	color: #3a3a3a;
	line-height: 1.5;
	overflow: hidden auto;
	position: relative;
	-webkit-tap-highlight-color: transparent
}

@media (max-width:1200px) {
	body {
		font-size: 1.6rem
	}
}

::-webkit-scrollbar {
	width: 7px
}

@media (max-width:1200px) {
	::-webkit-scrollbar {
		width: 3px
	}
}

::-webkit-scrollbar-track {
	background: 0 0
}

::-webkit-scrollbar-thumb {
	background: #c3c3c3;
	border-radius: 2rem
}

a {
	text-decoration: none;
	color: inherit
}

button,
input,
select,
textarea {
	font-family: Inter, sans-serif;
	font-size: 1.4rem;
	line-height: 1.2;
	padding: 0;
	border: none;
	outline: 0;
	resize: none;
	vertical-align: middle
}

.container {
	position: relative;
	width: 100%;
	max-width: 144.6rem;
	height: 100%;
	margin: 0 auto;
	padding: 0 1.5rem
}

@media (max-width:1580px) {
	.container {
		max-width: 80%
	}
}

@media (max-width:1368px) {
	.container {
		max-width: 90%
	}
}

@media (max-width:1200px) {
	.container {
		max-width: 100%
	}
}

@media (max-width:768px) {
	.container {
		padding: 0 .8rem
	}
}

.no-scroll {
	touch-action: none;
	-webkit-overflow-scrolling: none;
	overflow: hidden;
	overscroll-behavior: none
}

.section {
	background-color: #fff;
	position: relative;
	padding: 6rem 0
}

@media (max-width:1500px) {
	.section {
		padding: 6.4rem 0
	}
}

@media (max-width:1200px) {
	.section {
		padding: 5.6rem 0
	}
}

@media screen and (max-width:768px) {
	.section {
		padding: 2.8rem 0
	}
}

.section-12 {
	position: relative;
	padding: 12rem 0
}

@media (max-width:1500px) {
	.section-12 {
		padding: 8rem 0
	}
}

@media (max-width:1200px) {
	.section-12 {
		padding: 5.6rem 0
	}
}

@media screen and (max-width:768px) {
	.section-12 {
		padding: 2.8rem 0
	}
}

.btn-purple-linear {
	white-space: nowrap;
	display: block;
	width: max-content;
	position: relative;
	border-radius: 10rem;
	padding: 1.6rem 3.2rem;
	color: #fff;
	font-size: 1.8rem;
	font-weight: 700;
	background-size: 300% 300%;
	z-index: 12;
	transition: .3s;
	margin: 4rem 0;
	animation: animatedgradient 6s ease alternate infinite
}

@media screen and (max-width:1200px) {
	.btn-purple-linear {
		margin: 2rem 0
	}
}

@media screen and (max-width:576px) {
	.btn-purple-linear {
		margin: 1rem 0
	}
}

.btn-purple-linear::before {
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: -2;
	width: calc(100% + 1.6rem);
	height: calc(100% + 1.6rem);
	border-radius: 10rem;
	background-color: #f41e92;
	transform: translate(-50%, -50%);
	opacity: .2;
	transition: .3s
}

.btn-purple-linear::after {
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: -1;
	width: 100%;
	height: 100%;
	border-radius: 10rem;
	background: linear-gradient(272deg, #f41e92 -34.1%, #7c0fd1 115.23%);
	transform: translate(-50%, -50%)
}

.btn-purple-linear .txt {
	position: relative;
	z-index: 2;
	font-weight: 600;
	display: flex;
	align-items: center;
	gap: .4rem
}

.btn-purple-linear .ani-arow {
	position: relative;
	width: 1rem;
	display: block;
	left: 1rem
}

.btn-purple-linear .ani-arow .icon-inner {
	display: block;
	position: absolute;
	top: 10%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(-90deg);
	cursor: pointer
}

.btn-purple-linear .ani-arow .icon-arrow {
	display: block;
	width: .8rem;
	height: .8rem;
	border-bottom: 2px solid #fff;
	border-right: 2px solid #fff;
	transform: rotate(45deg);
	margin: -2rem 1rem 1rem 1rem;
	animation: btn-arrow-ani 2s infinite
}

@media screen and (min-width:1201px) {
	.btn-purple-linear:hover {
		box-shadow: 0 .4rem 1.6rem 0 #ce18c5
	}

	.btn-purple-linear:hover::before {
		opacity: 0
	}
}

@keyframes animatedgradient {
	0% {
		background-position: 0 50%
	}

	50% {
		background-position: 100% 50%
	}

	100% {
		background-position: 0 50%
	}
}

@keyframes btn-arrow-ani {
	0% {
		opacity: 0;
		transform: rotate(45deg) translate(-8px, -8px)
	}

	50% {
		opacity: 1
	}

	100% {
		opacity: 0;
		transform: rotate(45deg) translate(8px, 8px)
	}
}

.sec-header {
	width: 100%;
	max-width: 78rem;
	margin: 0 auto;
	position: relative
}

@media screen and (max-width:1200px) {
	.sec-header {
		max-width: 100%
	}
}

.sec-header-route {
	position: absolute;
	top: 50%;
	transform: translateY(-20%)
}

@media screen and (max-width:1200px) {
	.sec-header-route svg {
		width: 10rem
	}
}

@media screen and (max-width:768px) {
	.sec-header-route svg {
		width: 7rem
	}
}

@media screen and (max-width:650px) {
	.sec-header-route {
		top: unset;
		bottom: 0;
		transform: translateY(100%)
	}

	.sec-header-route svg {
		width: 4rem;
		height: 4rem
	}
}

.sec-header-route-1 {
	left: 5%
}

.sec-header-route-2 {
	right: 5%
}

.sec-tt {
	font-size: 4rem;
	font-weight: 700;
	transition: .3s;
	overflow: hidden;
	line-height: 1.2
}

@media only screen and (max-width:1200px) {
	.sec-tt {
		font-size: 3.5rem
	}
}

@media only screen and (max-width:800px) {
	.sec-tt {
		font-size: 3rem
	}
}

@media (max-width:1200px) {
	.sec-tt {
		font-size: 2.4rem
	}
}

@media screen and (max-width:768px) {
	.sec-tt br {
		display: none
	}
}

.sec-tt.sec-subtt {
	font-size: 2.1rem
}

@media only screen and (max-width:1200px) {
	.sec-tt.sec-subtt {
		font-size: 1.9rem
	}
}

@media only screen and (max-width:800px) {
	.sec-tt.sec-subtt {
		font-size: 1.7rem
	}
}

.sec-tt.fz-64 {
	font-size: 6.4rem
}

@media only screen and (max-width:1200px) {
	.sec-tt.fz-64 {
		font-size: 3.9rem
	}
}

@media only screen and (max-width:800px) {
	.sec-tt.fz-64 {
		font-size: 2.9rem
	}
}

.sec-tt.fz-56 {
	font-size: 5.6rem
}

@media only screen and (max-width:1200px) {
	.sec-tt.fz-56 {
		font-size: 5.1rem
	}
}

@media only screen and (max-width:800px) {
	.sec-tt.fz-56 {
		font-size: 4rem
	}
}

.subtt {
	font-size: 3.2rem;
	font-weight: 600;
	color: #f5851e;
	margin-bottom: 2.4rem
}

@media only screen and (max-width:1200px) {
	.subtt {
		font-size: 2.7rem
	}
}

@media only screen and (max-width:800px) {
	.subtt {
		font-size: 2.2rem
	}
}

.sec-tt-flex {
	align-items: center;
	-webkit-align-items: center;
	gap: .8rem;
	margin-bottom: 4rem
}

@media screen and (max-width:1200px) {
	.sec-tt-flex {
		margin-bottom: 3.2rem
	}
}

@media screen and (max-width:768px) {
	.sec-tt-flex {
		margin-bottom: 2.4rem
	}
}

.sec-tt-flex .sec-tt {
	margin-bottom: 0 !important
}

.txt-center {
	text-align: center
}

.txt-underline {
	display: inline-block;
	position: relative
}

.txt-underline.hl-blue-sky::before {
	border-color: #2686ec
}

.txt-underline.hl-white-sky::before {
	border-color: #fff
}

@media screen and (max-width:1200px) {
	.txt-underline {
		display: inline;
		text-decoration: underline;
		text-underline-offset: .3rem
	}
}

.txt-underline::before {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 1px;
	border-bottom: 1px solid #3a3a3a
}

.txt-under {
	text-decoration: underline;
	text-underline-offset: .6rem
}

.sec-desc {
	margin-top: 2.4rem;
	overflow: hidden;
	color: #8b8b8b
}

.sec-desc p {
	margin-bottom: 1.6rem
}

.sec-desc p:last-child {
	margin-bottom: 0
}

.sec-btn {
	margin-top: 3.2rem
}

.sec-quote {
	font-style: italic;
	font-size: 2.4rem;
	font-weight: 600;
	letter-spacing: .05em;
	color: #7c0fd1;
	margin-bottom: 3.2rem
}

@media only screen and (max-width:1200px) {
	.sec-quote {
		font-size: 2rem
	}
}

@media only screen and (max-width:800px) {
	.sec-quote {
		font-size: 1.7rem
	}
}

.btn-group {
	display: flex;
	align-items: center;
	gap: .8rem
}

.btn {
	padding: 1.6rem 3.2rem;
	border-radius: 5rem;
	width: 100%;
	max-width: max-content;
	border-radius: .5rem;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	font-size: 1.6rem;
	line-height: 1.2;
	font-weight: 700;
	color: #fff;
	transition: .5s;
	cursor: pointer;
	position: relative;
	z-index: 3;
	overflow: hidden
}

.btn::after {
	content: "";
	background: #7c0fd1;
	position: absolute;
	width: calc(100% + .5rem);
	height: 100%;
	border-radius: 5px;
	top: 0;
	left: -.25rem;
	z-index: -1;
	transform: scaleX(0);
	transform-origin: center right;
	transition: transform .5s ease
}

@media (min-width:1201px) {
	.btn:hover::after {
		transform: scale(1);
		transform-origin: center left
	}
}

@media (min-width:1201px) {
	.btn[type=submit]:hover {
		background-color: #7c0fd1
	}

	.btn[type=submit]:hover::after {
		transform: scale(1);
		transform-origin: center left
	}
}

.btn img {
	width: 2.4rem;
	height: 2.4rem;
	margin-left: 1rem
}

.btn.btn-orange {
	background: var(--gradient-button, linear-gradient(101deg, #ffa318 -38.94%, #f6851c 44.05%, #f31f10 132.4%))
}

.btn.btn-black {
	background: #3a3a3a;
	color: #fff
}

@media (min-width:1201px) {
	.btn.btn-black:hover {
		color: #f5851e
	}
}

.btn.btn-black::after {
	background: #fff
}

.btn.btn-transparent {
	background: 0 0;
	color: #fff;
	border: .1rem solid #fff
}

.btn.btn-small {
	padding: .8rem 1.6rem;
	font-size: 1.4rem
}

.btn.btn-white {
	background-color: transparent;
	border: 1px solid rgba(0, 64, 132, .3);
	color: #7c0fd1
}

@media (min-width:1201px) {
	.btn.btn-white:hover {
		color: #fff;
		border-color: transparent
	}
}

.btn.btn-white::after {
	background: #f5851e
}

.btn.btn-white-b {
	background-color: transparent;
	border: 1px solid rgba(255, 255, 255, .3);
	color: #fff
}

.btn.btn-white-b::after {
	background-color: #f5851e
}

@media screen and (min-width:1201px) {
	.btn.btn-white-b:hover {
		border-color: #f5851e
	}
}

.btn.btn-nor {
	padding: 1.2rem 2rem;
	background: #fff;
	border: 1px solid rgba(9, 25, 41, .3);
	color: #3a3a3a
}

@media screen and (min-width:1201px) {
	.btn.btn-nor:hover {
		color: #fff
	}
}

body.web-design .btn::after {
	background-color: #7c0fd1
}

@media screen and (min-width:1201px) {
	body.web-design .btn-more:hover {
		background-color: #7c0fd1
	}
}

.btn-more {
	padding: 1.6rem 3.2rem;
	font-weight: 600;
	text-align: center;
	background: #fff;
	border: 1px solid rgba(9, 25, 41, .3);
	border-radius: .4rem;
	width: max-content;
	margin: 0 auto;
	margin-top: 4rem;
	cursor: pointer;
	transition: .3s
}

@media screen and (max-width:768px) {
	.btn-more {
		padding: .8rem 1.6rem
	}
}

@media screen and (min-width:1201px) {
	.btn-more:hover {
		background-color: #7c0fd1;
		color: #fff
	}
}

.view-more {
	font-size: 1.6rem;
	font-weight: 500;
	color: #3a3a3a;
	position: relative;
	text-transform: uppercase;
	transition: .3s;
	padding-right: 2.4rem
}

.view-more::before {
	content: "";
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	width: 2rem;
	height: .9rem;
	background: url("../assets/images/view-arrow.svg") no-repeat;
	background-size: cover;
	transition: .3s ease
}

@media (min-width:1201px) {
	.view-more:hover {
		color: #7c0fd1
	}

	.view-more:hover::before {
		transform: translate(.5rem, -50%)
	}
}

.ani-arrow {
	cursor: pointer;
	position: relative;
	transition: .3s;
	pointer-events: auto;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	color: #f5851e;
	margin-top: 3.2rem;
	padding-right: 6.4rem;
	font-weight: 600;
	max-width: max-content
}

.ani-arrow::after,
.ani-arrow::before {
	content: "";
	position: absolute;
	top: 50%;
	right: 0;
	transform: translate(0, -50%);
	transition: .6s cubic-bezier(.61, .22, .23, 1);
	-webkit-transition: .6s cubic-bezier(.61, .22, .23, 1);
	width: 4.4rem;
	height: 2.5rem;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center
}

@media (min-width:1201px) {
	.ani-arrow:hover::after {
		transform: translate(50%, -50%) scale(0);
		-webkit-transform: translate(50%, -50%) scale(0);
		opacity: 0;
		visibility: hidden
	}

	.ani-arrow:hover::before {
		opacity: 1;
		visibility: visible;
		transform: translate(0, -50%) scale(1);
		-webkit-transform: translate(0, -50%) scale(1);
		-o-transform: translate(0, -50%) scale(1);
		transition: .6s cubic-bezier(.61, .22, .23, 1);
		-webkit-transition: .6s cubic-bezier(.61, .22, .23, 1);
		-o-transition: .6s cubic-bezier(.61, .22, .23, 1)
	}
}

.ani-arrow::before {
	background: url("../assets/images/arrow-ani.png") no-repeat;
	background-size: contain;
	background-size: 2rem 1.2rem;
	background-position: center;
	opacity: 0;
	visibility: hidden;
	transform: translate(-50%, -50%) scale(0);
	-webkit-transform: translate(-50%, -50%) scale(0)
}

.ani-arrow::after {
	background: url("../assets/images/arrow-ani.png") no-repeat;
	background-size: contain;
	background-size: 2rem 1.2rem;
	background-position: center
}

.ani-arrow.read-more {
	padding-right: 3rem
}

.ani-arrow.read-more::after,
.ani-arrow.read-more::before {
	width: 2rem;
	height: 1.2rem
}

.ani-arrow.read-more::after {
	background-size: 2rem 1.2rem
}

.ani-arrow.read-white {
	transition: .6s;
	color: #fff;
	margin-top: 0;
	padding-right: 3rem
}

.ani-arrow.read-white.ani-arrow::after,
.ani-arrow.read-white.ani-arrow::before {
	filter: brightness(0) invert(1);
	-webkit-filter: brightness(0) invert(1)
}

@media screen and (min-width:1201px) {
	.img-hv:hover img {
		transform: translate(-50%, -50%) scale(1.1)
	}
}

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

.row-ctn {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	justify-content: flex-start;
	-webkit-justify-content: flex-start;
	align-items: stretch;
	-webkit-align-items: stretch;
	width: calc(100% + 3rem);
	margin-left: -1.5rem
}

@media (max-width:1200px) {
	.row-ctn {
		width: calc(100% + 1.5rem);
		margin-left: -.75rem
	}
}

strong {
	font-weight: 700
}

img {
	object-fit: cover;
	vertical-align: middle;
	width: 100%;
	height: 100%;
	transition: 1s
}

.dot {
	margin: 2.4rem 0;
	padding-left: 4.2rem;
	position: relative
}

.dot:nth-child(1) {
	margin-top: 0
}

.dot:last-child {
	margin-left: 0
}

.dot::before {
	content: "";
	position: absolute;
	top: .5rem;
	left: 1.1rem;
	width: .7rem;
	height: .7rem;
	border-radius: 50%;
	border: .3rem solid #f5851e
}

.hl-pri {
	color: #7c0fd1;
	transition: .3s
}

.hl-sec {
	color: #f5851e;
	transition: .3s
}

.hl-sec-2 {
	color: #f5851e;
	transition: .3s
}

.hl-red {
	color: #e72a2a;
	transition: .3s
}

.hl-purple {
	color: #7c0fd1;
	transition: .3s
}

.hl-blue-sky {
	color: #2686ec;
	transition: .3s
}

.fw-700 {
	font-weight: 700
}

.fw-600 {
	font-weight: 600
}

.fw-500 {
	font-weight: 500
}

.fw-400 {
	font-weight: 400
}

.fw-300 {
	font-weight: 300
}

.hover-item .name {
	transition: .3s
}

.hover-item .img {
	overflow: hidden
}

.hover-item .img img {
	transition: .5s ease
}

.hover-item span {
	display: block
}

@media screen and (min-width:1201px) {
	.hover-item:hover .name {
		color: #f5851e
	}

	.hover-item:hover .img img {
		transform: scale(1.05)
	}
}

.wow {
	animation-duration: 1s
}

.scrollbar-cus {
	overflow: hidden auto
}

@media screen and (min-width:1201px) {
	.scrollbar-cus {
		padding-right: .8rem
	}
}

.scrollbar-cus::-webkit-scrollbar {
	width: .3rem
}

.scrollbar-cus::-webkit-scrollbar-track {
	background: #1a5492
}

.scrollbar-cus::-webkit-scrollbar-thumb {
	background: #f5851e;
	border-radius: 0
}

.scrollbar-cus.scrollbar-cus-sec::-webkit-scrollbar-track {
	background: #f1f1f1
}

.scrollbar-cus.scrollbar-cus-sec::-webkit-scrollbar-thumb {
	background: #f5851e;
	border-radius: 0
}

.mg-auto {
	margin-left: auto;
	margin-right: auto
}

.txt-bg {
	display: block;
	width: 100%;
	max-width: max-content;
	padding: .8rem 1.6rem;
	color: #fff;
	border-radius: .8rem;
	margin-top: .2rem;
	margin-bottom: .2rem
}

@media screen and (max-width:375px) {
	.txt-bg {
		padding: .4rem .8rem
	}
}

.txt-bg-ani {
	background: 0 0 !important;
	box-shadow: unset;
	position: relative
}

.txt-bg-ani.active::before {
	width: 100%
}

.txt-bg-ani.bg-digital::before {
	background-color: #7c0fd1
}

.txt-bg-ani.bg-lms::before {
	background-color: #f41e92
}

.txt-bg-ani.bg-nhtq::before {
	background-color: #f5851e
}

.txt-bg-ani.bg-software::before {
	background-color: #2686ec
}

.txt-bg-ani.bg-host::before {
	background-color: #1ec0f2
}

.txt-bg-ani.bg-green::before {
	background-color: #0dba35
}

.txt-bg-ani.bg-white::before {
	background-color: #fff
}

.txt-bg-ani::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	width: 0;
	height: 100%;
	transition: .5s ease-in-out;
	background-color: #7c0fd1;
	border-radius: .8rem
}

.txt-bg-ani .txt {
	position: relative;
	z-index: 2
}

.txt-bg.txt-bg-win {
	border: 1px solid #7c0fd1;
	border-radius: .8rem;
	font-size: 3.2rem;
	color: #7c0fd1
}

@media only screen and (max-width:1200px) {
	.txt-bg.txt-bg-win {
		font-size: 2.7rem
	}
}

@media only screen and (max-width:800px) {
	.txt-bg.txt-bg-win {
		font-size: 2.2rem
	}
}

.txt-bg.txt-upper {
	padding-top: 1rem;
	padding-bottom: .6rem
}

.bg-nhtq {
	background-color: #f5851e
}

.bg-host {
	background-color: #1ec0f2
}

.bg-software {
	background-color: #2686ec
}

.bg-digital {
	background-color: #7c0fd1
}

.bg-lms {
	background-color: #f41e92
}

.bg-red {
	background-color: #e01507
}

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

.txt-digital {
	color: #7c0fd1
}

.txt-software {
	color: #2686ec
}

.txt-lms {
	color: #f41e92
}

.txt-nhtq {
	color: #f5851e
}

.txt-host {
	color: #1ec0f2
}

.txt-host-2 {
	color: #53f2ff
}

.txt-green {
	color: #01b940
}

.txt-green-2 {
	color: #09f057
}

.txt-yellow {
	color: #ffcb01
}

.txt-red {
	color: #e72a2a
}

.txt-warning {
	color: #ffb241
}

@media screen and (min-width:601px) {
	.sec-tt-hl-svg {
		padding-bottom: 2rem
	}

	.hl-svg {
		position: relative
	}

	.hl-svg::before {
		content: "";
		position: absolute;
		bottom: -42%;
		right: 0;
		width: 100%;
		height: 2rem;
		background: url("../assets/images/dvs/hl-svg-nhtq.png") no-repeat;
		background-size: 100% 100%
	}
}

.btn-second {
	padding: 2.4rem 4rem;
	display: inline-block;
	z-index: 1;
	box-shadow: .8rem .8rem 4rem rgba(245, 133, 30, .24);
	border-radius: .8rem;
	color: #fff;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	gap: 1.6rem;
	font-weight: 700;
	font-size: 2.4rem;
	width: fit-content;
	height: 8.2rem;
	transition: .5s;
	position: relative;
	overflow: hidden;
	text-align: center;
	cursor: pointer
}

@media only screen and (max-width:1200px) {
	.btn-second {
		font-size: 2rem
	}
}

@media only screen and (max-width:800px) {
	.btn-second {
		font-size: 1.7rem
	}
}

@media screen and (max-width:720px) {
	.btn-second {
		gap: .4rem
	}
}

.btn-second::before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: linear-gradient(100.87deg, #ffbe18 -38.94%, #ff9635 44.05%, #f31f10 132.4%);
	z-index: -1;
	transition: .45s ease-in-out all
}

.btn-second::after {
	content: "";
	position: absolute;
	height: 100%;
	top: 0;
	left: 0;
	background-image: linear-gradient(270deg, #7c0fd1 0, #b34ae6 100%);
	transition: transform .5s ease 0s;
	z-index: -1;
	width: 100%;
	transform: scaleX(0);
	transform-origin: center right
}

.btn-second:hover::after {
	transform: scale(1);
	transform-origin: center left
}

@media screen and (max-width:1200px) {
	.btn-second {
		height: 6rem
	}
}

@media screen and (max-width:600px) {
	.btn-second {
		padding: 1.2rem;
		height: auto;
		font-size: 1.4rem
	}
}

.btn-second .icon {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	width: 2.4rem;
	height: 2.4rem;
	flex-shrink: 0
}

@media screen and (max-width:720px) {
	.btn-second .icon {
		width: 1.6rem;
		height: 1.6rem
	}
}

.btn-second.btn-trans {
	background: 0 0;
	font-weight: 700;
	font-size: 2.4rem;
	color: #3a3a3a;
	box-shadow: unset;
	border: .1rem solid rgba(58, 58, 58, .3);
	filter: drop-shadow(.8rem 8px 4rem rgba(245, 133, 30, .24))
}

@media only screen and (max-width:1200px) {
	.btn-second.btn-trans {
		font-size: 2rem
	}
}

@media only screen and (max-width:800px) {
	.btn-second.btn-trans {
		font-size: 1.7rem
	}
}

.btn-second.btn-trans::before {
	display: none
}

.btn-second.btn-trans:hover .txt {
	color: #fff
}

.btn-second.btn-trans .txt {
	transition: .45s ease-in-out all
}

@media screen and (max-width:1200px) {
	.btn.btn-orange {
		font-size: 1.8rem
	}
}

@media screen and (max-width:550px) {
	.btn.btn-orange {
		text-align: center;
		padding: 1.6rem 2.4rem
	}
}

.pd-100 {
	padding-top: 10rem
}

.pd-125 {
	padding-top: 12.5rem
}

.pd-170 {
	padding-top: 17rem
}

.pd-120 {
	padding-top: 12rem
}

.pd-70 {
	padding-top: 7rem
}

.pd-180 {
	padding-top: 18rem
}

.mg-200 {
	margin-top: 20rem
}

.mg-50 {
	margin-top: 5rem
}

.mg-40 {
	margin-top: 4rem
}

.txt-upper {
	text-transform: uppercase
}

.media-tt {
	font-size: 4rem
}

@media screen and (max-width:1200px) {
	.media-tt {
		font-size: 2.4rem
	}
}

.text-desc-dc {
	font-size: 3.2rem;
	text-align: center
}

.text-desc-sm {
	font-size: 1.6rem;
	text-align: center;
	max-width: 45.4rem
}

@keyframes textLinear {
	100% {
		background-position: 300% center
	}
}

.text-gradient {
	background-image: linear-gradient(to right, #fecd1f, #f5851e, #f5851e, #fecd1f, #f5851e, #fecd1f);
	background-size: 150% auto;
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent
}

.text-gradient.fs-big {
	font-size: 4.8rem
}

@media screen and (max-width:1200px) {
	.text-gradient.fs-big {
		font-size: 3.2rem;
		line-height: 1.2
	}
}

@media screen and (max-width:768px) {
	.text-gradient.fs-big {
		font-size: 2.4rem
	}
}

@media screen and (max-width:576px) {
	.text-gradient.fs-big {
		font-size: 1.8rem
	}
}

.text-gradient.fs-normal {
	font-size: 4rem
}

@media screen and (max-width:1200px) {
	.text-gradient.fs-normal {
		font-size: 2.4rem
	}
}

@media screen and (max-width:768px) {
	.text-gradient.fs-normal {
		font-size: 1.8rem
	}
}

@media screen and (max-width:576px) {
	.text-gradient.fs-normal {
		font-size: 1.6rem
	}
}

.text-gradient.active {
	animation: textLinear 2s linear infinite
}

.text-gradient.text-gradient-link {
	transition: 1s;
	text-decoration: underline;
	cursor: pointer;
	display: inline-block;
	position: relative
}

@media screen and (min-width:1201px) {
	.text-gradient.text-gradient-link:hover {
		transform: scale(1.03)
	}
}

.text-gradient.text-gradient-link::before {
	content: "";
	position: absolute;
	bottom: .7rem;
	left: 0;
	width: 100%;
	height: .1rem;
	border-bottom: .2rem solid transparent;
	background: linear-gradient(269deg, #f5851e -2.58%, #fecd1f 104.94%)
}

@media screen and (max-width:1200px) {
	.text-gradient.text-gradient-link::before {
		bottom: -.2rem
	}
}

@media screen and (max-width:576px) {
	.text-gradient.text-gradient-link::before {
		border-width: .1rem
	}
}

.font-italic {
	font-style: italic
}

.txt-upper {
	text-transform: uppercase
}

.txt-white {
	color: #fff
}

.d-flex {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	-webkit-flex-wrap: wrap
}

.d-flex.a-start {
	align-items: flex-start;
	-webkit-align-items: flex-start
}

.d-flex.f-column {
	flex-direction: column
}

.d-flex.f-stretch {
	align-items: stretch;
	-webkit-align-items: stretch
}

.d-flex.f-between {
	justify-content: space-between;
	-webkit-justify-content: space-between
}

.d-flex.f-center {
	align-items: center;
	-ms-align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center
}

.d-flex.f-center.f-between {
	justify-content: space-between;
	-webkit-justify-content: space-between
}

.d-flex.f-start {
	justify-content: flex-start;
	-webkit-justify-content: flex-start
}

.d-flex.f-end {
	justify-content: flex-end;
	-webkit-justify-content: flex-end
}

.d-flex.f-ctn {
	width: calc(100% + 2.4rem);
	margin-left: -1.2rem
}

@media (max-width:1200px) {
	.d-flex.f-ctn {
		width: calc(100% + 1.5rem);
		margin-left: -.75rem
	}
}

@media (max-width:768px) {
	.d-flex.f-ctn {
		width: calc(100% + .8rem);
		margin-left: -.4rem
	}
}

.d-flex.f-nowrap {
	flex-wrap: nowrap;
	-webkit-flex-wrap: nowrap
}

.row-6 {
	width: calc(100% * (6 / 12));
	margin: 0 auto
}

@media screen and (max-width:1200px) {
	.row-6 {
		width: 80%
	}
}

@media screen and (max-width:500px) {
	.row-6 {
		width: 100%
	}
}

.col {
	padding: 0 1.2rem
}

@media (max-width:1200px) {
	.col {
		padding: 0 .75rem
	}
}

@media (max-width:768px) {
	.col {
		padding: 0 .4rem
	}
}

.col-1 {
	width: calc(100% / 12)
}

.col-2 {
	width: calc(100% * (2 / 12))
}

.col-3 {
	width: calc(100% * (3 / 12))
}

.col-4 {
	width: calc(100% * (4 / 12))
}

.col-5 {
	width: calc(100% * (5 / 12))
}

.col-6 {
	width: calc(100% * (6 / 12))
}

.col-7 {
	width: calc(100% * (7 / 12))
}

.col-8 {
	width: calc(100% * (8 / 12))
}

.col-9 {
	width: calc(100% * (9 / 12))
}

.col-10 {
	width: calc(100% * (10 / 12))
}

.col-11 {
	width: calc(100% * (11 / 12))
}

.col-12 {
	width: 100%
}

@keyframes hotline-movement {
	100% {
		background-position-x: 100%
	}
}

.wpcf7-not-valid-tip {
	direction: rtl
}

.use-floating-validation-tip .wpcf7-not-valid-tip {
	right: 1em
}

.wpcf7-list-item {
	margin: 0 1em 0 0
}

.wpcf7 .screen-reader-response {
	position: absolute;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	width: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
	word-wrap: normal !important
}

.wpcf7 form .wpcf7-response-output {
	margin: 2em .5em 1em;
	padding: .2em 1em;
	border: 2px solid #00a0d2
}

.wpcf7 form.init .wpcf7-response-output,
.wpcf7 form.resetting .wpcf7-response-output,
.wpcf7 form.submitting .wpcf7-response-output {
	display: none
}

.wpcf7 form.sent .wpcf7-response-output {
	border-color: #46b450
}

.wpcf7 form.aborted .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output {
	border-color: #dc3232
}

.wpcf7 form.spam .wpcf7-response-output {
	border-color: #f56e28
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
	border-color: #ffb900
}

.wpcf7-form-control-wrap {
	position: relative
}

.wpcf7-not-valid-tip {
	color: #dc3232;
	font-size: 1em;
	font-weight: 400;
	display: block
}

.use-floating-validation-tip .wpcf7-not-valid-tip {
	position: relative;
	top: -2ex;
	left: 1em;
	z-index: 100;
	border: 1px solid #dc3232;
	background: #fff;
	padding: .2em .8em;
	width: 24em
}

.wpcf7-list-item {
	display: inline-block;
	margin: 0 0 0 1em
}

.wpcf7-list-item-label::after,
.wpcf7-list-item-label::before {
	content: " "
}

.wpcf7-spinner {
	visibility: hidden;
	display: inline-block;
	background-color: #23282d;
	opacity: .75;
	width: 24px;
	height: 24px;
	border: none;
	border-radius: 100%;
	padding: 0;
	margin: 0 24px;
	position: relative
}

form.submitting .wpcf7-spinner {
	visibility: visible
}

.wpcf7-spinner::before {
	content: '';
	position: absolute;
	background-color: #fbfbfc;
	top: 4px;
	left: 4px;
	width: 6px;
	height: 6px;
	border: none;
	border-radius: 100%;
	transform-origin: 8px 8px;
	animation-name: spin;
	animation-duration: 1s;
	animation-timing-function: linear;
	animation-iteration-count: infinite
}

@media (prefers-reduced-motion:reduce) {
	.wpcf7-spinner::before {
		animation-name: blink;
		animation-duration: 2s
	}
}

@keyframes spin {
	from {
		transform: rotate(0)
	}

	to {
		transform: rotate(360deg)
	}
}

@keyframes blink {
	from {
		opacity: 0
	}

	50% {
		opacity: 1
	}

	to {
		opacity: 0
	}
}

.wpcf7 input[type=file] {
	cursor: pointer
}

.wpcf7 input[type=file]:disabled {
	cursor: default
}

.wpcf7 .wpcf7-submit:disabled {
	cursor: not-allowed
}

.wpcf7 input[type=email],
.wpcf7 input[type=tel],
.wpcf7 input[type=url] {
	direction: ltr
}

.wpcf7-reflection>output {
	display: list-item;
	list-style: none
}

.bakvitech-btn-shortcode {
	display: inline-block
}

.bakvitech-count-down-btn {
	outline: 0;
	border-radius: 0;
	font: inherit;
	cursor: pointer;
	color: #fff;
	padding: 5px 20px;
	-webkit-transition: .3s;
	transition: .3s;
	background: #f25b64;
	border: 1px solid #f25b64;
	display: block
}

.bakvitech-btn-shortcode .bakvitech-count-down-btn {
	color: #fff
}

.bakvitech-count-down-btn:focus,
.bakvitech-count-down-btn:hover {
	background: #fff;
	color: #f25b64;
	border: 1px solid #f25b64
}

.get-code .hidden-label {
	display: none
}

.get-code {
	cursor: pointer
}

.get-code.done:hover .code {
	display: none
}

.get-code.done:hover .hidden-label {
	display: inline
}

.hd-search {
	flex: 1;
	margin: 0;
	margin-left: 1.6rem;
	padding-left: .8rem;
	border-left: .1rem solid #e0e0e0;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	justify-content: flex-start;
	-webkit-justify-content: flex-start
}

@media screen and (max-width:1200px) {
	.hd-search {
		margin-left: 0;
		padding-left: 0;
		border-left: unset;
		flex: 0
	}
}

.hd-search.hd-search-mobile {
	display: none
}

@media screen and (max-width:1200px) {
	.hd-search.hd-search-mobile {
		display: block
	}
}

.hd-search-wrap {
	padding: .8rem;
	width: 4rem;
	height: 4rem;
	cursor: pointer;
	position: relative;
	border-radius: .6rem;
	transition: .3s
}

@media screen and (max-width:1200px) {
	.hd-search-wrap {
		width: 3.2rem;
		height: 3.2rem;
		background-color: #f7f7f7;
		border-radius: .2rem;
		padding: .5rem
	}
}

@media screen and (min-width:1201px) {
	.hd-search-wrap:hover {
		background-color: #f8f0ff
	}
}

.hd-search-icon {
	width: 100%;
	height: 100%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center
}

.hd-search-box {
	position: fixed;
	top: 10.2rem;
	transform: translateY(1rem);
	left: 0;
	width: 100%;
	z-index: 2;
	font-size: 1.6rem;
	color: #8b8b8b;
	pointer-events: none;
	opacity: 0;
	visibility: hidden;
	transition: .3s linear
}

@media screen and (max-width:1200px) {
	.hd-search-box {
		top: 7.2rem;
		width: 100%
	}
}

@media screen and (max-width:850px) {
	.hd-search-box {
		font-size: 1.5rem
	}
}

.hd-search-box.active {
	opacity: 1;
	visibility: visible;
	transform: translateY(0)
}

.hd-search-box.active .hd-search-box-wrap {
	pointer-events: auto
}

.hd-search-box .container {
	max-width: 144.6rem
}

.hd-search-box-wrap {
	width: 41.6666666667%;
	margin-left: auto;
	background-color: #fff;
	border-radius: .8rem;
	padding: .8rem;
	box-shadow: 0 1.6rem 4rem -1rem rgba(50, 50, 93, .32), 0 .8rem 2.4rem -1.5rem rgba(0, 0, 0, .24), inset 0 .1rem .1rem rgba(255, 255, 255, .1)
}

@media screen and (max-width:1200px) {
	.hd-search-box-wrap {
		width: 50%
	}
}

@media screen and (max-width:850px) {
	.hd-search-box-wrap {
		width: 100%
	}
}

.hd-search-form {
	position: relative
}

.hd-search-form.hasValue .hd-search-form-remove {
	opacity: 1
}

.hd-search-form .form {
	flex: 1
}

.hd-search-form .form input {
	background-color: #fff;
	transition: .3s;
	height: 4.8rem;
	border: .1rem solid #e0e0e0;
	border-radius: .6rem
}

@media screen and (max-width:450px) {
	.hd-search-form .form input {
		height: 3.6rem
	}
}

.hd-search-form .form .search-btn {
	position: absolute;
	top: 0;
	left: 0;
	width: 4.8rem;
	max-width: 4.8rem;
	flex-shrink: 0;
	border-right: 0;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	padding: 0 !important;
	background: url("../assets/images/header/icon-search.svg") no-repeat;
	background-size: 2.4rem 2.4rem;
	background-position: center
}

@media screen and (max-width:450px) {
	.hd-search-form .form .search-btn {
		width: 3.6rem;
		background-size: 1.6rem 1.6rem
	}
}

@media screen and (min-width:1201px) {
	.hd-search-form .form .search-btn:hover {
		background: url("../assets/images/header/icon-search-pri.svg") no-repeat rgba(0, 0, 0, .04);
		background-size: 2.4rem 2.4rem;
		background-position: center
	}
}

@media screen and (min-width:1201px) and (max-width:450px) {
	.hd-search-form .form .search-btn:hover {
		background-size: 1.6rem 1.6rem
	}
}

.hd-search-form .form .search-key {
	width: calc(100% - 4.8rem);
	margin-left: auto;
	border-left: 0;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
	padding-right: 5.6rem;
	color: #3a3a3a;
	font-weight: 500
}

@media screen and (max-width:450px) {
	.hd-search-form .form .search-key {
		width: calc(100% - 3.6rem);
		padding-left: .8rem;
		padding-right: 4.8rem
	}
}

.hd-search-form .form .search-key::placeholder {
	display: block;
	font-size: 1.6rem;
	font-weight: 400
}

@media screen and (max-width:450px) {
	.hd-search-form .form .search-key::placeholder {
		font-size: 1.4rem
	}
}

.hd-search-form .form .search-key:focus {
	border-color: #7c0fd1
}

.hd-search-form .form .search-key:focus~.search-btn {
	border-color: #7c0fd1;
	background: url("../assets/images/header/icon-search-pri.svg") no-repeat;
	background-size: 2.4rem 2.4rem;
	background-position: center
}

@media screen and (max-width:450px) {
	.hd-search-form .form .search-key:focus~.search-btn {
		background-size: 1.6rem 1.6rem
	}
}

@media screen and (min-width:1201px) {
	.hd-search-form .form .search-key:focus~.search-btn:hover {
		background: url("../assets/images/header/icon-search-pri.svg") no-repeat rgba(0, 0, 0, .04);
		background-size: 2.4rem 2.4rem;
		background-position: center
	}
}

@media screen and (min-width:1201px) and (max-width:450px) {
	.hd-search-form .form .search-key:focus~.search-btn:hover {
		background-size: 1.6rem 1.6rem
	}
}

.hd-search-form-remove {
	position: absolute;
	top: 50%;
	right: 1.6rem;
	transform: translateY(-50%);
	transition: .3s;
	opacity: 0;
	font-weight: 500
}

@media screen and (max-width:450px) {
	.hd-search-form-remove {
		right: 1rem
	}
}

@media screen and (min-width:1201px) {
	.hd-search-form-remove:hover {
		color: #7c0fd1
	}
}

.hd-search-history {
	padding: 1.6rem;
	margin-top: .8rem
}

@media screen and (max-width:850px) {
	.hd-search-history {
		padding: .8rem 0
	}
}

.hd-search-history-list {
	margin-top: -.8rem
}

.hd-search-history-list .suggest-item {
	padding-right: 4.2rem !important
}

.hd-search-history-list .suggest-item .history-remove {
	position: absolute;
	right: .8rem;
	top: 50%;
	transform: translateY(-50%);
	transition: .3s;
	font-weight: 400;
	font-size: 1.4rem
}

@media screen and (min-width:1201px) {
	.hd-search-history-list .suggest-item .history-remove:hover {
		color: #7c0fd1
	}
}

.hd-search-suggest:not(:last-child) {
	margin-bottom: 2.4rem
}

.hd-search-suggest-item:not(:last-child) {
	margin-bottom: 1.6rem
}

.hd-search-suggest .label {
	font-weight: 600
}

.hd-search-suggest .suggest-list {
	margin-top: .8rem
}

.hd-search-suggest .suggest-item {
	padding: .8rem;
	margin-bottom: .2rem;
	align-items: center;
	-webkit-align-items: center;
	line-height: 1.2;
	transition: .3s;
	border-radius: .6rem;
	position: relative
}

@media screen and (max-width:450px) {
	.hd-search-suggest .suggest-item {
		padding-left: 1.2rem
	}
}

@media screen and (min-width:1201px) {
	.hd-search-suggest .suggest-item:hover {
		background-color: rgba(0, 0, 0, .04)
	}
}

.hd-search-suggest .suggest-item .icon {
	flex-shrink: 0;
	width: 1.6rem;
	height: 1.6rem;
	margin-right: .8rem;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center
}

.hd-search-suggest .suggest-item .name {
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden
}

@media screen and (max-width:1200px) {
	.hd-bar {
		margin-left: 1.2rem
	}
}

@media screen and (max-width:450px) {
	.hd .bakvitech-logo {
		width: 80%
	}

	.hd .bakvitech-logo img {
		content: url("../assets/images/header/bakvitech-logo-less.svg")
	}
}

.sec-com {
	--padding-section: 8rem;
	--padding-section-tl: 4.8rem;
	--padding-section-mobile: 2.4rem;
	padding: var(--padding-section) 0
}

@media screen and (max-width:1200px) {
	.sec-com {
		padding: var(--padding-section-tl) 0
	}
}

@media screen and (max-width:576px) {
	.sec-com {
		padding: var(--padding-section-mobile) 0
	}
}

.sec-com-bg {
	background-color: var(--digitalDeepColor);
	color: #fff;
	overflow: hidden
}

.sec-com-header {
	position: relative;
	z-index: 5
}

.sec-com-logo {
	height: 2.5rem;
	margin-bottom: 3.2rem
}

@media screen and (max-width:1200px) {
	.sec-com-logo {
		margin-bottom: 1.6rem
	}
}

.sec-com-logo .link {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	width: 100%;
	height: 100%
}

.sec-com-logo .link img {
	object-fit: contain
}

.sec-com-tt {
	font-size: 4rem;
	font-weight: 700;
	line-height: 1.3
}

@media screen and (max-width:1727px) {
	.sec-com-tt {
		font-size: 3.2rem
	}
}

@media screen and (max-width:1200px) {
	.sec-com-tt {
		font-size: 2.4rem
	}
}

.sec-com-desc-ar {
	--sec-com-desc-ar: #3E036C;
	padding: 3rem 3.8rem;
	background-color: var(--sec-com-desc-ar);
	color: #fff;
	text-align: center;
	font-size: 2.4rem;
	border-radius: 2.4rem;
	border: .2rem solid rgba(255, 255, 255, .2);
	position: relative
}

.sec-com-tt-sub {
	font-size: 3.2rem;
	font-weight: 600
}

@media screen and (max-width:1727px) {
	.sec-com-tt-sub {
		font-size: 2.4rem
	}
}

@media screen and (max-width:1200px) {
	.sec-com-tt-sub {
		font-size: 1.8rem
	}
}

.sec-com-desc-ar.has-arrow::before {
	content: '';
	position: absolute;
	bottom: 0;
	right: 14%;
	transform: translateY(100%);
	width: 3.2rem;
	height: 2.4rem;
	background: url("../assets/images/dvs/sec-com-desc-ar.png") no-repeat;
	background-size: contain;
	background-position: center
}

img {
	vertical-align: middle
}

.sec-com-frame {
	position: relative;
	padding: 15.5rem 0
}

.sec-com-frame-item {
	position: absolute;
	width: 100%
}

.sec-com-frame-item-top {
	top: 0
}

.sec-com-frame-item-bottom {
	bottom: 0
}

.sec-com-frame-item-bottom .sec-com-frame-ani-left {
	top: -88%;
	left: 2%
}

.sec-com-frame-item-bottom .sec-com-frame-ani-right {
	top: -88%;
	right: 2%
}

@keyframes frame-ani {
	100% {
		offset-distance: 100%
	}
}

.sec-com-frame-ani {
	position: absolute;
	mix-blend-mode: color-dodge;
	width: 15%
}

.sec-com-frame-ani-left {
	left: 0;
	top: -107%
}

.sec-com-frame-ani-right {
	right: 0;
	top: -107%
}

.sec-com-frame-ani-mid {
	left: 50%;
	top: 5%;
	transform: translateX(-50%);
	width: 70%
}

img {
	vertical-align: middle
}

.font-bebas {
	font-family: 'Bebas Neue'
}

.hl-host {
	color: #1ec0f2
}

.txt-bg-wrap {
	display: flex;
	justify-content: flex-start;
	flex-direction: column;
	width: max-content
}

@media screen and (max-width:600px) {
	.txt-bg-wrap {
		width: 100%;
		max-width: max-content
	}
}

.txt-bg-wrap.txt-saying {
	font-family: "SVN-Just Saying", sans-serif;
	font-size: 3.2rem;
	line-height: 1.2
}

@media only screen and (max-width:1200px) {
	.txt-bg-wrap.txt-saying {
		font-size: 2.7rem
	}
}

@media only screen and (max-width:800px) {
	.txt-bg-wrap.txt-saying {
		font-size: 2.2rem
	}
}

.bg-big {
	padding: 4.8rem;
	background: linear-gradient(100.87deg, #ffa318 -38.94%, #f7851c 44.05%, #f31f10 132.4%);
	border-radius: 2.4rem;
	font-size: 3.2rem;
	width: 83.3333333333%;
	margin: 0 auto
}

@media screen and (max-width:1200px) {
	.bg-big {
		font-size: 2.4rem;
		border-radius: 1.6rem
	}
}

@media screen and (max-width:900px) {
	.bg-big {
		width: 100%;
		font-size: 1.8rem
	}
}

@media screen and (max-width:768px) {
	.bg-big {
		padding: 2.4rem;
		border-radius: 1.6rem;
		font-size: 1.6rem
	}
}

.bg-big-txt {
	margin-bottom: 2.4rem
}

.bg-big-txt:last-child {
	margin-bottom: 0
}

.txt-t {
	width: 5rem
}

@media screen and (max-width:768px) {
	.txt-t {
		width: 2.4rem
	}
}

.bg-nhtq {
	background-color: #f5851e
}

.bg-host {
	background-color: #1ec0f2
}

.bg-software {
	background-color: #2686ec
}

.bg-digital {
	background-color: #7c0fd1
}

.bg-lms {
	background-color: #f41e92
}

.bg-red {
	background-color: #e01507
}

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

.txt-digital {
	color: #7c0fd1
}

.txt-lms {
	color: #f41e92
}

.txt-nhtq {
	color: #f5851e
}

.txt-host {
	color: #1ec0f2
}

.txt-ita {
	font-style: italic
}

.txt-respon {
	padding: 3.2rem 5.4rem;
	border-radius: 1.6rem;
	background-color: #f9f1ff;
	max-width: 73.7rem;
	margin: 0 auto;
	margin-bottom: 2.4rem
}

@media screen and (max-width:1200px) {
	.txt-respon {
		padding: 1.6rem 2.4rem;
		border-radius: .8rem
	}
}

.txt-logo-flex {
	display: flex;
	justify-content: center;
	align-items: center
}

.txt-logo-flex .logo,
.txt-logo-flex img {
	height: 6.8rem;
	width: max-content;
	max-width: 100%;
	margin-left: 1.6rem;
	margin-right: 1.6rem;
	object-fit: contain
}

.sec-sub-bg {
	width: max-content;
	margin: 0 auto;
	margin-bottom: 1rem;
	padding: .8rem 3rem;
	position: relative;
	-webkit-mask-image: url("../assets/images/dvs/sec-sub-bg-lms.png");
	mask-image: url("../assets/images/dvs/sec-sub-bg-lms.png");
	-webkit-mask-size: cover;
	mask-size: cover;
	mask-position: bottom;
	-webkit-mask-position: bottom;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	font-size: 2.4rem;
	font-weight: 500;
	font-style: italic;
	color: #fff
}

@media only screen and (max-width:1200px) {
	.sec-sub-bg {
		font-size: 2rem
	}
}

@media only screen and (max-width:800px) {
	.sec-sub-bg {
		font-size: 1.7rem
	}
}

.txt-quote {
	max-width: max-content
}

.txt-quote.w_290 .txt-quote-wrap {
	width: 29rem
}

@media screen and (max-width:1200px) {
	.txt-quote.w_290 .txt-quote-wrap {
		width: 14rem
	}
}

.txt-quote.w_290 .txt-quote-wrap .txt {
	color: #3a3a3a;
	top: 3.2rem;
	left: 50%;
	transform: translateX(-50%) rotate(4.38deg)
}

@media screen and (max-width:1200px) {
	.txt-quote.w_290 .txt-quote-wrap .txt {
		top: 1.2rem;
		padding: 0 1.2rem
	}
}

.txt-quote.w_596 .txt-quote-wrap {
	width: 59.6rem;
	font-size: 3.2rem
}

@media screen and (max-width:1200px) {
	.txt-quote.w_596 .txt-quote-wrap {
		font-size: 1.5rem;
		width: 30rem
	}
}

.txt-quote.w_596 .txt-quote-wrap .txt {
	color: #3a3a3a;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%) rotate(-13deg)
}

.txt-quote-wrap {
	width: 42.4rem;
	position: relative;
	font-size: 2.4rem;
	text-align: center;
	color: #8b8b8b
}

@media only screen and (max-width:1200px) {
	.txt-quote-wrap {
		font-size: 2rem
	}
}

@media only screen and (max-width:800px) {
	.txt-quote-wrap {
		font-size: 1.7rem
	}
}

@media screen and (max-width:1200px) {
	.txt-quote-wrap {
		font-size: 1.5rem;
		width: 30rem
	}
}

@media screen and (max-width:768px) {
	.txt-quote-wrap {
		font-size: 1.3rem;
		width: 25rem
	}
}

.txt-quote-wrap .txt {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	left: 47%;
	top: 3.6rem;
	transform: translateX(-50%) rotate(-2.69deg);
	width: 100%;
	padding: 0 4.2rem;
	z-index: 2;
	overflow: hidden
}

@media screen and (max-width:768px) {
	.txt-quote-wrap .txt {
		padding: 0 2.4rem;
		top: 2.4rem
	}
}

@media screen and (min-width:1201px) {
	.txt-quote-wrap .txt-ani {
		opacity: 0;
		transform: translateY(100%);
		transition: .7s linear
	}

	.txt-quote-wrap .txt-ani.active {
		opacity: 1;
		transform: translateY(0)
	}
}

.mg-auto {
	margin-left: auto;
	margin-right: auto
}

.btn.btn-big {
	font-size: 3.2rem;
	border-radius: 1.2rem;
	background: var(--gradient-button, linear-gradient(130deg, #ffa318 0, #f6851c 48.44%, #f31f10 100%));
	box-shadow: 0 0 13.748148918151855px 0 #f5851e;
	line-height: 1.5
}

@media screen and (max-width:850px) {
	.btn.btn-big {
		font-size: 2.4rem
	}
}

@media screen and (max-width:600px) {
	.btn.btn-big {
		font-size: 1.6rem
	}
}

.show-on-sp {
	display: none
}

.show-on-pc {
	display: block
}

@media screen and (max-width:1200px) {
	.show-on-sp {
		display: block
	}

	.show-on-pc {
		display: none
	}
}

.c-btn {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	white-space: nowrap;
	gap: .8rem;
	padding: 1.6rem 3.2rem;
	font-size: 1.8rem;
	font-weight: 700;
	background-color: #f5851e;
	color: #fff;
	border-radius: .8rem;
	overflow: hidden;
	cursor: pointer;
	position: relative
}

.c-btn>* {
	position: relative;
	z-index: 2
}

.c-btn.ln-orange {
	background: linear-gradient(100.87deg, #ffa318 -38.94%, #f7851c 44.05%, #f31f10 132.4%)
}

.c-btn::after {
	position: absolute;
	content: "";
	width: 0;
	height: 100%;
	top: 0;
	right: 0;
	background: #fff;
	transition: all .4s ease;
	z-index: 1;
	pointer-events: none
}

@media screen and (min-width:1201px) {
	.c-btn:hover {
		color: #f5851e
	}

	.c-btn:hover::after {
		left: 0;
		width: 100%
	}
}

@media screen and (max-width:600px) {
	.c-btn {
		white-space: normal
	}
}

iframe {
	vertical-align: middle
}

.txt-border-style {
	padding: 1.6rem 4rem;
	border-radius: .4rem;
	border: 1.5px dashed var(--primary-bakvitech-lms-main, #f41e92);
	background: var(--primary-bakvitech-lms-10, #ffe3f2);
	font-size: 3.2rem;
	text-align: center;
	color: #f41e92;
	max-width: max-content
}

@media screen and (max-width:1200px) {
	.txt-border-style {
		font-size: 1.8rem;
		padding: 1.2rem 2.4rem
	}
}

.shpar-mess {
	position: absolute;
	opacity: 0;
	left: 0;
	width: 100%
}

@media screen and (max-width:600px) {
	.sec-com-frame {
		padding: 8rem 0
	}
}

.select2-container--default .select2-selection--single {
	border-radius: unset;
	border: unset;
	background-color: transparent;
	border-bottom: .1rem solid #e0e0e0;
	height: auto
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
	padding: 0;
	padding: 1.2rem 0;
	font-size: 1.4rem;
	color: #3a3a3a;
	line-height: 1.5
}

.select2-container--default .select2-selection--single .select2-selection__placeholder {
	color: #5f5f5f
}

.select2-dropdown {
	border: unset;
	overflow: hidden
}

.select2-container--open .select2-dropdown--below {
	border-radius: .8rem;
	box-shadow: .1rem .1rem 1rem #7c0fd1
}

.select2-container--default .select2-search--dropdown .select2-search__field {
	border-radius: .4rem
}

.select2-container--default .select2-results__option--selected {
	background-color: #7c0fd1;
	color: #fff
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
	background-color: #a32dff
}

.select2-results__option {
	font-size: 1.4rem;
	line-height: 1.5
}

.select2-results__option--selectable {
	transition: .2s
}

.notis {
	position: fixed;
	bottom: 1.5rem;
	left: 1.5rem;
	z-index: 50;
	width: 25rem;
	height: 25rem;
	display: flex;
	align-items: flex-end
}

.notis-icon {
	width: 6rem;
	height: 6rem;
	position: relative;
	border-radius: .8rem;
	background-color: #000;
	border: .3rem solid #5f5f5f;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	position: relative;
	cursor: pointer
}

@media screen and (max-width:767px) {
	.notis-icon {
		width: 7rem;
		height: 7rem
	}
}

.notis-icon video {
	width: 4rem;
	height: 4rem
}

@media screen and (max-width:767px) {
	.notis-icon video {
		width: 3rem;
		height: 3rem
	}
}

.notis .notis-list {
	position: absolute;
	bottom: 7rem;
	min-width: 26.5rem;
	max-width: 26.5rem;
	transition: .2s ease-in-out
}

.notis.hide {
	pointer-events: none
}

.notis.hide .notis-icon {
	pointer-events: auto
}

.notis-list.hide {
	opacity: 0;
	visibility: hidden;
	transform: translateX(-120%);
	pointer-events: none
}

.notis-item {
	padding: .8rem;
	border-radius: .8rem;
	background-color: rgba(58, 58, 58, .8)
}

.notis-item.c-animated {
	animation: fadeInLeft .3s ease-in-out
}

.notis-item:not(:first-child) {
	margin-top: .8rem
}

.notis-item.media {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	align-items: center
}

.notis-item.media .notis-title {
	font-weight: 400;
	color: #e0e0e0;
	padding-left: 0;
	-webkit-line-clamp: 2
}

.notis-item.media .notis-title::before {
	display: none
}

.notis-item.media .notis-title span {
	font-weight: 700;
	color: #fff
}

.notis-item.media .notis-content {
	margin-left: 1rem
}

.notis-item.hide {
	transform: translateY(-5rem);
	opacity: 0;
	transition: .8s ease-in-out
}

.notis-img {
	width: 6.4rem;
	height: 4.8rem;
	border-radius: .8rem;
	flex-shrink: 0;
	display: block;
	position: relative;
	overflow: hidden
}

.notis-img:has(i)::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(0deg, rgba(0, 0, 0, .4), rgba(0, 0, 0, .4))
}

.notis-img i {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #fff
}

.notis-title {
	font-size: 1.4rem;
	font-weight: 700;
	color: #fff;
	padding-left: 1.4rem;
	display: inline-block;
	position: relative;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	transition: .3s ease-in-out
}

.notis-title span {
	transition: .3s ease-in-out
}

@media (hover:hover) {
	.notis-title:hover {
		color: #f5851e !important
	}

	.notis-title:hover span {
		color: #f5851e !important
	}
}

.notis-title::before {
	content: "";
	width: .8rem;
	height: .8rem;
	border-radius: 100rem;
	background-color: #14ef6c;
	display: inline-block;
	vertical-align: middle;
	margin-right: .4rem;
	position: absolute;
	left: 0;
	top: .6rem
}

.notis-des {
	font-size: 1.4rem;
	color: #e0e0e0;
	padding-left: 1.4rem;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden
}

.notis {
	z-index: 150;
	bottom: 3rem;
	transition: .3s ease-in-out
}

.notis.notis-hidden {
	transform: scale(0);
	opacity: 0;
	visibility: hidden
}

.notis.hide .notis-list {
	transform: translateX(-100%);
	opacity: 0;
	visibility: hidden;
	pointer-events: none
}

.notis.hide .notis-icon-song {
	display: none
}

.notis.hide .notis-icon-img {
	transform: rotate(90deg) !important
}

@media screen and (max-width:550px) {
	.notis {
		bottom: 1.5rem
	}
}

.notis-icon {
	position: relative;
	width: 6rem;
	height: 6rem
}

.notis-icon-img {
	width: 2.8rem;
	position: relative;
	transition: .5s ease-in-out;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center
}

@media screen and (max-width:550px) {
	.notis-icon-img {
		width: 2.5rem
	}
}

.notis-icon-img>img {
	object-fit: contain;
	object-position: center
}

.notis-icon-song {
	position: absolute;
	left: 85%;
	top: 11.5%;
	height: 65%;
	width: 1.2rem
}

.notis-icon-song img {
	object-fit: contain;
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0
}

.notis-icon.c-animated .notis-icon-img {
	transform: rotate(-45deg)
}

.notis-icon.c-animated .notis-icon-song img:nth-child(1) {
	animation: song-1 2.5s ease-out infinite both .5s
}

.notis-icon.c-animated .notis-icon-song img:nth-child(2) {
	animation: song-2 2.5s ease-out infinite both .5s
}

.notis-icon.c-animated .notis-icon-song img:nth-child(3) {
	animation: song-3 2.5s ease-out infinite both .5s
}

@keyframes song-1 {
	0% {
		transform: translate3d(0, 0, 0) scale(1);
		opacity: 1
	}

	100%,
	50% {
		transform: translate3d(5px, 0, 0) scale(2);
		opacity: 0
	}
}

@keyframes song-2 {

	0%,
	19% {
		opacity: 0
	}

	20% {
		transform: translate3d(0, 0, 0) scale(1);
		opacity: 1
	}

	100%,
	70% {
		transform: translate3d(5px, 0, 0) scale(2);
		opacity: 0
	}
}

@keyframes song-3 {

	0%,
	39% {
		opacity: 0
	}

	40% {
		transform: translate3d(0, 0, 0) scale(1);
		opacity: 1
	}

	100%,
	90% {
		transform: translate3d(5px, 0, 0) scale(2);
		opacity: 0
	}
}

@media screen and (max-width:550px) {
	.notis-icon {
		width: 5rem;
		height: 5rem
	}
}

.notis-number {
	position: absolute;
	width: 2rem;
	height: 2rem;
	font-size: 1.2rem;
	border-radius: 100rem;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	color: #fff;
	background-color: #f41e92;
	top: -1rem;
	right: -1rem
}

.notis-list {
	max-width: 24.5rem;
	min-width: 24.5rem
}

.notis-item.hides {
	animation: backOutLeft 2s forwards
}

.notis-img img {
	width: 100% !important;
	height: 100% !important
}

.notis-title {
	font-weight: 400;
	font-size: 1.2rem
}

.notis-title::before {
	top: .5rem
}

@media screen and (max-width:550px) {
	.notis-title {
		font-size: 1.2rem;
		font-weight: 600
	}
}

.notis-title p {
	display: inline
}

@media screen and (max-width:550px) {
	.notis-des {
		font-size: 1.2rem
	}

	.notis {
		height: 22rem
	}

	.notis-list {
		bottom: 6rem
	}
}

@media screen and (max-width:1200px) {
	.web-bakvitechblog .notis {
		bottom: 11%
	}
}

@media screen and (max-width:650px) {
	.web-bakvitechblog .notis {
		bottom: 15%
	}
}

.notis-item.media .notis-title {
	color: #fff
}

.blog-info-tag span:before {
	content: ",";
	position: absolute;
	bottom: 6px;
	right: 0;
	height: 100%;
	font-size: 16px;
	width: auto;
	padding-right: 5px
}

.blog-info-tag span {
	position: relative;
	display: inline-block;
	padding-right: 10px
}

.blog-info-tag span:last-child:before {
	display: none
}

.zalo-chat-widget {
	bottom: 94px !important;
	right: 26px !important;
	z-index: 20 !important
}

.sidebar-blog-detail-right.widget_media_image {
	margin-bottom: 2.4rem;
	border-radius: 1.2rem;
	overflow: hidden
}

.sidebar-blog.widget_media_image {
	margin-bottom: 2.4rem;
	border-radius: 1.2rem;
	overflow: hidden
}

.wpcf7 form .wpcf7-response-output {
	border: 0;
	margin: 15px 0;
	padding: 0;
	font-weight: 700;
	font-size: 12px
}

.wpcf7 form.sent .wpcf7-response-output {
	color: #46b450
}

.wpcf7 form.invalid .wpcf7-response-output {
	color: red
}

#wpcf7-6515f8495e935-wrapper,
#wpcf7-651d5279d7d22-wrapper,
#wpcf7-651d527a0db81-wrapper,
#wpcf7-651d527a120b6-wrapper,
#wpcf7-651d527a121cb-wrapper {
	display: none !important;
	visibility: hidden !important
}

.ft-license-col .widget_nav_menu .bakvitech-head-title.bakvitech-widget-title {
	display: none
}

.ft-license-col .widget_nav_menu ul {
	justify-content: flex-end;
	-webkit-justify-content: flex-end;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	-webkit-flex-wrap: wrap
}

@media screen and (max-width:768px) {
	.ft-license-col .widget_nav_menu ul {
		justify-content: flex-start;
		-webkit-justify-content: flex-start
	}
}

.ft-license-col .widget_nav_menu ul li {
	padding: .4rem 2rem
}

.ft-col .widget_nav_menu .bakvitech-head-title.bakvitech-widget-title {
	font-size: 1.8rem;
	font-weight: 600;
	color: #7c0fd1
}

@media screen and (max-width:1200px) {
	.ft-col .widget_nav_menu .bakvitech-head-title.bakvitech-widget-title {
		font-size: 1.6rem
	}
}

.solution-col .ft-col.col.col-6 {
	width: 50%
}

@media screen and (max-width:360px) {
	.solution-col .ft-col.col.col-6 {
		width: 100%
	}
}

.ft-col .widget_nav_menu ul {
	margin-top: 1.6rem
}

.ft-col .widget_nav_menu ul li.current-menu-item a {
	font-weight: 600;
	color: #f58635
}

.ft-col .widget_nav_menu ul li a {
	display: block;
	padding: .8rem 0;
	transition: .3s
}

.ft-col.col-6 .hd-menu-info>* {
	align-items: center
}

.blog-large-content .bakvitech-content>* {
	color: #5f5f5f
}

.blog-large-content .bakvitech-content .specifies {
	color: #7c0fd1 !important
}

.blog-large-content .bakvitech-content ol,
.blog-large-content .bakvitech-content ul {
	padding-left: 0
}

.blog-large-content .hr-box.hr-idea img {
	height: 100%
}

.blog-large-content .hr-box.hr-idea .hr-box-img {
	transform: unset
}

.blog-large-content .hr-box.hr-idea .hr-box-img-ab {
	top: 0
}

.blog-large-content .bakvitech-content blockquote {
	background: #f7f7f7;
	border-radius: .8rem;
	color: #5f5f5f;
	border-left: 1rem solid #7c0fd1;
	padding: 2.64rem 3.6rem;
	transition: .3s ease-in-out
}

.blog-large-content .bakvitech-content blockquote:hover {
	border-left-color: #f5851e;
	background: #ffeedf
}

.blog-large-content .bakvitech-content blockquote:hover a {
	color: #f5851e !important
}

.blog-large-content .bakvitech-content blockquote strong {
	color: #3a3a3a;
	font-size: 1.8rem
}

@media only screen and (max-width:1200px) {
	.blog-large-content .bakvitech-content blockquote strong {
		font-size: 1.6rem
	}
}

.blog-large-content .bakvitech-content img+h2,
.blog-large-content .bakvitech-content img+h3,
.blog-large-content .bakvitech-content img+h4 {
	margin-top: 2.6rem
}

.blog-large-content .bakvitech-content h2 {
	margin: 2.4rem 0;
	font-size: 4rem;
	font-weight: 700;
	color: #7c0fd1
}

.blog-large-content .bakvitech-content h3 {
	margin: 2.4rem 0;
	font-size: 2.4rem;
	font-weight: 600;
	color: #7c0fd1
}

.blog-large-content .bakvitech-content h4 {
	margin: 2.4rem 0;
	font-weight: 600;
	color: #7c0fd1;
	font-size: 1.125em
}

.blog-large-content .hr-box-btn a,
.blog-large-content .hr-box>* {
	color: #fff !important
}

@media only screen and (min-width:1201px) {
	.blog-large-content.bakvitechWithoutAsideBlog {
		width: calc(100% / 12 * 9)
	}
}

@media only screen and (max-width:1200px) {
	.blog-large-content .bakvitech-content h3 {
		margin-top: 2.4rem;
		margin-bottom: .8rem;
		font-size: 2rem
	}

	.blog-large-content .bakvitech-content h2 {
		margin-top: 2.4rem;
		margin-bottom: .8rem;
		font-size: 2.4rem
	}

	.blog-large-content .bakvitech-content h4 {
		margin-bottom: .8rem
	}

	.blog-large-content .bakvitech-content blockquote {
		margin: 2.4rem 0
	}
}

@media only screen and (max-width:800px) {
	.blog-large-content .bakvitech-content h3 {
		font-size: 1.7rem
	}

	.blog-large-content .bakvitech-content h2 {
		font-size: 3rem
	}

	.blog-large-content .bakvitech-content blockquote {
		padding: 1.2rem 1.6rem
	}
}

.widget.sidebar-blog-detail.toc_widget .bakvitech-head-title.bakvitech-widget-title {
	display: none
}

.widget.sidebar-blog-detail.toc_widget span.toc_number {
	display: none
}

.widget.sidebar-blog-detail.toc_widget ul li a {
	display: block;
	padding: 1rem 0;
	opacity: 1;
	cursor: pointer;
	transition: .3s;
	position: relative;
	font-weight: 400;
	font-size: 1.6rem;
	color: #354a60
}

.widget.sidebar-blog-detail.toc_widget ul li a::before {
	content: "";
	position: absolute;
	left: -2.4rem;
	height: 100%;
	transition: .3s;
	opacity: 0;
	width: .2rem;
	background: #7c0fd1;
	height: 0;
	top: 50%;
	transform: translateY(-50%);
	transition: .3s ease-in-out
}

.widget.sidebar-blog-detail.toc_widget ul li a.current::before {
	height: 100%;
	opacity: 1
}

.widget.sidebar-blog-detail.toc_widget ul li a.current {
	color: #7c0fd1;
	font-weight: 500
}

.inspiration-img .img img {
	height: 100%;
	width: 100%
}

.wpcf7-not-valid-tip {
	position: absolute
}

.wpcf7-response-output {
	position: absolute
}

.wpcf7-spinner {
	position: absolute
}

.blogr-regis .blogr-regis-control .wpcf7-not-valid-tip {
	left: 20px;
	font-size: 10px;
	font-weight: 700;
	bottom: -20px
}

.blogr-regis .blogr-regis-control .btn-submit {
	position: relative
}

.blogr-regis .blogr-regis-control .wpcf7-spinner {
	bottom: 15px;
	left: -70px
}

@media only screen and (max-width:1200px) {
	.blogr-regis .blogr-regis-control .wpcf7-spinner {
		bottom: 15px
	}
}

@media only screen and (max-width:550px) {
	.blogr-regis .blogr-regis-control .wpcf7-spinner {
		bottom: 10px
	}
}

.bakvitechCategorySearchingTagJS {
	cursor: pointer
}

.aside-body-item.asideActive {
	opacity: 1;
	color: #f58635
}

.banner-blog-info .info-name .avt {
	border-radius: unset
}

.blog-large-author .author-header .avt {
	border-radius: unset
}

.bakvitech-mess-empty {
	text-align: center;
	font-size: 2rem
}

.form-cus textarea {
	height: 10rem
}

.bakvitech-hiden {
	display: none
}

.blogt-content .description.bakvitech-content {
	color: #5f5f5f
}

.btn-hidden-submit {
	display: none
}

.blogr-regis .blogr-regis-gr .inner::before {
	z-index: 10
}

.blogr-regis .wpcf7 {
	width: 100%
}

.blogr-regis .blogr-regis-form {
	margin: auto
}

.blogr-regis .wpcf7 form.invalid .wpcf7-response-output {
	text-align: center;
	width: 100%;
	margin: 1rem 0
}

.blogr-regis .wpcf7 form.sent .wpcf7-response-output {
	color: #46b450;
	text-align: center;
	width: 100%;
	margin: 1rem 0
}

.seoadv-form .wpcf7-form {
	position: relative
}

.seoadv-form .seoadv-buttons {
	position: relative;
	margin-bottom: 1rem
}

.seoadv-form .wpcf7-spinner {
	right: -1%;
	bottom: 50%;
	transform: translateY(50%);
	z-index: 10
}

.seoadv-form .wpcf7-not-valid-tip {
	position: absolute;
	font-size: 10px;
	font-weight: 700;
	right: 0;
	bottom: -1.5rem
}

.seoadv-form .wpcf7-response-output {
	margin: 1rem 0 !important;
	padding: 0 !important;
	text-align: center;
	bottom: -30px;
	width: 100%;
	font-size: 10px !important
}

.seoadv-form .wpcf7-form-control-wrap {
	position: relative;
	width: 100%
}

.blogf-menu-item.active .blogf-menu-link {
	color: #f5851e
}

.blogf-menu-item.active .blogf-menu-link::before {
	height: 3.6rem
}

.blogrc2-form .blogrc2-submit {
	position: relative
}

.blogrc2-form .wpcf7-spinner {
	left: -50px;
	bottom: 50%;
	transform: translateY(50%);
	z-index: 10;
	margin: 0
}

@media only screen and (max-width:1200px) {
	.blogrc2-form .wpcf7-spinner {
		bottom: 50%;
		transform: translateY(50%)
	}
}

.blogrc2-form .wpcf7-not-valid-tip {
	font-size: 10px;
	font-weight: 700;
	bottom: -25px
}

.blogrc2-form .wpcf7-response-output {
	width: 100%;
	text-align: center;
	margin: 1rem 0 !important;
	font-size: 10px !important
}

.blogt-wrap.searching-wrapper {
	min-height: 100% !important
}

.postTagJS {
	cursor: pointer
}

.postTagJS input {
	display: none
}

.postTagJS input:checked~.postTagName {
	color: #fff;
	background: #7c0fd1
}

.bakvitech-contact.fix .bakvitech-contact-form .wpcf7 .wpcf7-not-valid-tip {
	bottom: -15px;
	font-size: 10px;
	font-weight: 700;
	right: 0
}

.bakvitech-contact.fix .bakvitech-contact-form .wpcf7 form {
	position: relative
}

.bakvitech-contact.fix .bakvitech-contact-form .wpcf7 form.invalid .wpcf7-response-output {
	color: red;
	text-align: center;
	width: 100%;
	margin: 0;
	bottom: -30px;
	z-index: 10
}

.bakvitech-contact.fix .bakvitech-contact-form .wpcf7 form.sent .wpcf7-response-output {
	color: #46b450;
	z-index: 10;
	bottom: -22px;
	width: 100%;
	text-align: center;
	margin: 0;
	padding: 0
}

.bakvitech-contact.fix .bakvitech-contact-form .wpcf7 .wpcf7-spinner {
	position: absolute;
	z-index: 10;
	top: 50%;
	transform: translateY(-50%);
	margin: 0;
	padding: 0;
	right: 5%
}

.bakvitech-contact.fix .wpcf7-form-control-wrap.your-service.is-loading-btn.loading::before {
	height: 2.4rem !important;
	width: 2.4rem !important;
	right: 5% !important;
	left: unset !important;
	margin: 0 !important
}

.pj-detail-solution-col ul li::before {
	content: "";
	position: absolute;
	top: .5rem;
	left: 1.1rem;
	width: .7rem;
	height: .7rem;
	border-radius: 50%;
	border: .3rem solid #f58635
}

.pj-detail-solution-col ul li::before {
	border-color: #7c0fd1
}

.bakvitech_project-template-single-project-nhtq-template .pj-detail-solution-col ul li::before {
	border-color: #f58635
}

.pj-detail-solution-col ul li {
	margin: 2.4rem 0;
	padding-left: 4.2rem;
	position: relative
}

.lmsa-content-box .pj-detail-solution-content ul li {
	margin: .8rem 0;
	font-size: 1.8rem;
	color: #5f5f5f;
	margin: 2.4rem 0;
	padding-left: 4.2rem;
	position: relative
}

@media only screen and (max-width:1200px) {
	.lmsa-content-box .pj-detail-solution-content ul li {
		font-size: 1.6rem
	}
}

@media only screen and (max-width:800px) {
	.lmsa-content-box .pj-detail-solution-content ul li {
		font-size: 1.5rem
	}
}

.lmsa-content-box .pj-detail-solution-content ul li::before {
	content: "";
	position: absolute;
	top: .5rem;
	left: 1.1rem;
	border-radius: 50%;
	border: .3rem solid #ffa51f;
	width: 1rem;
	height: 1rem
}

.bakvitech-contact.fix .bakvitech-contact-form .wpcf7 form.invalid .wpcf7-response-output {
	color: red;
	text-align: center;
	width: 100%;
	margin: 0;
	bottom: -22px;
	z-index: 10;
	font-size: 10px
}

.bakvitech_project-template-single-project-lms-template .lmsf-ani .txt-wrap {
	font-family: inherit
}

.bakvitech_project-template-single-project-lms-template .lmsf-font {
	font-size: 32rem;
	font-weight: 700;
	line-height: .9;
	text-align: center
}

.seofaq-tbody.bakvitechAnswer p {
	font-size: 1.8rem;
	color: #3a3a3a;
	margin: 1.6rem 0
}

@media only screen and (max-width:1200px) {
	.seofaq-tbody.bakvitechAnswer p {
		font-size: 1.6rem
	}
}

@media only screen and (max-width:800px) {
	.seofaq-tbody.bakvitechAnswer p {
		font-size: 1.5rem
	}
}

@media screen and (max-width:1060px) {
	.seofaq-tbody.bakvitechAnswer ul {
		width: 60rem;
		max-width: 100%;
		margin: 2.4rem auto
	}
}

.seofaq-tbody.bakvitechAnswer ul li {
	padding-left: 4rem;
	position: relative
}

.seofaq-tbody.bakvitechAnswer ul li:not(:last-child) {
	margin-bottom: 1.6rem
}

.seofaq-tbody.bakvitechAnswer ul li::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	transform: translateY(40%);
	width: 1.2rem;
	height: 1.2rem;
	border: .3rem solid #f5851e;
	border-radius: 50%
}

.seofaq-tbody.bakvitechAnswer ul li::before {
	width: 1rem;
	height: 1rem;
	border-width: .2rem;
	top: .6rem;
	transform: unset;
	left: 1rem
}

.blogf-sale.unset {
	background: unset
}

#template-website-gallery>* {
	display: none;
	cursor: pointer
}

#template-website-gallery>.active {
	display: block
}

.relative-bakvitech,
.sample-nine-func-form form {
	position: relative
}

.sample-nine-func-form form .wpcf7-spinner {
	position: absolute;
	z-index: 10;
	right: -10px;
	bottom: 8px
}

.sample-nine-func-form form .wpcf7-response-output {
	position: absolute;
	margin: 0 !important;
	padding: 0 !important;
	bottom: -25px;
	text-align: center;
	width: 100%
}

.sample-nine-func-form .form-cus input,
.sample-nine-func-form .form-cus textarea {
	color: #444
}

.sample-nine-func-form .form-cus .wpcf7-not-valid-tip {
	position: absolute;
	font-size: 10px;
	right: 0;
	font-weight: 700;
	bottom: -15px
}

.sample-nine-func-form .form-cus input,
.sample-nine-func-form .form-cus textarea {
	color: #4c0f7c;
	font-size: 1.6rem;
	border-bottom: .1rem solid #e0e0e0
}

.booking-content .des ul {
	list-style-type: disc;
	list-style: inside
}

.pj-cate .cate-sm-item.active a {
	color: #fff;
	background: #7c0fd1
}

.sers-tag-btn {
	max-width: max-content
}

.sers-tag-btn.has-text .icon {
	width: auto;
	height: auto
}

.sers-tag-btn .icon {
	width: 30%;
	height: auto
}

.sers-tag-btn.no-text .icon {
	width: 100%;
	height: auto
}

.sers-tag.fix .sers-tag-btn:hover .icon img {
	filter: unset
}

.sers-tag-btn img {
	transition: none;
	opacity: .6;
	object-fit: contain
}

.sers-tag-btn:hover img {
	opacity: 1
}

.ab-eight-link-bakvitech {
	margin-top: 1rem
}

.bakvitech_seo_service_extension.bakvitech-content {
	margin-top: 2.4rem;
	font-size: 1.8rem;
	color: #5f5f5f
}

.bakvitech_seo_service_extension.bakvitech-content ul li::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	transform: translateY(40%);
	width: 1.2rem;
	height: 1.2rem;
	border: .3rem solid #f5851e;
	border-radius: 50%
}

.bakvitech_seo_service_extension.bakvitech-content ol,
.bakvitech_seo_service_extension.bakvitech-content ul {
	padding-left: 0
}

.seoachi-link-bakvitech {
	margin: 4rem auto 0
}

.seoachi-link-bakvitech .btn-second {
	padding: 1.4rem 2rem;
	font-size: 1.8rem;
	height: 6.2rem
}

.blogdt-tag .text {
	display: flex;
	align-items: center
}

.blogdt-top .blogdt-tag .time {
	padding-top: 1rem
}

@media (max-width:768px) {
	.popup-service .popup-wrap {
		min-width: 90vw
	}
}

@media (max-width:600px) {
	.select2-container .select2-selection--single .select2-selection__rendered {
		font-size: 1.5rem
	}
}

.popup-service .btn-second {
	font-size: 2.2rem
}

@media (max-width:800px) {
	.popup-service .btn-second {
		font-size: 1.4rem
	}
}

.popup .seoadv-gr.seo-modified {
	height: unset;
	border: none
}

.bakvitech-content blockquote a {
	margin-left: 0
}

.hd-menu .menu-item .new-hotline-wrap {
	background-size: 100% 100%;
	width: 24.6rem;
	height: 4.8rem;
	position: relative;
	transform: translateX(-4rem)
}

.hd-menu.show-on-mobile .menu-item .new-hotline-wrap {
	transform: translateX(0)
}

.hd-menu .menu-item .new-hotline-wrap .hotline-panda {
	position: absolute;
	right: -6rem;
	top: .9rem;
	width: 6.2rem;
	height: 6.2rem
}

.hd-menu .menu-item .new-hotline-item {
	display: block;
	width: 100%;
	height: 100%;
	font-size: unset;
	color: #fff;
	border-radius: unset;
	padding: unset;
	background-position-x: 0;
	animation: hotline-movement 10s infinite linear;
	background-image: url("../assets/images/header/hotline-sky.png"), linear-gradient(151deg, #208cff 2.08%, #6dddff 100%);
	background-repeat: no-repeat;
	-webkit-mask-image: url("../assets/images/header/hotline-mask.png");
	mask-image: url("../assets/images/header/hotline-mask.png");
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
	background-size: cover;
	position: relative
}

.hd-menu .menu-item .new-hotline-item:hover {
	background-color: unset
}

.hd-menu .menu-item .new-hotline-item .hotline-number {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	align-items: center;
	width: calc(100% - 10rem);
	height: 100%;
	object-fit: contain;
	margin-left: 2rem
}

.hd-menu .menu-item .new-hotline-item .hotline-decor {
	position: absolute;
	right: 1.6rem;
	top: .1rem;
	width: 4.6rem;
	height: 4.6rem
}

.hd-menu .menu-item .new-hotline-wrap.night {
	background-image: url("../assets/images/header/hotline-bg-night.png")
}

.hd-menu .menu-item .new-hotline-item.night {
	background-image: url("../assets/images/header/hotline-night-sky.png")
}

.hd-menu .menu-item .new-hotline-item.night .hotline-number {
	margin-left: 5.8rem
}

.hd-menu .menu-item .new-hotline-item.night .hotline-decor {
	right: unset;
	left: .3rem
}

@keyframes hotline-movement {
	to {
		background-position-x: 100%
	}
}

@media screen and (max-width:1300px) {
	.hd-menu .menu-item .new-hotline-wrap {
		width: 23rem;
		height: 4.5rem
	}

	.hd-menu .menu-item .new-hotline-item .hotline-number {
		width: 65%;
		margin-left: 0
	}

	.hd-menu .menu-item .new-hotline-item .hotline-decor {
		width: 4rem;
		height: 4rem;
		top: 50%;
		transform: translateY(-50%)
	}
}

@media screen and (max-width:1750px) {
	.hd-menu .menu-item .new-hotline-wrap .hotline-panda {
		top: 1rem
	}
}

@media screen and (max-width:1250px) {
	.hd-menu .menu-item .new-hotline-wrap .hotline-panda {
		top: -.3rem
	}
}

@media screen and (max-width:1200px) {
	.hd-menu .menu-item .new-hotline-wrap .hotline-panda {
		top: 0;
		object-fit: contain
	}
}

@media screen and (min-width:2500px) {
	.site-software .hd-logo {
		width: 22%
	}

	.site-software .bakvitech-logo img {
		max-width: 90%
	}

	.hd-menu .menu-item .new-hotline-wrap {
		width: 19rem;
		height: 4.8rem
	}

	.hd-menu .menu-item .new-hotline-item .hotline-number {
		width: 65%;
		margin-left: 0
	}
}

@media screen and (min-width:2800px) {
	.site-software .hd-logo {
		width: 22%
	}

	.hd-menu .menu-item .new-hotline-wrap {
		width: 25rem;
		height: 4.8rem
	}
}

@media screen and (min-width:3200px) {
	.hd-menu .menu-item .new-hotline-wrap .hotline-panda {
		top: 1.1rem
	}
}

@media screen and (min-width:3400px) {
	.site-software .hd-logo {
		width: 24%
	}
}

.site-media .hd-logo {
	width: 26%
}

@media screen and (min-width:2000px) {
	.hd-menu .menu-item .new-hotline-wrap {
		width: 18rem;
		height: 4.2rem
	}

	.hd-menu .menu-item .new-hotline-item .hotline-number {
		width: calc(100% - 7rem);
		margin-left: 1rem
	}

	.hd-menu .menu-item .new-hotline-wrap .hotline-panda {
		width: 5rem;
		height: 5rem;
		top: 1.8rem
	}

	.hd-menu .menu-item .new-hotline-item .hotline-decor {
		width: 4rem;
		height: 4rem;
		top: 50%;
		transform: translateY(-50%)
	}

	.site-media .hd-logo {
		width: 24%
	}

	.home-banner-video-team {
		width: 40%
	}
}

@media screen and (min-width:2300px) {
	.site-media .hd-logo {
		width: 28%
	}
}

@media screen and (min-width:2500px) {
	.site-media .hd-logo {
		width: 22%
	}
}

@media screen and (min-width:2800px) {
	.site-media .hd-logo {
		width: 28%
	}
}

@media screen and (max-width:1680px) {
	.site-media .hd-logo {
		width: 24%
	}

	.site-media .hd-menu .menu-item .new-hotline-wrap {
		width: 18.5rem
	}

	.hd-menu .menu-item .new-hotline-item .hotline-number {
		width: calc(100% - 6rem);
		margin-left: .5rem
	}
}

@media screen and (max-width:1580px) {
	.site-media .hd-logo {
		width: 28%
	}

	.site-media .hd-menu .menu-item .new-hotline-wrap {
		width: 24.5rem;
		height: 5rem
	}

	.site-media .hd-menu .menu-item .new-hotline-item .hotline-decor {
		top: 50%;
		transform: translateY(-50%)
	}
}

@media screen and (max-width:1580px) {
	.site-media .hd-logo {
		width: 26%
	}

	.site-media .hd-menu .menu-item .new-hotline-wrap .hotline-panda {
		top: 1.1rem
	}
}

@media screen and (max-width:1480px) {
	.site-media .hd-logo {
		width: 24%
	}
}

@media screen and (max-width:1470px) {
	.site-media .hd-logo {
		width: 26%
	}
}

@media screen and (max-width:1420px) {
	.site-media .hd-logo {
		width: 23%
	}

	.site-media .hd-menu .menu-item .new-hotline-item .hotline-decor {
		empty-cells: 2.2rem
	}
}

@media screen and (max-width:1380px) {
	.site-media .hd-menu .menu-item .new-hotline-item .hotline-number {
		width: calc(100% - 7rem)
	}

	.site-media .hd-menu .menu-item .new-hotline-wrap {
		width: 22rem
	}
}

@media screen and (max-width:1300px) {
	.site-media .hd-menu .menu-item .new-hotline-wrap {
		width: 18rem;
		height: 4.5rem
	}

	.site-media .hd-menu .menu-item .new-hotline-item .hotline-number {
		width: calc(100% - 5rem)
	}

	.site-media .hd-menu .menu-item .new-hotline-wrap .hotline-panda {
		top: 1rem
	}
}

@media screen and (max-width:1250px) {
	.site-media .hd-menu .menu-item .new-hotline-wrap .hotline-panda {
		top: -.3rem
	}
}

@media screen and (max-width:1200px) {
	.mega-menu-on-mobile {
		padding-bottom: 2rem
	}

	.hd-menu .menu-item .new-hotline-wrap .hotline-panda {
		top: 1.5rem
	}

	.site-media .hd-menu .menu-item .new-hotline-item .hotline-number {
		width: calc(100% - 5rem);
		margin-left: .3rem
	}

	.mega-menu-child .menu-item .new-hotline-item .hotline-number,
	.mega-menu-on-mobile .menu-item .new-hotline-item .hotline-number {
		width: calc(100% - 8rem) !important;
		margin-left: 1.5rem !important
	}

	.site-media .hd-menu .menu-item .new-hotline-wrap .hotline-panda {
		top: .5rem
	}

	.site-media .mega-menu-on-mobile .menu-item .new-hotline-wrap .hotline-panda {
		top: .5rem
	}

	.mega-menu-on-mobile .hd-contact.hd-menu.show-on-mobile {
		margin-top: 2rem
	}
}

@media screen and (max-width:500px) {
	.slider-main-channel {
		width: 8rem;
		height: 8rem
	}
}

.hd-menu .menu-item .menu-item-link {
	white-space: nowrap
}

.hd-menu.d-flex .menu-list {
	flex-wrap: nowrap
}

.hd-menu,
.mega-menu-box-wrap {
	box-shadow: unset
}

.render-3_freelancer .ab-eight-content-inner {
	font-size: 3.2rem;
	padding: 4.8rem
}

.page-template-customers-template .bakvitech-buddy {
	position: relative
}

.page-template-customers-template .bakvitech-buddy .video-main {
	background: linear-gradient(180deg, rgba(233, 244, 255, 0) 0, #aed5ff 100%);
	position: relative;
	padding-top: 52rem;
	margin-top: -35rem;
	padding-bottom: 2rem
}

@media screen and (max-width:1200px) {
	.page-template-customers-template .bakvitech-buddy .video-main {
		padding-top: 45rem;
		padding-bottom: 0
	}
}

@media screen and (max-width:768px) {
	.page-template-customers-template .bakvitech-buddy .video-main {
		padding-bottom: 1.5rem
	}
}

@media screen and (max-width:600px) {
	.page-template-customers-template .bakvitech-buddy .video-main {
		padding-top: 42rem
	}
}

.page-template-customers-template .bakvitech-buddy .video {
	position: relative;
	width: calc(66.6666666667% - .8rem);
	margin: 0 auto;
	padding-top: 37%;
	background-color: #7c0fd1;
	border-top-left-radius: 2.4rem;
	border-top-right-radius: 2.4rem;
	border: 1rem solid #7c0fd1
}

@media screen and (max-width:1200px) {
	.page-template-customers-template .bakvitech-buddy .video {
		border-top-left-radius: 1.6rem;
		border-top-right-radius: 1.6rem
	}
}

@media screen and (max-width:768px) {
	.page-template-customers-template .bakvitech-buddy .video {
		border-radius: .8rem;
		width: 100%;
		padding-top: 57%;
		margin-left: 0
	}
}

.page-template-customers-template .bakvitech-buddy .video .splide__slide {
	border-top-left-radius: 2.4rem;
	border-top-right-radius: 2.4rem;
	overflow: hidden
}

@media screen and (max-width:1200px) {
	.page-template-customers-template .bakvitech-buddy .video .splide__slide {
		border-top-left-radius: 1.6rem;
		border-top-right-radius: 1.6rem
	}
}

@media screen and (max-width:768px) {
	.page-template-customers-template .bakvitech-buddy .video .splide__slide {
		border-radius: .8rem
	}
}

.page-template-customers-template .bakvitech-buddy .video-tt {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translate(-50%, -85%);
	border-radius: 24px;
	background: linear-gradient(178deg, #208cff 0, #8f32d7 100%);
	box-shadow: 8px 8px 40px 0 rgba(32, 140, 255, .24), 8px 8px 40px 0 rgba(143, 50, 215, .24);
	padding: 2.4rem;
	width: 70%;
	font-size: 4rem;
	color: #fff;
	text-align: center;
	font-weight: 700;
	z-index: 2
}

@media only screen and (max-width:1200px) {
	.page-template-customers-template .bakvitech-buddy .video-tt {
		font-size: 3.5rem
	}
}

@media only screen and (max-width:800px) {
	.page-template-customers-template .bakvitech-buddy .video-tt {
		font-size: 3rem
	}
}

@media screen and (max-width:1480px) {
	.page-template-customers-template .bakvitech-buddy .video-tt {
		font-size: 3.8rem
	}
}

@media screen and (max-width:1300px) {
	.page-template-customers-template .bakvitech-buddy .video-tt {
		font-size: 3.2rem
	}
}

@media screen and (max-width:1200px) {
	.page-template-customers-template .bakvitech-buddy .video-tt {
		font-size: 2.4rem;
		border-radius: 1.6rem;
		padding: 1.6rem
	}
}

@media screen and (max-width:900px) {
	.page-template-customers-template .bakvitech-buddy .video-tt {
		width: 80%;
		font-size: 1.8rem
	}
}

@media screen and (max-width:768px) {
	.page-template-customers-template .bakvitech-buddy .video-tt {
		border-radius: .8rem;
		font-size: 1.6rem
	}
}

@media screen and (max-width:450px) {
	.page-template-customers-template .bakvitech-buddy .video-tt {
		font-size: 1.4rem;
		padding: .8rem
	}
}

.page-template-customers-template .bakvitech-buddy .video-re {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%
}

.page-template-customers-template .bakvitech-buddy .panda-buddy {
	position: absolute;
	z-index: 2;
	pointer-events: none;
	bottom: 0;
	right: 0;
	transform: translateX(68%);
	width: 47%
}

@media screen and (max-width:1200px) {
	.page-template-customers-template .bakvitech-buddy .panda-buddy {
		width: 40%;
		bottom: -1rem
	}
}

@media screen and (max-width:768px) {
	.page-template-customers-template .bakvitech-buddy .panda-buddy {
		display: none
	}
}

.page-template-customers-template .bakvitech-buddy .video-thumb-mask-p {
	position: relative;
	z-index: 4;
	padding: 3.5rem 0;
	padding-top: 2.6rem;
	margin-top: -5.5rem;
	-webkit-mask-image: url("../assets/images/video/video-thumb-mask.png");
	mask-image: url("../assets/images/video/video-thumb-mask.png");
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
	mask-position: bottom;
	-webkit-mask-position: bottom;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	background-color: #dcf7ff;
	filter: drop-shadow(0 -11px 32px rgba(0, 0, 0, .25));
	-webkit-filter: drop-shadow(0 1.1rem 3.2rem rgba(0, 0, 0, .25))
}

@media screen and (max-width:1200px) {
	.page-template-customers-template .bakvitech-buddy .video-thumb-mask-p {
		-webkit-mask-image: unset;
		mask-image: unset;
		margin-top: 0;
		padding: 1.5rem 0;
		filter: unset;
		-webkit-filter: unset
	}
}

.page-template-customers-template .bakvitech-buddy .video-thumb {
	position: relative;
	z-index: 4;
	-webkit-mask-image: url("../assets/images/video/video-thumb-mask.png");
	mask-image: url("../assets/images/video/video-thumb-mask.png");
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
	mask-position: bottom;
	-webkit-mask-position: bottom;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	background-color: #dcf7ff;
	filter: drop-shadow(0 -11px 32px rgba(0, 0, 0, .25));
	-webkit-filter: drop-shadow(0 1.1rem 3.2rem rgba(0, 0, 0, .25))
}

@media screen and (max-width:1200px) {
	.page-template-customers-template .bakvitech-buddy .video-thumb {
		-webkit-mask-image: unset;
		mask-image: unset;
		filter: unset;
		-webkit-filter: unset
	}
}

.page-template-customers-template .bakvitech-buddy .video-thumb-mask {
	-webkit-mask-image: url("../assets/images/video/video-thumb-mask.png");
	mask-image: url("../assets/images/video/video-thumb-mask.png");
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
	mask-position: 0 3rem;
	-webkit-mask-position: 0 0;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat
}

@media screen and (max-width:1200px) {
	.page-template-customers-template .bakvitech-buddy .video-thumb-mask {
		-webkit-mask-image: unset;
		mask-image: unset
	}
}

.page-template-customers-template .bakvitech-buddy .video-thumb .list {
	display: flex
}

.page-template-customers-template .bakvitech-buddy .video-thumb .item {
	width: 25%;
	max-width: 45.4rem;
	flex-shrink: 0;
	margin: 0 1.2rem
}

@media screen and (max-width:1200px) {
	.page-template-customers-template .bakvitech-buddy .video-thumb .item {
		margin: 0 .7rem
	}
}

.page-template-customers-template .bakvitech-buddy .video-thumb .item:first-child {
	margin-left: 0
}

.page-template-customers-template .bakvitech-buddy .video-thumb .item:last-child {
	margin-right: 0
}

.page-template-customers-template .bakvitech-buddy .slider-thumb .splide__track {
	padding-bottom: 0
}

.page-template-customers-template .bakvitech-buddy .page-template-customers-template .bakvitech-buddy .video-thumb .item,
.page-template-customers-template .bakvitech-buddy .splide__track--nav>.splide__list>.splide__slide,
.page-template-customers-template .bakvitech-buddy .splide__track--nav>.splide__list>.splide__slide.is-active {
	border: unset
}

.bg-ab {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%
}

.page-template-customers-template .bakvitech-buddy .video-main {
	margin-top: 0;
	padding-top: 20rem
}

@media screen and (max-width:1200px) {
	.page-template-customers-template .bakvitech-buddy .video-main {
		padding-top: 14rem;
		padding-bottom: 0
	}
}

@media screen and (max-width:600px) {
	.page-template-customers-template .bakvitech-buddy .video-main {
		padding-top: 9rem
	}
}

.feedback-list.d-flex {
	flex-wrap: nowrap
}

.bakvitech-team.fix.custom {
	margin-top: 9.6rem
}

.bakvitech-team.fix.custom .bakvitech-team-bot {
	margin-top: 0
}

.is-loading-btn.loading {
	opacity: .5 !important;
	position: relative;
	pointer-events: none !important
}

.is-loading-btn.loading::before {
	height: 1em;
	width: 1em;
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -.5em;
	margin-top: -.5em;
	content: "";
	-webkit-animation: spin 1s ease-in-out infinite;
	animation: spin 1s ease-in-out infinite;
	background: url("../../wp-content/themes/bakvitechtheme/public/helpers/images/icon-loading-ring.svg") center center;
	background-size: cover;
	line-height: 1;
	text-align: center;
	font-size: 2em;
	color: rgba(0, 0, 0, .75);
	z-index: 99
}

.is-loading-group.loading {
	opacity: .5 !important;
	position: relative;
	pointer-events: none !important
}

.is-loading-group.loading::before {
	height: 1em;
	width: 1em;
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -.5em;
	margin-top: -.5em;
	content: "";
	-webkit-animation: spin 1s ease-in-out infinite;
	animation: spin 1s ease-in-out infinite;
	background: url("../../wp-content/themes/bakvitechtheme/public/helpers/images/loader.svg") center center;
	background-size: cover;
	line-height: 1;
	text-align: center;
	font-size: 2em;
	color: rgba(0, 0, 0, .75);
	z-index: 99
}

.get-code .hidden-label {
	display: none
}

.get-code {
	cursor: pointer;
	transition: .3s
}

.ft-hl-gr {
	bottom: 0
}

.ft-hl-decor .text {
	color: var(--secColor)
}

@media screen and (max-width:1200px) {
	.ab-one .head {
		margin-bottom: 4rem
	}

	.ab-eight {
		margin-top: 4rem
	}

	.render-3_freelancer .ab-eight-content-inner {
		padding: 2.4rem;
		font-size: 2.4rem
	}
}

@media screen and (max-width:500px) {
	.render-3_freelancer .ab-eight-content-inner {
		padding: 1.6rem;
		font-size: 1.6rem
	}
}

.bakvitech-btn-shortcode {
	display: inline-block
}

.bakvitech-count-down-btn {
	outline: 0;
	border-radius: 0;
	font: inherit;
	cursor: pointer;
	color: #fff;
	padding: 5px 20px;
	-webkit-transition: .3s;
	transition: .3s;
	background: #f25b64;
	border: 1px solid #f25b64;
	display: block
}

.bakvitech-btn-shortcode .bakvitech-count-down-btn {
	color: #fff
}

.bakvitech-count-down-btn:focus,
.bakvitech-count-down-btn:hover {
	background: #fff;
	color: #f25b64;
	border: 1px solid #f25b64
}

.get-code .hidden-label {
	display: none
}

.get-code {
	cursor: pointer
}

.get-code.done:hover .code {
	display: none
}

.get-code.done:hover .hidden-label {
	display: inline
}

.btn-cta {
	padding: 1.6rem 4rem;
	border-radius: .4rem;
	display: block;
	max-width: max-content;
	cursor: pointer;
	line-height: 1.2;
	transition: .3s;
	position: relative;
	transform-style: preserve-3d
}

.btn-cta-orange {
	border-radius: .4rem;
	border: .2rem solid #e85a18;
	background: linear-gradient(90deg, #f17800 .43%, #f39930 51.12%, #ef7c00 99.74%);
	box-shadow: 0 4px 12px 0 rgba(0, 0, 0, .16), 0 1px 4px 0 rgba(0, 0, 0, .1)
}

.btn-cta::after,
.btn-cta::before {
	content: '';
	position: absolute;
	height: 0%;
	width: .1rem;
	box-shadow: -.1rem -.1rem 2rem 0 #fff, -.4rem -.4rem .5rem 0 #fff, .7rem .7rem 2rem 0 rgba(0, 0, 0, .4), .4rem .4rem .5rem 0 rgba(0, 0, 0, .3);
	transition: all .5s ease
}

.btn-cta::before {
	right: 0;
	top: 0
}

.btn-cta::after {
	left: 0;
	bottom: 0
}

.btn-cta .line {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%
}

.btn-cta .line::after,
.btn-cta .line::before {
	content: '';
	position: absolute;
	box-shadow: -.1rem -.1rem 2rem 0 #fff, -.4rem -.4rem .5rem 0 #fff, .7rem .7rem 2rem 0 rgba(0, 0, 0, .4), .4rem .4rem .5rem 0 rgba(0, 0, 0, .3)
}

.btn-cta .line::before {
	left: 0;
	top: 0;
	width: 0%;
	height: .05rem;
	transition: all .5s ease
}

.btn-cta .line::after {
	right: 0;
	bottom: 0;
	width: 0%;
	height: .05rem;
	transition: all .5s ease
}

.btn-cta .text-small {
	font-size: 1.6rem
}

@media screen and (max-width:550px) {
	.btn-cta .text-small {
		font-size: 1.2rem
	}
}

.btn-cta .text {
	transition: all .5s ease;
	display: inline-block
}

@keyframes ani-btn {
	0% {
		background-position: 0 50%
	}

	50% {
		background-position: 100% 50%
	}

	100% {
		background-position: 0 50%
	}
}

.btn-cta-dot {
	width: 100%;
	max-width: max-content;
	transition: all .3s ease-in-out;
	padding: 1.7rem 2.7rem;
	margin: 3.4rem 0;
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	border-radius: 10rem;
	background: linear-gradient(77deg, #530d99 17.91%, #d61ef4 90.76%);
	background-size: 300% 300%;
	animation: ani-btn 4s ease alternate infinite
}

@media screen and (max-width:1200px) {
	.btn-cta-dot {
		margin: 2.4rem 0
	}
}

@media screen and (max-width:850px) {
	.btn-cta-dot {
		margin: 1.6rem 0
	}
}

@media screen and (max-width:450px) {
	.btn-cta-dot {
		padding: 1.6rem 2.4rem
	}
}

.btn-cta-dot .inner {
	display: flex;
	gap: 1.2rem;
	align-items: center
}

@media screen and (max-width:450px) {
	.btn-cta-dot .inner {
		gap: .8rem
	}
}

.btn-cta-dot .inner .icon {
	display: block;
	width: 3.3rem;
	height: 5.4rem;
	position: relative;
	z-index: 2
}

@media screen and (max-width:576px) {
	.btn-cta-dot .inner .icon {
		width: 2.3rem;
		height: 3.4rem
	}

	.btn-cta-dot .inner .icon .ani span {
		width: 2.3rem;
		height: 3.4rem
	}
}

.btn-cta-dot .inner .text {
	display: flex;
	flex-direction: column;
	gap: .4rem
}

.btn-cta-dot .inner .text .txt {
	display: block;
	font-size: 2.4rem
}

@media screen and (max-width:450px) {
	.btn-cta-dot .inner .text .txt {
		font-size: 1.6rem
	}
}

.btn-cta-dot .inner .text .txt-gif {
	display: block;
	font-size: 1.4rem
}

@media screen and (max-width:450px) {
	.btn-cta-dot .inner .text .txt-gif {
		font-size: 1.2rem
	}
}

.btn-cta-dot .img {
	position: absolute;
	top: 50%;
	left: 50%;
	width: calc(100% + 3.2rem);
	height: calc(100% + 2.4rem);
	transform: translate(-50%, -50%)
}

@media screen and (max-width:576px) {
	.btn-cta-dot .img {
		display: none
	}
}

@keyframes btn-new-blur {
	0% {
		filter: blur(0)
	}

	50% {
		filter: blur(1.2rem)
	}

	100% {
		filter: blur(0)
	}
}

.btn-new {
	display: flex;
	justify-content: center;
	gap: 0 1.2rem;
	align-items: center;
	font-size: 3.2rem;
	line-height: 1.2;
	border-radius: 100rem;
	position: relative;
	z-index: 3;
	border-radius: 100rem;
	background: rgba(255, 255, 255, .58);
	border: .2rem solid #fff;
	margin-top: 4.6rem;
	margin-bottom: 4.6rem;
	padding: 2.4rem 4.8rem;
	max-width: max-content
}

@media screen and (max-width:1200px) {
	.btn-new {
		font-size: 2.4rem
	}
}

@media screen and (max-width:576px) {
	.btn-new {
		font-size: 1.8rem;
		padding: 1.2rem 2.4rem
	}
}

.btn-new::after,
.btn-new::before {
	animation: btn-new-blur 2.6s ease-in-out infinite;
	content: "";
	position: absolute;
	z-index: 0;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 100rem
}

.btn-new::before {
	background: linear-gradient(77deg, #a32dff 17.91%, #d61ef4 90.76%)
}

.btn-new::after {
	background: linear-gradient(0deg, #530d99 0, rgba(227, 15, 130, 0) 100%)
}

.btn-new .inner {
	display: flex;
	align-items: center;
	position: relative;
	z-index: 3
}

.btn-new .inner .icon {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	width: 3.5rem;
	height: auto;
	margin-right: 1.2rem
}

@media screen and (max-width:1200px) {
	.btn-new .inner .icon {
		width: 2.4rem
	}
}

@media screen and (max-width:576px) {
	.btn-new .inner .icon {
		width: 2rem
	}
}

.btn-new .inner .text {
	display: flex;
	flex-direction: column;
	transition: .3s
}

.btn-new .inner .text .txt-sub {
	font-size: 1.6rem
}

@media screen and (max-width:1200px) {
	.btn-new .inner .text .txt-sub {
		font-size: 1.4rem
	}
}

@media screen and (max-width:576px) {
	.btn-new .inner .text .txt-sub {
		font-size: 1.2rem
	}
}

.btn-new .img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: calc(100% + 5.2rem);
	height: calc(100% + 4.8rem)
}

@media screen and (max-width:1200px) {
	.btn-new .img {
		width: calc(100% + 4.2rem);
		height: calc(100% + 2.8rem)
	}
}

@media screen and (max-width:576px) {
	.btn-new .img {
		width: calc(100% + 2.2rem)
	}
}

.btn-commit {
	margin-top: 2.4rem;
	margin-bottom: 2.4rem;
	margin-left: auto;
	margin-right: auto;
	max-width: 35.74rem;
	padding: 1.2rem 2.4rem;
	border-radius: .4rem;
	border: .1rem dashed #fff;
	font-size: 1.6rem;
	font-weight: 500;
	text-align: center;
	position: relative;
	z-index: 3
}

@media screen and (max-width:1200px) {
	.btn-commit {
		font-size: 1.6rem
	}
}

@media screen and (max-width:576px) {
	.btn-commit {
		font-size: 1.4rem;
		padding: .8rem 1.6rem
	}
}

.btn-commit::before {
	content: '';
	position: absolute;
	top: 0;
	left: 50%;
	transform: translate(-50%, -70%);
	width: 1.2rem;
	height: 1.5rem;
	background: url("../assets/images/button/icon-commit.svg") no-repeat;
	background-size: contain;
	background-position: center
}

@keyframes hotline-wrap-ani {
	100% {
		background-position: 100% 0, 0 100%, 0 0, 100% 100%
	}
}

.btn-hotline {
	display: flex;
	flex-direction: column;
	align-items: center;
	max-width: max-content;
	margin-left: auto;
	margin-right: auto;
	z-index: 3;
	position: relative
}

.btn-hotline .tt {
	font-size: 2.4rem;
	font-weight: 600;
	text-align: center;
	margin-bottom: .8rem;
	display: inline-block
}

@media screen and (max-width:1200px) {
	.btn-hotline .tt {
		font-size: 1.8rem
	}
}

@media screen and (max-width:576px) {
	.btn-hotline .tt {
		font-size: 1.6rem
	}
}

.btn-hotline .num {
	padding-top: 1.8rem;
	padding-bottom: 1rem;
	padding-left: 4rem;
	padding-right: 4rem;
	border-radius: .5rem;
	font-family: "Bebas Neue";
	font-size: 8rem;
	line-height: 1;
	color: #f5851e;
	background: linear-gradient(90deg, #f5851e 50%, transparent 50%), linear-gradient(90deg, #f5851e 50%, transparent 50%), linear-gradient(0deg, #f5851e 50%, transparent 50%), linear-gradient(0deg, #f5851e 50%, transparent 50%);
	background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
	background-size: .5rem .2rem, .5rem .2rem, .2rem .5rem, .2rem .5rem;
	background-position: 0 0, 100% 100%, 0 100%, 100% 0;
	position: relative
}

@media screen and (max-width:1200px) {
	.btn-hotline .num {
		font-size: 4.8rem;
		padding-left: 2.4rem;
		padding-right: 2.4rem
	}
}

@media screen and (max-width:576px) {
	.btn-hotline .num {
		font-size: 3.2rem;
		padding-top: 1.4rem
	}
}

.btn-hotline .num::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: calc(100% - .4rem);
	height: calc(100% - .4rem);
	border-radius: .5rem;
	background: #340658;
	z-index: 1
}

.btn-hotline .num .txt {
	position: relative;
	z-index: 2
}

@media screen and (min-width:1201px) {
	.btn-hotline:hover .num {
		animation: hotline-wrap-ani 5s linear infinite
	}
}

@media screen and (min-width:1201px) {
	.btn-cta:hover {
		background: 0 0;
		color: #e85a18;
		border-color: transparent
	}

	.btn-cta:hover .text {
		transform: translateY(-.2rem);
		text-shadow: 6px 3px 2px rgba(0, 0, 0, .2)
	}

	.btn-cta:hover::before {
		transition: all .5s ease;
		height: 100%
	}

	.btn-cta:hover::after {
		transition: all .5s ease;
		height: 100%
	}

	.btn-cta:hover .line::before {
		transition: all .5s ease;
		width: 100%
	}

	.btn-cta:hover .line::after {
		transition: all .5s ease;
		width: 100%
	}
}

.hotline-btn-wrap {
	max-width: max-content;
	margin-left: auto;
	margin-right: auto
}

.hotline-btn-bg {
	position: relative
}

.hotline-btn-bg::after {
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
	z-index: -1;
	border-radius: 4px
}

.hotline-btn-bg.bg-white {
	background: #fff;
	border-radius: .4rem
}

.hotline-btn-bg.bg-media {
	background: #7c0fd1
}

.hotline-btn-bg.bg-software {
	background: #2686ec
}

.hotline-btn {
	padding: 1.6rem 4rem;
	padding-bottom: .8rem;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	max-width: max-content;
	margin-left: auto;
	margin-right: auto;
	border-radius: 4px;
	background: #24033f;
	background: linear-gradient(90deg, #2686ec 50%, transparent 50%), linear-gradient(90deg, #2686ec 50%, transparent 50%), linear-gradient(0deg, #2686ec 50%, transparent 50%), linear-gradient(0deg, #2686ec 50%, transparent 50%);
	background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
	background-size: .5rem .2rem, .5rem .2rem, .2rem .5rem, .2rem .5rem;
	background-position: 0 0, 100% 100%, 0 100%, 100% 0;
	font-family: 'Bebas Neue';
	line-height: 1
}

@media screen and (max-width:550px) {
	.hotline-btn {
		padding: 1.4rem 1.8rem;
		padding-bottom: .8rem
	}
}

.hotline-btn.hotline-btn-media {
	background: linear-gradient(90deg, #a943f9 50%, transparent 50%), linear-gradient(90deg, #a943f9 50%, transparent 50%), linear-gradient(0deg, #a943f9 50%, transparent 50%), linear-gradient(0deg, #a943f9 50%, transparent 50%);
	background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
	background-size: .5rem .2rem, .5rem .2rem, .2rem .5rem, .2rem .5rem;
	background-position: 0 0, 100% 100%, 0 100%, 100% 0
}

.hotline-btn.hotline-btn-nhtq {
	background: linear-gradient(90deg, #ffa318 50%, transparent 50%), linear-gradient(90deg, #ffa318 50%, transparent 50%), linear-gradient(0deg, #ffa318 50%, transparent 50%), linear-gradient(0deg, #ffa318 50%, transparent 50%);
	background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
	background-size: .5rem .2rem, .5rem .2rem, .2rem .5rem, .2rem .5rem;
	background-position: 0 0, 100% 100%, 0 100%, 100% 0
}

.hotline-btn.hotline-btn-nhtq .txt {
	background: var(--gradient-button, linear-gradient(101deg, #ffa318 -38.94%, #f6851c 44.05%, #f31f10 132.4%));
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent
}

@keyframes hotline-wrap-ani {
	100% {
		background-position: 100% 0, 0 100%, 0 0, 100% 100%
	}
}

.hotline-btn.active {
	animation: hotline-wrap-ani 5s linear infinite
}

.hotline-btn .txt {
	font-size: 5.6rem;
	line-height: 1;
	font-weight: 700;
	background: linear-gradient(4deg, #2686ec 25.85%, #26bcec 71.65%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent
}

@media screen and (max-width:600px) {
	.hotline-btn .txt {
		font-size: 4rem
	}
}

.hotline-btn.hotline-btn-media .txt {
	background: linear-gradient(4deg, #7c0fd1 25.85%, #b557ff 71.65%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent
}

.hotline-btn-wrap .panda {
	position: relative;
	display: block;
	width: 20%;
	margin-left: auto
}

.hotline-btn-wrap .svg-ani {
	width: 92%;
	height: auto;
	position: absolute;
	left: -85%;
	top: 0
}

.form-custom .f-r {
	display: flex
}

.form-custom .f-r:not(:last-child) {
	margin-bottom: 1rem
}

.form-custom .f-c {
	width: 100%
}

.form-custom .f-c .ipt-txt,
.form-custom .f-c input {
	width: 100%;
	padding: 1.2rem 0;
	background-color: transparent;
	border-radius: unset;
	border-bottom: .1rem solid #e0e0e0;
	font-size: 1.4rem;
	line-height: 1.5;
	color: #3a3a3a
}

.form-custom .f-c .ipt-txt::placeholder,
.form-custom .f-c input::placeholder {
	color: #5f5f5f
}

.section-horizontal-sticky {
	position: sticky;
	top: 0;
	width: 100%;
	height: 100vh;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	justify-content: center
}

.section-horizontal-sticky-content,
.section-horizontal-sticky-header {
	width: 100%;
	overflow: hidden
}

.section-horizontal-scrolling {
	transition: .8s cubic-bezier(.25, .46, .45, .94)
}

.section-horizontal-list {
	display: flex;
	align-items: center;
	justify-content: flex-start
}

.section-horizontal-item {
	width: 100%;
	max-width: max-content;
	flex-shrink: 0
}

@media screen and (max-width:1200px) {
	.section-horizontal-sticky {
		height: auto
	}

	.section-horizontal-list {
		flex-wrap: wrap;
		justify-content: center
	}
}

.contact-box {
	position: relative;
	background-color: #f2ecfc;
	padding-bottom: 8rem
}

.contact-box-map {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 60rem;
	margin-bottom: -12rem
}

.home-page .contact-box-map {
	margin-top: -18rem;
	height: 80rem
}

@media screen and (max-width:1200px) {
	.home-page .contact-box-map {
		margin-top: -10rem;
		height: 55rem
	}
}

@media screen and (max-width:576px) {
	.home-page .contact-box-map {
		margin-top: -12rem;
		height: 40rem
	}
}

.contact-box-wrap {
	width: calc(100% * (10 / 12));
	background-color: #7c0fd1;
	color: #fff;
	border-radius: 3.2rem;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	z-index: 3;
	overflow: hidden
}

.contact-box-bg-decor {
	position: absolute;
	z-index: 1;
	left: 0;
	bottom: 0;
	width: calc(100% * (8 / 10));
	pointer-events: none
}

.contact-box-ctn {
	display: flex;
	align-items: flex-end;
	align-items: stretch;
	gap: 1.6rem;
	flex-wrap: nowrap;
	min-height: 80rem
}

.contact-box-ctn .bolt-ani,
.contact-box-ctn .bolt-ani .ani span {
	width: 1.8rem;
	height: 2.8rem
}

.contact-box-content {
	flex: 1;
	position: relative;
	display: flex;
	flex-direction: column;
	gap: .4rem
}

.contact-box-content-wrap {
	margin-left: 4.2rem;
	margin-top: 4rem;
	max-width: 52rem
}

.contact-box-form {
	width: calc(100% * (4.5 / 10));
	padding: 2.4rem;
	position: relative;
	z-index: 2
}

.contact-box-form .wrap {
	background-color: #fff;
	border-radius: 1.6rem;
	overflow: hidden;
	padding: 2.8rem 2.4rem;
	height: 100%;
	display: flex;
	flex-direction: column
}

.contact-box-form .ipt-txt,
.contact-box-form input,
.contact-box-form textarea {
	width: 100%;
	padding: 1rem 0;
	border-bottom: .1rem solid var(--Primary-Color-Stroke, #ebebeb);
	line-height: 1.5;
	color: #3a3a3a;
	border-radius: unset
}

.contact-box-form .select2-container .select2-selection--single .select2-selection__rendered {
	color: #3a3a3a
}

.contact-box-form .select2-container--default .select2-results>.select2-results__options::-webkit-scrollbar {
	width: .3rem
}

.contact-box-form .select2-container--default .select2-results>.select2-results__options:-webkit-scrollbar-track {
	background: #ebebeb
}

.contact-box-form .select2-container--default .select2-results>.select2-results__options::-webkit-scrollbar-thumb {
	background: #7c0fd1;
	border-radius: 2rem
}

.select2-container--default .select2-results>.select2-results__options {
	max-height: 30rem
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
	color: #fff
}

.contact-box-form .select2-container--open .select2-dropdown--below {
	border-radius: .8rem;
	box-shadow: .1rem .1rem 1rem #7c0fd1
}

.contact-box-form .ipt-txt::placeholder,
.contact-box-form .select2-container--default .select2-selection--single .select2-selection__placeholder,
.contact-box-form input::placeholder {
	opacity: .6;
	color: #3a3a3a
}

.contact-box-form .select2-container--default .select2-selection--single .select2-selection__placeholder {
	color: #3a3a3a
}

.contact-box-form .select2-container--default .select2-selection--single .select2-selection__arrow,
.select2.select2-container--default .select2-selection--single .select2-selection__arrow {
	top: 50%;
	transform: translateY(-50%)
}

.contact-box-form .select2-container--default .select2-selection--single {
	border-radius: unset;
	border: unset;
	background-color: transparent;
	border-bottom: .1rem solid #e0e0e0;
	height: auto
}

.contact-box-form .textarea-txt,
.contact-box-form textarea {
	height: 5.6rem;
	min-height: 7.2rem;
	max-height: max-content
}

.contact-box-mg:not(:last-child) {
	margin-bottom: 1.6rem
}

.contact-box-header .title {
	font-size: 3.2rem;
	line-height: 1.4;
	font-weight: 700;
	margin-bottom: 1.4rem;
	position: relative;
	width: 87%
}

.contact-box-header .title .decor {
	position: absolute;
	top: 0;
	right: 0;
	transform: translate(60%, -50%);
	pointer-events: none;
	width: 10%
}

.contact-box-header .desc {
	font-size: 1.6rem;
	opacity: .8
}

.contact-box-react {
	display: flex;
	gap: 5.8rem;
	position: relative;
	z-index: 2
}

.contact-box-react .item {
	display: block
}

.contact-box-react .icon {
	--sizeIcon: 4rem;
	width: var(--sizeIcon);
	height: var(--sizeIcon);
	border-radius: 1.2rem;
	overflow: hidden;
	margin-bottom: .8rem;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	flex-shrink: 0
}

.contact-box-react .label {
	font-size: 1.4rem;
	opacity: .8;
	line-height: 1.5
}

.contact-box-react .name {
	font-size: 1.8rem;
	font-weight: 700;
	transition: .3s
}

.contact-box-address {
	font-size: 1.6rem
}

.contact-box-address .item {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: .2rem 0
}

.contact-box-address .icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 3.2rem;
	height: 3.2rem
}

.contact-box-address .txt {
	transition: .3s
}

.contact-box-img {
	width: 100%;
	position: relative;
	flex: 1;
	display: flex;
	align-items: flex-end
}

.contact-box-img>img {
	position: relative;
	z-index: 2;
	height: auto
}

.contact-box-img .bg {
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 100%;
	transform: translateX(-50%);
	pointer-events: none
}

.contact-box-img .img {
	position: relative;
	z-index: 2
}

.contact-box-img .img .decor {
	--sizeDecor: 1.2rem;
	--sizeDecorSmall: 0.8rem;
	position: absolute;
	width: var(--sizeDecor);
	height: var(--sizeDecor);
	right: 0;
	background-color: #f5851e
}

@media screen and (max-width:850px) {
	.contact-box-img .img .decor {
		width: var(--sizeDecorSmall);
		height: var(--sizeDecorSmall)
	}
}

.contact-box-img .img .decor.decor-one {
	top: 0
}

.contact-box-img .img .decor.decor-two {
	top: calc(var(--sizeDecor) * 2);
	background-color: #f41e92
}

@media screen and (max-width:850px) {
	.contact-box-img .img .decor.decor-two {
		top: calc(var(--sizeDecorSmall) * 2)
	}
}

.contact-box-img .img .decor.decor-three {
	top: calc(var(--sizeDecor) * 4);
	background-color: #1ec0f2
}

@media screen and (max-width:850px) {
	.contact-box-img .img .decor.decor-three {
		top: calc(var(--sizeDecorSmall) * 4)
	}
}

.contact-box-img .img .decor.decor-four {
	top: calc(var(--sizeDecor) * 6);
	background-color: #fff
}

@media screen and (max-width:850px) {
	.contact-box-img .img .decor.decor-four {
		top: calc(var(--sizeDecorSmall) * 6)
	}
}

.form-ref .f-r:not(:last-child) {
	margin-bottom: .4rem
}

.form-ref .f-r.f-r-textarea {
	margin-bottom: 4.2rem
}

.form-ref .f-r {
	display: flex;
	width: calc(100% + 2.4rem);
	margin-left: -1.2rem
}

.form-ref .f-c {
	width: 100%;
	padding: 0 1.2rem;
	position: relative
}

.form-ref .f-c .word {
	position: absolute;
	bottom: 0;
	right: 1.2rem;
	transform: translateY(calc(100% + .8rem));
	font-size: 1.2rem;
	color: #b8b8b8
}

.form-ref .select2-container .select2-selection--single .select2-selection__rendered {
	height: auto;
	padding: 1.2rem 0
}

.form-ref .select2-container .select2-selection--single .select2-selection__rendered {
	font-size: 1.4rem;
	line-height: 1.5
}

.form-ref-btn {
	display: block;
	width: 100%;
	padding: 2rem;
	border-radius: .8rem;
	overflow: hidden;
	position: relative;
	background: linear-gradient(77deg, #a32dff 17.91%, #d61ef4 90.76%);
	cursor: pointer
}

.form-ref-btn::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(0deg, #530d99 0, rgba(124, 15, 210, 0) 65.79%);
	filter: blur(12px)
}

.form-ref-btn .content {
	display: flex;
	justify-content: center;
	align-items: flex-start;
	gap: 1.2rem;
	position: relative;
	z-index: 2;
	font-size: 1.8rem;
	font-weight: 700;
	text-align: center
}

.form-ref-btn .icon {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	width: 1.9rem;
	flex-shrink: 0
}

.form-ref-clock {
	flex: 1;
	display: flex;
	align-items: flex-end
}

.form-ref-clock-wrap {
	border-radius: .4rem;
	border: .1rem dashed var(--Primary-Color-grey-100, #c2c2c2);
	max-width: max-content;
	width: 92%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 1.8rem;
	padding: 1rem 2.4rem;
	position: relative;
	font-size: 1.5rem;
	color: #616161;
	font-weight: 500;
	text-align: center
}

.form-ref-clock .icon {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translate(-50%, -52%);
	width: 1.2rem;
	height: 1.6rem;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center
}

@keyframes zoomInTab {
	0% {
		opacity: 0;
		transform: scale(.95)
	}

	100% {
		opacity: 1;
		transform: scale(1)
	}
}

@-webkit-keyframes zoomInTab {
	0% {
		opacity: 0;
		-webkit-transform: scale(.95)
	}

	100% {
		opacity: 1;
		-webkit-transform: scale(1)
	}
}

.form-tab {
	margin-bottom: 2.4rem;
	padding: .8rem;
	display: flex;
	gap: .8rem;
	background: #f4e6ff;
	border-radius: .8rem;
	font-size: 1.6rem
}

.form-tab .item {
	width: calc(100% / 3);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: .8rem 1.6rem;
	color: #3a3a3a;
	border-radius: .4rem;
	cursor: pointer;
	transition: .3s
}

.form-tab .item.active {
	background-color: #7c0fd1;
	color: #fff
}

.form-panel {
	display: none;
	animation: zoomInTab .4s linear forwards;
	-webkit-animation: zoomInTab .4s linear forwards
}

.form-panel.active {
	display: block
}

.contact-box-form .label {
	position: absolute;
	left: 1.2rem;
	top: 50%;
	transform: translateY(-50%);
	width: calc(100% - 2.4rem);
	height: 100%;
	pointer-events: none;
	transition: .3s;
	display: flex;
	align-items: center;
	padding-right: 2.4rem;
	cursor: pointer;
	border-bottom: .1rem solid var(--Primary-Color-Stroke, #ebebeb)
}

.contact-box-form .label .txt {
	font-size: 1.4rem;
	color: #3a3a3a;
	opacity: .6
}

.contact-box-form .label[for=CV]::before {
	content: "";
	position: absolute;
	top: 50%;
	right: 0;
	width: 2rem;
	height: 2rem;
	transform: translateY(-50%);
	background: url("../assets/images/contact-box/icon-pinn.png") no-repeat;
	background-size: contain
}

.contact-box-form .ipt-txt.ipt-cv,
.contact-box-form input[type=file] {
	cursor: pointer
}

.contact-box-form .ipt-cv,
.contact-box-form input[type=file] {
	opacity: 0
}

.form-ref {
	position: relative
}

.form-ref form {
	padding-bottom: 2.4rem
}

.contact-box-form .wpcf7-not-valid-tip,
.contact-box-form .wpcf7-response-output,
.form-custom .wpcf7-not-valid-tip,
.form-custom .wpcf7-response-output {
	width: 100%;
	font-size: 1.2rem;
	color: #dc3232
}

.wpcf7-form-control-wrap.recaptcha {
	width: 100%;
	display: inline-block
}

.contact-box-form .wpcf7-response-output {
	left: 0;
	text-align: center
}

.contact-box-form .wpcf7-not-valid-tip,
.form-custom .wpcf7-not-valid-tip {
	right: 1.2rem;
	text-align: right;
	bottom: -1.2rem;
	right: 0;
	pointer-events: none
}

.contact-box-form .wpcf7-form-control-wrap.bakvitechmediaatothebtothc-wrap {
	display: none !important;
	visibility: hidden !important
}

.f-captcha .wpcf7-not-valid-tip,
.form-custom .f-captcha .wpcf7-not-valid-tip {
	bottom: -1.8rem
}

.form-ref .f-r.f-captcha {
	margin-bottom: 2.4rem
}

.form-custom .wpcf7-response-output {
	text-align: center
}

.form-custom .wpcf7 form.invalid .wpcf7-response-output,
.form-custom .wpcf7-response-output,
.wpcf7 form.invalid .wpcf7-response-output {
	font-size: 1.3rem;
	bottom: .2rem;
	margin: 0;
	padding: 0 .4rem;
	width: 100%;
	position: relative
}

.form-tkw {
	background: rgba(255, 255, 255, .95)
}

.contact-box-footer .wpcf7 form.invalid .wpcf7-response-output {
	bottom: .4rem;
	padding: 0;
	font-size: 1.3rem
}

.btn-submit {
	position: relative
}

.wpcf7-spinner {
	z-index: 3;
	top: 50%;
	transform: translateY(-50%);
	right: .4rem;
	width: 2.4rem;
	height: 2.4rem;
	margin: 0;
	background-color: #3f096a
}

.wpcf7-spinner::before {
	top: .3rem;
	left: .3rem;
	width: .6rem;
	height: .6rem
}

.contact-box-footer .wpcf7-spinner,
.popup-form .wpcf7-spinner {
	right: 1.6rem
}

@media screen and (min-width:1201px) {
	.form-tab .item:hover {
		background-color: #7c0fd1;
		color: #fff
	}

	.contact-box-react .item:hover .name {
		color: #f5851e
	}

	.contact-box-address .item:hover .txt {
		color: #f5851e
	}
}

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

	.container-lg .contact-box-form .wpcf7-not-valid-tip,
	.container-lg .contact-box-form .wpcf7-response-output,
	.container-lg .form-custom .wpcf7 form.invalid .wpcf7-response-output,
	.container-lg .form-custom .wpcf7-not-valid-tip,
	.container-lg .form-custom .wpcf7-response-output,
	.container-lg .wpcf7 form.invalid .wpcf7-response-output {
		font-size: 1.2rem
	}
}

@media screen and (max-width:1200px) {
	.contact-box-ctn {
		gap: 3.2rem;
		min-height: 74rem
	}

	.contact-box-wrap {
		width: calc(100% * (11 / 12))
	}

	.contact-box-header .title {
		font-size: 2.4rem;
		width: 100%
	}

	.contact-box-form {
		width: calc(100% * (5 / 10))
	}

	.contact-box-form .textarea-txt {
		min-height: 8rem
	}

	.contact-box-react {
		gap: .8rem;
		flex-wrap: wrap
	}

	.contact-box-react .item {
		display: flex;
		align-items: center;
		gap: .8rem;
		width: calc(50% - .8rem)
	}

	.contact-box-react .item:nth-child(3) {
		width: 80%
	}

	.contact-box-react .icon {
		margin-bottom: 0;
		margin-top: .2rem;
		--sizeIcon: 3.2rem;
		width: var(--sizeIcon);
		height: var(--sizeIcon)
	}

	.contact-box-react .name {
		font-size: 1.5rem
	}

	.contact-box-form {
		padding: 1.6rem
	}

	.contact-box-form .wrap {
		padding: 1.6rem;
		border-radius: .8rem
	}

	.contact-box-form .textarea-txt {
		min-height: 4.2rem
	}

	.form-ref-btn {
		padding: 1.2rem
	}

	.form-ref-btn .content {
		font-size: 1.5rem;
		gap: .8rem;
		align-items: center
	}

	.form-ref-btn .content {
		font-size: 1.6rem
	}

	.form-ref-clock-wrap {
		width: 100%;
		padding: .8rem 1.2rem;
		font-size: 1.4rem
	}

	.contact-box-react .name {
		font-size: 1.6rem
	}

	.contact-box-wrap {
		border-radius: 2rem
	}

	.contact-box-footer .wpcf7 form.invalid .wpcf7-response-output {
		font-size: 1rem
	}

	.form-tab {
		max-width: 100%;
		justify-content: space-between
	}

	.form-tab .item {
		width: auto
	}
}

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

	.contact-box-form .wpcf7-not-valid-tip,
	.contact-box-form .wpcf7-response-output,
	.form-custom .wpcf7 form.invalid .wpcf7-response-output,
	.form-custom .wpcf7-not-valid-tip,
	.form-custom .wpcf7-response-output,
	.wpcf7 form.invalid .wpcf7-response-output {
		font-size: 1rem
	}

	.container-lg .contact-box-form .wpcf7-not-valid-tip,
	.container-lg .contact-box-form .wpcf7-response-output,
	.container-lg .form-custom .wpcf7 form.invalid .wpcf7-response-output,
	.container-lg .form-custom .wpcf7-not-valid-tip,
	.container-lg .form-custom .wpcf7-response-output,
	.container-lg .wpcf7 form.invalid .wpcf7-response-output {
		font-size: 1rem
	}

	.form-ref form {
		padding-bottom: 3.8rem
	}

	.contact-box-wrap {
		border-radius: 1.6rem
	}

	.contact-box-ctn {
		gap: 1.6rem
	}

	.contact-box-content-wrap {
		margin-left: 2rem;
		margin-top: 1.6rem
	}

	.contact-box-header {
		margin-bottom: 1.8rem
	}

	.contact-box-header .title {
		font-size: 2rem;
		margin-bottom: 1.2rem
	}

	.contact-box-header .desc {
		font-size: 1.5rem
	}

	.form-tab .item {
		padding: .8rem
	}
}

@media screen and (max-width:768px) {
	.contact-box-wrap {
		width: 100%
	}

	.contact-box-form {
		width: calc(100% * (5.2 / 10))
	}
}

@media screen and (max-width:650px) {
	.contact-box-wrap {
		padding: 1.6rem
	}

	.contact-box-ctn {
		flex-wrap: wrap;
		gap: 0
	}

	.contact-box-form {
		width: 100%
	}

	.contact-box-content-wrap {
		margin: 0
	}

	.contact-box-form {
		padding: 0
	}

	.contact-box-header .title .decor {
		display: none
	}

	.contact-box-img>img {
		transform: translateY(.5rem)
	}

	.contact-box {
		padding-bottom: 4.8rem
	}

	.contact-box-address .item {
		gap: .4rem;
		font-size: 1.4rem
	}

	.contact-box-address .icon {
		width: 2.4rem;
		height: 2.4rem
	}
}

@media screen and (max-width:576px) {
	.form-tab {
		padding: .4rem;
		max-width: max-content;
		margin-left: auto;
		margin-right: auto;
		justify-content: center;
		gap: .4rem
	}

	.form-tab .item {
		padding: .4rem .8rem;
		font-size: 1.6rem
	}

	.contact-box-map {
		height: 30rem;
		margin-bottom: -5rem
	}
}

@media screen and (max-width:350px) {
	.contact-box-react .item {
		width: 100%;
		align-items: center
	}
}

.popup-form {
	width: 100%;
	max-width: 118rem
}

.popup-form .container {
	max-width: 100%
}

.popup-form.active {
	opacity: 1;
	visibility: visible;
	pointer-events: auto
}

.popup-form .contact-box-ctn {
	min-height: 65rem;
	padding-top: 4.2rem
}

.popup-form .contact-box-wrap {
	width: 100%;
	height: 100%;
	max-height: calc(100vh - 1.6rem);
	max-height: calc((var(--vhh, 1vh) * 100) - 1.6rem)
}

.popup-form .popup-close {
	background-color: #f5851e
}

@media screen and (min-width:1201px) {
	.popup-form .popup-close:hover {
		background-color: #f41e92
	}
}

@media screen and (max-width:650px) {
	.popup-form .contact-box-ctn {
		padding-top: 0
	}
}

@media screen and (max-width:600px) {
	.popup-form .contact-box-wrap {
		padding-top: 2.4rem
	}

	.popup-form .popup-close {
		position: sticky;
		top: 0;
		right: 0;
		margin-left: auto;
		margin-bottom: .8rem
	}

	.popup-form .contact-box-ctn {
		min-height: unset
	}

	.popup-form .contact-box-ctn {
		height: 100%;
		max-height: calc((var(--vhh, 1vh) * 100) - 8rem);
		margin-top: -3rem;
		overflow: hidden auto
	}

	.popup-form .contact-box-ctn::-webkit-scrollbar {
		display: none
	}

	.contact-box-header .title {
		width: calc(100% - 4rem);
		font-size: 1.8rem
	}
}

@keyframes phoneRingFixed {
	0% {
		transform: rotate(0) skew(1deg) translateY(0)
	}

	10% {
		transform: rotate(-15deg) skew(1deg)
	}

	20% {
		transform: rotate(15deg) skew(1deg)
	}

	30% {
		transform: rotate(-15deg) skew(1deg)
	}

	40% {
		transform: rotate(15deg) skew(1deg)
	}

	50% {
		transform: rotate(-15deg) skew(1deg)
	}

	60% {
		transform: rotate(15deg) skew(1deg)
	}

	70% {
		transform: rotate(0) skew(1deg)
	}

	100% {
		transform: rotate(0) skew(1deg)
	}
}

.contact-fixed-pop {
	position: fixed;
	z-index: 10;
	bottom: 10rem;
	right: 27px;
	display: none
}

@media screen and (max-width:1200px) {
	.contact-fixed-pop {
		display: block
	}
}

.contact-fixed-pop .item {
	margin-top: 1.5rem
}

.contact-fixed-pop .item .link {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	width: 6rem;
	height: 6rem;
	border-radius: 50%;
	overflow: hidden;
	animation: phoneRingFixed 2s ease-in-out infinite
}

#contact-fixed .contact-box-react .item:nth-child(1),
#contact-fixed .contact-box-react .item:nth-child(3) {
	display: none
}

.bolt-ani {
	--bolt: rgb(242, 222, 16);
	display: block;
	width: 3.3rem;
	height: 5.4rem;
	position: relative
}

@media screen and (max-width:576px) {
	.bolt-ani {
		width: 2.3rem;
		height: 3.4rem
	}
}

.bolt-ani svg {
	position: absolute;
	display: block;
	stroke-width: 4;
	fill: none;
	stroke-linecap: round;
	stroke: var(--bolt)
}

.bolt-ani svg.bolt-ani-line {
	--r: 0deg;
	--s: 1;
	top: 30%;
	z-index: 1;
	stroke: #fff;
	stroke-dashoffset: 241px;
	stroke-dasharray: 0 240px;
	transform: rotate(var(--r)) scaleX(var(--s))
}

.bolt-ani svg.bolt-ani-line.left {
	--r: -20deg;
	left: 0
}

.bolt-ani svg.bolt-ani-line.right {
	--r: 20deg;
	--s: -1;
	right: 0
}

.bolt-ani .ani {
	display: block;
	position: relative
}

.bolt-ani .ani span {
	display: block;
	width: 3.3rem;
	height: 5.4rem;
	background: var(--bolt);
	clip-path: polygon(50% 10%, 100% 10%, 60% 40%, 88% 40%, 5% 100%, 30% 50%, 0 50%)
}

@media screen and (max-width:576px) {
	.bolt-ani .ani span {
		width: 2.3rem;
		height: 4.4rem
	}
}

.bolt-ani svg.bolt-ani-line {
	animation: white-ani .45s cubic-bezier(.77, 0, .175, 1) forwards infinite 1.45s
}

.bolt-ani svg.bolt-ani-line.right {
	animation-delay: 1.6s
}

@keyframes white-ani {
	100% {
		stroke-dasharray: 240px 240px
	}
}

:root {
	--heightHeader: 8rem;
	--heightHeaderSmall: 6.6rem
}

header.header {
	position: sticky;
	z-index: 200;
	top: 0;
	left: 0;
	width: 100%;
	height: var(--heightHeader);
	padding: 1.6rem 0;
	transition: .5s ease-in-out;
	background-color: #fff
}

@media screen and (min-width:1201px) {
	header.header::before {
		content: "";
		position: absolute;
		height: var(--heightHeader);
		inset: 0;
		z-index: 20;
		--tw-bg-opacity: 1;
		background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
		pointer-events: none
	}
}

@media screen and (max-width:1200px) {
	header.header {
		padding: 1.2rem 0;
		height: var(--heightHeaderSmall)
	}
}

.header.out {
	transform: translateY(-100%);
	overflow: hidden
}

.header-ctn {
	justify-content: space-between
}

.header-ctn.d-flex {
	flex-wrap: nowrap
}

.header-logo {
	height: 4.8rem;
	margin-left: 2rem
}

@media screen and (max-width:1300px) {
	.header-logo {
		height: 4.2rem
	}
}

@media screen and (max-width:500px) {
	.header-logo {
		margin-left: 0
	}

	.header-logo img {
		content: url("../assets/icon/bakvitech-logo.png")
	}
}

.header-logo-link {
	display: block;
	height: 100%
}

@media screen and (min-width:1201px) {
	.header-logo-link {
		position: relative;
		z-index: 30
	}
}

.header-logo img {
	object-fit: contain
}

.header-left {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	justify-content: flex-start
}

@media screen and (max-width:500px) {
	.header-left {
		position: relative;
		z-index: 5;
		width: 60%;
		margin-left: 1.2rem
	}

	.header-left.hide {
		opacity: 0;
		pointer-events: none
	}
}

.header-mid {
	display: flex;
	flex: 1;
	justify-content: center
}

@media screen and (max-width:1200px) {
	.header-mid {
		position: fixed;
		z-index: 3;
		top: .8rem;
		right: .8rem;
		width: 32.8rem;
		height: auto;
		border-radius: .8rem;
		transition: .3s;
		pointer-events: none
	}

	.header-mid.col {
		padding: .6rem 1.6rem
	}
}

@media screen and (max-width:500px) {
	.header-mid {
		width: calc(100vw - 1.6rem)
	}

	.header-mid .header-logo-sp {
		display: none
	}
}

.header-mid-flex {
	justify-content: center;
	align-items: center
}

@media screen and (max-width:500px) {
	.header-mid-flex {
		padding-top: 5.6rem
	}
}

.header-mid-flex.d-flex {
	flex-wrap: nowrap
}

.header-search {
	margin-left: 1.6rem;
	padding-left: .8rem;
	position: relative;
	transition: .3s
}

@media screen and (min-width:1201px) {
	.header-search {
		z-index: 30
	}
}

@media screen and (max-width:1200px) {
	.header-search {
		position: fixed;
		top: 1.6rem;
		right: 6.4rem;
		margin: 0;
		padding: 0;
		pointer-events: auto
	}
}

.header-search::before {
	content: "";
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	width: .1rem;
	height: 70%;
	border-left: .2rem solid #e0e0e0
}

@media screen and (max-width:1200px) {
	.header-search::before {
		content: none
	}
}

.header-search-wrap {
	cursor: pointer
}

.header-search .icon {
	width: 4rem;
	height: 4rem;
	padding: .8rem;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	transition: .3s;
	border-radius: .8rem
}

@media screen and (max-width:1200px) {
	.header-search .icon {
		width: 3.2rem;
		height: 3.2rem;
		padding: .4rem;
		border-radius: .2rem
	}
}

@media screen and (min-width:1201px) {
	.header-search .icon:hover {
		background-color: #f8f0ff
	}
}

@media screen and (max-width:1200px) {
	.header-menu {
		width: 100%;
		opacity: 0
	}
}

.header-menu .menu-list {
	justify-content: center;
	flex-wrap: nowrap
}

@media screen and (max-width:1200px) {
	.header-menu .menu-list {
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start
	}
}

.header-menu .menu-item {
	margin-left: .4rem
}

.header-menu .menu-item.active .mega-menu-inner .mega-menu-sub.active,
.header-menu .menu-item.active .mega-menu-inner .mega-menu-sub.active .mega-menu-sub-wrap,
.header-menu .menu-item.active .mega-menu-inner.active {
	opacity: 1;
	pointer-events: auto;
	visibility: visible
}

.header-menu .menu-item.active .mega-menu-sub.active .mega-menu-sub-wrap {
	opacity: 1;
	pointer-events: auto;
	visibility: visible
}

.header-menu .menu-item.active .mega-menu-sub.active .mega-menu-sub-wrap .inner {
	transform: translateY(0)
}

@media screen and (min-width:1201px) {
	.header-menu .menu-item:nth-child(7n+1) .menu-item-link:hover {
		background-color: #ffe3f2
	}

	.header-menu .menu-item:nth-child(7n+1).current-menu-item .menu-item-link {
		background-color: #ffe3f2
	}

	.header-menu .menu-item:nth-child(7n+2) .menu-item-link:hover {
		background-color: #dcf7ff
	}

	.header-menu .menu-item:nth-child(7n+2).current-menu-item .menu-item-link {
		background-color: #dcf7ff
	}

	.header-menu .menu-item:nth-child(7n+3) .menu-item-link:hover {
		background-color: #ffeedf
	}

	.header-menu .menu-item:nth-child(7n+3).current-menu-item .menu-item-link {
		background-color: #ffeedf
	}

	.header-menu .menu-item:nth-child(7n+4) .menu-item-link:hover {
		background-color: #e9f4ff
	}

	.header-menu .menu-item:nth-child(7n+4).current-menu-item .menu-item-link {
		background-color: #e9f4ff
	}

	.header-menu .menu-item:nth-child(7n+5) .menu-item-link:hover {
		background-color: #dcf7ff
	}

	.header-menu .menu-item:nth-child(7n+5).current-menu-item .menu-item-link {
		background-color: #dcf7ff
	}

	.header-menu .menu-item:nth-child(7n+6) .menu-item-link:hover {
		background-color: #ffeedf
	}

	.header-menu .menu-item:nth-child(7n+6).current-menu-item .menu-item-link {
		background-color: #ffeedf
	}

	.header-menu .menu-item:nth-child(7n+7) .menu-item-link:hover {
		background-color: #f9f1ff
	}

	.header-menu .menu-item:nth-child(7n+7).current-menu-item .menu-item-link {
		background-color: #f9f1ff
	}
}

@media screen and (max-width:1200px) {
	.header-menu .menu-item {
		margin-left: 0;
		margin-bottom: .8rem;
		width: 100%
	}

	.header-menu .menu-item:last-child {
		margin-bottom: 0
	}

	.header-menu .menu-item.current-menu-item .menu-item-link {
		color: #7c0fd1
	}
}

.header-menu .menu-item.dropdown .menu-item-link {
	position: relative
}

@media screen and (max-width:1200px) {
	.header-menu .menu-item.dropdown .menu-item-link {
		width: calc(100% - 3rem)
	}
}

.header-menu .menu-item.dropdown .dropdown-btn {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	position: absolute;
	top: .5rem;
	right: -4.2rem;
	width: 3.2rem;
	height: 3.2rem
}

.header-menu .menu-item.dropdown .dropdown-btn img {
	width: 30%;
	height: 20%;
	object-fit: contain
}

.header-menu .menu-item-link {
	align-items: center;
	padding: 1.2rem 1.6rem;
	transition: .3s;
	border-radius: .8rem;
	flex-wrap: nowrap;
	white-space: nowrap
}

@media screen and (max-width:1350px) {
	.header-menu .menu-item-link {
		padding: 1rem 1.2rem
	}
}

@media screen and (max-width:1200px) {
	.header-menu .menu-item-link {
		padding: 1rem 0
	}
}

@media screen and (min-width:1201px) {
	.header-menu .menu-item-link {
		position: relative;
		z-index: 30
	}

	.header-menu .menu-item-link.active {
		background-color: #dcf7ff
	}
}

.header-menu .menu-item .icon {
	flex-shrink: 0;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	width: 1.6rem;
	height: 1.6rem;
	margin-right: .4rem
}

@media screen and (max-width:1200px) {
	.header-menu .menu-item .icon {
		margin-right: 1.2rem
	}
}

.header-menu .menu-item .icon img {
	object-fit: contain
}

.header-menu .menu-item .txt {
	font-size: 1.5rem;
	line-height: 1.2;
	font-weight: 600
}

.header-right {
	position: relative;
	margin-right: .4rem
}

@media screen and (min-width:1201px) {
	.header-right {
		z-index: 30
	}
}

@media screen and (max-width:1200px) {
	.header-right {
		display: none
	}
}

.header-menu .menu-item.hop-tac .icon {
	width: 2.2rem;
	height: auto
}

:root {
	--paddingMenu: 3.2rem
}

.header-hotline-w {
	position: relative
}

.header-hotline-w .hotline-panda {
	position: absolute;
	z-index: 1;
	bottom: -1.6rem;
	right: -1.6rem;
	width: 6rem;
	height: 6rem
}

@media screen and (max-width:1350px) {
	.header-hotline-w .hotline-panda {
		width: 5rem;
		height: 5rem
	}
}

.header-hotline-w .header-hotline {
	position: relative;
	z-index: 2;
	margin-right: 3.2rem;
	padding-right: 1.3rem;
	-webkit-mask-image: url("../assets/images/header/hotline-mask.png");
	mask-image: url("../assets/images/header/hotline-mask.png");
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
	transition: .3s;
	background: linear-gradient(151deg, #208cff 2.08%, #6dddff 100%)
}

.header-hotline-w .header-hotline-wrap {
	align-items: center;
	padding: .4rem;
	background-position-x: 0;
	animation: hotline-movement 10s infinite linear;
	background-image: url("../assets/images/header/hotline-sky.png"), linear-gradient(151deg, #208cff 2.08%, #6dddff 100%);
	background-size: auto 100%;
	background-repeat: no-repeat
}

.header-hotline-w .header-hotline-wrap.d-flex {
	flex-wrap: nowrap
}

.header-hotline-w .header-hotline-wrap .icon {
	width: 4rem;
	height: 4rem;
	border-radius: 50%;
	overflow: hidden;
	flex-shrink: 0;
	margin-right: 0
}

.header-hotline-w .header-hotline-wrap .num {
	font-family: "Bebas Neue";
	font-size: 2.8rem;
	font-weight: 500;
	color: #fff;
	margin-left: .4rem;
	margin-right: 1rem;
	letter-spacing: .05em;
	line-height: 1;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	padding-top: .4rem;
	white-space: nowrap
}

@media only screen and (max-width:1200px) {
	.header-hotline-w .header-hotline-wrap .num {
		font-size: 2.4rem
	}
}

@media only screen and (max-width:800px) {
	.header-hotline-w .header-hotline-wrap .num {
		font-size: 2.1rem
	}
}

@media screen and (max-width:1350px) {
	.header-hotline-w .header-hotline-wrap .num {
		font-size: 2.2rem;
		margin-left: 1.2rem
	}
}

@media screen and (max-width:1200px) {
	.header-hotline-w .header-hotline-wrap .num {
		font-size: 3.2rem
	}
}

@media screen and (max-width:450px) {
	.header-hotline-w .header-hotline-wrap .num {
		font-size: 2.8rem
	}
}

.header-hotline-w .header-hotline.night {
	background: linear-gradient(151deg, #002da1 2.08%, #00126d 100%)
}

.header-hotline-w .header-hotline.night .header-hotline-wrap {
	background-image: url("../assets/images/header/hotline-night-sky.png")
}

.header-hotline-w .header-hotline.night .header-hotline-wrap .num {
	margin-left: .5rem;
	margin-right: 1.6rem
}

.header-hotline-w .header-hotline.night .header-hotline-wrap .icon img {
	content: url("../assets/images/header/hotline-moon.png")
}

.hotline-sp {
	width: 28rem
}

@media screen and (max-width:1200px) {
	.hotline-sp .hotline-panda {
		right: -.4rem
	}

	.hotline-sp .header-hotline-w .header-hotline-wrap .num {
		letter-spacing: .02em
	}

	.hotline-sp .header-hotline-w .header-hotline-wrap {
		padding: .8rem;
		justify-content: space-between
	}
}

@keyframes ani-gradient {
	0% {
		background-position: 0
	}

	100% {
		background-position: 100%
	}
}

.mega-menu-inner {
	position: fixed;
	z-index: 12;
	top: 8rem;
	left: 0;
	width: 100%;
	transition: .3s linear;
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
	transition: .6s cubic-bezier(.585, -.195, .245, 1.25)
}

@media screen and (min-width:1201px) {
	.mega-menu-inner {
		transform: translateY(calc(-100% - 8rem))
	}
}

@media screen and (max-width:1200px) {
	.mega-menu-inner {
		position: absolute;
		z-index: 5;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: #fff;
		border-radius: .8rem;
		display: flex;
		flex-direction: column
	}

	.mega-menu-inner .box {
		border-radius: .8rem
	}
}

.mega-menu-inner.active {
	opacity: 1;
	pointer-events: auto;
	visibility: visible
}

@media screen and (min-width:1201px) {
	.mega-menu-inner.active {
		transform: translateY(0)
	}
}

.mega-menu-inner .hotline-sp {
	position: absolute;
	bottom: 1.6rem;
	left: 1.6rem;
	width: 88%;
	margin-bottom: 0
}

@media screen and (max-width:1200px) {
	.mega-menu-inner .hotline-sp {
		width: 28rem;
		position: relative
	}
}

.mega-menu-inner .box {
	padding: var(--paddingMenu);
	background-color: #fff;
	box-shadow: 1rem 1rem 4rem rgba(0, 0, 0, .25);
	position: relative
}

@media screen and (max-width:1200px) {
	.mega-menu-inner .box {
		padding: 0;
		box-shadow: unset;
		position: static;
		flex: 1;
		display: flex;
		flex-direction: column
	}
}

.mega-menu-inner .label {
	font-size: 2rem;
	font-weight: 600;
	position: absolute;
	top: 3.2rem;
	left: calc(var(--widthSub) + (var(--paddingMenu) * 2))
}

.mega-menu-inner .list {
	padding: .8rem;
	width: 100%;
	max-width: max-content;
	border-radius: 1.6rem;
	background: linear-gradient(45deg, #dcf7ff 0, #e9f4ff 25.24%, #f9f1ff 50.41%, #ffe3f2 76.17%, #ffeedf 100%);
	background-size: 600% 100%;
	animation: ani-gradient 3s linear infinite;
	animation-direction: alternate
}

@media screen and (max-width:1200px) {
	.mega-menu-inner .list {
		max-width: 100%;
		border-radius: .8rem;
		padding: 0 .8rem;
		background: unset;
		flex: 1
	}
}

.mega-menu-inner .item {
	width: 100%;
	margin-bottom: .2rem
}

@media screen and (max-width:1200px) {
	.mega-menu-inner .item {
		margin-bottom: .6rem
	}
}

.mega-menu-inner .item.active>.wrap {
	background-color: #fff
}

.mega-menu-inner .item.active>.wrap .img {
	background-color: var(--background-icon)
}

.mega-menu-inner .item:last-child {
	margin-bottom: 0
}

@media screen and (max-width:1200px) {
	.mega-menu-inner .item:nth-child(5n+1) .img {
		background-color: #f9f1ff
	}

	.mega-menu-inner .item:nth-child(5n+1).active>.wrap {
		background-color: #f9f1ff
	}
}

@media screen and (max-width:1200px) {
	.mega-menu-inner .item:nth-child(5n+2) .img {
		background-color: #fff5fb
	}

	.mega-menu-inner .item:nth-child(5n+2).active>.wrap {
		background-color: #fff5fb
	}
}

@media screen and (max-width:1200px) {
	.mega-menu-inner .item:nth-child(5n+3) .img {
		background-color: #fff6ed
	}

	.mega-menu-inner .item:nth-child(5n+3).active>.wrap {
		background-color: #fff6ed
	}
}

@media screen and (max-width:1200px) {
	.mega-menu-inner .item:nth-child(5n+4) .img {
		background-color: #edfbff
	}

	.mega-menu-inner .item:nth-child(5n+4).active>.wrap {
		background-color: #edfbff
	}
}

@media screen and (max-width:1200px) {
	.mega-menu-inner .item:nth-child(5n+5) .img {
		background-color: #f3f9ff
	}

	.mega-menu-inner .item:nth-child(5n+5).active>.wrap {
		background-color: #f3f9ff
	}
}

.mega-menu-inner .item .wrap {
	padding: 1.6rem;
	align-items: center;
	cursor: pointer;
	transition: .2s cubic-bezier(.25, .46, .45, .94);
	border-radius: 1.2rem;
	flex-wrap: nowrap;
	position: relative;
	z-index: 2
}

@media screen and (max-width:1200px) {
	.mega-menu-inner .item .wrap {
		padding: .8rem;
		padding-right: 1.5rem;
		border-radius: .8rem
	}

	.mega-menu-inner .item .wrap::before {
		content: "";
		position: absolute;
		top: 50%;
		transform: translateY(-50%) rotate(-90deg);
		opacity: .4;
		right: 1rem;
		width: 1rem;
		height: 1rem;
		background: url("../assets/images/header/icon-arrow.svg") no-repeat;
		background-size: contain
	}
}

@media screen and (min-width:1201px) {
	.mega-menu-inner .item .wrap:hover .img {
		background-color: var(--background-icon)
	}
}

.mega-menu-inner .item .img {
	flex-shrink: 0;
	width: 5.6rem;
	height: 5.6rem;
	padding: 1.2rem;
	transition: .3s;
	border-radius: .8rem
}

@media screen and (max-width:1200px) {
	.mega-menu-inner .item .img {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-ms-align-items: center;
		align-items: center;
		-webkit-align-items: center;
		justify-content: center;
		-webkit-justify-content: center;
		width: 3.8rem;
		height: 3.8rem;
		padding: .8rem;
		border-radius: .4rem
	}
}

.mega-menu-inner .item .txt {
	margin-left: 1rem
}

.mega-menu-inner .item .txt .title {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden
}

.mega-menu-inner .item .txt .desc {
	font-size: 1.4rem;
	color: #8b8b8b;
	font-weight: 400;
	margin-top: .4rem;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden
}

@media screen and (max-width:1200px) {
	.mega-menu-inner .item .txt .desc {
		font-size: 1.2rem
	}
}

.mega-menu-inner .mega-menu-sub {
	position: absolute;
	top: var(--paddingMenu);
	right: var(--paddingMenu);
	height: calc(100% - var(--paddingMenu) * 2);
	width: calc(100% - var(--widthSub) - (var(--paddingMenu) * 2) - 2.4rem);
	pointer-events: none
}

@media screen and (max-width:1200px) {
	.mega-menu-inner .mega-menu-sub {
		top: 0;
		left: 0;
		width: 100%;
		min-height: 100%;
		height: auto;
		max-height: calc(var(--vh, 1vh) * 100 - 1.6rem);
		background-color: #fff;
		border-radius: .8rem;
		transition: .3s;
		z-index: 4;
		display: flex;
		flex-direction: column;
		opacity: 0;
		pointer-events: none;
		visibility: hidden
	}

	.mega-menu-inner .mega-menu-sub .wrap {
		padding: .8rem;
		padding-right: .8rem
	}

	.mega-menu-inner .mega-menu-sub .wrap::before {
		content: none
	}
}

.mega-menu-inner .mega-menu-sub.active .mega-menu-sub-wrap .inner {
	transform: translateY(0)
}

.mega-menu-inner .mega-menu-sub.active .mega-menu-sub-wrap .hotline-sp {
	position: relative
}

.mega-menu-inner .mega-menu-sub.mega-menu-cate--before .inner {
	transform: translateY(-2rem)
}

@media screen and (max-width:1200px) {
	.mega-menu-inner .mega-menu-sub.mega-menu-cate--before .inner {
		transform: translateY(0)
	}
}

.mega-menu-inner .mega-menu-sub-wrap {
	margin-top: 2.8rem;
	overflow: hidden;
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
	transition: .3s
}

@media screen and (max-width:1200px) {
	.mega-menu-inner .mega-menu-sub-wrap {
		margin-top: 0;
		height: 100%;
		max-height: calc(var(--vh, 1vh) * 100 - 1.6rem);
		flex: 1;
		display: flex;
		flex-direction: column
	}
}

.mega-menu-inner .mega-menu-sub-wrap .inner {
	transform: translateY(2rem);
	will-change: transform, opacity;
	transition: .3s cubic-bezier(.25, .46, .45, .94)
}

@media screen and (max-width:1200px) {
	.mega-menu-inner .mega-menu-sub-wrap .inner {
		transform: translateY(0);
		max-height: calc(var(--vh, 1vh) * 100 - 15.6rem);
		overflow: hidden auto;
		flex: 1
	}
}

.mega-menu-inner .mega-menu-sub span {
	display: block
}

.mega-menu-inner .mega-menu-sub .title {
	line-height: 1.4
}

@media screen and (min-width:2000px) {
	.mega-menu-inner .mega-menu-sub .title {
		line-height: 1.3
	}
}

@media screen and (max-width:1700px) {
	.mega-menu-inner .mega-menu-sub .title {
		line-height: 1.5
	}
}

.mega-menu-inner .mega-menu-sub .item .desc {
	font-size: 1.2rem
}

@media screen and (min-width:2000px) {
	.mega-menu-inner .mega-menu-sub .item .desc {
		line-height: 1.3
	}
}

@media screen and (max-width:1700px) {
	.mega-menu-inner .mega-menu-sub .item .desc {
		margin-top: .2rem
	}
}

.mega-menu-inner .mega-menu-sub .list {
	background: 0 0;
	padding: 0;
	width: 100%
}

.mega-menu-inner .mega-menu-sub .item {
	width: calc(100% / 4);
	padding: 0 .4rem
}

@media screen and (min-width:1201px) {
	.mega-menu-inner .mega-menu-sub .item.active-sub .wrap {
		background-color: var(--mega-background)
	}
}

@media screen and (max-width:1200px) {
	.mega-menu-inner .mega-menu-sub .item.active-sub .wrap {
		color: #2686ec
	}
}

@media screen and (max-width:1200px) {
	.mega-menu-inner .mega-menu-sub .item {
		width: 100%;
		padding: 0
	}
}

.mega-menu-inner .mega-menu-sub .wrap {
	align-items: flex-start;
	padding: 1.2rem
}

.mega-menu-inner .mega-menu-sub .img {
	padding: 0;
	width: 2.4rem;
	height: 2.4rem;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: transparent !important
}

@media screen and (max-width:1500px) {
	.mega-menu-inner .mega-menu-sub .img {
		width: 2rem;
		height: 2rem
	}
}

.mega-menu-inner .mega-menu-sub .txt {
	margin-left: 1.2rem
}

@media screen and (max-width:1700px) {
	.mega-menu-inner .mega-menu-sub .txt {
		font-size: 1.5rem
	}
}

@media screen and (max-width:1500px) {
	.mega-menu-inner .mega-menu-sub .txt {
		margin-left: .8rem
	}
}

.mega-menu-inner .mega-menu-sub .sticky {
	display: inline-block;
	margin-right: .4rem;
	padding: .4rem .8rem;
	border-radius: .4rem;
	font-size: 1.2rem;
	line-height: 1.2;
	font-weight: 600;
	color: #fff;
	background-color: #f41e92;
	transition: .3s
}

.mega-menu-inner .mega-menu-sub .sticky.bg-lms {
	background-color: #f41e92
}

.mega-menu-inner .mega-menu-sub .sticky.bg-nhtq {
	background-color: #f5851e
}

.mega-menu-inner .mega-menu-sub .related {
	border-top: .1rem solid #d7d7d7;
	margin-top: .1rem;
	padding-top: .1rem
}

.mega-menu-inner .mega-menu-sub .related .list {
	margin-top: .4rem;
	max-width: 100%
}

@media screen and (max-width:1700px) {
	.mega-menu-inner .mega-menu-sub .related .list {
		margin-top: .2rem
	}
}

@media screen and (max-width:1200px) {
	.mega-menu-inner .mega-menu-sub .related {
		display: none
	}
}

.mega-menu-background {
	position: absolute;
	left: var(--paddingMenu);
	top: 0;
	transform: translate(var(--background-left), var(--background-top));
	will-change: transform, height;
	width: var(--background-width);
	height: var(--background-height);
	background-color: var(--background-color);
	border-radius: 1.2rem;
	pointer-events: none;
	transition: all .3s cubic-bezier(.25, .46, .45, .94)
}

.mega-menu-close {
	position: fixed;
	z-index: 4;
	top: 1.6rem;
	right: 1.6rem
}

.mega-menu-close .hd-bar {
	margin: 0
}

.header-logo-sp {
	height: 3.2rem;
	width: 70%;
	margin-top: .2rem;
	margin-bottom: 1.6rem;
	pointer-events: none;
	opacity: 0
}

.header-logo-sp-link {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	justify-content: flex-start;
	width: 100%;
	height: 100%
}

.header-logo-sp-link img {
	width: 100%;
	height: 100%;
	object-fit: contain
}

.show-on-sp {
	display: block
}

@media screen and (min-width:1201px) {
	.show-on-sp {
		display: none
	}
}

.hide-on-sp {
	display: none
}

@media screen and (min-width:1201px) {
	.hide-on-sp {
		display: block
	}
}

.mega-menu-header {
	position: sticky;
	z-index: 3;
	top: 0;
	margin-bottom: .8rem;
	border-radius: .8rem .8rem 0 0;
	border-bottom: 1px solid #e0e0e0;
	background-color: #fff;
	display: none !important
}

@media screen and (max-width:1200px) {
	.mega-menu-header {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-ms-align-items: center;
		align-items: center;
		-webkit-align-items: center;
		justify-content: center;
		-webkit-justify-content: center;
		display: flex !important
	}
}

.mega-menu-back {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	justify-content: flex-start;
	-webkit-justify-content: flex-start;
	transform: translateY(-.2rem);
	font-size: 1.4rem;
	font-weight: 600;
	color: #7c0fd1
}

.mega-menu-back img {
	width: .7rem;
	height: 1.2rem;
	margin-right: .8rem
}

.mega-menu-back {
	padding: 1.6rem;
	transform: translateY(0)
}

.dropdown-sub {
	position: relative
}

.dropdown-sub::before {
	content: "";
	position: absolute;
	z-index: 14;
	top: 100%;
	width: 100%;
	height: 3rem;
	background-color: transparent;
	cursor: pointer;
	display: none
}

.dropdown-sub .icon-arrow {
	position: absolute;
	right: 1.2rem;
	top: .2rem;
	width: .5rem;
	transform: rotate(90deg);
	height: auto;
	transform: rotate(-90deg);
	transform: rotate(0);
	width: 3.8rem;
	height: 3.8rem;
	padding: 1.6rem 1.4rem;
	right: -1.5rem
}

@media screen and (min-width:1201px) {
	.dropdown-sub .icon-arrow {
		display: none
	}
}

.header .submenu {
	position: absolute;
	z-index: 13;
	top: 100%;
	left: 0;
	min-width: 25rem;
	max-width: 30rem;
	background: #fff;
	box-shadow: 0 12px 24px rgba(0, 67, 101, .08);
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
	transition: .3s;
	left: 0;
	max-width: 100%;
	min-width: 33.6rem;
	transform: translate(0, 2.8rem);
	padding: 1.6rem;
	border-radius: 1.6rem;
	box-shadow: 0 24px 60px -20px rgba(50, 50, 93, .24), 0 16px 32px -30px rgba(0, 0, 0, .16), inset 0 1px 1px rgba(255, 255, 255, .1)
}

@media screen and (max-width:1200px) {
	.header .submenu {
		display: none;
		width: 100%;
		min-width: calc(100% - 1.5rem);
		transition: unset;
		position: relative;
		opacity: 1;
		pointer-events: auto;
		visibility: visible;
		transform: unset;
		box-shadow: unset;
		margin-left: 0;
		border-left: 1px solid rgba(0, 0, 0, .12);
		transform: translate(0);
		border-radius: unset;
		box-shadow: unset;
		padding: .8rem;
		min-width: calc(100% - 1.5rem);
		transform: unset
	}
}

.header .submenu .submenu-item {
	margin-bottom: .4rem
}

.header .submenu .submenu-item:last-child {
	margin-bottom: 0
}

.header .submenu .submenu-item-link {
	font-size: 1.6rem;
	color: #3a3a3a;
	font-weight: 600;
	padding: 1.2rem .8rem;
	padding-right: .8rem;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	justify-content: flex-start;
	-webkit-justify-content: flex-start;
	transition: .3s;
	border-radius: .8rem
}

.header .submenu .submenu-item-link-icon {
	flex-shrink: 0;
	margin-right: .8rem;
	width: 2.4rem;
	height: 2.4rem
}

.header .submenu .submenu-item:nth-child(4n+1).current-menu-item .submenu-item-link {
	background-color: #faf6ff
}

@media screen and (min-width:1201px) {
	.header .submenu .submenu-item:nth-child(4n+1):hover .submenu-item-link {
		background-color: #faf6ff
	}
}

.header .submenu .submenu-item:nth-child(4n+2).current-menu-item .submenu-item-link {
	background-color: #fff5fb
}

@media screen and (min-width:1201px) {
	.header .submenu .submenu-item:nth-child(4n+2):hover .submenu-item-link {
		background-color: #fff5fb
	}
}

.header .submenu .submenu-item:nth-child(4n+3).current-menu-item .submenu-item-link {
	background-color: #fff6ed
}

@media screen and (min-width:1201px) {
	.header .submenu .submenu-item:nth-child(4n+3):hover .submenu-item-link {
		background-color: #fff6ed
	}
}

.header .submenu .submenu-item:nth-child(4n+4).current-menu-item .submenu-item-link {
	background-color: #edfbff
}

@media screen and (min-width:1201px) {
	.header .submenu .submenu-item:nth-child(4n+4):hover .submenu-item-link {
		background-color: #edfbff
	}
}

@media screen and (min-width:1201px) {
	.header .menu-item:hover .submenu {
		opacity: 1;
		pointer-events: auto;
		visibility: visible;
		transform: translate(0, 2.5rem)
	}

	.header .menu-item:hover::before {
		display: block
	}
}

.header-cart {
	width: 4rem;
	height: 4rem;
	margin-left: .8rem
}

@media screen and (min-width:1201px) {
	.header-cart {
		position: relative;
		z-index: 30
	}
}

.header-cart-wrap {
	position: relative
}

.header-cart .icon {
	width: 4rem;
	height: 4rem;
	position: relative;
	border-radius: .8rem;
	background-color: #1ec0f2;
	cursor: pointer
}

.header-cart .icon-img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 1.6rem;
	height: 1.6rem;
	transition: .3s
}

.header-cart .icon-img:nth-child(2) {
	opacity: 0
}

.header-cart .qty {
	position: absolute;
	top: 0;
	right: 0;
	transform: translate(50%, -50%);
	font-size: 1.4rem;
	color: #fff;
	background-color: #f41e92;
	padding: .2rem;
	border-radius: 50%;
	min-width: 2.4rem;
	height: 2.4rem;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center
}

@media screen and (max-width:1200px) {
	.header-cart .qty {
		transform: translate(25%, -25%)
	}
}

.mini-cart {
	position: relative
}

.mini-cart.show-on-mobile {
	display: none
}

@media screen and (max-width:1200px) {
	.mini-cart.show-on-mobile {
		display: block
	}
}

.mini-cart.show-on-mobile .menu-item-link {
	width: 3.2rem;
	height: 3.2rem;
	border-radius: .3rem
}

.mini-cart.show-on-mobile .menu-item-link .icon {
	width: 1.2rem;
	height: 1.2rem
}

.mini-cart.show-on-mobile .mini-cart-qty {
	width: 1.8rem;
	height: 1.8rem;
	font-size: 1.2rem
}

.mini-cart::before {
	content: "";
	position: absolute;
	top: 100%;
	right: 0;
	width: calc(100% + 3rem);
	height: 1.6rem;
	background-color: transparent
}

.mini-cart .menu-item-link {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	width: 4rem;
	height: 4rem;
	background-color: #1ec0f2;
	border-radius: .8rem
}

.mini-cart .menu-item-link .icon {
	width: 1.6rem;
	height: 1.6rem
}

.mini-cart .mini-cart-qty {
	position: absolute;
	top: 0;
	right: 0;
	transform: translate(50%, -50%);
	display: block;
	width: 2.4rem;
	height: 2.4rem;
	border-radius: 50%;
	background-color: #f41e92;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	font-size: 1.4rem;
	color: #fff
}

@media screen and (max-width:1200px) {
	.site-host .header-cart {
		position: fixed;
		top: 1.6rem;
		right: 6.4rem;
		margin: 0;
		padding: 0;
		pointer-events: auto;
		width: 3.2rem;
		height: 3.2rem
	}

	.site-host .header-cart .icon {
		width: 3.2rem;
		height: 3.2rem;
		border-radius: .4rem
	}

	.site-host .header-cart .icon img {
		width: 1.2rem;
		height: 1.2rem
	}

	.site-host .header-cart .qty {
		height: 1.6rem;
		min-width: 1.6rem;
		font-size: 1rem
	}

	.site-host .header-search {
		right: 10.4rem
	}

	.site-host .header-logo-sp {
		width: 57%
	}
}

@media screen and (max-width:500px) {
	.site-host .header-left {
		width: 55%
	}

	.site-host .header-logo img {
		content: url("../assets/icon/bakvitech-logo.png")
	}

	.site-software .header-logo img {
		content: url("../assets/icon/bakvitech-logo.png")
	}
}

@media screen and (max-width:350px) {
	.site-host .header-left {
		width: 50%
	}
}

.c-popup {
	position: fixed;
	z-index: 1000;
	top: 8rem;
	right: 3.2rem;
	height: auto;
	max-height: calc(100vh - 16rem);
	transform: translateX(calc(100% + 3.2rem));
	transition: .3s linear;
	pointer-events: none
}

@media screen and (max-width:1200px) {
	.c-popup {
		right: .8rem;
		top: .8rem;
		max-height: calc(100vh - 1.6rem);
		transform: translateX(calc(100% + .8rem))
	}
}

.c-popup.active {
	transform: translateX(0);
	pointer-events: auto
}

.c-popup-wrap {
	position: relative;
	height: 100%;
	max-height: calc(100vh - 1.6rem);
	min-width: 36rem;
	width: 40rem
}

@media screen and (max-width:600px) {
	.c-popup-wrap {
		width: calc(100vw - 1.6rem)
	}
}

.c-popup .host-service-aside-wrap {
	overflow: hidden auto;
	height: 100%;
	max-height: calc(100vh - 1.6rem);
	border-radius: 1.6rem;
	box-shadow: 0 .4rem 3rem rgba(0, 0, 0, .16);
	padding: 1.6rem
}

@media screen and (max-width:1200px) {
	.c-popup .host-service-aside-wrap {
		border-radius: .8rem
	}
}

.c-popup .host-service-cart {
	margin-bottom: 1.6rem
}

.c-popup .host-service-aside-item,
.c-popup .host-service-aside-item-header,
.c-popup .host-service-cart-item {
	padding: .4rem 0
}

.c-popup .host-service-aside-item-body {
	padding-top: .2rem
}

.c-popup .host-service-aside-item .label-small {
	font-size: 1.6rem
}

.c-popup .host-service-aside-item .price.price-big,
.c-popup .host-service-aside-item .price.price-biggest,
.c-popup .host-service-aside-tt {
	font-size: 1.8rem
}

.c-popup .host-service-aside-tt {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	justify-content: space-between;
	gap: .4rem
}

.c-popup .host-service-aside-tt .close-modal {
	display: block;
	width: 2.4rem;
	height: 2.4rem;
	border-radius: .4rem;
	border: .1rem solid rgba(0, 0, 0, .7);
	cursor: pointer;
	transition: .3s;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center
}

@media screen and (min-width:1201px) {
	.c-popup .host-service-aside-tt .close-modal:hover {
		border-color: #1ec0f2
	}

	.c-popup .host-service-aside-tt .close-modal:hover .fas {
		color: #1ec0f2
	}
}

.c-popup .host-service-aside-tt .close-modal .fas {
	transition: .3s;
	font-weight: 300
}

.c-popup .c-popup .host-service-aside-item .label-small,
.c-popup .host-service-aside-item-body,
.c-popup .host-service-cart-item .desc,
.c-popup .host-service-cart-item .name,
.c-popup .host-service-cart-item .price {
	font-size: 1.4rem
}

.c-popup .host-service-aside-item-body .d-flex.f-start {
	flex-wrap: nowrap
}

.c-popup .host-service-aside-item-body .checkbox-cus-name {
	margin-top: -.2rem
}

.c-popup .host-service-aside-item-body .checkbox-cus-item {
	width: calc(50% - 1.6rem)
}

.host-service-aside-wrap .host-service-aside-tt {
	margin-bottom: .8rem
}

.host-service-aside-wrap .name,
.host-service-aside-wrap .txt {
	font-weight: 600
}

.host-service-cart-item {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	align-items: flex-start;
	justify-content: space-between;
	gap: .8rem;
	border-bottom: 1px solid rgba(58, 58, 58, .1)
}

.host-service-cart-item .desc {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center
}

.host-service-cart-item .desc .label {
	white-space: nowrap
}

.host-service-cart-item .remove {
	margin-left: auto;
	width: 4rem;
	height: 4rem;
	border-radius: .8rem;
	background-color: #fff1f0;
	transition: .3s;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	transition: .3s;
	cursor: pointer
}

@media screen and (min-width:1201px) {
	.host-service-cart-item .remove:hover {
		background-color: #1ec0f2
	}

	.host-service-cart-item .remove:hover img {
		filter: brightness(0) invert(1);
		-webkit-filter: brightness(0) invert(1)
	}
}

.host-service-cart-item .remove img {
	width: 40%;
	height: 40%;
	object-fit: contain;
	transition: .3s
}

.hd-search-suggest .suggest-item .icon {
	padding: 0
}

@media screen and (max-width:1200px) {
	.mega-menu-background {
		display: none
	}
}

.mega-menu-back img {
	object-fit: contain
}

.site-software .hd-bar.active .menu__svg path,
.site-software .menu__svg path {
	stroke: #2686ec
}

.site-host .hd-bar.active .menu__svg path,
.site-host .menu__svg path {
	stroke: #1ec0f2
}

.site-software .mega-menu-back {
	color: #2686ec
}

.site-software .mega-menu-back img {
	content: url("../assets/images/header/icon-arrow-software.svg")
}

.site-host .mega-menu-back {
	color: #1ec0f2
}

.site-host .mega-menu-back img {
	content: url("../assets/images/header/icon-arrow-host.svg")
}

.hd-bar {
	margin-left: 2.4rem;
	margin-right: .2rem;
	width: 3.2rem;
	height: 3.2rem;
	background: #f7f7f7;
	border-radius: .2rem
}

.hd-bar span {
	height: .2rem;
	border-radius: .5rem
}

.hd-bar span:nth-child(1),
.hd-bar span:nth-child(3) {
	width: 1.4rem
}

.hd-bar span:nth-child(2) {
	width: 1rem;
	left: unset;
	right: .5rem;
	transform: translate(0, -50%)
}

@media screen and (max-width:770px) {
	.hd-bar {
		margin-right: .8rem
	}
}

@media screen and (max-width:450px) {
	.hd-bar {
		margin-left: 1.4rem;
		margin-right: .8rem
	}
}

.menu__svg {
	transition: .4s ease
}

.menu__svg path {
	fill: none;
	transition: stroke-dasharray .4s, stroke-dashoffset .4s;
	stroke: #7c0fd1;
	stroke-width: 6;
	stroke-linecap: round
}

.menu__svg path:nth-child(1) {
	stroke-dasharray: 40 160
}

.menu__svg path:nth-child(2) {
	transform: rotate(0)
}

.menu__svg path:nth-child(3) {
	stroke-dasharray: 40 85;
	transform-origin: 50%;
	transition: transform .4s, stroke-dashoffset .4s
}

.hd-bar {
	z-index: 6
}

.hd-bar.active .menu__svg {
	transform: rotate(45deg)
}

.hd-bar.active .menu__svg path {
	fill: none;
	transition: stroke-dasharray .4s, stroke-dashoffset .4s;
	stroke: #7c0fd1;
	stroke-linecap: round
}

.hd-bar.active .menu__svg path:nth-child(1),
.hd-bar.active .menu__svg path:nth-child(3) {
	stroke-dashoffset: -64px
}

.hd-bar.active .menu__svg path:nth-child(2) {
	transform-origin: 50%;
	transform: rotate(90deg)
}

.mega-menu-close .hd-bar {
	margin: 0
}

.mega-menu-child .hd-bar {
	margin-right: -.7rem;
	margin-top: -.8rem
}

@media screen and (max-width:770px) {
	.mega-menu-child .hd-bar {
		margin-right: -.8rem
	}
}

@media screen and (max-width:450px) {
	.mega-menu-child .hd-bar {
		margin-right: -.8rem;
		margin-top: -.8rem
	}
}

.bg-page,
.bg-page-out {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, .3);
	z-index: 2;
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
	transition: .3s
}

:root {
	--paddingMegaMenu: 3.2rem;
	--paddingMegaMenuSmall: 1.6rem;
	--backgroundContent: #EEF2F6;
	--gutterContentItem: 3.2rem;
	--gutterContentItemSmall: 1.6rem;
	--widthMenuSp: 37.5rem;
	--widthContentItem: 30rem;
	--widthContentItemSmall: 32rem;
	--heightHD: 8rem;
	--heightHDSmall: 6.6rem
}

header.header.header-height {
	height: var(--heightHD)
}

@media screen and (max-width:1200px) {
	header.header.header-height {
		padding: 1.2rem 0;
		height: var(--heightHDSmall)
	}
}

@media screen and (min-width:1201px) {
	.show-on-sp {
		display: none !important
	}
}

@media screen and (min-width:1201px) {
	.mega-menu-tab .tab-item:not(.active):hover::before {
		opacity: 1
	}
}

.mega-menu-tab-bg {
	transition: all .5s cubic-bezier(.25, .46, .45, .94)
}

.header-mid-flex.d-flex {
	width: 100%
}

.mega-menu-wrap {
	position: fixed;
	z-index: 12;
	top: calc(var(--heightHD) - .1rem);
	left: 0;
	width: 100%;
	transition: .6s cubic-bezier(.585, -.195, .245, 1.25);
	box-shadow: 0 5rem 10rem rgba(50, 72, 92, .25);
	border-top: .1rem solid rgba(50, 72, 92, .25);
	pointer-events: none;
	visibility: hidden
}

@media screen and (min-width:1201px) {
	.mega-menu-wrap {
		min-height: 65rem;
		height: var(--heightMegaMenu);
		transform: translateY(calc(-100% - 8rem))
	}
}

@media screen and (max-width:1200px) {
	.mega-menu-wrap {
		opacity: 0;
		position: absolute;
		top: calc(var(--heightHDSmall) - .9rem);
		left: 0;
		width: 100%;
		height: calc(100% - var(--heightHDSmall) + .9rem);
		background-color: #fff;
		border-bottom-left-radius: .8rem;
		border-bottom-right-radius: .8rem
	}
}

@media screen and (min-width:1201px) {
	.mega-menu-tab .tab-item:not(.active):hover::before {
		opacity: 1
	}
}

.mega-menu-tab-bg {
	transition: all .5s cubic-bezier(.25, .46, .45, .94)
}

.mega-menu-wrap.active {
	opacity: 1;
	pointer-events: auto;
	visibility: visible;
	transform: translateY(0)
}

.header-height .header-menu .mega-menu-inner {
	top: 0;
	transition: .25s linear;
	transition-property: transform, width, height;
	will-change: transform, width, height;
	background-color: #fff;
	padding: var(--paddingMegaMenu);
	transform: unset;
	opacity: 1;
	pointer-events: auto;
	visibility: visible
}

@media screen and (min-width:1201px) {
	.header-height .header-menu .mega-menu-inner {
		min-height: 65rem;
		height: var(--heightMegaMenu)
	}
}

@media screen and (max-width:1200px) {
	.header-height .header-menu .mega-menu-inner {
		pointer-events: none;
		height: 100%;
		padding: 0
	}
}

.mega-menu-content {
	border-radius: 1.6rem;
	overflow: hidden;
	position: relative;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column
}

.mega-menu-content-bg {
	background-color: var(--backgroundContent)
}

.mega-menu-tab {
	position: relative
}

.mega-menu-tab-bg {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: var(--widthMegaMenuTab);
	transform: translateX(var(--transformMegaMenuTab));
	background-color: var(--backgroundContent);
	border-top-left-radius: 1.6rem;
	border-top-right-radius: 1.6rem;
	transition: all .5s cubic-bezier(.25, .46, .45, .94)
}

@media screen and (max-width:1200px) {
	.mega-menu-tab-bg {
		display: none
	}
}

.mega-menu-tab-bg .triangle {
	position: absolute;
	bottom: -.1rem;
	height: 90%;
	width: 3.5rem
}

.mega-menu-tab-bg .triangle:nth-child(1) {
	left: 0;
	transform: translateX(-44%)
}

.mega-menu-tab-bg .triangle:nth-child(2) {
	right: 0;
	transform: translateX(94%)
}

.mega-menu-tab-bg .triangle::after,
.mega-menu-tab-bg .triangle::before {
	content: '';
	position: absolute;
	top: 0;
	width: 50%;
	height: 100%
}

.mega-menu-tab-bg .triangle:nth-child(1):before {
	background-color: var(--backgroundContent);
	clip-path: polygon(100% 100%, 100% 0, 0 100%)
}

.mega-menu-tab-bg .triangle:nth-child(1):after {
	background-color: #fff;
	clip-path: polygon(100% 0, 0 0, 0 100%)
}

.mega-menu-tab-bg .triangle:nth-child(2):before {
	background-color: var(--backgroundContent);
	clip-path: polygon(0 0, 0 100%, 100% 100%)
}

.mega-menu-tab-bg .triangle:nth-child(2):after {
	background-color: #fff;
	clip-path: polygon(100% 0, 0 0, 100% 100%)
}

.mega-menu-tab-bg .triangle .before {
	width: 4.2rem;
	height: 4.2rem;
	position: absolute;
	z-index: 3;
	bottom: .1rem
}

.mega-menu-tab-bg .triangle:nth-child(1) .before {
	transform: translateX(-88%);
	left: 0
}

.mega-menu-tab-bg .triangle:nth-child(2) .before {
	transform: translateX(45%);
	right: 0
}

.mega-menu-tab-bg .triangle .before::after,
.mega-menu-tab-bg .triangle .before::before {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%
}

.mega-menu-tab-bg .triangle:nth-child(1) .before::before {
	border-bottom-right-radius: 2rem;
	background-color: #fff;
	z-index: 2
}

.mega-menu-tab-bg .triangle:nth-child(2) .before::before {
	border-bottom-left-radius: 2rem;
	background-color: #fff;
	z-index: 2
}

.mega-menu-tab-bg .triangle .before::after {
	background-color: var(--backgroundContent)
}

.mega-menu-tab-bg.first .triangle:nth-child(1) .before {
	transform: translateY(50%)
}

.mega-menu-tab-bg.first .triangle:nth-child(1) .before::before {
	background-color: var(--backgroundContent)
}

.mega-menu-tab .tab-list {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	position: relative;
	z-index: 2
}

@media screen and (max-width:1200px) {
	.mega-menu-tab .tab-list {
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start
	}
}

.mega-menu-tab .tab-item {
	padding: 2.2rem 1.6rem;
	border-top-left-radius: 1.6rem;
	border-top-right-radius: 1.6rem;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	cursor: pointer;
	position: relative
}

@media screen and (max-width:1200px) {
	.mega-menu-tab .tab-item {
		width: 100%;
		padding: 1.6rem;
		padding-right: 3.8rem;
		margin-right: 0
	}
}

.mega-menu-tab .tab-item:not(:last-child) {
	margin-right: 1.6rem
}

.mega-menu-tab .tab-item::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: calc(100% - 1rem);
	height: calc(100% - 2.5rem);
	background-color: var(--backgroundContent);
	border-radius: .8rem;
	z-index: -1;
	pointer-events: none;
	opacity: 0;
	transition: .3s
}

.mega-menu-tab .tab-item .icon {
	--sizeIcon: 2.4rem;
	--sizeIconSmall: 1.6rem;
	width: var(sizeIcon);
	height: var(sizeIcon);
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	flex-shrink: 0;
	margin-right: .8rem
}

@media screen and (max-width:1200px) {
	.mega-menu-tab .tab-item .icon {
		width: var(sizeIconSmall);
		height: var(sizeIconSmall)
	}
}

.mega-menu-tab .tab-item .name {
	font-size: 1.4rem;
	font-weight: 700;
	text-transform: uppercase
}

.mega-menu-panel {
	flex: 1;
	padding: 1.6rem;
	background-color: var(--backgroundContent);
	border-radius: 1.6rem
}

.mega-menu-panel .mega-menu-panel-wrap {
	display: flex;
	align-items: flex-start;
	height: 100%
}

.mega-menu-list {
	flex: 1;
	position: relative;
	width: 100%;
	height: 100%
}

.mega-menu-item {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	will-change: transform, opacity;
	transition: .3s cubic-bezier(.25, .46, .45, .94);
	opacity: 0;
	pointer-events: none;
	visibility: hidden
}

.mega-menu-item-wrap {
	transform: translateX(3rem);
	will-change: transform, opacity;
	transition: .3s cubic-bezier(.25, .46, .45, .94)
}

@media screen and (min-width:1201px) {
	.mega-menu-item.active {
		opacity: 1;
		pointer-events: auto;
		visibility: visible
	}
}

.mega-menu-item.active .mega-menu-item-wrap {
	transform: translateX(0)
}

.mega-menu-item.mega-menu-item--before .mega-menu-item-wrap {
	transform: translateX(-3rem)
}

.mega-menu-list .content-desc {
	font-size: 1.6rem;
	font-style: italic;
	color: #3a3a3a;
	margin-bottom: 1.2rem
}

.mega-menu-content .content-list {
	display: flex;
	align-items: flex-start
}

@media screen and (max-width:1200px) {
	.mega-menu-content .content-list {
		padding-bottom: 1.6rem
	}
}

.mega-menu-content .content-item {
	width: calc(100% / 3);
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
	margin-right: var(--gutterContentItem)
}

.mega-menu-content .content-item span {
	display: block
}

.mega-menu-content .mega-menu-item-style-first .content-item:nth-child(1) {
	width: calc(100% / 3 + var(--gutterContentItem));
	padding-right: var(--gutterContentItem);
	border-right: .1rem solid rgba(58, 58, 58, .2)
}

.mega-menu-content .mega-menu-item-style-seconds .content-item:not(:last-child) .item,
.mega-menu-content .mega-menu-item-style-seconds .content-item:nth-child(2) .item {
	flex-wrap: wrap
}

.mega-menu-content .mega-menu-item-style-seconds .content-item:last-child:not(:nth-child(2)) {
	width: 48%;
	padding-left: var(--gutterContentItem);
	border-left: .1rem solid rgba(58, 58, 58, .2)
}

@media screen and (max-width:1200px) {
	.mega-menu-content .mega-menu-item-style-seconds .content-item:last-child:not(:nth-child(2)) {
		width: var(--widthContentItem);
		padding-left: var(--gutterContentItemSmall)
	}
}

.mega-menu-content .mega-menu-item-style-seconds .content-item:not(:last-child) .content-img,
.mega-menu-content .mega-menu-item-style-seconds .content-item:nth-child(2) .content-img {
	width: 100%
}

.mega-menu-content .mega-menu-item-style-thirds .content-item:nth-child(1) {
	width: calc(100% / 3);
	padding-right: var(--gutterContentItem);
	border-right: .1rem solid rgba(58, 58, 58, .2);
	flex-shrink: 0
}

.mega-menu-content .mega-menu-item-style-thirds .content-item .item {
	align-items: flex-start
}

.mega-menu-content .mega-menu-item-style-thirds .content-item .name {
	display: flex;
	align-items: flex-start;
	margin-bottom: .8rem;
	gap: .8rem
}

.mega-menu-content .mega-menu-item-style-thirds .content-item .name .name-txt {
	flex: 1;
	margin-left: 0;
	line-height: 1.3;
	padding-top: .2rem
}

.mega-menu-content .mega-menu-item-style-thirds .content-item .name .name-tag {
	width: 45%;
	flex-shrink: 0
}

.mega-menu-content .mega-menu-item-style-thirds .content-item .name .name-tag img {
	object-fit: contain
}

.mega-menu-content .content-item .item {
	display: flex;
	align-items: center;
	transition: .3s;
	border-radius: .8rem
}

@media screen and (min-width:1201px) {
	.mega-menu-content .content-item .item.active {
		background-color: #fff;
		box-shadow: 0 .4rem .4rem -.2rem rgba(16, 24, 40, .03), 0 1rem 1.4rem -.2rem rgba(16, 24, 40, .08)
	}

	.mega-menu-content .content-item .item.active .content-text .name {
		color: #7c0fd1
	}

	.mega-menu-tab .tab-item:not(.active):hover::before {
		opacity: 1
	}
}

.mega-menu-content .content-item .item:active .content-text .name {
	color: #7c0fd1
}

.mega-menu-content .content-item .item:not(:last-child) {
	margin-bottom: .8rem
}

.mega-menu-content .content-item .item .content-img {
	width: 40%;
	border-radius: .8rem;
	overflow: hidden
}

.mega-menu-content .content-item .item .content-icon {
	width: 1.6rem;
	height: 1.6rem;
	margin-top: 1.6rem;
	margin-left: 1.2rem;
	flex-shrink: 0;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center
}

.mega-menu-content .content-item .item .content-text {
	flex: 1;
	padding: 1.2rem
}

.mega-menu-sticked {
	max-width: max-content;
	margin-bottom: .4rem;
	padding: .5rem 1rem;
	padding-bottom: .3rem;
	display: flex !important;
	align-items: center;
	border-radius: .4rem;
	border: .1rem solid #c09148;
	background: linear-gradient(93deg, #f41e92 -34.85%, #f5851e 101.44%);
	position: relative;
	overflow: hidden;
	font-size: 1.2rem;
	font-weight: 700;
	color: #fff
}

.mega-menu-sticked.premium {
	background: radial-gradient(1041.96% 97.06% at -31.25% -25%, #1ec0f2 0, #002d3b 100%), radial-gradient(72.32% 21.43% at 50% 50%, rgba(1, 151, 167, .98) 0, rgba(0, 92, 103, .98) 100%)
}

@-webkit-keyframes contentTagShine {

	0%,
	20%,
	40% {
		left: -75%
	}

	100% {
		left: 125%
	}
}

@keyframes contentTagShine {

	0%,
	20%,
	40%,
	60% {
		left: -75%
	}

	100% {
		left: 125%
	}
}

.mega-menu-sticked::before {
	content: "";
	position: absolute;
	top: 0;
	left: -75%;
	z-index: 2;
	display: block;
	width: 12%;
	height: 100%;
	background: rgba(255, 255, 255, .1);
	mix-blend-mode: plus-lighter;
	-webkit-transform: skewX(-25deg);
	transform: skewX(-25deg)
}

.header-menu .mega-menu-wrap.active .mega-menu-sticked::before {
	-webkit-animation: contentTagShine 3s infinite;
	animation: contentTagShine 3s infinite
}

.mega-menu-content .content-item .item .content-text .content-tag .icon {
	flex-shrink: 0
}

.mega-menu-content .content-item .item .content-text .name {
	font-size: 1.6rem;
	font-weight: 700;
	transition: .3s;
	color: #3a3a3a;
	transition: .3s
}

.mega-menu-content .content-item .item .content-text .desc {
	font-size: 1.4rem;
	font-style: italic;
	color: #5f5f5f
}

.mega-menu-tag {
	width: 100%
}

.mega-menu-tag .link {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	padding: 1.2rem;
	transition: .3s;
	width: 100%
}

.mega-menu-tag .link .icon {
	width: 1.6rem;
	height: 1.6rem;
	margin-right: .8rem;
	flex-shrink: 0
}

.mega-menu-tag .link .name {
	font-size: 1.6rem;
	font-weight: 700;
	transition: .3s
}

@media screen and (min-width:1201px) {
	.mega-menu-tag .link .name {
		display: -webkit-box;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
		overflow: hidden
	}
}

.mega-menu-content .mega-menu-banner {
	width: 17.6%;
	max-width: 27.6rem;
	position: relative;
	border-radius: .8rem;
	overflow: hidden;
	margin-top: 3.6rem
}

@media screen and (max-width:1200px) {
	.mega-menu-content .mega-menu-banner {
		display: none
	}
}

.mega-menu-content .mega-menu-banner .bg {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%
}

@keyframes bgRotate {
	100% {
		transform: rotate(360deg)
	}
}

.mega-menu-content .mega-menu-banner .bg-2 {
	width: 100%;
	height: auto;
	top: 35%;
	border-radius: .8rem
}

.mega-menu-content .mega-menu-banner .bg-2 img {
	animation: bgRotate 10s linear infinite
}

.mega-menu-content .mega-menu-banner .text {
	position: relative;
	z-index: 3
}

.mega-menu-content .mega-menu-banner .text-header {
	padding: 2.4rem 1.2rem;
	text-align: center;
	font-weight: 700
}

.mega-menu-content .mega-menu-banner .title {
	color: #fff;
	text-align: center;
	text-shadow: .3rem .3rem 0 #000, .2rem .2rem 0 #2686ec;
	font-size: 2.8rem;
	font-style: italic;
	letter-spacing: .056rem;
	text-transform: uppercase;
	margin-bottom: 1.2rem
}

.mega-menu-content .mega-menu-banner .discount {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: flex-end;
	padding-left: 2.4rem;
	padding-right: 3.2rem;
	max-width: max-content;
	margin-left: auto;
	margin-right: auto
}

.mega-menu-content .mega-menu-banner .discount .text {
	display: flex;
	gap: .4rem
}

.mega-menu-content .mega-menu-banner .discount::before {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 64%;
	border-radius: .8rem;
	background: #123366
}

.mega-menu-content .mega-menu-banner .discount .text-linear {
	font-size: 2.4rem;
	background: linear-gradient(6deg, #f59034 15.62%, #fecd1f 67.42%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent
}

.mega-menu-content .mega-menu-banner .discount .value {
	position: relative;
	line-height: 1
}

.mega-menu-content .mega-menu-banner .discount .num {
	font-size: 5.6rem;
	font-weight: 800;
	background: linear-gradient(6deg, #f59034 15.62%, #fecd1f 67.42%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent
}

.mega-menu-content .mega-menu-banner .discount .percent {
	font-size: 3rem;
	background: linear-gradient(6deg, #f59034 15.62%, #fecd1f 67.42%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	position: absolute;
	top: 0;
	right: 0;
	transform: translateX(100%)
}

@keyframes tramsFormScale {

	0%,
	100%,
	30%,
	70% {
		transform: scale(1)
	}

	50%,
	90% {
		transform: scale(.9)
	}
}

@keyframes transformScaleValue {

	0%,
	100%,
	20%,
	40%,
	55%,
	80% {
		transform: scale(1)
	}

	50% {
		transform: scale(1.15)
	}
}

.mega-menu-wrap.active .mega-menu-content .mega-menu-banner .title {
	animation: tramsFormScale 3s ease-in-out infinite
}

.mega-menu-wrap.active .mega-menu-content .mega-menu-banner .discount .text-item {
	animation: transformScaleValue 4s ease-in-out infinite
}

.mega-menu-wrap.active .mega-menu-content .mega-menu-banner .discount .text-item:nth-child(2) {
	animation-delay: .5s
}

.mega-menu-wrap.active .mega-menu-content .mega-menu-banner .discount .value .text-item {
	animation-delay: 1s
}

@media screen and (min-width:1201px) {
	.mega-menu-content .content-item .item:hover {
		background-color: #fff;
		box-shadow: 0 .4rem .4rem -.2rem rgba(16, 24, 40, .03), 0 1rem 1.4rem -.2rem rgba(16, 24, 40, .08)
	}

	.mega-menu-content .content-item .item:hover .content-text .name {
		color: #7c0fd1
	}

	.mega-menu-tag .link:hover {
		color: #7c0fd1
	}
}

.mega-menu-back .flex {
	display: flex;
	align-items: center;
	justify-content: flex-start
}

.mega-menu-back .flex .icon {
	width: 1.6rem;
	height: 1.6rem;
	flex-direction: 0;
	margin-right: .8rem
}

.mega-menu-tab .tab-item .icon-arrow {
	position: absolute;
	top: 1.8rem;
	right: 1.2rem;
	width: 1.6rem;
	height: 1.6rem
}

.header-height .header-menu .menu-item.dropdown .dropdown-btn img {
	width: 1.6rem;
	height: 1.6rem
}

.header-height .header-menu .menu-item.dropdown .mega-menu-sticked .show-on-sp {
	pointer-events: none
}

@media screen and (max-width:1200px) {
	.header-height .header-menu .menu-item.dropdown .mega-menu-sticked .show-on-sp {
		display: flex
	}
}

@media screen and (max-width:1380px) {
	.mega-menu-content .mega-menu-item-style-thirds .content-item:nth-child(1) {
		width: calc(100% / 3.5)
	}
}

@media screen and (max-width:1200px) {
	.mega-menu-content .content-item .item .content-img {
		width: 32%
	}

	.mega-menu-sticked {
		font-size: .8rem;
		padding: .2rem .8rem;
		padding-bottom: .1rem;
		margin-bottom: .2rem
	}

	.header-height .header-menu .menu-item .mega-menu-sticked .icon {
		margin-right: .4rem;
		width: 1rem;
		height: 1rem
	}

	.header-height.header .submenu .submenu-item-link-icon {
		width: 1.6rem;
		height: 1.6rem
	}

	.header-height .header-hotline-w .header-hotline.night .header-hotline-wrap .num {
		margin-left: 0
	}

	.header-height .header-mid {
		width: var(--widthMenuSp);
		min-height: 70rem;
		max-height: 100vh;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		padding: .6rem 1.6rem;
		padding-bottom: 12rem
	}
}

@media screen and (max-width:1200px) and (max-width:1200px) {
	.header-height .header-mid {
		align-items: flex-start
	}
}

@media screen and (max-width:1200px) {
	.header.header-height .hotline-sp {
		position: absolute;
		bottom: 1.6rem;
		right: 1.6rem;
		z-index: 12;
		margin: 0;
		padding-top: 1.6rem;
		opacity: 0
	}

	.header.header-height .hotline-sp::before {
		content: '';
		position: absolute;
		top: 0;
		left: -6.2rem;
		width: calc(var(--widthMenuSp) - 3.2rem);
		border-top: .1rem solid #e0e0e0
	}

	.mega-menu-list .content-desc {
		font-size: 1.4rem;
		padding-right: 1.6rem
	}

	.mega-menu-tab .tab-item .icon-arrow {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-ms-align-items: center;
		align-items: center;
		-webkit-align-items: center;
		justify-content: center;
		-webkit-justify-content: center
	}

	.mega-menu-panel {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: #fff;
		z-index: 12;
		padding-right: 0;
		opacity: 0;
		pointer-events: none;
		visibility: hidden;
		z-index: -2
	}

	.mega-menu-panel.active {
		z-index: 12;
		opacity: 1;
		pointer-events: auto;
		visibility: visible
	}

	.mega-menu-panel .mega-menu-back {
		padding: 0;
		margin-right: 1.6rem;
		margin-bottom: 1.6rem
	}

	.mega-menu-content .content-list {
		display: flex;
		overflow-x: auto;
		scroll-snap-type: x mandatory
	}

	.mega-menu-content .content-list::-webkit-scrollbar {
		height: .4rem;
		width: 8rem
	}

	.mega-menu-content .content-list::-webkit-scrollbar-track {
		background: rgba(58, 58, 58, .2)
	}

	.mega-menu-content .content-list::-webkit-scrollbar-thumb {
		background: #7c0fd1;
		border-radius: 2rem
	}

	.mega-menu-content .content-list::before {
		content: '';
		position: absolute;
		bottom: 0;
		right: 0;
		width: 1.6rem;
		height: .4rem;
		background-color: #fff;
		pointer-events: none
	}

	.mega-menu-content .content-item {
		scroll-snap-align: start;
		width: var(--widthContentItemSmall);
		flex-shrink: 0;
		margin-right: var(--gutterContentItemSmall)
	}

	.mega-menu-content .mega-menu-item-style-first .content-item:nth-child(1) {
		width: var(--widthContentItem);
		padding-right: 0;
		border: unset
	}

	.mega-menu-content .content-item .item .content-text {
		padding-top: .4rem;
		padding-bottom: .4rem;
		padding-left: .8rem
	}

	.mega-menu-tag .link {
		padding: .8rem 0;
		padding-left: 0
	}

	.mega-menu-tag .link {
		font-size: 1.4rem
	}

	.mega-menu-content .content-item .item .content-text .content-tag {
		width: 9.6rem
	}

	.mega-menu-tag .link .name {
		font-size: 1.4rem
	}

	.mega-menu-wrap {
		z-index: -1
	}

	.mega-menu-wrap.active {
		z-index: 12
	}

	.mega-menu-wrap.active .mega-menu-inner,
	.mega-menu-wrap.active .mega-menu-item.active {
		opacity: 1;
		visibility: visible;
		pointer-events: auto
	}

	.mega-menu-content .mega-menu-item-style-seconds .content-item:last-child {
		width: var(--widthContentItem);
		padding-left: 0;
		border: unset
	}

	.mega-menu-content .content-item .item .content-text .name {
		font-size: 1.4rem
	}

	.mega-menu-content .content-item .item .content-icon {
		margin-top: .4rem;
		margin-left: 0
	}

	.mega-menu-content .mega-menu-item-style-thirds .content-item .name .name-tag {
		width: 35%
	}

	.mega-menu-content .mega-menu-item-style-thirds .content-item .name {
		margin-bottom: .4rem
	}

	.mega-menu-content .mega-menu-item-style-thirds .content-item:nth-child(1) {
		padding-right: 0;
		border: unset;
		width: var(--widthContentItem)
	}

	.header-height .header-menu .menu-item.dropdown .menu-item-link {
		width: 100%
	}

	.header-height .header-menu .menu-item.dropdown .dropdown-btn {
		right: -1.2rem;
		pointer-events: none
	}

	.header-height .header-menu .menu-item.dropdown-sub .menu-item-link {
		width: calc(100% - 3rem)
	}

	.header-height .dropdown-sub .icon-arrow {
		transition: .3s;
		transform: rotate(90deg);
		padding: 1.2rem 1.1rem
	}

	.header-height .dropdown-sub .icon-arrow.active {
		transform: rotate(-90deg)
	}

	.mega-menu-content .content-item .item .content-text .desc {
		font-size: 1.2rem
	}

	.header-height.header .submenu .submenu-item-link {
		font-size: 1.4rem;
		padding: .7rem
	}

	.header-height .header-menu .menu-item-link,
	.mega-menu-inner {
		border-radius: 0
	}

	body.open-menu .menu__svg {
		rotate: 45deg
	}

	body.open-menu .menu__svg path {
		fill: none;
		transition: stroke-dasharray .4s, stroke-dashoffset .4s;
		stroke: #7c0fd1;
		stroke-linecap: round
	}

	body.open-menu .menu__svg path:nth-child(1),
	body.open-menu .menu__svg path:nth-child(3) {
		stroke-dashoffset: -64px
	}

	body.open-menu .menu__svg path:nth-child(2) {
		transform-origin: 50%;
		transform: rotate(90deg)
	}

	body.open-menu .bg-page,
	body.open-menu .bg-page-out {
		opacity: 1;
		pointer-events: auto;
		visibility: visible
	}

	body.open-menu .header-mid {
		background-color: #fff;
		pointer-events: auto
	}

	body.open-menu .header-mid .header-logo-sp,
	body.open-menu .header-mid .header-menu,
	body.open-menu .header-mid .hotline-sp {
		opacity: 1
	}
}

@media screen and (max-width:576px) {
	.header-height .header-mid {
		min-height: 65rem
	}

	.mega-menu-content .mega-menu-item-style-thirds .content-item .name .name-txt br {
		display: none
	}
}

@media screen and (max-width:450px) {
	.header-height .header-mid {
		top: 0;
		left: 0;
		width: 100vw;
		height: 100vh;
		max-height: calc(var(--vh, 1vh) * 100);
		border-radius: 0;
		padding-bottom: 0
	}

	.mega-menu-wrap {
		top: calc(var(--heightHDSmall))
	}

	.header.header-height .hotline-sp {
		bottom: 0;
		right: 0;
		padding: .8rem 1.6rem;
		width: 100%;
		max-width: 100%;
		border-top: .1rem solid #e0e0e0
	}

	.header.header-height .hotline-sp::before {
		content: none
	}

	.header-height .hotline-sp .hotline-panda {
		bottom: -.8rem
	}

	.header-height .header-hotline-w .header-hotline {
		max-width: 21rem;
		margin-left: auto
	}

	.header-height .header-hotline-w .header-hotline-wrap .icon {
		width: 3.2rem;
		height: 3.2rem
	}
}

.header-height .header-menu .mega-menu-inner {
	padding-top: 1.5rem
}

.popper-contextMenu .mega-menu-item {
	position: static;
	opacity: 1;
	pointer-events: unset;
	visibility: visible
}

.header-language {
	display: flex;
	margin-left: 2.4rem;
	position: relative;
	z-index: 30
}

.header-language .language-item {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 1.6rem;
	gap: .4rem;
	font-size: 1.6rem;
	line-height: 1;
	transition: .3s;
	opacity: .5
}

.header-language .language-item:nth-child(1) {
	border-right: .1rem solid rgba(39, 1, 71, .4)
}

.header-language .language-item.current {
	pointer-events: none;
	opacity: 1;
	font-weight: 700
}

.header-language .language-item:hover {
	opacity: 1
}

.header-language .language-item img {
	width: 1.6rem;
	height: 1.6rem;
	object-fit: contain
}

@media screen and (max-width:1200px) {
	.header-language {
		position: fixed;
		top: 2.4rem;
		pointer-events: auto
	}
}

@media screen and (max-width:576px) {
	.header-language {
		margin: 0;
		top: 1.7rem;
		right: 8.6rem
	}

	.header-language .language-item {
		opacity: 1;
		padding: .8rem
	}

	.header-language .language-item:nth-child(1) {
		display: none
	}

	header.header .header-left {
		width: 55%
	}

	.header-search {
		right: 5.4rem
	}
}

:root {
	--secColor: #f58635
}

.ft {
	padding: 8rem 0;
	background-color: #fff
}

@media screen and (max-width:768px) {
	.ft {
		overflow: hidden
	}
}

@media screen and (max-width:1200px) {
	.ft {
		padding: 5.6rem 0
	}
}

@media screen and (max-width:450px) {
	.ft {
		font-size: 1.4rem
	}
}

.ft .hd-menu-info {
	font-size: 1.4rem
}

.ft .hd-menu-info-f {
	margin-bottom: 1.6rem
}

.ft .hd-menu-info-f:last-child {
	margin-bottom: 0
}

.ft .hd-menu-info-f .icon {
	flex-shrink: 0;
	width: 2.4rem;
	height: 2.4rem;
	margin-right: .8rem
}

.ft .hd-menu-info-f .icon img {
	object-fit: contain
}

.ft .hd-menu-info-f .d-flex {
	flex-direction: column;
	-webkit-flex-direction: column
}

.ft .hd-menu-info-f .label {
	display: inline-block;
	margin-bottom: .8rem
}

.ft .hd-menu-info-f .link-h {
	transition: .3s
}

@media screen and (min-width:1201px) {
	.ft .hd-menu-info-f .link-h:hover {
		color: #f58635
	}
}

.ft-row {
	margin-bottom: -4rem
}

@media screen and (max-width:1200px) {
	.ft-row {
		margin-bottom: -2.4rem
	}
}

.ft-col {
	margin-bottom: 4rem
}

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

	.ft-col,
	.ft-col.col {
		width: 50%;
		margin-bottom: 2.4rem
	}
}

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

	.ft-col,
	.ft-col.col {
		width: 100%
	}
}

@media screen and (max-width:1200px) {
	.ft-col.col-6 {
		width: 100%
	}
}

@media screen and (max-width:600px) {
	.ft-col.col-6.contact-col .ft-menu-list-col {
		width: 100%
	}
}

.ft-col.col-6 .ft-menu-list {
	width: calc(100% + 2.4rem);
	margin-left: -1.2rem
}

@media screen and (max-width:1200px) {
	.ft-col.col-6 .ft-menu-list {
		width: calc(100% + 1.5rem);
		margin-left: -.75rem
	}
}

@media screen and (max-width:768px) {
	.ft-col.col-6 .ft-menu-list {
		width: calc(100% + .8rem);
		margin-left: -.4rem
	}
}

.ft-col.col-6 .ft-menu-list-col {
	width: 50%;
	padding: 0 1.2rem
}

@media screen and (max-width:1200px) {
	.ft-col.col-6 .ft-menu-list-col {
		padding: 0 .75rem
	}
}

@media screen and (max-width:768px) {
	.ft-col.col-6 .ft-menu-list-col {
		padding: 0 .4rem
	}
}

@media screen and (max-width:360px) {
	.ft-col.col-6 .ft-menu-list-col {
		width: 100%
	}
}

.ft-col.col-6 .hd-menu-info {
	padding: 0;
	display: block
}

.ft-col.col-6 .hd-menu-info p.d-flex {
	flex-wrap: nowrap;
	-webkit-flex-wrap: nowrap;
	margin-bottom: 2.4rem
}

@media screen and (max-width:1200px) {
	.ft-col.col-6 .hd-menu-info p.d-flex br {
		display: none
	}
}

.ft-col.col-6 .hd-menu-info p.d-flex a {
	transition: .3s
}

@media screen and (min-width:1201px) {
	.ft-col.col-6 .hd-menu-info p.d-flex a:hover {
		color: #f58635
	}
}

.ft-col.col-6 .social-list {
	opacity: .5
}

.ft-col.solution-col .ft-row {
	width: calc(100% + 2.4rem);
	margin-left: -1.2rem
}

@media screen and (max-width:1200px) {
	.ft-col.solution-col .ft-row {
		width: calc(100% + 1.5rem);
		margin-left: -.75rem
	}
}

@media screen and (max-width:768px) {
	.ft-col.solution-col .ft-row {
		width: calc(100% + .8rem);
		margin-left: -.4rem
	}
}

.ft-label {
	font-size: 1.8rem;
	font-weight: 600;
	color: #7c0fd1;
	margin-bottom: 1.6rem
}

@media screen and (max-width:1200px) {
	.ft-label {
		font-size: 1.6rem
	}
}

@media screen and (max-width:450px) {
	.ft-label {
		font-size: 1.5rem
	}
}

.ft-menu {
	font-size: 1.4rem
}

.ft-menu-list-col {
	width: 100%
}

.ft-menu-item.current-menu-item a {
	font-weight: 600;
	color: #f58635
}

.ft-menu-item a {
	display: block;
	padding: .8rem 0;
	transition: .3s
}

@media screen and (max-width:1200px) {
	.ft-menu-item a {
		padding: .4rem 0
	}
}

.ft-menu-item a:hover {
	color: #f58635
}

.ft-corp {
	padding: 4.2rem 0;
	margin: 4rem 0;
	background-color: #f7f7f7;
	position: relative
}

.ft-corp::after,
.ft-corp::before {
	content: "";
	position: absolute;
	width: 100%;
	height: .2rem;
	left: 0;
	background: url("../assets/images/Line-201.png") no-repeat;
	background-size: 100% 100%
}

.ft-corp::before {
	top: 0
}

.ft-corp::after {
	bottom: -.1rem
}

@media screen and (max-width:1200px) {
	.ft-corp {
		padding: 2.4rem 0;
		margin: 2.4rem 0;
		border-top: .1rem dotted #979797;
		border-bottom: .1rem dotted #979797
	}
}

@media screen and (max-width:1200px) and (max-width:768px) {
	.ft-corp {
		padding-top: 3.4rem
	}
}

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

	.ft-corp::after,
	.ft-corp::before {
		content: none
	}
}

@media screen and (max-width:1200px) {
	.ft-corp .ft-corp-col.col-5 {
		width: 60%
	}

	.ft-corp .ft-corp-col.col-7 {
		width: 40%
	}
}

@media screen and (max-width:768px) {
	.ft-corp .d-flex.f-ctn {
		flex-direction: column;
		-webkit-flex-direction: column
	}

	.ft-corp .d-flex.f-ctn .ft-corp-col {
		width: 100%
	}

	.ft-corp .d-flex.f-ctn .ft-corp-col:nth-child(1) {
		margin-bottom: 1.2rem
	}

	.ft-corp .d-flex.f-ctn .ft-corp-col .ft-corp-img-item,
	.ft-corp .d-flex.f-ctn .ft-corp-col .bakvitech-logo {
		justify-content: flex-start;
		-webkit-justify-content: flex-start
	}
}

.ft-corp .d-flex {
	align-items: center;
	-webkit-align-items: center
}

.ft-corp-img {
	width: calc(100% + 2.2rem);
	margin-left: -1.1rem;
	justify-content: flex-end;
	-webkit-justify-content: flex-end
}

@media screen and (max-width:1200px) {
	.ft-corp-img {
		width: calc(100% + 1rem);
		margin-left: -.5rem
	}
}

@media screen and (max-width:768px) {
	.ft-corp-img {
		width: calc(100% + .8rem);
		margin-left: -.4rem
	}
}

.ft-corp-img img {
	object-fit: contain
}

.ft-corp-img-item {
	width: 70%;
	padding: .75rem 0;
	justify-content: flex-end;
	-webkit-justify-content: flex-end
}

@media screen and (max-width:1200px) {
	.ft-corp-img-item {
		padding: .5rem 0;
		flex-wrap: nowrap;
		-webkit-flex-wrap: nowrap;
		width: 100%
	}
}

@media screen and (max-width:768px) {
	.ft-corp-img-item {
		padding: .4rem 0
	}
}

@media screen and (max-width:450px) {
	.ft-corp-img-item {
		width: 100%
	}
}

.ft-corp-img-link {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	padding: .4rem .8rem;
	width: max-content;
	max-width: 70%;
	transition: .3s
}

@media screen and (max-width:1200px) {
	.ft-corp-img-link {
		padding: .4rem;
		max-width: 55%
	}
}

@media screen and (max-width:768px) {
	.ft-corp-img-link {
		max-width: 50%
	}
}

.ft-corp-img-link img {
	min-width: 22rem;
	max-width: 21.7rem
}

@media screen and (max-width:1200px) {
	.ft-corp-img-link img {
		max-width: 100%;
		min-width: 100%
	}
}

@media screen and (max-width:1200px) {
	.ft-corp-img-link.dmca_protected {
		max-width: 30%
	}
}

@media screen and (max-width:768px) {
	.ft-corp-img-link.dmca_protected {
		max-width: 25%
	}
}

.ft-corp-img-link.dmca_protected img {
	max-width: 10.5rem;
	min-width: 10.5rem
}

@media screen and (max-width:1200px) {
	.ft-corp-img-link.dmca_protected img {
		max-width: 100%;
		min-width: 100%
	}
}

.ft-corp-img-link img {
	border-radius: .4rem
}

@media screen and (min-width:1201px) {
	.ft-corp-img-link:hover {
		opacity: .8
	}
}

.policy-item {
	padding: .4rem 2rem
}

.policy-item:nth-child(1) {
	padding-left: 0
}

@media screen and (max-width:1200px) {
	.policy-item {
		padding: 1.6rem
	}
}

.policy-item a {
	transition: .3s;
	color: #3a3a3a
}

@media screen and (min-width:1201px) {
	.policy-item a:hover {
		color: #f58635
	}
}

.ft-license {
	font-size: 1.6rem
}

.ft-license-row {
	align-items: center;
	-webkit-align-items: center
}

.ft-license-col {
	align-items: center
}

@media screen and (max-width:768px) {
	.ft-license-col.col {
		width: 100%;
		padding: .4rem
	}

	.ft-license-col.d-flex.f-end {
		justify-content: flex-start;
		-webkit-justify-content: flex-start
	}
}

.ft-license-col .social-list {
	margin-left: 6rem
}

@media screen and (max-width:1200px) {
	.ft-license-col .social-list {
		margin-left: 2.4rem
	}
}

@media screen and (max-width:768px) {
	.ft-license-col .social-list {
		margin-left: 0
	}
}

.ft-license-col .social-list img {
	filter: brightness(0) invert(.5);
	-webkit-filter: brightness(0) invert(.5)
}

.f-signature {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	justify-content: flex-start;
	-webkit-justify-content: flex-start
}

.f-signature-wrap {
	margin-left: .4rem;
	align-items: center;
	-webkit-align-items: center
}

.f-signature-share {
	flex-shrink: 0;
	margin-left: .4rem;
	width: 1.6rem;
	height: 1.6rem
}

@media screen and (min-width:1201px) {
	.f-signature-share:hover {
		animation: rotate-animation 2s linear infinite
	}
}

.f-signature .reserved {
	flex-shrink: 0
}

@media screen and (min-width:1201px) {
	.f-signature .bakvitech-logo:hover .hl-purple {
		color: #f58635
	}
}

.f-signature .bakvitech-logo img {
	object-fit: contain;
	max-width: 20rem
}

@media screen and (max-width:1200px) {
	.f-signature .bakvitech-logo img {
		max-width: 15rem
	}
}

.hd-menu-info-f {
	align-items: flex-start !important;
	-webkit-align-items: flex-start !important;
	margin-bottom: 1.6rem
}

.hd-menu-info-f:last-child {
	margin-bottom: 0
}

.hd-menu-info-f .icon {
	width: 2.4rem;
	height: 2.4rem;
	flex-shrink: 0;
	margin-right: .8rem
}

.hd-menu-info-f .d-flex {
	flex-direction: column;
	-webkit-flex-direction: column;
	align-items: flex-start !important;
	-webkit-align-items: flex-start !important
}

.hd-menu-info-f .label {
	margin-bottom: .4rem
}

.ft .bakvitech-logo img {
	max-height: 100%
}

body.hd-transparent .ft .corp-name {
	color: #7c0fd1
}

body.web-design .ft-label {
	color: #7c0fd1
}

.ft .ft-col.solution-col .ft-row {
	width: calc(100% + 2.4rem);
	margin-left: -1.2rem
}

@media screen and (min-width:1201px) {
	.ft-col .widget_nav_menu ul li a:hover {
		color: var(--secColor)
	}

	.popup .seoadv {
		padding: 7.8125vw 2.86458vw;
		padding-bottom: 4.1666vw
	}
}

@media screen and (max-width:1200px) {
	.ft .ft-col.solution-col .ft-row {
		width: calc(100% + 1.5rem);
		margin-left: -.75rem
	}

	.blogtc2-img {
		width: 100%
	}

	.blogtc2-box {
		width: 100%
	}
}

@media screen and (max-width:768px) {
	.ft .ft-col.solution-col .ft-row {
		width: calc(100% + .8rem);
		margin-left: -.4rem
	}
}

.ft-if-logo {
	height: 2.4rem
}

.ft-if-logo img {
	object-fit: contain
}

.ft .menu-item {
	margin-left: 0
}

.ft .menu-item.current-menu-item a {
	background-color: transparent
}

.popup .seoadv-title .title {
	font-size: 4rem
}

.popup .seoadv-left {
	width: 52%
}

@media screen and (max-width:1200px) {
	.hd .container {
		padding: 0 1.5rem
	}

	.menu-item.current-menu-item a {
		background-color: transparent
	}

	.hd.small .hd-menu .menu-item a {
		color: var(--textColor-1-c)
	}

	.hd.small .hd-menu .menu-item.current-menu-item a {
		color: var(--secColor-c)
	}
}

@media screen and (max-width:768px) {
	.hd .container {
		padding: 0 .8rem
	}
}

.modal-pop {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: .3s
}

.modal-pop.active {
	opacity: 1;
	visibility: visible;
	pointer-events: auto
}

.policy-item {
	position: relative
}

.modal-pop {
	position: absolute;
	right: 2rem;
	bottom: calc(100% + 1.2rem)
}

.modal-pop-wrap {
	width: 45.6rem;
	padding: 2.4rem;
	background: #fff;
	box-shadow: 8px 8px 32px rgba(0, 0, 0, .16);
	border-radius: 16px
}

.modal-pop .modal-pop-close {
	position: absolute;
	top: 2.4rem;
	right: 2.4rem;
	padding: .4rem;
	width: 2.4rem;
	height: 2.4rem;
	transition: .3s;
	border: 1px solid transparent;
	border-radius: .4rem;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer
}

.modal-pop-tt {
	font-size: 1.8rem;
	font-weight: 700;
	margin-bottom: .8rem;
	max-width: calc(100% - 3.2rem)
}

.modal-pop-desc {
	font-size: 1.4rem;
	color: #8b8b8b
}

.modal-pop-btn {
	display: flex;
	position: relative;
	margin-top: 3.2rem;
	max-width: max-content
}

.modal-pop-btn-item {
	display: block;
	padding: 1.4rem 3.2rem;
	border: .1rem solid rgba(58, 58, 58, .4);
	border-radius: .8rem;
	margin-right: 1.6rem;
	min-width: 14.5rem;
	font-size: 1.6rem;
	font-weight: 500;
	color: #3a3a3a;
	text-align: center
}

.modal-pop-btn-item.get-code {
	background-color: #7c0fd1;
	color: #fff
}

.modal-pop-btn-item:last-child {
	margin-right: 0
}

.modal-pop-btn .ani-preview-web {
	position: absolute;
	top: 0;
	right: 0;
	width: 4rem;
	height: 6rem;
	transform: translate(100%, -3rem) rotateY(-180deg)
}

.bakvitech-contact.fix {
	overflow: hidden
}

@media screen and (min-width:1201px) {
	.modal-pop .modal-pop-close:hover {
		border-color: #7c0fd1
	}

	.modal-pop-btn-item.get-code:hover,
	.modal-pop-btn-item:hover {
		background-color: #f58635;
		color: #fff !important;
		border-color: transparent !important
	}

	.sample-nine-func-list .wpcf7-list-item label:hover {
		background: #f9f1ff
	}

	.sample-nine-func-list .wpcf7-list-item label:hover .wpcf7-list-item-label {
		color: #7c0fd1
	}
}

@media screen and (max-width:1200px) {
	.modal-pop {
		right: 1.6rem
	}

	.modal-pop .preview-web {
		display: block
	}

	.popup .seoadv-left {
		width: 100%
	}

	.popup .seoadv-content {
		flex-direction: column
	}

	.popup .seoadv-title {
		width: 70%
	}

	.popup .bakvitech-contact-desc {
		width: 100%;
		text-align: center;
		margin-top: 1.2rem
	}

	.popup .fcts-mid {
		width: 100%
	}

	.popup .seoadv-img {
		top: 30%;
		bottom: unset;
		transform: translateX(20%)
	}

	.seoadv-content {
		margin-top: 0
	}

	.seoadv-flex {
		flex-direction: row
	}

	.seoadv-title {
		width: 100%
	}

	.seoadv-left {
		width: 45%
	}

	.seoadv-right {
		width: 45%
	}

	.seoadv-title .title {
		font-size: 2.4rem;
		text-align: left
	}

	.fcts-mid-gr {
		margin-bottom: 1.2rem
	}

	.fcts-mid-link {
		border-radius: 1.2rem;
		padding: 1.6rem
	}

	.fcts-mid-link .text {
		font-size: 1.6rem
	}

	.fcts-mid-link .icon {
		width: 4.8rem;
		height: 4.8rem
	}

	.fcts-content .title {
		margin-bottom: 2.2rem
	}

	.fcts-top-fl {
		flex-direction: column;
		gap: 3.2rem
	}

	.fcts-mid-left {
		width: 65%
	}

	.fcts-mid-right {
		width: 31%
	}

	.fcts-top-fl-item {
		width: 100%
	}

	.popup .sec-seoadv {
		border-radius: 1.6rem
	}
}

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

	#contact-information .fcts-left,
	#contact-information .fcts-right {
		width: 100%
	}
}

@media screen and (max-width:900px) {
	.popup .seoadv-img {
		display: none
	}

	.sec-seoadv .fcts-mid-left {
		width: 100%
	}

	.fcts-mid-control {
		max-width: 100%
	}

	.popup .seoadv-title .title {
		font-size: 2.4rem
	}

	.popup .seoadv-flex {
		gap: 2.4rem
	}

	.popup .bakvitech-contact-desc br {
		display: none
	}
}

@media screen and (max-width:850px) {
	.seoadv-flex {
		flex-direction: column
	}

	.seoadv-left,
	.seoadv-right {
		width: 100%
	}

	.seoadv-title .title {
		width: 70%;
		margin: 0 auto;
		text-align: center
	}

	.seoadv-title .bakvitech-contact-desc {
		text-align: center;
		margin-top: 2.4rem
	}

	.seoadv-decor {
		display: none
	}

	.seoadv-img {
		top: 20%;
		bottom: unset;
		transform: translateX(40%)
	}
}

@media screen and (max-width:768px) {
	.modal-pop {
		right: unset;
		left: 0
	}

	.seoadv-img {
		display: none
	}

	.sec-seoadv .fcts-mid-left {
		width: 100%
	}

	.fcts-mid-control {
		max-width: 100%
	}

	.seoadv-py {
		padding: 1.2rem;
		border-radius: .8rem
	}

	.seoadv-input {
		padding: 0 .8rem
	}

	.ft .f-signature .bakvitech-logo {
		width: 17rem
	}
}

.ft-col {
	margin-bottom: 8rem
}

@media screen and (max-width:1200px) {
	.ft-col {
		margin-bottom: 2.4rem
	}
}

.hl-purple {
	color: #3a3a3a
}

@media screen and (max-width:500px) {
	.hl-purple br {
		display: none
	}
}

.ft .hd-menu-info-f .label {
	margin-bottom: .4rem
}

.ft-hl-img {
	position: relative
}

.ft-hl-img .inner {
	position: relative;
	padding-top: 84.2729970326%
}

.ft-hl-img .inner img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 2.4rem
}

.ft-hl-gr {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	flex-direction: column;
	position: absolute;
	width: 100%;
	left: 0;
	right: 0;
	z-index: 1
}

.ft .ft-hl-gr {
	bottom: 0
}

.ft-hl-avt {
	width: 90%
}

.ft-hl-avt img {
	display: block
}

.ft-hl-phone {
	position: absolute;
	bottom: 0;
	width: 100%;
	display: inline-block;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	padding: 0 1.2rem
}

.ft-hl-phone .text {
	padding: 1.2rem .8rem;
	padding-bottom: .4rem;
	font-size: 5.6rem;
	color: #fff;
	font-family: "Bebas Neue";
	background: #f41e92;
	border-radius: .8rem;
	line-height: 1;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center
}

@media only screen and (max-width:1200px) {
	.ft-hl-phone .text {
		font-size: 5.1rem
	}
}

@media only screen and (max-width:800px) {
	.ft-hl-phone .text {
		font-size: 4rem
	}
}

.ft .ft-hl-decor {
	position: absolute;
	top: 0;
	left: 0;
	bottom: unset;
	width: max-content;
	transform: translate(-40%, 65%) rotate(-7.22deg);
	z-index: -1
}

@media screen and (max-width:500px) {
	.ft .ft-hl-decor {
		transform: translate(25%, 82%) rotate(-7.22deg)
	}
}

.ft .ft-hl-decor .text {
	font-family: "SVN-Just Saying";
	font-size: 3.2rem;
	color: #3a3a3a;
	line-height: 1;
	text-align: center;
	display: inline-block;
	transform: rotate(-12deg)
}

@media only screen and (max-width:1200px) {
	.ft .ft-hl-decor .text {
		font-size: 2.7rem
	}
}

@media only screen and (max-width:800px) {
	.ft .ft-hl-decor .text {
		font-size: 2.2rem
	}
}

.ft .ft-hl-line {
	position: absolute;
	width: 150%;
	top: 70%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(352deg);
	transform: translate(-45%, -50%) rotateY(180deg);
	z-index: -1
}

.ft .ft-hl-line img {
	display: block
}

.ft-if {
	padding: 3.2rem 0;
	position: relative;
	overflow: hidden
}

.ft-if-top {
	margin-bottom: 3.2rem
}

.ft-if::before {
	content: "";
	position: absolute;
	top: 0;
	width: 100%;
	height: .2rem;
	left: 0;
	background: url("../assets/images/Line-201.png") no-repeat;
	background-size: 100% 100%
}

.ft-if-flex {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	align-items: center;
	margin: 0 -1.2rem;
	flex-wrap: wrap
}

@media screen and (max-width:1200px) {
	.ft-if-flex {
		align-items: unset
	}
}

.ft-if-col {
	width: 25%;
	padding: 0 1.2rem
}

@media screen and (max-width:1200px) {
	.ft-if-col {
		width: 33.3333333333%
	}

	.ft-if-col:first-child {
		width: 100%;
		margin-bottom: 2.4rem
	}
}

@media screen and (max-width:650px) {
	.ft-if-col {
		width: 50%;
		margin-bottom: 2.4rem
	}

	.ft-if-col:last-child {
		width: 100%
	}
}

.ft-if-gr {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	align-items: center;
	gap: .8rem
}

@media screen and (min-width:1201px) {
	.ft-if-gr {
		margin-top: 1rem
	}
}

.ft-if-gr .icon {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	width: 2.4rem;
	height: 2.4rem;
	flex-shrink: 0
}

.ft-if-gr .text {
	font-size: 1.6rem;
	color: #5f5f5f
}

.ft-if-box {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-direction: column
}

.ft-if-logo {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-shrink: 0
}

.ft-if-logo img {
	width: auto;
	display: block;
	max-width: 100%
}

.ft-if-text {
	padding-top: 1.6rem
}

@media screen and (max-width:1200px) {
	.ft-if-text {
		flex-direction: column;
		margin-top: auto;
		display: flex
	}
}

@media screen and (max-width:768px) {
	.ft-if-text {
		padding-top: 1.2rem
	}
}

.ft-if-text .text {
	font-weight: 500;
	font-size: 1.5rem;
	color: #5f5f5f
}

.ft-if-text .tphone {
	font-size: 1.6rem;
	font-weight: 700;
	color: #7c0fd1
}

.ft-if-bank {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	align-items: center;
	gap: .4rem;
	margin-bottom: .8rem
}

.ft-if-bank .text {
	font-size: 1.6rem;
	color: #5f5f5f
}

.ft-if-bank .icon {
	width: 3.6rem;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	flex-shrink: 0
}

.ft-if-tbank {
	font-weight: 700;
	font-size: 1.5rem;
	color: #2686ec
}

.ft-corp {
	margin-top: unset
}

@media screen and (max-width:1200px) {
	.hotline-col {
		margin-top: 0;
		padding-bottom: 2.4rem
	}

	.hotline-col .ft-hl-gr {
		position: relative
	}

	.hotline-col .ft-hl-img {
		width: 34rem;
		max-width: 100%
	}

	.ft .ft-hl-img .inner {
		position: absolute;
		bottom: 0;
		width: 100%
	}
}

.ft .hd-menu-info {
	display: block;
	padding: unset;
	font-size: 1.6rem
}

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

	.contact-col,
	.contact-col.ft-col,
	.hotline-col,
	.hotline-col .ft-hl-img,
	.hotline-col.ft-col,
	.hotline-col.ft-col .ft-hl-img {
		width: 100%
	}
}

@media screen and (min-width:1201px) {
	.ft-if-bot .ft-if-gr {
		margin-top: -2.6rem
	}
}

@media screen and (max-width:1200px) {
	.blogtc2-control {
		bottom: unset;
		top: 100%
	}
}

@media screen and (max-width:1200px) {
	.sec-blogtc2 .blogt-wrap {
		min-height: unset
	}
}

@media screen and (max-width:1200px) {
	.sec-blogpc3 .blogpc3-top {
		margin-top: unset;
		padding-top: 2.4rem
	}
}

.ft-if-gr .icon img {
	object-fit: contain
}

.ft-license-col .widget_nav_menu .bakvitech-head-title.bakvitech-widget-title {
	display: none
}

.ft-license-col .widget_nav_menu ul {
	justify-content: flex-end;
	-webkit-justify-content: flex-end;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	-webkit-flex-wrap: wrap
}

@media screen and (max-width:768px) {
	.ft-license-col .widget_nav_menu ul {
		justify-content: flex-start;
		-webkit-justify-content: flex-start
	}
}

.ft-license-col .widget_nav_menu ul li {
	padding: .4rem 2rem
}

.ft-col .widget_nav_menu .bakvitech-head-title.bakvitech-widget-title {
	font-size: 1.8rem;
	font-weight: 600;
	color: #7c0fd1
}

@media screen and (max-width:1200px) {
	.ft-col .widget_nav_menu .bakvitech-head-title.bakvitech-widget-title {
		font-size: 1.6rem
	}
}

.solution-col .ft-col.col.col-6 {
	width: 50%
}

@media screen and (max-width:360px) {
	.solution-col .ft-col.col.col-6 {
		width: 100%
	}
}

.ft-col .widget_nav_menu ul {
	margin-top: 1.6rem
}

.ft-col .widget_nav_menu ul li.current-menu-item a {
	font-weight: 600;
	color: #f58635
}

.ft-col .widget_nav_menu ul li a {
	display: block;
	padding: .8rem 0;
	transition: .3s
}

.ft-col.col-6 .hd-menu-info>* {
	align-items: center
}

@media screen and (max-width:600px) {
	.ft-col.col-6.contact-col .ft-menu-list-col {
		width: 100%
	}
}

.social-fixed {
	position: fixed;
	z-index: 100;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	transition: .3s linear;
	opacity: 0
}

.social-fixed.active {
	opacity: 1;
	right: 2.8rem
}

@media (max-width:1500px) {
	.social-fixed.active {
		right: 1.5rem
	}
}

@media (max-width:1200px) {
	.social-fixed {
		display: none
	}
}

.social-fixed-item {
	margin-top: 2.4rem
}

.social-fixed-item a {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	width: 4rem;
	height: 4rem;
	border-radius: 50%;
	background-color: #7c0fd1
}

.back__to__top {
	display: block;
	width: 4rem;
	height: 6rem;
	position: fixed;
	bottom: 0;
	right: 1.5rem;
	z-index: 200;
	transform: translateY(3rem);
	opacity: 0;
	transition: .5s linear;
	cursor: pointer;
	visibility: hidden
}

.back__to__top.active {
	visibility: visible;
	transform: translateY(0);
	opacity: 1
}

@media (max-width:1200px) {
	.back__to__top {
		width: 2rem;
		height: 4rem;
		right: .8rem;
		z-index: 199
	}
}

.back__to__top::after {
	content: "GO TOP";
	color: #f58635;
	white-space: nowrap;
	transform: translateX(.4rem) rotate(-90deg);
	position: absolute;
	bottom: calc(100% + 1.5rem);
	transition: .3s;
	font-family: "Bebas Neue", sans-serif;
	line-height: 1
}

@media (max-width:1200px) {
	.back__to__top::after {
		transform: translateX(-.5rem) rotate(-90deg)
	}
}

.back__to__top .triangle {
	display: block;
	width: 100%;
	height: 6rem;
	z-index: 2;
	flex-shrink: 0;
	position: absolute;
	transition: .3s;
	overflow: hidden
}

.back__to__top .triangle::after {
	content: "";
	position: absolute;
	left: 45%;
	width: .2rem;
	height: 6rem;
	background-color: #f58635
}

.back__to__top .triangle:nth-child(1) {
	display: none
}

.back__to__top .triangle:nth-child(2)::after {
	bottom: 0;
	animation: GOTOP3 1.2s linear .2s infinite
}

.back__to__top .triangle:nth-child(3)::after {
	animation: GOTOP3 linear 2s infinite
}

@media only screen and (min-width:1201px) {
	.back__to__top:hover {
		visibility: visible;
		opacity: 1;
		transform: translateX(0)
	}
}

@media (max-width:450px) {
	.hd-social {
		width: calc(25% + 1rem)
	}
}

@media (max-width:1200px) {
	.hd-social .social-item {
		margin-left: 1.4rem
	}

	.hd-social .social-item a {
		width: 2.2rem;
		height: 2.2rem
	}

	.hd-social .social-item a img {
		padding: .2rem
	}
}

.social-list {
	margin-bottom: -1.6rem
}

.social-item {
	margin-right: 1.6rem;
	margin-bottom: 1.6rem;
	transition: .3s ease
}

@media screen and (min-width:1201px) {
	.social-item:hover {
		transform: translateY(-.5rem)
	}
}

.social-item a {
	width: 3.2rem;
	height: 3.2rem;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center
}

.social-item a img {
	object-fit: contain
}

.ft-col.col-6 .social-list {
	opacity: .5
}

.ft-license-col .social-list {
	margin-left: 6rem
}

@media screen and (max-width:1200px) {
	.ft-license-col .social-list {
		margin-left: 2.4rem
	}
}

@media screen and (max-width:768px) {
	.ft-license-col .social-list {
		margin-left: 0
	}
}

.ft-license-col .social-list img {
	filter: brightness(0) invert(.5);
	-webkit-filter: brightness(0) invert(.5)
}

.social-fixed {
	position: fixed;
	z-index: 100;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	transition: .3s linear;
	opacity: 0
}

.social-fixed.active {
	opacity: 1;
	right: 2.8rem
}

@media (max-width:1500px) {
	.social-fixed.active {
		right: 1.5rem
	}
}

@media (max-width:1200px) {
	.social-fixed {
		display: none
	}
}

.social-fixed-item {
	margin-top: 2.4rem
}

.social-fixed-item a {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	width: 4rem;
	height: 4rem;
	border-radius: 50%;
	background-color: #7c0fd1
}

.blog-large-author .author-social {
	width: 33.3333333333%
}

@media screen and (max-width:600px) {
	.blog-large-author .author-social {
		margin-top: 2.4rem;
		width: 100%
	}
}

.blog-large-author .author-social .social-list {
	justify-content: flex-end;
	-webkit-justify-content: flex-end;
	margin-top: 1.5rem
}

@media screen and (max-width:600px) {
	.blog-large-author .author-social .social-list {
		margin-top: 0;
		margin-bottom: -.8rem;
		justify-content: flex-start;
		-webkit-justify-content: flex-start
	}
}

.blog-large-author .author-social .social-item {
	margin-right: 0;
	margin-left: 1.6rem;
	opacity: .4
}

@media screen and (max-width:600px) {
	.blog-large-author .author-social .social-item {
		margin-left: 0;
		margin-right: .8rem;
		margin-bottom: .8rem
	}
}

@media screen and (min-width:1201px) {
	.blog-large-author .author-social .social-item:hover {
		opacity: 1
	}
}

.author-social {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	gap: 1.6rem
}

.author-social-link {
	width: 3.2rem;
	height: 3.2rem;
	border-radius: 100rem;
	transition: .2s ease-in-out;
	opacity: .7
}

@media (hover:hover) {
	.author-social-link:hover {
		transform: translateY(-5px)
	}
}

.author-social-link img {
	object-fit: unset
}

.author-top {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 2.4rem
}

.author-one {
	overflow: hidden
}

.author-one-side {
	align-items: flex-end
}

.author-one-left {
	width: 50%
}

@media screen and (max-width:767px) {
	.author-one-left {
		width: 100%
	}
}

.author-one-right {
	width: 50%
}

@media screen and (max-width:767px) {
	.author-one-right {
		width: 100%
	}
}

.author-one-info {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1.6rem
}

.author-one-info-ava {
	width: 6.4rem;
	height: 6.4rem;
	border-radius: 100rem
}

.author-one-content {
	padding: 12rem 0
}

@media screen and (max-width:1200px) {
	.author-one-content {
		padding: 4rem 0
	}
}

.author-one-name {
	font-size: 3.2rem;
	font-weight: 700;
	color: #3a3a3a;
	display: flex;
	align-items: center;
	gap: .6rem
}

@media only screen and (max-width:1200px) {
	.author-one-name {
		font-size: 2.7rem
	}
}

@media only screen and (max-width:800px) {
	.author-one-name {
		font-size: 2.2rem
	}
}

.author-one-name img {
	width: 3.2rem;
	height: 3.2rem;
	border-radius: 100rem;
	position: relative
}

@media screen and (max-width:800px) {
	.author-one-name img {
		width: 2.4rem;
		height: 2.4rem;
		top: .2rem
	}
}

.author-one-tag {
	display: flex;
	flex-wrap: wrap
}

.author-one-tag-item {
	font-size: 1.6rem;
	line-height: 1.2;
	font-weight: 500;
	color: #fff;
	padding: .8rem 1.6rem;
	border-radius: .8rem;
	background-color: #7c0fd1
}

.author-one-des {
	color: #5f5f5f;
	margin: 2.4rem 0
}

.author-one-img {
	height: 100%;
	position: relative
}

@media screen and (min-width:1201px) {
	.author-one-img {
		width: calc(100% + 7.5rem)
	}
}

.author-one-img-inner {
	margin-left: 5.5rem;
	position: relative;
	z-index: 5
}

.author-one-img-inner .img {
	display: block;
	padding-top: calc((573 / 724) * 100%);
	position: relative;
	overflow: hidden
}

.author-one-img-inner .img img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
	object-fit: cover
}

.author-one-line {
	position: absolute;
	top: 5%;
	left: 0;
	width: 45%
}

.author-one-line .line {
	stroke-dashoffset: 821.3475952148px;
	stroke-dasharray: 821.3475952148px;
	-webkit-transition: stroke-dashoffset 1s cubic-bezier(.47, 0, .745, .715) 0s;
	transition: stroke-dashoffset 1s cubic-bezier(.47, 0, .745, .715) 0s
}

.author-one-line.active .line {
	stroke-dashoffset: 0
}

.author-one-cirle {
	position: absolute;
	width: 60%;
	padding-top: 60%;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	bottom: 0
}

.author-one-cirle .inner {
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	position: absolute
}

.author-one-cirle img {
	width: 100%;
	height: 100%;
	animation: rotate-animation 30s linear
}

.author-one-cirle-blue {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 90%;
	padding-top: 90%;
	transform: translateY(35%) rotate(-18deg);
	z-index: 2
}

.author-one-cirle-blue .inner {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 50%;
	overflow: hidden
}

.author-one-cirle-blue .inner::before {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 200%;
	background-color: #2686ec;
	border-radius: 100rem
}

.author-one-cirle-pink {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 80%;
	padding-top: 80%;
	transform: translate(14%, 32%) rotate(5deg)
}

.author-one-cirle-pink .inner {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 50%;
	overflow: hidden
}

.author-one-cirle-pink .inner::before {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 200%;
	background-color: #f41e92;
	border-radius: 100rem
}

.author-two-img {
	height: 53.2407407407vw;
	overflow: hidden
}

.author-two-img img {
	position: relative;
	transition: none
}

@media screen and (max-width:1200px) {
	.author-three-slider {
		padding-bottom: 1.2rem
	}
}

.author-three-slider .swiper {
	padding-left: 1rem;
	padding-right: 1rem;
	margin-left: -1rem;
	margin-right: -1rem
}

.author-three-slider .swiper-slide {
	width: 46rem
}

.author-three-slider .swiper-control-btn {
	top: 40% !important
}

@media (hover:hover) {
	.author-three .blogvc2-inner:hover .blogvc2-content-py {
		box-shadow: 10px 10px 15px rgba(0, 0, 0, .08)
	}
}

.author-three .blogvc2-content-py {
	box-shadow: none
}

.author-three .blogtc2-bot {
	flex-wrap: wrap
}

.author-four-left {
	width: 50%
}

@media screen and (max-width:700px) {
	.author-four-left {
		width: 100%
	}
}

.author-four-right {
	width: 50%
}

@media screen and (max-width:700px) {
	.author-four-right {
		width: 100%
	}
}

.author-four-note {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	gap: 1.6rem
}

.author-four-note-item {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	align-items: center;
	font-size: 1.6rem;
	font-weight: 500;
	color: #3a3a3a;
	gap: 1rem
}

.author-four-note-item:not(:first-child) {
	padding-left: 1.6rem;
	border-left: .1rem solid #5f5f5f
}

.author-four-note-item img {
	width: 1.6rem;
	height: 1.6rem
}

.author-four-content {
	height: 100%;
	display: flex;
	flex-direction: column
}

@media screen and (min-width:1201px) {
	.author-four-content {
		max-width: 57.6rem
	}
}

.author-four-content .tag-list {
	margin-top: 2.4rem;
	border: none;
	padding-top: 0;
	margin-bottom: 1.6rem
}

.author-four-more {
	margin-top: auto;
	font-weight: 500;
	width: fit-content;
	border-bottom: .2rem solid rgba(58, 58, 58, .2);
	transition: .3s ease-in-out
}

@media (hover:hover) {
	.author-four-more:hover {
		color: #7c0fd1
	}
}

.author-four-img {
	display: block;
	padding-top: calc((522 / 696) * 100%);
	position: relative;
	overflow: hidden;
	border-radius: 2.4rem
}

@media (hover:hover) {
	.author-four-img:hover img {
		transform: translate(-50%, -50%) scale(1.05);
		-webkit-transform: translate(-50%, -50%) scale(1.05);
		-moz-transform: translate(-50%, -50%) scale(1.05);
		-o-transform: translate(-50%, -50%) scale(1.05)
	}
}

.author-four-img img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
	object-fit: cover
}

.author-seven-slider .swiper-slide {
	width: 35rem
}

.author-seven-img {
	display: block;
	padding-top: calc((252 / 336) * 100%);
	position: relative;
	overflow: hidden;
	border-radius: 1.6rem
}

@media (hover:hover) {
	.author-seven-img:hover img {
		transform: translate(-50%, -50%) scale(1.05);
		-webkit-transform: translate(-50%, -50%) scale(1.05);
		-moz-transform: translate(-50%, -50%) scale(1.05);
		-o-transform: translate(-50%, -50%) scale(1.05)
	}
}

.author-seven-img:not(img) {
	background-color: #f9f1ff
}

.author-seven-content {
	margin-top: 1.6rem
}

.author-seven-note {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-wrap: wrap;
	gap: .8rem
}

.author-seven-note-item {
	color: #5f5f5f;
	font-size: 1.6rem
}

.author-seven-note-item:not(:first-child) {
	padding-left: .8rem;
	border-left: .1rem solid #5f5f5f
}

.author-seven-name {
	font-size: 2.4rem;
	font-weight: 600;
	margin-top: .8rem;
	margin-bottom: .4rem
}

@media only screen and (max-width:1200px) {
	.author-seven-name {
		font-size: 2rem
	}
}

@media only screen and (max-width:800px) {
	.author-seven-name {
		font-size: 1.7rem
	}
}

.author-seven-name img {
	width: 2rem;
	height: 2rem;
	vertical-align: middle
}

.author-seven-level {
	font-size: 1.6rem;
	color: #8b8b8b
}

.popup {
	position: fixed;
	z-index: 1000;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
	transition: .3s
}

.popup.active {
	opacity: 1;
	pointer-events: auto;
	visibility: visible
}

.popup.w-80 {
	width: 80rem
}

.popup-success.popup.w-80 {
	width: 51.3rem
}

.popup-success .popup-wrap {
	padding: 3.5rem
}

.popup-success .popup-header {
	margin-bottom: 0
}

.popup-success .popup-img {
	width: 5rem;
	height: 5rem;
	margin: 0 auto;
	margin-bottom: 1.5rem;
	border-radius: 50%;
	overflow: hidden
}

.popup-success .title {
	text-align: center;
	margin-bottom: 2.6rem
}

.popup-success .popup-desc {
	text-align: center;
	color: #4a4a4a;
	font-size: 1.6rem;
	margin-bottom: 4rem
}

.popup-success .popup-btn {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center
}

.popup-wrap {
	position: relative;
	width: 117.6rem;
	max-width: 90vw
}

.popup-header {
	margin-bottom: 4rem
}

.popup-header .title {
	font-size: 2rem;
	font-weight: 700;
	color: #4a4a4a
}

@media only screen and (max-width:1200px) {
	.popup-header .title {
		font-size: 1.8rem
	}
}

@media only screen and (max-width:800px) {
	.popup-header .title {
		font-size: 1.6rem
	}
}

.popup-header .close-pop {
	position: absolute;
	top: 0;
	right: 0;
	width: 5.6rem;
	height: 5.6rem;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	cursor: pointer;
	transition: .3s
}

@media (min-width:1201px) {
	.popup-header .close-pop:hover {
		background-color: rgba(0, 0, 0, .16)
	}
}

.popup-header .close-pop img {
	max-width: max-content;
	height: auto
}

.popup-bg {
	position: fixed;
	z-index: 900;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, .7);
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
	transition: .3s
}

.popup-bg.active {
	opacity: 1;
	pointer-events: auto;
	visibility: visible
}

.form .f-r {
	margin-bottom: 2.4rem
}

.form .f-r:last-child {
	margin-bottom: 0
}

.form .f-c {
	width: 100%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	align-items: flex-start;
	-webkit-align-items: flex-start
}

.form .f-c-file {
	flex: 1;
	position: relative;
	min-height: 15rem;
	border: 1px dashed #c9c9c9;
	cursor: pointer;
	position: relative;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	flex-direction: column;
	-webkit-flex-direction: column;
	padding: 1.2rem
}

.form .f-c-file-content {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	flex-direction: column;
	-webkit-flex-direction: column;
	text-align: center;
	width: 100%;
	height: 100%
}

.form .f-c-file-content img {
	width: 2.4rem;
	height: auto;
	margin-bottom: 1.5rem
}

.form .f-c .label {
	display: block;
	min-width: 10rem;
	margin-right: 2.4rem;
	flex-shrink: 0;
	margin-top: 1rem;
	font-size: 1.6rem;
	font-weight: 700;
	color: #4a4a4a
}

.form .f-c input,
.form .f-c textarea {
	width: 100%;
	flex: 1;
	border: 1px solid #c9c9c9;
	min-height: 4.2rem;
	padding: 0 1.5rem
}

.form .f-c input[type=file],
.form .f-c textarea[type=file] {
	min-height: 13.8rem;
	border-style: dashed;
	cursor: pointer;
	display: none
}

@media (min-width:1201px) {

	.form .f-c input[type=file]:hover,
	.form .f-c textarea[type=file]:hover {
		border-color: #7c0fd1
	}
}

.form .f-btn {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	justify-content: flex-end;
	-webkit-justify-content: flex-end
}

.file-chooser {
	width: 100%;
	height: 100%;
	position: relative
}

.hidden-inputs.hidden {
	display: none
}

.file-list {
	width: 100%;
	flex-wrap: wrap;
	-webkit-flex-wrap: wrap
}

.file-item,
.file-list {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	margin-top: 1rem
}

.file-item {
	margin-right: 1rem;
	padding-right: 1rem;
	border-right: 1px solid #4a4a4a;
	color: #3a3a3a
}

.file-item:last-child {
	border: unset
}

.file-item .file-list__name {
	margin-right: .8rem
}

.file-item .removal-button {
	background-color: red;
	color: #fff;
	width: 1.8rem;
	height: 1.8rem;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	line-height: 1;
	cursor: pointer;
	transition: .3s;
	flex-shrink: 0
}

@media (min-width:1201px) {
	.file-item .removal-button:hover {
		box-shadow: 1px 1px 3px #000
	}
}

.popup .sec-seoadv {
	background: #faf4ff;
	border-radius: 3.2rem;
	position: relative;
	margin-top: 0;
	z-index: 1;
	max-height: 95vh;
	overflow: hidden auto
}

@media screen and (max-width:1200px) {
	.popup .sec-seoadv {
		border-radius: 0
	}
}

.popup .seoadv {
	padding: 15rem 5.5rem;
	padding-bottom: 8rem;
	height: 100%
}

@media screen and (max-width:1500px) {
	.popup .seoadv {
		padding: 12rem 3.2rem;
		padding-bottom: 5.6rem
	}
}

@media screen and (max-width:1200px) {
	.popup .seoadv {
		padding: 4rem .8rem
	}
}

.popup .seoadv-bgdecor {
	position: absolute;
	width: 85%;
	bottom: 0;
	left: 0
}

.popup .seoadv-bgdecor>img {
	display: block
}

.popup .seoadv-content {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	flex-direction: column;
	align-items: center
}

@media screen and (max-width:1200px) {
	.popup .seoadv-content {
		flex-direction: column-reverse;
		margin-top: 0
	}
}

@media screen and (max-width:1200px) {
	.popup .seoadv-img {
		width: 24rem
	}
}

.popup .seoadv-decor {
	position: absolute;
	top: 40%;
	left: 100%;
	transform: translateY(-50%);
	width: 10%
}

@media screen and (max-width:600px) {
	.popup .seoadv-decor {
		display: none
	}
}

.popup .seoadv-title {
	position: relative
}

@media screen and (max-width:1200px) {
	.popup .seoadv-title {
		width: 50rem;
		max-width: 100%;
		margin: 0 auto
	}
}

.popup .seoadv-title .title {
	font-size: 4.6rem;
	font-weight: 700;
	color: #3a3a3a
}

@media screen and (max-width:1500px) {
	.popup .seoadv-title .title {
		font-size: 3.8rem
	}
}

@media screen and (max-width:1200px) {
	.popup .seoadv-title .title {
		text-align: center
	}
}

@media screen and (max-width:450px) {
	.popup .seoadv-title .title {
		font-size: 2.6rem
	}
}

.popup .seoadv-title .text {
	display: inline-block;
	position: relative;
	color: #fff;
	padding: 0 .4rem;
	z-index: 1
}

.popup .seoadv-title .text::before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: #7c0fd1;
	border-radius: .4rem;
	z-index: -1;
	opacity: 1
}

.popup .seoadv-img {
	width: 70%;
	position: relative;
	z-index: 3
}

@media screen and (max-width:1200px) {
	.popup .seoadv-img {
		width: 50%
	}
}

.popup .seoadv-flex {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: space-between;
	margin: 0 -1.5rem
}

@media screen and (max-width:1200px) {
	.popup .seoadv-flex {
		flex-direction: column;
		gap: 4rem
	}
}

.popup .seoadv-left {
	width: 50%;
	padding: 0 1.5rem
}

@media screen and (max-width:1200px) {
	.popup .seoadv-left {
		width: 100%
	}
}

.popup .seoadv-right {
	width: 42%;
	padding: 0 1.5rem
}

@media screen and (max-width:1200px) {
	.popup .seoadv-right {
		width: 100%
	}
}

.popup .seoadv-wrap {
	margin: 0 auto;
	width: 100%
}

.popup .seoadv-py {
	padding: 2.4rem;
	background: #fff;
	border-radius: 1.6rem;
	position: relative
}

@media screen and (max-width:600px) {
	.popup .seoadv-py {
		padding: 1.6rem
	}
}

.popup .seoadv-text {
	position: absolute;
	right: 0;
	bottom: 100%;
	transform: translate(0, -10%) rotate(11.08deg)
}

@media screen and (max-width:1200px) {
	.popup .seoadv-text {
		display: none
	}
}

.popup .seoadv-text .text {
	font-size: 4.8rem;
	font-weight: 700;
	color: #3a3a3a;
	display: inline-block
}

@media screen and (max-width:1500px) {
	.popup .seoadv-text .text {
		font-size: 3.2rem
	}
}

.popup .seoadv-svg {
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 95%;
	left: 50%
}

.popup .seoadv-svg svg {
	display: block;
	width: 100%;
	height: auto
}

.popup .seoadv-svg svg .svg-elem-1 {
	stroke-dashoffset: 794.158203125px;
	stroke-dasharray: 794.158203125px;
	-webkit-transition: stroke-dashoffset 1s cubic-bezier(.47, 0, .745, .715) 0s;
	transition: stroke-dashoffset 1s cubic-bezier(.47, 0, .745, .715) 0s
}

.popup .seoadv-svg svg.active .svg-elem-1 {
	stroke-dashoffset: 0
}

.popup .seoadv-control:not(:last-child) {
	margin-bottom: 1.6rem
}

.popup .seoadv-gr {
	position: relative;
	height: 5.6rem;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	align-items: center;
	border-bottom: .1rem solid #e0e0e0
}

.popup .seoadv-gr .select2-selection__rendered {
	color: #b8b8b8 !important;
	padding: 0 2rem !important;
	padding-top: 0 !important;
	font-size: 1.6rem !important
}

.popup .seoadv-gr .select2-selection .select2-selection__rendered {
	color: #3a3a3a !important
}

.popup .seoadv-gr .select2-container--default .select2-selection--single .select2-selection__arrow {
	transform: translateY(-50%)
}

.popup .seoadv-input {
	width: 100%;
	font-family: Inter;
	font-size: 1.6rem;
	color: #3a3a3a;
	padding: 0 2rem;
	height: 5.6rem;
	border-bottom: .1rem solid #e0e0e0;
	background: 0 0;
	transition: .3s ease-in-out
}

@media screen and (max-width:1500px) {
	.popup .seoadv-input {
		height: 4.8rem
	}
}

.popup .seoadv-input::placeholder {
	color: #b8b8b8
}

.popup .seoadv-input:focus {
	background: #f7f7f7;
	border-bottom-color: #5f5f5f
}

@media screen and (max-width:600px) {
	.popup .seoadv-input {
		padding: 0 1.2rem
	}
}

.popup .seoadv-area {
	width: 100%;
	font-family: Inter;
	font-size: 1.6rem;
	color: #3a3a3a;
	padding: 0 2rem;
	padding-top: 1.6rem;
	min-height: 14rem;
	border-bottom: .1rem solid #e0e0e0;
	background: 0 0;
	transition: .3s ease-in-out
}

@media screen and (max-width:1500px) {
	.popup .seoadv-area {
		min-height: 10rem
	}
}

.popup .seoadv-area::placeholder {
	color: #b8b8b8
}

.popup .seoadv-area:focus {
	background: #f7f7f7;
	border-bottom-color: #5f5f5f
}

.popup .seoadv-btn {
	width: 100%;
	background: unset;
	cursor: pointer
}

.popup .seoadv-btn .btn-second {
	width: 100%
}

@media screen and (max-width:1500px) {
	.popup .seoadv-btn .btn-second {
		height: 5.6rem
	}
}

input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0
}

input[type=number] {
	-moz-appearance: textfield
}

.text-ani {
	display: inline-block;
	position: relative;
	text-align: center
}

.text-ani.bg-blue::after {
	background: linear-gradient(to top, #1ec0f2 50%, transparent 50%)
}

.text-ani.bg-blue.bg-orange::after {
	background: linear-gradient(to top, #f5851e 50%, transparent 50%)
}

.text-ani::after {
	content: "";
	display: inline-block;
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: -1;
	top: 0;
	left: 0;
	animation: 5s highlight 1.5s infinite alternate;
	border-radius: .2rem
}

.popup-close {
	position: absolute;
	z-index: 5;
	top: 2.4rem;
	right: 2.4rem;
	width: 2.4rem;
	height: 2.4rem;
	cursor: pointer;
	background-color: #7c0fd1;
	border-radius: 50%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	transition: .3s
}

@media screen and (max-width:1200px) {
	.popup-close {
		top: 1rem;
		right: 1rem
	}
}

@media screen and (min-width:1201px) {
	.popup-close:hover {
		background-color: #f58635
	}
}

.popup-close img {
	width: 1.2rem;
	height: 1.2rem;
	object-fit: contain
}

.popup-service {
	transition: .3s linear;
	top: 50%
}

.popup-service .popup-wrap {
	width: 100%
}

.popup-service .popup-close {
	top: 1.2rem;
	right: 1.2rem;
	background-color: #fff
}

@media screen and (min-width:1201px) {
	.popup-service .popup-close:hover {
		background-color: #f58635
	}
}

.popup-service .popup-close img {
	filter: brightness(.3);
	-webkit-filter: brightness(.3)
}

.popup-service.active {
	top: calc(50% + 4.2rem)
}

.popup-service.active .ani-cus {
	transform: translateY(0)
}

.popup-service-content {
	max-width: 54rem;
	margin: 0 auto;
	background-color: #fff;
	border-radius: 2.4rem;
	padding: 2.4rem
}

@media screen and (max-width:1500px) {
	.popup-service-content {
		max-width: 42rem
	}
}

.popup-service-img {
	position: relative;
	width: 100%;
	padding-top: 77%;
	background-color: #7c0fd1;
	border-radius: 2.4rem
}

@media screen and (max-width:1500px) {
	.popup-service-img {
		padding-top: 50%
	}
}

.popup-service-img .img {
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translateX(-50%);
	width: 70%;
	height: auto
}

@media screen and (max-width:1500px) {
	.popup-service-img .img {
		width: 60%
	}
}

.popup-service-img .img img {
	transition: 1.4s ease-in-out
}

.popup-service-body {
	margin-top: 2.4rem
}

.popup-service-body .title {
	font-size: 2.4rem;
	font-weight: 600;
	color: #3a3a3a;
	margin-bottom: 1.6rem;
	overflow: hidden
}

@media only screen and (max-width:1200px) {
	.popup-service-body .title {
		font-size: 2rem
	}
}

@media only screen and (max-width:800px) {
	.popup-service-body .title {
		font-size: 1.7rem
	}
}

.popup-service-body .desc {
	margin-bottom: 6.4rem;
	overflow: hidden
}

@media screen and (max-width:1500px) {
	.popup-service-body .desc {
		margin-bottom: 4.2rem
	}
}

.popup-service-btn {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	align-items: stretch;
	-webkit-align-items: stretch;
	overflow: hidden
}

.popup-service-btn .btn-second {
	padding: 2.4rem;
	width: 100%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center
}

@media screen and (max-width:1500px) {
	.popup-service-btn .btn-second {
		font-size: 1.6rem;
		padding: .8rem 1.2rem;
		height: 5.6rem
	}
}

.mega-menu a {
	border-radius: .8rem;
	padding: .8rem 1.2rem;
	padding-top: 6.2rem
}

.mega-menu-box {
	position: fixed;
	width: calc(100vw - .7rem);
	left: 0;
	top: 9.4rem;
	transition: .3s linear;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateY(2rem);
	animation: zoomOut .3s ease-in-out forwards;
	display: none
}

@media screen and (max-width:1200px) {
	.mega-menu-box {
		display: none
	}
}

.mega-menu-box .container {
	max-width: 144.6rem;
	padding: 0 1.5rem
}

.mega-menu-box-list {
	align-items: flex-start;
	-webkit-align-items: flex-start
}

.mega-menu-box-wrap {
	padding: 3.2rem;
	background-color: #fff;
	box-shadow: 0 8px 40px 2px rgba(0, 0, 0, .08);
	border-radius: 16px
}

.mega-menu-box-wrap-item .label {
	font-size: 1.8rem;
	font-weight: 600;
	color: #8b8b8b;
	margin-bottom: 2.4rem
}

.mega-menu-img {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	padding: 1.2rem;
	border-radius: .8rem;
	background-color: #f2f8ff;
	transition: .3s
}

.mega-menu-img img {
	width: 4rem;
	height: 4rem
}

.mega-menu-txt {
	margin-left: 1.6rem;
	text-transform: initial;
	line-height: 1.2
}

.mega-menu-txt .title {
	display: block;
	font-size: 1.8rem;
	font-weight: 600;
	color: #3a3a3a
}

.mega-menu-txt .desc {
	display: block;
	font-size: 1.4rem;
	color: #8b8b8b;
	font-weight: 400;
	margin-top: .4rem
}

.hd .menu-item.mega-menu .mega-menu-list {
	position: relative;
	flex: 1
}

.hd .menu-item.mega-menu .mega-menu-list .mega-menu-cate {
	position: absolute;
	left: 0;
	top: -5rem;
	width: calc(100% - 32rem);
	margin-left: 32rem;
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
	transition: .3s;
	height: calc(100% + 5rem)
}

.hd .menu-item.mega-menu .mega-menu-list .mega-menu-cate.active {
	opacity: 1;
	pointer-events: auto;
	visibility: visible
}

.hd .menu-item.mega-menu .mega-menu-list .mega-menu-cate-wrap {
	margin-left: 2.4rem;
	width: calc(100% - 2.4rem);
	padding: 0 !important;
	align-items: flex-start !important;
	-webkit-align-items: flex-start !important;
	background-color: transparent !important;
	box-shadow: unset !important
}

.hd .menu-item.mega-menu .mega-menu-list .mega-menu-cate-wrap-item .d-flex {
	background-color: transparent !important;
	box-shadow: unset !important
}

.hd .menu-item.mega-menu .mega-menu-item {
	margin-bottom: .6rem;
	width: 32rem;
	cursor: pointer
}

.hd .menu-item.mega-menu .mega-menu-item.active>.d-flex {
	background-color: #f2f8ff;
	box-shadow: inset 6px 6px 12px rgba(16, 72, 132, .12)
}

.hd .menu-item.mega-menu .mega-menu-item .d-flex {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	justify-content: flex-start;
	-webkit-justify-content: flex-start;
	flex-wrap: nowrap;
	-webkit-flex-wrap: nowrap;
	padding: 1.6rem .8rem;
	padding-right: .8rem;
	border-radius: 1.2rem;
	height: 100%
}

@media screen and (min-width:1201px) {
	.hd .menu-item.mega-menu .mega-menu-item .d-flex:hover {
		background-color: #f2f8ff;
		box-shadow: inset 6px 6px 12px rgba(16, 72, 132, .12)
	}
}

.hd .menu-item.mega-menu .mega-menu-item:nth-child(5n+2) .d-flex .mega-menu-img {
	background-color: #fff5fb
}

@media screen and (min-width:1201px) {
	.hd .menu-item.mega-menu .mega-menu-item:nth-child(5n+2) .d-flex:hover {
		background-color: #fff5fb;
		box-shadow: inset 6px 6px 12px rgba(208, 45, 134, .12)
	}
}

.hd .menu-item.mega-menu .mega-menu-item:nth-child(5n+2).active>.d-flex {
	background-color: #fff5fb;
	box-shadow: inset 6px 6px 12px rgba(208, 45, 134, .12)
}

.hd .menu-item.mega-menu .mega-menu-item:nth-child(5n+3) .d-flex .mega-menu-img {
	background-color: #faf3ff
}

@media screen and (min-width:1201px) {
	.hd .menu-item.mega-menu .mega-menu-item:nth-child(5n+3) .d-flex:hover {
		background-color: #faf3ff;
		box-shadow: inset 6px 6px 12px rgba(16, 72, 132, .12)
	}
}

.hd .menu-item.mega-menu .mega-menu-item:nth-child(5n+3).active>.d-flex {
	background-color: #faf3ff;
	box-shadow: inset 6px 6px 12px rgba(16, 72, 132, .12)
}

.hd .menu-item.mega-menu .mega-menu-item:nth-child(5n+4) .d-flex .mega-menu-img {
	background-color: #edfbff
}

@media screen and (min-width:1201px) {
	.hd .menu-item.mega-menu .mega-menu-item:nth-child(5n+4) .d-flex:hover {
		background-color: #edfbff;
		box-shadow: inset 6px 6px 12px rgba(32, 140, 173, .12)
	}
}

.hd .menu-item.mega-menu .mega-menu-item:nth-child(5n+4).active>.d-flex {
	background-color: #edfbff;
	box-shadow: inset 6px 6px 12px rgba(32, 140, 173, .12)
}

.hd .menu-item.mega-menu .mega-menu-item:nth-child(5n+5) .d-flex .mega-menu-img {
	background-color: #fff6ed
}

@media screen and (min-width:1201px) {
	.hd .menu-item.mega-menu .mega-menu-item:nth-child(5n+5) .d-flex:hover {
		background-color: #fff6ed;
		box-shadow: inset 6px 6px 12px rgba(194, 113, 39, .12)
	}
}

.hd .menu-item.mega-menu .mega-menu-item:nth-child(5n+5).active>.d-flex {
	background-color: #fff6ed;
	box-shadow: inset 6px 6px 12px rgba(194, 113, 39, .12)
}

.mega-menu-box-wrap-item.mega-service {
	width: 70%
}

.mega-menu-box-wrap-item.mega-service .mega-menu-list {
	-moz-column-count: 2;
	-webkit-column-count: 2;
	column-count: 2
}

.mega-menu-box-wrap-item.mega-service .mega-menu-item {
	-webkit-column-break-inside: avoid;
	page-break-inside: avoid;
	break-inside: avoid-column;
	max-width: calc(100% - .8rem)
}

.mega-menu-box-wrap-item.mega-service .mega-menu-item.active .d-flex {
	background-color: transparent !important;
	box-shadow: unset !important
}

.mega-menu-box-wrap-item.mega-service .mega-menu-item.active .d-flex .mega-menu-txt .title {
	color: #7c0fd1 !important
}

.mega-menu-box-wrap-item.mega-service .d-flex {
	padding: 1.6rem 0 !important
}

.mega-menu-box-wrap-item.mega-service .d-flex .mega-menu-txt .title {
	font-size: 1.6rem;
	font-weight: 400;
	color: #5f5f5f
}

@media screen and (min-width:1201px) {
	.mega-menu-box-wrap-item.mega-service .d-flex:hover {
		background-color: transparent !important;
		color: #7c0fd1 !important;
		box-shadow: unset !important
	}

	.mega-menu-box-wrap-item.mega-service .d-flex:hover .mega-menu-txt .title {
		color: #7c0fd1 !important
	}
}

.mega-menu-box-wrap-item.mega-service .mega-menu-img {
	background-color: transparent;
	padding: 0
}

.mega-menu-box-wrap-item.mega-service .mega-menu-img img {
	width: 2.4rem;
	height: 2.4rem
}

.mega-menu-box-wrap-item.mega-service .mega-menu-txt {
	margin-left: .8rem
}

.mega-menu-box-wrap-item.mega-related {
	position: relative;
	width: 30%;
	padding-right: 0;
	height: 100%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	flex-direction: column;
	-webkit-flex-direction: column;
	justify-content: flex-start;
	align-items: stretch
}

.mega-menu-box-wrap-item.mega-related::before {
	content: "";
	position: absolute;
	top: 0;
	left: -1.2rem;
	width: 1px;
	height: 100%;
	background-color: #e0e0e0
}

.mega-menu-box-wrap-item.mega-related .mega-menu-list {
	padding-top: 1.2rem
}

.mega-menu-box-wrap-item.mega-related .mega-menu-item.active .d-flex {
	background-color: transparent !important;
	box-shadow: unset !important
}

.mega-menu-box-wrap-item.mega-related .mega-menu-item.active .d-flex .mega-menu-txt .title {
	color: #7c0fd1 !important
}

.mega-menu-box-wrap-item.mega-related .d-flex {
	padding: 1.2rem 0 !important;
	position: relative
}

.mega-menu-box-wrap-item.mega-related .d-flex::before {
	content: "";
	position: absolute;
	top: 1.8rem;
	left: 0;
	width: .6rem;
	height: .6rem;
	border-radius: 50%;
	background-color: #7c0fd1
}

.mega-menu-box-wrap-item.mega-related .d-flex .mega-menu-txt .title {
	font-size: 1.6rem;
	font-weight: 400;
	color: #5f5f5f
}

@media screen and (min-width:1201px) {
	.mega-menu-box-wrap-item.mega-related .d-flex:hover {
		background-color: transparent !important;
		color: #7c0fd1 !important;
		box-shadow: unset !important
	}

	.mega-menu-box-wrap-item.mega-related .d-flex:hover .mega-menu-txt .title {
		color: #7c0fd1 !important
	}
}

.hd-menu .menu-item.mega-menu::before {
	content: "";
	position: absolute;
	top: 100%;
	height: 4rem;
	width: 50vw;
	left: 50%;
	transform: translateX(-50%);
	cursor: pointer;
	background-color: transparent;
	pointer-events: none
}

@media screen and (max-width:1200px) {
	.hd-menu .menu-item.mega-menu::before {
		content: none
	}
}

@media screen and (min-width:1201px) {
	.hd-menu .menu-item.dropdown.mega-menu .subBtn {
		width: .5rem;
		height: .9rem;
		transition: .3s;
		top: 1.6rem
	}
}

.menu-item.mega-menu.dropdown .submenu {
	display: none
}

.domain-gift {
	padding: 2.4rem;
	border-radius: 1.6rem;
	background-color: #7c0fd1;
	color: #fff;
	margin-top: 4rem;
	position: relative;
	overflow: hidden
}

.domain-gift::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url("../assets/images/mega-menu/domain-gift-bg.png") no-repeat;
	background-size: cover
}

.domain-gift-tt {
	font-size: 2.4rem;
	font-weight: 600;
	position: relative;
	z-index: 2
}

@media only screen and (max-width:1200px) {
	.domain-gift-tt {
		font-size: 2rem
	}
}

@media only screen and (max-width:800px) {
	.domain-gift-tt {
		font-size: 1.7rem
	}
}

.domain-gift-btn {
	margin-top: 1.6rem;
	position: relative;
	z-index: 2
}

.domain-gift-btn .btn {
	padding: .8rem 1.2rem !important;
	font-size: 1.4rem !important;
	color: #fff !important;
	border-radius: .4rem !important
}

.domain-gift-btn .btn::after {
	background: #f41e92
}

@media screen and (min-width:1201px) {
	.hd-menu .menu-item.mega-menu a:hover {
		color: #fff;
		background-color: #f5851e
	}

	.hd-menu .menu-item.mega-menu:hover>a {
		background-color: #f5851e;
		color: #fff
	}

	.hd-menu .menu-item.mega-menu:hover::before {
		pointer-events: auto
	}

	.hd-menu .menu-item.mega-menu:hover .subBtn {
		filter: brightness(0) invert(1);
		-webkit-filter: brightness(0) invert(1);
		transform: rotate(-90deg)
	}

	.hd-menu .menu-item.mega-menu:hover .mega-menu-box {
		display: block;
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
		animation: zoomIn .5s ease-in-out forwards
	}

	.hd-menu .menu-item.mega-menu:hover .mega-menu-box .container {
		pointer-events: auto
	}
}

.mega-menu-view {
	margin-top: 4.2rem
}

.mega-menu-view-link {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	justify-content: flex-start;
	-webkit-justify-content: flex-start;
	max-width: max-content;
	padding: .4rem 0 !important;
	font-size: 1.6rem !important;
	font-weight: 600 !important;
	transition: .3s;
	color: #7c0fd1 !important
}

@media screen and (min-width:1201px) {
	.mega-menu-view-link:hover {
		background-color: transparent !important;
		opacity: .7
	}
}

.mega-menu-view-link img {
	width: 1.2rem;
	height: 1.2rem;
	margin-right: .8rem
}

.mega-menu-img img {
	object-fit: contain
}

.popper-contextMenu {
	position: fixed;
	z-index: 3000000000;
	list-style-type: none;
	padding: 1.6rem;
	background: #fff;
	border-radius: 1.6rem;
	width: max-content;
	box-shadow: 0 0 .4rem rgba(0, 0, 0, .16)
}

.popper-contextMenu .mega-menu-item:not(:last-child) {
	margin-bottom: .2rem
}

.popper-contextMenu .mega-menu-item img {
	width: 2.4rem;
	height: 2.4rem
}

.popper-contextMenu .mega-menu-item:nth-child(5n+1) .mega-menu-img {
	background-color: #f2f8ff
}

.popper-contextMenu .mega-menu-item:nth-child(5n+2) .mega-menu-img {
	background-color: #fff5fb
}

.popper-contextMenu .mega-menu-item:nth-child(5n+3) .mega-menu-img {
	background-color: #faf3ff
}

.popper-contextMenu .mega-menu-item:nth-child(5n+4) .mega-menu-img {
	background-color: #edfbff
}

.popper-contextMenu .mega-menu-item:nth-child(5n+5) .mega-menu-img {
	background-color: #fff6ed
}

.popper-contextMenu .d-flex {
	align-items: center;
	-webkit-align-items: center;
	padding: 1.2rem .4rem;
	padding-right: 1.6rem;
	transition: .3s;
	border-radius: 1.2rem;
	cursor: pointer
}

@media screen and (min-width:1201px) {
	.popper-contextMenu .mega-menu-item:nth-child(5n+1) .d-flex:hover {
		background-color: #f2f8ff;
		box-shadow: inset 6px 6px 12px rgba(16, 72, 132, .12)
	}

	.popper-contextMenu .mega-menu-item:nth-child(5n+2) .d-flex:hover {
		background-color: #fff5fb;
		box-shadow: inset 6px 6px 12px rgba(208, 45, 134, .12)
	}

	.popper-contextMenu .mega-menu-item:nth-child(5n+3) .d-flex:hover {
		background-color: #faf3ff;
		box-shadow: inset 6px 6px 12px rgba(16, 72, 132, .12)
	}

	.popper-contextMenu .mega-menu-item:nth-child(5n+4) .d-flex:hover {
		background-color: #edfbff;
		box-shadow: inset 6px 6px 12px rgba(32, 140, 173, .12)
	}

	.popper-contextMenu .mega-menu-item:nth-child(5n+5) .d-flex:hover {
		background-color: #fff6ed;
		box-shadow: inset 6px 6px 12px rgba(194, 113, 39, .12)
	}

	.eco-two-item.is-inview:nth-last-child(1)>*,
	.eco-two-item.is-inview:nth-last-child(2)>* {
		opacity: .05
	}
}

.bakvitech-hiring.bakvitech-hiring-show {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translate(0, -50%)
}

.bakvitech-hiring-link {
	display: block
}

.bakvitech-hiring {
	position: fixed;
	z-index: 10;
	top: 70%;
	right: 0;
	width: 23.3rem;
	transition: .3s linear;
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
	transform: translate(100%, -50%)
}

@media screen and (max-width:1200px) {
	.bakvitech-hiring {
		width: 10rem
	}

	.aside-body {
		max-height: 37vh
	}
}

.bakvitech-hiring.bakvitech-hiring-show {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translate(0, -50%)
}

.bakvitech-hiring-link {
	display: block
}

.modal-pop {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: .3s
}

.modal-pop.active {
	opacity: 1;
	visibility: visible;
	pointer-events: auto
}

.policy-item {
	position: relative
}

.modal-pop {
	position: absolute;
	right: 2rem;
	bottom: calc(100% + 1.2rem)
}

.modal-pop-wrap {
	width: 45.6rem;
	padding: 2.4rem;
	background: #fff;
	box-shadow: 8px 8px 32px rgba(0, 0, 0, .16);
	border-radius: 16px
}

.modal-pop .modal-pop-close {
	position: absolute;
	top: 2.4rem;
	right: 2.4rem;
	padding: .4rem;
	width: 2.4rem;
	height: 2.4rem;
	transition: .3s;
	border: 1px solid transparent;
	border-radius: .4rem;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer
}

.modal-pop-tt {
	font-size: 1.8rem;
	font-weight: 700;
	margin-bottom: .8rem;
	max-width: calc(100% - 3.2rem)
}

.modal-pop-desc {
	font-size: 1.4rem;
	color: #8b8b8b
}

.modal-pop-btn {
	display: flex;
	position: relative;
	margin-top: 3.2rem;
	max-width: max-content
}

.modal-pop-btn-item {
	display: block;
	padding: 1.4rem 3.2rem;
	border: .1rem solid rgba(58, 58, 58, .4);
	border-radius: .8rem;
	margin-right: 1.6rem;
	min-width: 14.5rem;
	font-size: 1.6rem;
	font-weight: 500;
	color: #3a3a3a;
	text-align: center
}

.modal-pop-btn-item.get-code {
	background-color: #7c0fd1;
	color: #fff
}

.modal-pop-btn-item:last-child {
	margin-right: 0
}

.modal-pop-btn .ani-preview-web {
	position: absolute;
	top: 0;
	right: 0;
	width: 4rem;
	height: 6rem;
	transform: translate(100%, -3rem) rotateY(-180deg)
}

@media screen and (min-width:1201px) {
	.modal-pop .modal-pop-close:hover {
		border-color: #7c0fd1
	}

	.modal-pop-btn-item.get-code:hover,
	.modal-pop-btn-item:hover {
		background-color: #f58635;
		color: #fff !important;
		border-color: transparent !important
	}
}

@media screen and (max-width:1200px) {
	.modal-pop {
		right: 1.6rem
	}

	.modal-pop .preview-web {
		display: block
	}
}

@media screen and (max-width:768px) {
	.modal-pop {
		right: unset;
		left: 0
	}
}

@media screen and (max-width:550px) {
	.modal-pop-wrap {
		width: 95vw;
		padding: 1.2rem;
		border-radius: .8rem
	}

	.modal-pop-btn-item {
		padding: .8rem 1.6rem;
		min-width: 9.6rem
	}

	.modal-pop .modal-pop-close {
		top: 1.4rem;
		right: 1.2rem
	}
}

.container-lg .container {
	position: relative;
	width: 100%;
	max-width: 146.4rem;
	height: 100%;
	margin: 0 auto;
	padding: 0 3.2rem
}

@media (min-width:1921px) {
	.container-lg .container {
		max-width: 188rem
	}
}

@media (max-width:1727px) {
	.container-lg .container {
		max-width: 126.4rem
	}
}

@media (max-width:1200px) {
	.container-lg .container {
		max-width: 100%
	}
}

@media (max-width:576px) {
	.container-lg .container {
		padding: 0 1.6rem
	}
}

.container-lg .d-flex.f-ctn {
	width: calc(100% + 2.4rem);
	margin-left: -1.2rem
}

@media (max-width:1200px) {
	.container-lg .d-flex.f-ctn {
		width: calc(100% + 1.5rem);
		margin-left: -.75rem
	}
}

@media (max-width:768px) {
	.container-lg .d-flex.f-ctn {
		width: calc(100% + .8rem);
		margin-left: -.4rem
	}
}

.container-lg .col {
	padding: 0 1.2rem
}

@media (max-width:1200px) {
	.container-lg .col {
		padding: 0 .75rem
	}
}

@media (max-width:768px) {
	.container-lg .col {
		padding: 0 .4rem
	}
}

.container-lg .sec-tt {
	font-size: 3.2rem
}

@media screen and (max-width:550px) {
	.container-lg .sec-tt {
		font-size: 2.4rem
	}
}

.login-form .modal-position {
	opacity: 1;
	pointer-events: auto
}

.login-form .modal-position-bg {
	opacity: 1;
	pointer-events: auto
}

.modal-position {
	z-index: 100;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	justify-content: center;
	align-items: center;
	position: fixed;
	z-index: 1000;
	transition: all .45s ease-in-out;
	opacity: 0;
	pointer-events: none;
	cursor: pointer
}

.modal-position-bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, .4);
	transition: all .45s ease-in-out;
	opacity: 0;
	pointer-events: none
}

.modal-changepass-content {
	margin: auto;
	padding: 4.2rem 7.2rem;
	border-radius: 1.6rem;
	max-width: 62rem;
	width: 100%;
	position: relative;
	z-index: 1;
	overflow: hidden;
	top: 50%;
	transform: translateY(-50%);
	transition: all .45s ease-in-out;
	opacity: 0;
	pointer-events: none;
	display: none
}

@media screen and (max-width:768px) {
	.modal-changepass-content {
		max-width: 80%;
		padding: 5.6rem 8rem
	}
}

@media screen and (max-width:576px) {
	.modal-changepass-content {
		max-width: 96%;
		padding: 2.4rem 1.6rem
	}
}

.modal-changepass-content.open {
	opacity: 1;
	pointer-events: auto;
	display: block
}

.modal-changepass-content::before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: -1;
	background: rgba(0, 0, 0, .6);
	backdrop-filter: blur(32px);
	-webkit-backdrop-filter: blur(32px)
}

.modal-changepass-content.modal-pass .input-wrap-inner {
	overflow: hidden;
	width: 100%;
	position: relative;
	z-index: 2;
	height: 4.4rem
}

.modal-changepass-content.modal-pass .input-wrap-inner input {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 1.2rem;
	background: 0 0;
	font-size: 1.4rem;
	color: #fff
}

.modal-changepass-content.modal-pass .input-wrap-inner input::placeholder {
	font-size: 1.4rem;
	color: #fff
}

.modal-changepass-content.modal-pass .input-wrap-inner .input-wrap-img {
	z-index: 2;
	position: absolute;
	top: 50%;
	right: 1.2rem;
	transform: translateY(-50%)
}

.modal-changepass-content.modal-pass .input-wrap-inner .input-wrap-img .img {
	display: flex;
	align-items: center;
	width: 2rem;
	height: 2rem
}

.modal-changepass-content.modal-pass .input-wrap-inner .input-wrap-img .img img {
	object-fit: contain
}

.modal-changepass-content.modal-pass .input-wrap-inner .input-wrap-img.eys .img:nth-child(1) {
	display: none
}

.modal-changepass-content.modal-pass .input-wrap-inner .input-wrap-img.eys .img:nth-child(2) {
	display: flex
}

.modal-changepass-content.modal-pass .input-wrap-inner .input-wrap-img .img:nth-child(2) {
	display: none
}

.modal-changepass-content.modal-success .modal-changepass-header {
	margin-bottom: 0;
	flex-direction: column;
	align-items: center;
	text-align: center
}

.modal-changepass-content.modal-success .modal-changepass-header .img {
	width: 11rem
}

@media screen and (max-width:576px) {
	.modal-changepass-content.modal-success .modal-changepass-header .img {
		width: 8rem
	}
}

.modal-changepass-content.modal-success .modal-changepass-header .txt {
	font-size: 2rem;
	font-weight: 600;
	margin-bottom: .4rem
}

.modal-changepass-content.modal-success .modal-success-desc {
	font-size: 1.6rem;
	margin-bottom: 1.6rem;
	color: #fff
}

@media screen and (max-width:576px) {
	.modal-changepass-content.modal-success .modal-success-desc {
		font-size: 1.6rem;
		margin-bottom: 1.2rem
	}
}

.modal-changepass-content.modal-register .modal-changepass-form .input-wrap {
	width: calc(50% - .8rem)
}

.modal-changepass-content.modal-register .modal-changepass-form .input-wrap.style-pri {
	width: 100%
}

.modal-changepass-content.modal-register .modal-changepass-form .input-wrap {
	margin-bottom: 1.2rem
}

.modal-changepass-content.modal-register .input-wrap-list {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between
}

.modal-changepass-content.modal-register .input-wrap-inner {
	overflow: hidden;
	width: 100%;
	position: relative;
	z-index: 2;
	height: 4.4rem
}

.modal-changepass-content.modal-register .input-wrap-inner input {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 1.2rem;
	background: 0 0;
	font-size: 1.4rem;
	color: #fff
}

.modal-changepass-content.modal-register .input-wrap-inner input::placeholder {
	font-size: 1.4rem;
	color: #fff
}

.modal-changepass-content.modal-register .input-wrap-inner .input-wrap-img {
	z-index: 2;
	position: absolute;
	top: 50%;
	right: 1.2rem;
	transform: translateY(-50%)
}

.modal-changepass-content.modal-register .input-wrap-inner .input-wrap-img .img {
	width: 2rem;
	height: 2rem;
	display: flex;
	align-items: center
}

.modal-changepass-content.modal-register .input-wrap-inner .input-wrap-img .img img {
	object-fit: contain
}

.modal-changepass-content.modal-register .input-wrap-inner .input-wrap-img.eys .img:nth-child(1) {
	display: none
}

.modal-changepass-content.modal-register .input-wrap-inner .input-wrap-img.eys .img:nth-child(2) {
	display: flex
}

.modal-changepass-content.modal-register .input-wrap-inner .input-wrap-img .img:nth-child(2) {
	display: none
}

.modal-changepass-content.modal-register .group-wrap {
	width: 100%;
	display: flex;
	justify-content: space-between;
	font-size: 1.4rem
}

.modal-changepass-content.modal-register .group-wrap input {
	margin: 0
}

.modal-changepass-content.modal-register .group-wrap .group-left {
	display: flex;
	gap: .4rem;
	align-items: center
}

.modal-changepass-content.modal-login .modal-changepass-form .input-wrap {
	width: 100%
}

.modal-changepass-content.modal-login .group-wrap {
	width: 100%;
	display: flex;
	justify-content: space-between;
	font-size: 1.4rem
}

.modal-changepass-content.modal-login .group-wrap input {
	margin: 0
}

.modal-changepass-content.modal-login .group-wrap .group-left {
	display: flex;
	gap: .4rem;
	align-items: center
}

.modal-changepass-content .show-verify {
	color: #f5851e;
	margin-top: -1.2rem;
	margin-bottom: 1.2rem;
	font-size: 1.2rem
}

.show-send-later,
.show-verify-send {
	font-weight: -700
}

@keyframes shake {
	0% {
		transform: translateX(0)
	}

	25% {
		transform: translateX(-1px)
	}

	50% {
		transform: translateX(1px)
	}

	75% {
		transform: translateX(-1px)
	}

	100% {
		transform: translateX(0)
	}
}

.modal-changepass-header {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 1.6rem;
	margin-bottom: 1.6rem
}

@media screen and (max-width:576px) {
	.modal-changepass-header {
		gap: 1.2rem
	}
}

.modal-changepass-header .img {
	width: 7.3rem;
	height: auto;
	display: flex;
	justify-content: center;
	align-items: center;
	animation: shake 1s infinite;
	animation-delay: 1s
}

.modal-changepass-header .txt {
	color: #fff;
	font-size: 2rem;
	font-weight: 600;
	text-transform: uppercase;
	flex: 1
}

@media screen and (max-width:768px) {
	.modal-changepass-header .txt {
		font-size: 1.7rem;
		text-align: center
	}
}

.modal-changepass-form {
	position: relative
}

.modal-changepass-form .input-wrap {
	margin-bottom: 1.2rem;
	display: flex;
	flex-direction: column;
	width: 100%;
	justify-content: flex-start;
	align-items: flex-start;
	position: relative;
	padding-bottom: 1.6rem
}

.modal-changepass-form .input-wrap .invalid {
	margin-top: .2rem;
	color: red;
	font-size: 1.2rem
}

.modal-changepass-form .input-wrap .lable {
	color: #a4a4a4;
	font-size: 14px;
	font-weight: 600;
	margin-bottom: .4rem;
	width: 100%
}

.modal-changepass-form .input-wrap .input {
	border-radius: .8rem;
	border: .1rem solid #fff;
	background: rgba(255, 255, 255, .1);
	padding: 1.2rem;
	color: #fff;
	font-size: 1.4rem;
	width: 100%
}

.modal-changepass-form .input-wrap .input::placeholder {
	color: #a4a4a4
}

.modal-changepass-form .button-wrap {
	border-radius: .8rem;
	background: linear-gradient(80deg, #a32dff -.15%, #f41e92 87.57%);
	display: flex;
	padding: 1rem 3.2rem;
	justify-content: center;
	align-items: center;
	gap: 1.2rem;
	align-items: center;
	width: 100%;
	cursor: pointer;
	transition: .3s
}

.modal-changepass-form .button-wrap .img {
	width: 2.4rem;
	height: 2.4rem;
	display: flex;
	justify-content: center;
	align-items: center
}

.modal-changepass-form .button-wrap .txt {
	color: #fff;
	font-size: 1.8rem;
	font-weight: 600;
	text-transform: uppercase
}

@media screen and (min-width:1201px) {
	.modal-changepass-form .button-wrap:hover {
		opacity: .8
	}
}

.modal-changepass-form .button-wrap.button-wrap-normal {
	background: #fff;
	display: none;
	margin-top: 1.6rem
}

.modal-changepass-form .button-wrap.button-wrap-normal .txt {
	color: #3a3a3a
}

@media screen and (max-width:576px) {
	.modal-changepass-form .button-wrap.button-wrap-normal {
		display: flex
	}
}

.modal-mail .otp-wrapper {
	display: flex;
	margin: 0 -.8rem;
	margin-bottom: 1.6rem
}

@media screen and (max-width:576px) {
	.modal-mail .otp-wrapper {
		margin: 0 -.4rem;
		margin-bottom: 1.6rem
	}
}

.modal-mail .otp-wrapper-item {
	width: 25%;
	padding: 0 .8rem;
	height: 5.6rem
}

@media screen and (max-width:576px) {
	.modal-mail .otp-wrapper-item {
		padding: 0 .4rem;
		height: 4.4rem
	}
}

.modal-mail .form-input {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	border-radius: 8px;
	border: 1px solid #fff;
	background: rgba(255, 255, 255, .1);
	font-size: 2.4rem;
	font-weight: 600;
	color: #fff
}

@media screen and (max-width:1200px) {
	.modal-mail .form-input {
		font-size: 2rem;
		font-weight: 500
	}
}

.modal-mail .form-input:focus::placeholder {
	opacity: 0
}

.modal-mail .form-input::placeholder {
	font-size: 2.4rem;
	font-weight: 600;
	color: #fff;
	opacity: .5
}

@media screen and (max-width:1200px) {
	.modal-mail .form-input::placeholder {
		font-size: 2rem;
		font-weight: 500
	}
}

.modal-changepass-desc {
	margin-bottom: .8rem;
	font-size: 1.4rem;
	color: #fff
}

.modal-changepass-form .input-wrap-inner {
	position: relative
}

.input-wrap-flex {
	display: flex;
	gap: 1.2rem
}

.modal-changepass-form .icon-eye {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 0;
	font-size: 1.4rem;
	padding: 1rem 1.2rem;
	cursor: pointer;
	color: #fff
}

.modal-changepass-form .input-wrap .invalid {
	color: #f5851e;
	bottom: -.4rem;
	transition: .3s
}

.modal-changepass-form .group-wrap {
	width: 100%;
	color: #fff;
	gap: 1.2rem;
	cursor: pointer;
	display: flex;
	justify-content: space-between
}

.modal-changepass-form .group-wrap label {
	transition: .3s;
	font-size: 1.4rem;
	cursor: pointer;
	font-weight: 700
}

.modal-changepass-content .input:-webkit-autofill~.icon-eye {
	color: #3a3a3a
}

.modal-changepass-form input:-webkit-autofill {
	-webkit-box-shadow: inset 0 0 0 30px #fff !important
}

.modal-changepass-content input:-webkit-autofill,
.modal-changepass-content input:-webkit-autofill:focus {
	transition: background-color 0s 600000s, color 0s 600000s !important
}

.modal-changepass-form input:-webkit-autofill,
.modal-changepass-form input:-webkit-autofill:focus,
.modal-changepass-form input:-webkit-autofill:hover {
	transition: background-color 5000s ease-in-out 0s;
	-webkit-text-fill-color: #3a3a3a
}

.modal-changepass-content .input-wrap-list,
.modal-changepass-content.modal-register .input-wrap-list {
	display: flex;
	flex-wrap: nowrap;
	gap: 1.6rem
}

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

	.modal-changepass-content .input-wrap-list,
	.modal-changepass-content.modal-register .input-wrap-list {
		flex-wrap: wrap;
		gap: .8rem;
		margin-bottom: 0 !important
	}
}

.modal-changepass-form .input:-webkit-autofill~.icon-eye {
	color: #3a3a3a
}

.modal-changepass-form .group-left,
.modal-changepass-form .group-right {
	display: flex;
	align-items: center;
	gap: .8rem
}

@media screen and (min-width:1201px) {

	.modal-changepass-form .group-left:hover label,
	.modal-changepass-form .group-right:hover label {
		color: #f41e92
	}
}

.otp-form .form-note {
	font-style: italic;
	font-size: 1.4rem;
	margin: .4rem 0;
	color: #f5851e;
	text-align: center;
	font-weight: 600
}

.otp-form .loading {
	overflow: visible
}

.otp-form .is-loading-group.loading::before {
	margin-top: 0
}

.otp-form .is-loading-group[style="display: block;"]::before {
	margin-top: -.2em
}

.modal-mail .otp-wrapper-item {
	width: 25%;
	padding: 0 .8rem;
	height: 5.6rem
}

@media screen and (max-width:576px) {
	.modal-mail .otp-wrapper-item {
		padding: 0 .4rem;
		height: 4.4rem
	}
}

.checked-custom {
	display: inline-block;
	width: 1.6rem;
	height: 1.6rem;
	border-radius: .3rem;
	border: .1rem solid #89939e;
	transition: .3s;
	position: relative
}

.checked-custom::after,
.checked-custom::before {
	content: '';
	position: absolute;
	background-color: #fff;
	height: .2rem;
	opacity: 0;
	transition: .3s
}

.checked-custom::before {
	width: .5rem;
	top: .8rem;
	left: .15rem;
	transform: rotate(45deg)
}

.checked-custom::after {
	width: 1rem;
	top: .65rem;
	left: .35rem;
	transform: rotate(-45deg)
}

.checked-custom-ipt:checked~.checked-custom {
	border-color: #f41e92;
	background-color: #f41e92
}

.checked-custom-ipt:checked~.checked-custom::after,
.checked-custom-ipt:checked~.checked-custom::before {
	opacity: 1
}

@keyframes ani-blinker {
	from {
		opacity: 1
	}

	to {
		opacity: 0
	}
}

.modal-mail .otp-wrapper-item .otp-wrapper-item-txt {
	display: block;
	width: 100%;
	height: 100%;
	position: relative;
	border-radius: .8rem;
	border: .1rem solid var(--Primary-Color-grey-400, #616161);
	background: rgba(255, 255, 255, .1);
	cursor: text
}

.modal-mail .otp-wrapper-item .otp-wrapper-item-txt::before {
	content: attr(data-otp);
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 2.4rem;
	font-weight: 600;
	color: #fff
}

.modal-mail .otp-wrapper-item .otp-wrapper-item-txt.focus::before {
	font-size: 2rem;
	font-weight: 300;
	animation: ani-blinker .2s infinite alternate
}

.otp-pop-form-hidden {
	position: absolute;
	opacity: 0;
	pointer-events: none
}

.modal-changepass-content input:-internal-autofill-selected {
	background-color: rgba(255, 255, 255, .1)
}

.modal-changepass-content input:-webkit-autofill,
.modal-changepass-content input:-webkit-autofill:focus {
	transition: background-color 0s 600000s, color 0s 600000s !important
}

.modal-changepass-content .input:-webkit-autofill,
.modal-changepass-content .input:-webkit-autofill:active,
.modal-changepass-content .input:-webkit-autofill:focus,
.modal-changepass-content .input:-webkit-autofill:hover {
	-webkit-box-shadow: inset 0 0 0 30px #fff !important
}

.modal-changepass-content .input {
	background: rgba(255, 255, 255, .1)
}

.modal-changepass-form .input-wrap-inner {
	width: 100%
}

@media screen and (max-width:576px) {
	.modal-changepass-content {
		height: calc(100% - 1.6rem)
	}

	.modal-changepass-header .img {
		width: 4.8rem
	}

	.modal-changepass-header .txt {
		font-size: 1.4rem
	}

	.input-wrap-flex {
		flex-direction: column;
		gap: 0
	}
}

.open-popup-account-js {
	cursor: pointer
}

:root {
	--dark: #34495e;
	--light: #ffffff;
	--success: #12b76a;
	--error: #943cda;
	--warning: #e9bd0c;
	--info: #3498db
}

.notifications {
	position: fixed;
	top: 3.2rem;
	right: 2.2rem;
	z-index: 1002
}

.notifications :where(.toast, .column) {
	display: flex;
	align-items: center;
	gap: 1.2rem
}

.notifications .toast {
	width: 39rem;
	max-width: 95vw;
	position: relative;
	overflow: hidden;
	list-style: none;
	border-radius: .4rem;
	padding: 1.6rem;
	margin-bottom: 1rem;
	justify-content: space-between;
	background: var(--error);
	animation: show_toast .3s ease forwards
}

.notifications .toast.success {
	background: var(--success)
}

.close-icon {
	cursor: pointer;
	color: var(--light);
	padding: 1.2rem;
	transform: translateX(1.2rem)
}

@keyframes show_toast {
	0% {
		transform: translateX(100%)
	}

	40% {
		transform: translateX(-5%)
	}

	80% {
		transform: translateX(0)
	}

	100% {
		transform: translateX(-10px)
	}
}

.notifications .toast.hide {
	animation: hide_toast .3s ease forwards
}

@keyframes hide_toast {
	0% {
		transform: translateX(-10px)
	}

	40% {
		transform: translateX(0)
	}

	80% {
		transform: translateX(-5%)
	}

	100% {
		transform: translateX(calc(100% + 20px))
	}
}

.toast::before {
	position: absolute;
	content: "";
	height: 3px;
	width: 100%;
	bottom: 0;
	left: 0;
	animation: progress 5s linear forwards
}

.error-icon {
	width: 3.6rem;
	height: 3.6rem;
	flex-shrink: 0
}

@media screen and (max-width:400px) {
	.error-icon {
		width: 2.4rem;
		height: 2.4rem
	}
}

.toast-txt {
	font-size: 1.4rem;
	font-weight: 600;
	color: var(--light)
}

@media screen and (max-width:400px) {
	.error-icon {
		width: 2.4rem;
		height: 2.4rem
	}

	.toast-txt {
		font-size: 1.2rem
	}
}

@keyframes progress {
	100% {
		width: 0%
	}
}

.btn-toast#success,
.toast.success::before {
	background: var(--success)
}

.btn-toast#error,
.toast.error::before {
	background: var(--error)
}

.btn-toast#warning,
.toast.warning::before {
	background: var(--warning)
}

.btn-toast#info,
.toast.info::before {
	background: var(--info)
}

.toast .column i {
	font-size: 1.75rem
}

.toast.success .column i {
	color: var(--success)
}

.toast.error .column i {
	color: var(--error)
}

.toast.warning .column i {
	color: var(--warning)
}

.toast.info .column i {
	color: var(--info)
}

.toast i:last-child {
	color: #aeb0d7;
	cursor: pointer
}

.toast i:last-child:hover {
	color: var(--dark)
}

.buttons .btn-toast {
	border: none;
	outline: 0;
	cursor: pointer;
	margin: 0 5px;
	color: var(--light);
	font-size: 1.2rem;
	padding: 10px 20px;
	border-radius: 4px
}

@media screen and (max-width:530px) {
	.notifications {
		width: 95%;
		right: 2rem
	}

	.notifications .toast {
		width: 100%;
		font-size: 1rem;
		margin-left: 20px
	}

	.buttons .btn-toast {
		margin: 0 1px;
		font-size: 1.1rem;
		padding: 8px 15px
	}
}

.video-demo {
	position: relative;
	margin: 1.6rem 0
}

.video-demo .video-demo-play {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%)
}

.video-demo .video-demo-play .icon {
	font-size: 8rem;
	font-weight: 100;
	color: #f41e92;
	cursor: pointer
}

.video-demo-wrap {
	position: relative;
	border-radius: 1.6rem;
	overflow: hidden;
	aspect-ratio: 16/9
}

.video-demo-wrap .iframe {
	width: 100%;
	height: 100%;
	position: relative;
	z-index: 3
}

.video-demo .video {
	width: 100%;
	vertical-align: middle
}

.video-demo .video-time-line {
	position: absolute;
	z-index: 3;
	bottom: 2rem;
	left: 50%;
	transform: translateX(-50%);
	width: calc(100% - 3.2rem);
	display: flex;
	align-items: center;
	gap: .4rem
}

.video-demo .video-time-volume {
	width: 3.2rem;
	height: 3.2rem;
	padding: .8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer
}

.video-demo .video-time-volume .volume-icon {
	font-size: 2.4rem;
	color: #fff
}

.video-demo .video-time-wrap {
	position: relative;
	width: 100%;
	height: 100%;
	height: .8rem;
	background-color: #d9d9d9;
	border-radius: 10rem
}

.video-demo .pin {
	position: absolute;
	width: .8rem;
	height: 100%;
	left: var(--pin-position);
	background-color: #f5851e
}

.video-demo .pin::before {
	content: '';
	position: absolute;
	top: 0;
	left: 50%;
	transform: translate(-50%, -100%);
	width: 4rem;
	height: 4rem;
	background: url("https://bakvitech.com/template/assets/videos/login/video-demo-pin.png") no-repeat;
	background-size: contain;
	background-position: center
}

.video-demo .time-process {
	position: absolute;
	top: 0;
	left: 0;
	width: var(--videoCurrentTime);
	height: 100%;
	background-color: #f41e92;
	border-top-left-radius: 10rem;
	border-bottom-left-radius: 10rem;
	transition: width var(--timeTransition);
	transform: translateY(0)
}

.form-embed-close {
	position: absolute;
	top: 0;
	right: 0;
	padding: 1.6rem;
	z-index: 5;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	-webkit-align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	display: none
}

@media screen and (max-width:576px) {
	.form-embed-close {
		display: flex
	}
}

.form-embed .is-loading-group.loading::before {
	height: 1em;
	width: 1em;
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: unset;
	margin-top: unset;
	content: "";
	-webkit-animation: spin 1s ease-in-out infinite;
	animation: spin 1s ease-in-out infinite;
	background: url("../../wp-content/themes/bakvitechtheme/public/helpers/images/loader.svg") center center;
	background-size: cover;
	line-height: 1;
	text-align: center;
	font-size: 2em;
	color: rgba(0, 0, 0, .75);
	z-index: 99
}

.form-embed-close-icon {
	color: #fff
}

.form-embed {
	position: absolute;
	z-index: 4;
	inset: 0;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: .3s cubic-bezier(.25, .46, .45, .94)
}

.form-embed.active {
	opacity: 1;
	pointer-events: auto;
	visibility: visible
}

.form-embed.close {
	opacity: 0;
	pointer-events: none;
	visibility: hidden
}

.form-embed .modal-changepass-content {
	padding: 1em;
	max-width: 100%;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	top: unset;
	transform: unset;
	will-change: transform, opacity;
	transition: .3s cubic-bezier(.25, .46, .45, .94)
}

.form-embed .modal-changepass-content::before {
	content: none
}

.form-embed .modal-changepass-header .img {
	width: calc((50 / 1728) * 100vw)
}

@media screen and (max-width:576px) {
	.form-embed .modal-changepass-header .img {
		width: 5.4rem
	}
}

.form-embed .modal-changepass-header .txt {
	font-size: .83333vw;
	line-height: 1.5
}

@media screen and (max-width:1200px) {
	.form-embed .modal-changepass-header .txt {
		font-size: 14px
	}
}

@media screen and (max-width:768px) {
	.form-embed .modal-changepass-header .txt {
		text-align: left
	}
}

.form-embed .modal-changepass-header {
	margin-bottom: calc((14 / 1728) * 100vw)
}

.form-embed .modal-changepass-form .input-wrap {
	margin-bottom: calc((12 / 1728) * 100vw)
}

.form-embed .modal-changepass-form .input-wrap {
	position: relative
}

.blog-large-content .form-embed p {
	margin: 0;
	line-height: 1.2
}

.form-embed .modal-changepass-content .group-wrap,
.form-embed .modal-changepass-desc,
.form-embed .modal-changepass-form .input-wrap .lable,
.form-embed .modal-success-desc {
	color: #fff
}

.form-embed .modal-changepass-form .input-wrap .lable {
	font-size: 1.2rem
}

.form-embed .modal-changepass-content.modal-register .input-wrap-inner input::placeholder {
	color: #8a8a8b
}

.form-embed .modal-changepass-content.modal-register .input-wrap-inner input,
.form-embed .modal-changepass-form .input-wrap .input {
	padding: 1rem 1.2rem
}

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

	.form-embed .modal-changepass-content.modal-register .input-wrap-inner input,
	.form-embed .modal-changepass-form .input-wrap .input {
		padding: 1rem
	}
}

.form-embed .content {
	width: 100%;
	max-width: 45.9rem;
	margin-left: auto;
	margin-right: auto
}

.form-embed-list {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
	border-radius: 1.6rem
}

@media screen and (max-width:576px) {
	.form-embed-list {
		border-radius: 1.2rem
	}
}

.form-embed-list::before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 3;
	background: rgba(0, 0, 0, .6);
	backdrop-filter: blur(32px);
	-webkit-backdrop-filter: blur(32px);
	pointer-events: none
}

.form-embed-item {
	position: absolute;
	z-index: 3;
	inset: 0;
	pointer-events: none
}

.form-embed.active .form-embed-item.active .modal-changepass-content {
	opacity: 1;
	visibility: visible;
	pointer-events: auto
}

.form-embed .modal-changepass-content .group-wrap .group-left {
	gap: .8rem
}

.fa-eye-parent {
	position: relative;
	width: 100%
}

.form-embed .modal-changepass-content .input:-webkit-autofill~.icon-eye {
	color: #3a3a3a
}

.modal-changepass-content.modal-register .input-wrap-inner {
	height: unset
}

.modal-changepass-content.modal-register .input-wrap-inner input {
	position: static
}

.modal-changepass-content .input-wrap-inner .fa-eye-parent-ipt,
.modal-changepass-content.modal-register .input-wrap-inner .fa-eye-parent-ipt {
	padding-right: 3.2rem;
	width: 100%;
	height: 100%;
	padding: 1.2rem;
	background: 0 0;
	font-size: 1.4rem;
	color: #fff;
	border-radius: .8rem;
	border: .1rem solid #fff;
	background: rgba(255, 255, 255, .1)
}

.fa-eye-parent .icon-eye {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: .2rem;
	font-size: 1.2rem;
	color: #fff;
	padding: .8rem;
	cursor: pointer
}

.open-form-account-js {
	cursor: pointer
}

.open-form-account-js label {
	cursor: pointer
}

.checked-custom {
	display: inline-block;
	width: 1.6rem;
	height: 1.6rem;
	border-radius: .3rem;
	border: .1rem solid #89939e;
	transition: .3s;
	position: relative
}

.checked-custom::after,
.checked-custom::before {
	content: '';
	position: absolute;
	background-color: #fff;
	height: .2rem;
	opacity: 0;
	transition: .3s
}

.checked-custom::before {
	width: .5rem;
	top: .8rem;
	left: .15rem;
	transform: rotate(45deg)
}

.checked-custom::after {
	width: 1rem;
	top: .65rem;
	left: .35rem;
	transform: rotate(-45deg)
}

.checked-custom-ipt:checked~.checked-custom {
	border-color: #f41e92;
	background-color: #f41e92
}

.checked-custom-ipt:checked~.checked-custom::after,
.checked-custom-ipt:checked~.checked-custom::before {
	opacity: 1
}

.video-modal-continue {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	padding: 3.2rem;
	border-radius: 1.2rem;
	background: rgba(0, 0, 0, .6);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: .8rem;
	text-align: center;
	white-space: nowrap
}

.video-modal-continue .title {
	color: #fff
}

.video-modal-continue .continue-btn {
	display: flex;
	gap: .8rem;
	width: 100%;
	font-size: 1.6rem;
	font-weight: 600;
	line-height: 1.5
}

.video-modal-continue .item {
	width: 50%;
	padding: .8rem;
	border-radius: .8rem;
	background-color: #fff;
	color: #3a3a3a;
	cursor: pointer
}

.video-modal-continue .item.bg-edutech {
	background-color: #f41e92;
	color: #fff
}

.form-embed .modal-changepass-content.modal-register .modal-changepass-form .input-wrap {
	width: 100%;
	margin-bottom: .8rem
}

.form-embed .modal-changepass-content.modal-register .modal-changepass-form .input-wrap.style-pri {
	padding-bottom: 0
}

@media screen and (max-width:1727px) {
	.form-embed .modal-register .modal-changepass-header {
		margin-bottom: calc((8 / 1728)* 100vw)
	}

	.form-embed .modal-register .modal-changepass-header .img {
		width: calc((40 / 1728)* 100vw)
	}
}

.form-embed .modal-changepass-content.modal-register .modal-changepass-form .input-wrap .invalid {
	bottom: -.4rem;
	font-size: 1rem
}

.form-embed .input-wrap-list,
.form-embed .modal-changepass-content.modal-register .input-wrap-list {
	display: flex;
	flex-wrap: nowrap;
	gap: 1.6rem
}

.form-embed .modal-changepass-form .input-wrap.style-pri {
	margin-bottom: 0
}

.form-embed .modal-changepass-form .group-wrap label {
	font-size: 1.2rem
}

.form-embed .modal-changepass-form .button-wrap .txt {
	font-size: 1.6rem
}

.form-embed .show-verify {
	color: #f5851e;
	margin-bottom: 1.2rem
}

.form-embed .modal-changepass-form .button-wrap.button-wrap-normal {
	display: flex;
	transition: .3s;
	min-height: 4.4rem
}

@media screen and (min-width:1201px) {
	.form-embed .modal-changepass-form .button-wrap.button-wrap-normal:hover {
		background-color: #f41e92
	}

	.form-embed .modal-changepass-form .button-wrap.button-wrap-normal:hover .txt {
		color: #fff
	}
}

.form-embed .modal-login .modal-changepass-form .button-wrap.button-wrap-normal {
	display: none
}

.video-demo-login {
	position: absolute;
	z-index: 2;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
	padding: 1.6rem;
	border-radius: 1.2rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 1.4rem;
	font-weight: 700;
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
	transition: .3s
}

.video-demo-login::before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 3;
	background: rgba(0, 0, 0, .6);
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
	pointer-events: none
}

.video-demo-login.active {
	z-index: 4;
	opacity: 1;
	pointer-events: auto;
	visibility: visible
}

.video-demo-login-content {
	position: relative;
	z-index: 4;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center
}

.video-demo-login-header {
	display: flex;
	gap: 1.2rem;
	align-items: flex-start;
	margin-bottom: 1.2rem
}

.video-demo-login-header .img {
	width: 4.2rem
}

.video-demo-login-btn {
	display: flex;
	gap: .8rem;
	font-size: 1.4rem;
	justify-content: center;
	padding: .8rem 1.6rem;
	max-width: max-content;
	margin-left: auto;
	margin-right: auto;
	border-radius: .8rem;
	background: linear-gradient(80deg, #a32dff -.15%, #f41e92 87.57%);
	cursor: pointer
}

.video-demo-login-btn .img {
	width: 2.4rem;
	height: 2.4rem;
	display: flex;
	align-items: center;
	justify-content: center
}

.video-demo-login-btn .img img {
	object-fit: contain
}

.form-embed input:-webkit-autofill {
	-webkit-box-shadow: inset 0 0 0 30px #fff !important
}

.form-embed .modal-changepass-content.modal-pass .input-wrap-inner {
	border: unset
}

@media screen and (max-width:900px) {
	.form-embed {
		position: fixed;
		z-index: 1000;
		inset: .8rem
	}

	.form-embed .modal-login .modal-changepass-form .button-wrap.button-wrap-normal {
		display: flex;
		min-height: 4.4rem
	}

	.form-embed .modal-changepass-content {
		align-items: flex-start;
		padding: 3.2rem 1.6rem
	}

	.form-embed .modal-changepass-header .img,
	.form-embed .modal-register .modal-changepass-header .img {
		width: 5rem
	}

	.form-embed .modal-success .modal-changepass-header .txt {
		text-align: center
	}

	.form-embed .modal-changepass-header,
	.input-wrap-list {
		margin-bottom: 2.4rem
	}

	.form-embed .modal-changepass-form .input-wrap {
		margin-bottom: 1.2rem
	}

	.form-embed .modal-changepass-form .input-wrap .input {
		padding: 1.2rem
	}

	.video-demo-wrap {
		border-radius: 1.2rem
	}

	.video-demo .video-time-line {
		bottom: 0
	}

	.video-demo .video-time-wrap {
		height: .4rem
	}

	.video-demo .pin::before {
		width: 3rem;
		height: 3rem
	}

	.video-demo .video-time-volume .volume-icon {
		font-size: 1.6rem
	}
}

@media screen and (max-width:576px) {
	.form-embed .modal-changepass-header .txt br {
		display: none
	}

	.form-embed .input-wrap-list,
	.form-embed .modal-changepass-content.modal-register .input-wrap-list {
		gap: .8rem;
		flex-wrap: wrap
	}

	.form-embed .input-wrap-list {
		margin-bottom: 0
	}

	.form-embed .modal-changepass-header {
		margin-bottom: 2.4rem
	}

	.form-embed .modal-changepass-content.modal-register .modal-changepass-form .input-wrap .invalid {
		bottom: 0;
		margin: 0
	}
}

@keyframes falling {
	0% {
		top: -50px;
		opacity: 1
	}

	50% {
		opacity: 1
	}

	80% {
		opacity: 0
	}

	100% {
		top: 100%;
		opacity: 0
	}
}

@keyframes spins {
	0% {
		transform: rotate(0)
	}

	100% {
		transform: rotate(360deg)
	}
}

.dcor-holiday {
	position: fixed;
	top: 0;
	inset: 0;
	z-index: 20;
	pointer-events: none
}

.dcor-holiday .year-animation {
	width: 100%;
	height: 100%;
	overflow: hidden;
	z-index: 1;
	position: absolute
}

.dcor-holiday .year-animation .flake path {
	fill: #fff
}

.dcor-holiday .year-animation .flake-wrapper {
	position: absolute;
	z-index: 999
}

.dcor-holiday .year-animation .flake-wrapper img {
	animation: spins 5s linear infinite
}

.dcor-holiday .year-animation .flake {
	width: 100%;
	height: 100%
}

.dcor-holiday .year-img {
	position: absolute;
	top: calc(var(--heightHD) - 2.4rem);
	transition: .5s ease-in-out
}

.dcor-holiday .year-img .img {
	position: fixed;
	z-index: 100;
	height: auto
}

.dcor-holiday .year-img .img-01 {
	left: 0;
	transform: translate(-26%, -12%);
	width: 14%
}

.dcor-holiday .year-img .img-02 {
	right: 0;
	transform: translate(8%, -6%);
	width: 12%
}

body.out .year-img {
	top: -2rem
}

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

	.dcor-holiday .year-img .img-01,
	.dcor-holiday .year-img .img-02 {
		width: 9%
	}
}

@media screen and (max-width:576px) {
	.dcor-holiday {
		display: none
	}
}

.box-contact-form {
	display: block;
	position: fixed;
	width: 10%;
	z-index: 100;
	top: 50%;
	left: 1.6rem;
	transform: translateY(-50%);
	overflow: hidden;
	border-radius: .8rem;
	cursor: pointer;
	border-radius: 1rem
}

@keyframes styles_slide__SvF_62 {
	0% {
		left: -20%
	}

	100%,
	70%,
	80%,
	90% {
		left: 120%
	}
}

.styles_shine__JR1hn {
	position: absolute;
	top: 50%;
	left: 0;
	width: 20%;
	height: 120%;
	transform: translateY(-50%);
	pointer-events: none;
	animation: styles_slide__SvF_62 3s infinite
}

.styles_shine__JR1hn::after,
.styles_shine__JR1hn::before {
	content: "";
	height: 100%;
	position: absolute;
	background: rgba(255, 255, 255, .2);
	transform: skewX(-20deg)
}

.styles_shine__JR1hn::before {
	width: 50%;
	left: 40%
}

.styles_shine__JR1hn::after {
	width: 15%;
	left: 0
}

@media screen and (max-width:1360px) {
	.box-contact-form {
		width: 8%
	}
}

@media screen and (max-width:1200px) {
	.box-contact-form {
		display: none
	}
}

.bakvitech-content-hidden,
.bakvitech-content-hidden * {
	height: 0 !important;
	width: 0 !important;
	opacity: 0;
	pointer-events: none;
	position: absolute;
	bottom: 0;
	left: 0;
	font-size: 0 !important
}

.bakvitech-content-hidden iframe {
	display: none
}