/*====================== Google fonts ========================*/
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap');

/*====================== Basic css ========================*/
html {
	font-size: 62.5%;
}

:root {
	scroll-behavior: unset;
	--PlusJakartaSans: "Plus Jakarta Sans", sans-serif;
	--Inter: "Inter", sans-serif;
	--white: #FFFFFF;
	--black: #1D1D1D;
	--yellow: #F5C243;
	--gray: #ECEEF3;
}

html,
body,
header,
footer,
main,
nav,
section,
div,
menu,
span,
h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
strong,
i,
ol,
ul,
li,
form,
label,
button {
	margin: 0;
	padding: 0;
}

ol,
ul {
	list-style: none;
}

button:focus,
a:focus,
input:focus,
textarea:focus {
    outline: none;
}

a {
    text-decoration: none;
    color: inherit;
    transition: 0.2s all ease;
    -webkit-transition: 0.2s all ease;
    -moz-transition: 0.2s all ease;
}

a:visited,
a:hover,
a:active {
    text-decoration: none;
}

img {
	max-width: 100%;
}

/* body */
body {
	font-family: var(--PlusJakartaSans);
	font-size: 1.6rem;
	font-weight: 400;
	background: var(--white);
	color: var(--black);
}

/* container */
.container {
	max-width: 1625px;
	width: 100%;
	margin: 0 auto;
	padding: 0 15px;
}

/*====================== Header area start ========================*/
.header_area {
	width: 100%;
	background: var(--white);
	padding: 4.5rem 0;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 1024;
	transition: 0.25s all ease;
}

/*sticky*/
.header_area.sticky {
    padding: 2rem 0;
    box-shadow: 0 .8rem 2rem 0 rgba(0, 0, 0, .1);
}

