html,
body {
  position: relative;
  height: 100%;
}

a {
  color: #333; text-decoration: none;
}

.brand {
  left: 0;
  top: 0;
  z-index: 9999;
  width: 100%;
  background: #ffffff;
  padding: 20px 200px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.brand-logo{
	display: flex;
	align-items: center;
	gap: 10px;
}
.logo-text{
	color: #333333;
	font-weight: bold;
	font-size: 22px;
}
.logo-desc{
	font-weight: normal;
	font-size: 14px;
	margin-top: 8px;
}
.logo-home{
	border: 2px solid #0B9E43;
	color: #0B9E43;
	font-size: 18px;
	border-radius: 50px;
	padding: 6px 15px;
	font-weight: bold;
	cursor: pointer;
}

[dir="rtl"] .brand {
  left: initial; right: 0;
}

.swiper {
  width: 100%;
  height: 100%;
}


.view {
  position: relative;
  background: url(../images/bg.png);
  background-size: 100% 100%;
  width: 100%;
  height: 100%;
}

.view-1 {
  box-sizing: border-box;
  padding-inline-start: 250px;
  padding-inline-end: 250px;
  color: #fff;
  margin-top: 65px;
}

.flex-fill{
	margin-left: 80px;
}

[dir="rtl"] .flex-fill {
  margin-left: 0;
  margin-right: 80px;
}

.lt {
  font-size: 52px; font-weight: bold; line-height: 1.5;
  margin-top: 220px;
}

.st {
  line-height: 1.8; font-size: 16px; max-width: 660px; margin-top: 1rem;
}

.download {
  gap: 15px; margin-top: 3rem;
}

.download a {
  display: flex; background-color: #ffffff; height: 45px; justify-content: center; align-items: center; border-radius: 50px; color: #333333; padding: 0 26px; font-size: 13px; font-weight: 900;
}
.download a img {
  margin-right: 5px; display: block;
}

.logo-ft{
	bottom: 80px !important;
	font-size: 10px !important;
	right: 10px!important;
}

.view-2,
.view- {
  background-color: #fff;  box-sizing: border-box; padding: 40px;
}


.w-half {
  flex: 1; width: 50%;
}

.w-half .vc {
  max-width: 500px;
}

.vh {
  font-size: 46px; color: #fff; font-weight: 600; margin: 1rem 0;
}
.vt {
  font-size: 16px; color: #fff; line-height: 1.8;
}

.view-3 {
  background-color: #f8f8ff;box-sizing: border-box; padding: 40px;
}

.view {
  position: relative;
}

.ft {
  position: absolute; left: 40px; right: 40px; bottom: 1rem; font-size: 8px; color: #818181;
}
.ft div {
  flex: 1;
}

.fe > span { padding: 0 5px;}
.fe { text-align: end }

.ft a {
  color: #818181;
}

.lang {
  position: absolute; right: 40px; top: 40px;
}


[dir="rtl"] .lang {
  right: inherit; left: 40px;
}


.lang-wrap {
  display: none; position: absolute; left: -15px; top: 0;
}
.lang-select {
  list-style: none; padding: 0; margin: 0; margin-top: 30px;  background-color: #fff;
}

.lang:hover > .lang-wrap {
  display: block; cursor: pointer;
}

.current-lang {
  display: flex; align-items: center; background-color: #7430f1; height: 24px; border-radius: 24px; color: #fff; padding: 0 12px; font-size: 10px; 
}

.current-lang img {
  margin-inline-end: 3px;
}


.lang-select {
  border-radius: 5px;
  background-color: #fff;
  box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.2);
  width: 85px;
}

.lang-select a {
  padding: 9px 12px;
  display: block;
  font-size: 12px;
  text-align: end;
}

.lang-select li:first-child a {
  border-bottom: 1px solid #eee;
}

[dir="rtl"] .swiper-pagination-vertical.swiper-pagination-bullets,
[dir="rtl"] .swiper-vertical > .swiper-pagination-bullets {
  left: 14px; right: inherit;
}

.swiper-pagination-bullet{
	background: #fff;
	opacity: .5;
}
.swiper-pagination-bullet-active{
	opacity: 1;
}