:root {
	--main-color: #afc050;
}
body {
	background:#000000;
}

.section {
	height:auto;
}
.container {
	overflow:unset;
}

.container .content {
	background-image: none;
} 
.container .content .content-top {
	background:none;
}

.sec1 {
	background-color:#ffffff;
	padding-bottom:10%;
}
.sec1 .content-top {
	margin-top:2vh;
	background:none;
}
.sec1 .content-top h1 {
	display:block;
	color:#000000;
	width:auto;
	max-width:none;
	text-align:center;
}
.sec1 .mainCar {
	position: absolute;
    max-width: 70%;
    margin: 0 auto;
    bottom: 0;
    translate: 0 50%;
    left: 0;
    right: 0;
    z-index: 2;
}
.sec1 .mainGrill {
	max-width:80%;
	margin:0 auto;
}


.cardSection.card1 {
	padding-top:5%;
}
.cardSection.card1:before {
	content:'';
	position:absolute;
	top:0;
	width:100%;
	height:30%;
	background: linear-gradient(to bottom right, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0) 50.3%);
}
.cardSection.card1 .imgDiv {
	background-image: url("../assets/img/compass/card1-bg.webp");
}

.cardSection.card2 .imgDiv {
	background-image: url("../assets/img/compass/card2-bg.webp");
}
.cardSection.card2:after {
	background: linear-gradient(110deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 20%, var(--main-color) 20.1%, var(--main-color) 85%, rgba(0, 0, 0, 1) 85.1%, rgba(0, 0, 0, 1) 100%);
}

.cardSection.card3 .imgDiv {
	background-image: url("../assets/img/compass/card3-bg.webp");
}

.cardSection.card4 .imgDiv {
	background-image: url("../assets/img/compass/card4-bg.webp");
}
.cardSection.card4:after {
	background: linear-gradient(-110deg, var(--main-color) 0%, var(--main-color) 30%, rgba(0, 0, 0, 1) 30.1%, rgba(0, 0, 0, 1) 31%, var(--main-color) 31.1%, var(--main-color) 100%);
}

.colgal_sec {
	background-image: linear-gradient(rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.75)), url("../assets/img/compass/colgal-bg.webp");
	background-size:cover;
}

@media (max-width: 1024px) {
  .section {
    height: auto;
    min-height: auto;
  }
  .cardSection.card1 {
	  padding-top:10%;
  }
	.cardSection.card1:not(:has(.select-hide)) {
		z-index:5;
	}
  
  .cardSection.card1:before {
	  height:5%;
  }
}