.header_main {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.header_logo img {
	max-width: 23.4rem;
}

.header_menu ul li a {
	font-size: 2rem;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	color: var(--black);
	display: inline-block;
	margin: 0 2.4rem;
	transition: 0.2s all ease;
}

.header_menu ul li a:hover {
	opacity: 0.8;
}

.header_btn a {
	font-size: 2rem;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	color: var(--white);
	background: var(--black);
	display: inline-block;
	padding: 1.8rem 2.6rem;
	border-radius: 0.8rem;
	transition: 0.2s all ease;
}

.header_btn a:hover {
	opacity: 0.85;
}

/*Hamburger menu*/
.hamburger-menu {
	cursor: pointer;
	position: relative;
	display: none;
	z-index: 999;
}

.hamburger-menu span {
	background: var(--black);
	width: 3rem;
	height: .3rem;
	display: block;
	margin: .5rem 0;
	-webkit-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

.hamburger-menu:hover .line-top {
	-webkit-transform: translateY(-100%);
	-ms-transform: translateY(-100%);
	transform: translateY(-100%);
}

.hamburger-menu:hover .line-bottom {
	-webkit-transform: translateY(100%);
	-ms-transform: translateY(100%);
	transform: translateY(100%);
}

.hamburger-menu .line-top.current {
	-webkit-transform: translateY(200%) rotate(135deg);
	-ms-transform: translateY(200%) rotate(135deg);
	transform: translateY(200%) rotate(135deg);
}

.hamburger-menu .line-center.current {
	opacity: 0;
}

.hamburger-menu .line-bottom.current {
	-webkit-transform: translateY(-325%) rotate(-135deg);
	-ms-transform: translateY(-325%) rotate(-135deg);
	transform: translateY(-325%) rotate(-135deg);
}

/*ofcanvas menu*/
.ofcavas-menu {
	position: fixed;
	width: 100%;
	height: 100%;
	background: #fff;
	z-index: -1;
	top: 0;
	display: none;
	left: -100%;
	transition: .3s;
}

.ofcavas-menu.current {
	left: 0;
}

.ofcavas-menu ul {
	margin-top: 12rem;
}

.ofcavas-menu li {
	padding: 1rem 0;
}

.ofcavas-menu .header_menu ul li a {
	margin: 0;
}

.ofcavas-menu .header_btn {
	margin-top: 2rem;
}

/*========== return-to-top ==========*/
.back-to-top {
	width: 4.5rem;
	height: 4.5rem;
	line-height: 4.2rem;
	text-align: center;
	display: none;
	position: fixed;
	bottom: 2rem;
	right: 2rem;
	border-radius: 50%;
	background: var(--yellow);
	color: var(--black);
	font-size: 1.7rem;
	z-index: 1000;
	box-shadow: 0rem 0.5rem 1.2rem rgba(0, 0, 0, 0.25);
	transition: 0.2s all ease;
}

.back-to-top:hover {
	box-shadow: 0 0 4rem var(--yellow);
}

/*===================== hero_area start =======================*/
.hero_area {
	padding-top: 15.2rem;
}

.hero_main {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	position: relative;
}

.hero_left {
	width: 45%;
}

.hero_right {
	width: 52.5%;
}

.hero_right img {
	width: 100%;
	border-radius: 2.5rem;
}

.hero_leftbox {
	background: var(--black);
	padding: 5rem 5rem;
	border-radius: 2.5rem;
}

.hero_leftbox h1 {
	font-size: 6.7rem;
	font-style: normal;
	font-weight: 800;
	line-height: normal;
	letter-spacing: -0.134rem;
	color: var(--white);
}

@media screen and (max-width: 1650px) {
	.hero_leftbox h1 {
		font-size: 6rem;
	}
}

.hero_leftbox p {
	font-size: 2rem;
	font-style: normal;
	font-weight: 400;
	line-height: 180%; 
	color: var(--white);
	margin-top: 2.4rem;
}

.hero_leftBottom {
	background: #F5C243;
	padding: 4rem 3rem;
	border-radius: 2.5rem;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-gap: 3rem;
}

.hero_innerItem {
	display: flex;
	align-items: flex-start;
}

.hero_icon img {
	max-width: 4.8rem;
	margin-right: 1.6rem;
}

.hero_innerCnt h4 {
	font-size: 3.2rem;
	font-style: normal;
	font-weight: 600;
	line-height: 121.875%;
	color: var(--black);
}	

.hero_innerCnt p {
	font-family: var(--Inter);
	font-size: 2rem;
	font-style: normal;
	font-weight: 400;
	line-height: 180%; 
	color: var(--black);
	margin-top: 1.5rem;
}

.hero_leftBtmprt {
	width: 99.8rem;
	background: var(--white);
	padding: 4.2rem 4.2rem 4.2rem 0rem;
	border-radius: 2.5rem 2.5rem 0rem 2.5rem;
	position: absolute;
	left: 0;
	bottom: 0;
}

/*===================== partner_area start =======================*/
.partner_area {
	padding: 16rem 0;
	padding-left: calc((100% - 1595px) / 2);
	overflow: hidden;
}

.partner_main {
  	overflow: hidden;
	position: relative;
}

.marquee_content {
	width: 200%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 6rem;
    white-space: nowrap;
    transform: translate3d(0%, 0, 0);
    position: relative;
    animation: marquee 30s linear infinite;
}

.marquee_content:hover {
    animation-play-state: paused;
    cursor: pointer;
}

@keyframes marquee {
    0% {
        left: -0px;
    }

    25% {
        left: -25%;
    }

    50% {
        left: -50%;
    }

    75% {
        left: -75%;
    }

    100% {
        left: -100%;
    }

}

.partner_item {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 6rem;
}

.partner_logo img {
	max-width: 100%;
}

/*=================== export_area start =====================*/
.export_title h2 {
	font-size: 6rem;
	font-style: normal;
	font-weight: 600;
	line-height: 110.667%;
	letter-spacing: -0.12rem;
	color: var(--black);
	max-width: 80rem;
	width: 100%;
}

.export_main {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-gap: 3.2rem;
	padding-top: 5rem;
}

.export_item {
	background: var(--gray);
	padding: 5rem 5rem;
	border-radius: 2.4rem;
}

.export_item img {
	max-width: 10rem;
}

.export_item p {
	font-size: 2.4rem;
	font-style: normal;
	font-weight: 600;
	line-height: 135.417%;
	color: var(--black);
	letter-spacing: -0.032rem;
	text-transform: uppercase;
	margin-top: 8.6rem;
}

/*======================= efficient_area start =========================*/
.efficient_area {
	padding: 16rem 0;
}

.efficient_area .row {
	--bs-gutter-x: 4.5rem;
}

.efficient_left h3 {
	font-size: 6rem;
	font-style: normal;
	font-weight: 600;
	line-height: 110.667%;
	letter-spacing: -0.12rem;
	color: var(--black);
	margin-bottom: 4.5rem;
}	

.efficient_left p {
	font-size: 2rem;
	font-style: normal;
	font-weight: 400;
	line-height: 180%; 
	color: var(--black);
	margin-top: 2rem;
}

.efficient_left img {
	width: 100%;
	margin-top: 4.5rem;
}

.efficient_right {
	background: var(--gray);
	padding: 5rem 5rem;
	border-radius: 2.4rem;
}

.efficient_right h3 {
	font-size: 3.2rem;
	font-style: normal;
	font-weight: 600;
	line-height: 121.875%;
	display: flex;
	align-items: center;
	color: var(--black);
}

.efficient_right h3 img {
	max-width: 4.9rem;
	margin-right: 2.4rem;
}

.efficient_item {
	margin-top: 4rem;
}

.efficient_item h4 {
	font-size: 2rem;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	color: var(--black);
}

.efficient_item input,
.efficient_item select {
	width: 100%;
	display: block;
	font-family: var(--PlusJakartaSans);
	font-size: 14px;
	font-style: normal;
	font-weight: 500;
	color: #888;
	background: var(--white);
	border: 1px solid #ECEEF3; 
	border-radius: 0.8rem;
	margin-top: 2rem;
	padding: 1.7rem 2rem;
	outline: none;
}

.efficient_item input::placeholder {
	color: #888;
	opacity: 1;
}

.efficient_item select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background-image: url(../images/down.svg);
	background-repeat: no-repeat;
	background-size: auto;
	background-position: calc(100% - 2rem) center;
	cursor: pointer;
}

.efficient_item button {
	font-size: 2rem;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	border-radius: 0.8rem;
	background: var(--yellow);
	color: var(--black);
	border: none;
	outline: none;
	display: inline-block;
	padding: 2rem 3rem;
	margin-top: 4rem;
	transition: 0.2s all ease;
}

.efficient_item button:hover {
	opacity: 0.85;
}

/*====================== track_area start ========================*/
.track_area {
	padding-left: calc((100% - 1595px) / 2);
}

.track_title h3 {
	font-size: 6rem;
	font-style: normal;
	font-weight: 600;
	line-height: 110.667%;
	letter-spacing: -0.12rem;
	color: var(--black);
	max-width: 78rem;
	width: 100%;
}

.track_slider {
	padding-top: 6rem;
	position: relative;
}

.track_item {
	text-align: center;
	background: var(--gray);
	padding: 5rem 3rem;
	border-radius: 3rem;
}

.track_item img {
	max-width: 11.3rem;
	display: block;
	margin: 0 auto;
}

.track_item .notification {
	max-width: 9.5rem;
}

.track_item h4 {
	font-size: 2.4rem;
	font-style: normal;
	font-weight: 600;
	line-height: 135.417%;
	letter-spacing: -0.032rem;
	color: var(--black);
	text-align: center;
	margin: 4rem 0 2.4rem;
}

.track_item p {
	font-size: 2rem;
	font-style: normal;
	font-weight: 400;
	line-height: 180%; 
	color: var(--black);
	text-align: center;
}

.owl-nav {
	width: 12.5rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	position: absolute;
	right: calc((100% - 1595px) / 2);
	top: -10rem;
}

.owl-nav button {
	background: none;
	border: none;
	outline: none;
}

.owl-nav button img {
	max-width: 5rem;
}

/*===================== history_area start =======================*/
.history_area {
	padding: 16rem 0;
}

.history_main {
	background: var(--gray);
	padding: 11.6rem 6.5rem 18.8rem;
	border-radius: 2.4rem;
	position: relative;
}

.map img {
	max-width: 100%;
	position: absolute;
	bottom: 2.9rem;
	right: 7.9rem;
}

.history_main h3 {
	font-size: 6rem;
	font-style: normal;
	font-weight: 600;
	line-height: 110.667%;
	letter-spacing: -0.12rem;
	color: var(--black);
}

.history_main h6 {
	font-size: 3.6rem;
	font-style: normal;
	font-weight: 600;
	letter-spacing: -0.072rem;
	color: var(--black);
	margin: 3.5rem 0 4.5rem;
}

.history_cnt img {
	max-width: 5.9rem;
}

.history_cnt p {
	font-size: 2.4rem;
	font-style: normal;
	font-weight: 600;
	line-height: 135.417%;
	letter-spacing: -0.032rem;
	color: var(--black);
	margin: 4rem 0;
	max-width: 66.6rem;
	width: 100%;
}

.history_cnt span {
	font-size: 2.4rem;
	font-style: italic;
	font-weight: 300;
	line-height: 135.417% ;
	letter-spacing: -0.032rem;
	color: var(--black);
	display: block;
	margin-bottom: 2.5rem;
	margin-left: 2.5rem;
}

.history_mainCnt {
	position: relative;
	z-index: 9;
}

.history_cnt .hist_logo {
	max-width: 20.1rem;
	margin-left: 2.5rem;
}

/*====================== accordian_area start ========================*/
.accordian_area {

}

.accordian_item {
    padding: 3rem 2.4rem;
    border-bottom: 1px solid rgba(29, 29, 29, 0.20); 
}

.accordian_title {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
    cursor: pointer;
}

.accordian_title img {
	max-width: 3.2rem;
}

.accordian_title .up {
	display: none;
}

.accordian_title.active .up {
	display: inline-block;
}

.accordian_title.active .down {
	display: none;
}

.accordian_title h4 {
	font-size: 2.4rem;
	font-style: normal;
	font-weight: 600;
	line-height: 135.417%;
	letter-spacing: -0.032rem;
	color: var(--black);
	padding-right: 2rem;
}

.accordian_inner {
    display: none;
    padding-top: 3rem;
}

.accordian_inner p {
	font-size: 2rem;
	font-style: normal;
	font-weight: 400;
	line-height: 180%; 
	color: var(--black);
	margin: 0;
}

.accordian_left h3 {
	font-size: 6rem;
	font-style: normal;
	font-weight: 600;
	line-height: 110.667%
	letter-spacing: -0.12rem;
	margin-bottom: 5rem;
}

.accordian_left a {
	font-size: 2rem;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	color: var(--black);
	background: var(--yellow);
	display: inline-block;
	padding: 2rem 3rem;
	border-radius: 0.8rem;
}

/*=================== transform_area start ======================*/
.transform_area {
	padding: 16rem 0;
}

.transform_cnt h3 {
	font-family: var(--Inter);
	font-size: 6rem;
	font-style: normal;
	font-weight: 600;
	line-height: 110.667%
	letter-spacing: -0.12rem;
	color: var(--black);
	text-align: center;
	max-width: 98.5rem;
	width: 100%;
	margin: 0 auto;
}

.transform_cnt p {
	font-size: 4rem;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	letter-spacing: -0.08rem;
	color: var(--black);
	text-align: center;
	margin: 6rem 0;
	max-width: 121rem;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

.transform_cnt a {
	font-size: 2rem;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	color: var(--black);
	text-align: center;
	background: var(--yellow);
	display: inline-block;
	padding: 2rem 3rem;
	border-radius: 0.8rem;
	transition: 0.2s all ease;
}

.transform_item {
	margin-top: 6rem;
}

.transform_item img {
	width: 100%;
	border-radius: 2.4rem;
}

.transform_cnt a:hover {
	opacity: 0.85;
}

/*==================== footer_area start ======================*/
.footer_area {
	background: var(--black);
}

.footer_upper {
	padding: 5.4rem 0 8.5rem;
	border-bottom: 1px solid #555;;
}

.footer_upmain {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.footer_upleft {
	display: flex;
	align-items: center;
}

.footer_upleft a img {
	max-width: 23.4rem;
}

.footer_upleft p {
	font-size: 2.4rem;
	font-style: normal;
	font-weight: 600;
	line-height: 135.417% 
	letter-spacing: -0.032rem;
	color: var(--white);
	margin-left: 6.4rem;
}

.footer_upright a {
	font-size: 2.4rem;
	font-style: normal;
	font-weight: 700;
	line-height: 180%; 
	color: #F5C243;
}

.footer_bottom {
	padding: 6rem 0;
}

.footer_btmMain {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.footer_btmleft {
	display: flex;
	align-items: center;
}

.footer_btmleft p {
	font-family: var(--Inter);
	font-size: 1.6rem;
	font-style: normal;
	font-weight: 500;
	line-height: 180%;
	color: var(--white);
	margin: 0;
}

.footer_btmleft a {
	font-family: var(--Inter);
	font-size: 1.6rem;
	font-style: normal;
	font-weight: 500;
	line-height: 180%;
	color: var(--white);
	display: inline-block;
	margin-left: 2.5rem;
}

.footer_btmright p {
	font-family: var(--Inter);
	font-size: 1.6rem;
	font-style: normal;
	font-weight: 500;
	line-height: 180%;
	color: var(--white);
	margin: 0;
}