:root {
	--color-b1: #013034;
	--color-b2: #808d83;
	--color-b3: #c9cec9;
	--color-b4: #d6d6cb;
}

* {
	/* border:1px solid red; */
}


@font-face {
	font-family: "MetaCompPro-CondNormal W01 Rg";

	src: url("../../../fonts/1401359/0d3cf69a-2894-4d5c-abde-ceceed035f75.woff2") format("woff2"), url("../../../fonts/1401359/509912e6-0468-4522-847b-5966b7458a84.woff") format("woff");
}

.branding-wrp .container-fluid{
	padding:0px;
}
body {
	font-family: "MetaCompPro-CondNormal W01 Rg" !important;
}

.b_bg-color-01 {
	background: var(--color-b1);
}

.b_bg-color-02 {
	background: var(--color-b2);
}

.b_bg-color-03 {
	background: var(--color-b3);
}

.b_bg-color-04 {
	background: var(--color-b4);
}

.bc_full {
	/* height: 100vh; */
	min-height: 50vw;
	overflow: hidden;
	position: relative;


}

.bc_full img {
	position: absolute;
	width: 100%;
	height: 100%;
	object-fit: cover;
}


.bc_half {
	min-height: calc(50vw / 2);
	/* height: 50vh; */
	overflow: hidden;
}

/* .text-left {
	text-align: left !important;
} */

.branding-wrp {}

.branding-wrp p {
	font-size: 21px;
}

.branding-wrp h1 {
	font-size: calc(24px + 3vw);
	line-height: 1;
}


/* .width-450 {
	max-width: 450px;
	text-align: left;
	display: inline-block;
} */


/* sec 1 */

.branding-sec-01 {
	height: unset;
	overflow: hidden;
	position: relative;
}

.branding-sec-01 .h_logo {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 30%;
	transform: translate(-50%,-50%);
	filter: drop-shadow(0 5px 5px rgba(0,0,0,0.5));

}

.branding-sec-01 .h_img {}




.branding-sec-02 {
	color: var(--color-b1);
	padding: 5vw;
	background: var(--color-b3);

}

.branding-sec-02 .bc_logo-shape {
	width: calc(100px + 5vw);
}

.branding-sec-03,
.branding-sec-04{
	padding-top:0px;
	padding-bottom:0px;
}
.branding-sec-03 .bc_half {
	color: #ffffff;
	text-align: center;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	padding-bottom: 3vw;

}

.branding-sec-03 p {
	line-height: 1.2;
	font-size: clamp(0.9rem, 2vw, 1rem);
}

.branding-sec-03 p span {
	font-family: 'roboto';
	font-size: clamp(0.9rem, 2vw, 1rem);
}

.branding-sec-05 .logos-variation {
	padding: 9vw 5vw;
	text-align: center;
}

.branding-sec-05 .logos-variation img {
	width: 14vw;
}


.branding-sec-06 {
	position: relative;
	z-index: 9;
	min-height: 10vw;

}



.branding-sec-06 article {
	min-height: 10vw;
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* border: 1px solid black; */
	padding-left: 5vw;

}

.branding-sec-06 p {
	font-size: max(1.2rem, 1.2vw);
	font-family: "MetaCompPro-CondNormal W01 Rg" !important;
	margin-bottom: 10px;
	width: 90%;
}

.ark-product-01 {
	/* border: 1px solid black; */
	position: relative;

	aspect-ratio: 32 / 48;
	object-fit: contain;
	top: 10vw;
	right: 6vw;
	filter: drop-shadow(-4px 24px 16px rgba(0, 0, 0, .5));
}

.branding-parallax {
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	background-attachment: fixed;
}

.branding-content .content-wrapper{
	text-align: center;
	margin-top:1.5rem;
	margin-bottom: 2rem;
}

.branding-parallax.pb-02 {
	/* height: 100vh; */
	min-height: 50vw;
	background-image: url("thumb-02.webp");
	background-attachment: scroll;
}

.branding-parallax.pb-04 {
	min-height: 60vw;
	background-image: url("parallax-banner-03.webp");
}


.branding-sec-07 {
	color: var(--color-b1);
/*	padding: 50px 0 20px;*/
}
.branding-sec-07 .content-wrapper{
	border:1px solid red;
	margin-top:3rem;

}
.branding-sec-07 .text-wrapper {
	padding: 20px 0;
}

section.branding-sec-07 h2 {
	font-size: clamp(1.3rem, 3vw, 5rem);
	text-align: center;
}

.branding-sec-08 .branding-sec-08-col {
	/* border: 1px solid black; */
	min-height: 50vw;
	display: flex;
	justify-content: center;
	align-items: center;
}

.branding-sec-08-col article {
	/* border:1px solid black;  */
	max-width: 600px;
	font-family: "MetaCompPro-CondNormal W01 Rg";
}

.branding-sec-08-col article h1 {
	font-size: clamp(2rem, 4vw, 5.5rem);
	font-weight: 500;
}

.branding-sec-08-col article p {
	font-size: clamp(0.8rem, 2vw, 1.3rem);

}

.branding-sec-08 .branding-sec-08-col:nth-of-type(2) img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;

}

.branding-sec-09 {
	/* border: 1px solid black; */
	height: unset;
	overflow: hidden;
}

/* 
.branding-sec-09-col {
	border: 1px solid black;

} */

.branding-sec-09-col:nth-of-type(2) {
	display: flex;
	align-items: center;
	justify-content: flex-start;

}

.branding-sec-09-col:nth-of-type(2) article {
	max-width: 500px;


}

.branding-sec-09-col:nth-of-type(2) article p {
	font-family: "MetaCompPro-CondNormal W01 Rg";
	font-size: clamp(0.9rem, 3vw, 1.3rem);
}

@media(max-width:1280px){
	.branding-sec-08-col article {
		padding:30px;}
}

@media(max-width:767px) {		
	
	.bc_full {
		height:unset;
		aspect-ratio: 16 / 10;
	}

	.bc_full img{
		object-position: top;
	}
	.ark-product-01 {
		position: absolute;
		aspect-ratio: 1 / 1;
		width: 30vw;
		right: 0 !important;
		top: 12vw;
	}

	.branding-sec-06 p {
		width: 70%;
		font-size: max(0.9rem, 1vw);
	}
	
	.branding-sec-07 .product-card {
		margin-bottom: 16px;
	}

	.branding-sec-09-col:nth-of-type(2) {
		justify-content: center;
	}
	
	.branding-sec-08 .branding-sec-08-col:nth-of-type(2) {
		aspect-ratio: 1 / 1;
	}
	
	.branding-sec-09-col:nth-of-type(2) article {

		max-width: 80%;
		padding: 50px 0;

	}
	
	.bc_half {
		height: 24vh;}
	.branding-sec-06 article {
		min-height: 55vw;}
}

@media(max-width:575px) {
	.branding-sec-08 .branding-sec-08-col:nth-of-type(1) {
		padding: 20px !important;
	}
	
		.ark-product-01 {
		width: 30vw;
	}
}

@media(max-width:480px) {

	.ark-product-01 {
		width: 30vw;
		top: calc(10vh);
	}
	
		.branding-sec-06 article {
		min-height: 100vw;}
}