@font-face {
	font-family: "Freckle Face";
	src: url("../fonts/FreckleFace-Regular.woff2") format("woff2"), url("../fonts/FreckleFace-Regular.woff") format("woff");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
#oct-banner .freckle {
	font-family: "Freckle Face", cursive;
	font-weight: 400;
}
.container.promo-wrapper {
	--content-width: 1345px;
	margin-top: 60px;
	margin-bottom: 60px;
}
#oct-banner {
	position: relative;
	container-type: inline-size;
	padding: 0;
}
#oct-banner .banner-inner {
	position: relative;
	aspect-ratio: 1315 / 252;
	background-color: #042159;
	background-image: url("../images/banner/banner-bg.png");
	background-image: image-set(url("../images/banner/banner-bg.webp") 1x, url("../images/banner/banner-bg@2x.webp") 2x);
	background-image: -webkit-image-set(url("../images/banner/banner-bg.webp") 1x, url("../images/banner/banner-bg@2x.webp") 2x);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}
#oct-banner .ob-line1,
#oct-banner .ob-line2,
#oct-banner .ob-sub,
#oct-banner .ob-cta,
#oct-banner .ob-coin {
	position: absolute;
}
#oct-banner .ob-line1,
#oct-banner .ob-line2 {
	color: #00fe00;
	paint-order: stroke fill;
}
#oct-banner .ob-line1 {
	left: 12.446cqw;
	top: 1.141cqw;
	width: 23.042cqw;
	font-size: 6.959cqw;
	line-height: 7.794cqw;
	-webkit-text-stroke: 0.281cqw #009900;
	filter: drop-shadow(0.351cqw 0.491cqw 0 #009900);
}
#oct-banner .ob-line2 {
	left: 6.768cqw;
	top: 7.46cqw;
	width: 34.449cqw;
	font-size: 8.654cqw;
	line-height: 9.692cqw;
	-webkit-text-stroke: 0.349cqw #009900;
	filter: drop-shadow(0.436cqw 0.611cqw 0 #009900);
}
#oct-banner .ob-sub {
	left: 40.989cqw;
	top: 3.27cqw;
	width: 37.719cqw;
	font-size: 2.29cqw;
	line-height: 2.702cqw;
}
#oct-banner .ob-hl {
	color: #00fe00;
	-webkit-text-stroke: 0.416cqw #009900;
	paint-order: stroke fill;
}
#oct-banner .ob-cta {
	left: calc(59.877cqw - max(16.046cqw, 132px) / 2);
	top: 12.548cqw;
	width: max(16.046cqw, 132px);
	height: 3.422cqw;
	min-height: 34px;
	padding: 0;
	background: #00fe00;
	border-radius: 50px;
	font-size: clamp(12px, 1.521cqw, 20px);
	line-height: 1;
}
#oct-banner .ob-coin {
	left: 80.044cqw;
	top: 1.565cqw;
	width: 15.337cqw;
	height: auto;
}
@media screen and (max-width: 767px) {
	.container.promo-wrapper {
		margin-bottom: 20px;
	}
	#oct-banner {
		max-width: 420px;
	}
	#oct-banner .banner-inner {
		aspect-ratio: 390 / 356;
		background-color: #031248;
		background-image: url("../images/banner/banner-bg-m.png");
		background-image: image-set(url("../images/banner/banner-bg-m.webp") 1x, url("../images/banner/banner-bg-m@2x.webp") 2x);
		background-image: -webkit-image-set(url("../images/banner/banner-bg-m.webp") 1x, url("../images/banner/banner-bg-m@2x.webp") 2x);
	}
	#oct-banner .ob-line1 {
		left: 20.526cqw;
		top: 3.697cqw;
		width: 57.436cqw;
		font-size: 17.302cqw;
		line-height: 19.378cqw;
		-webkit-text-stroke: 0.698cqw #009900;
		filter: drop-shadow(0.873cqw 1.222cqw 0 #009900);
	}
	#oct-banner .ob-line2 {
		left: 6.41cqw;
		top: 19.408cqw;
		width: 85.641cqw;
		font-size: 21.513cqw;
		line-height: 24.095cqw;
		-webkit-text-stroke: 0.868cqw #009900;
		filter: drop-shadow(1.085cqw 1.519cqw 0 #009900);
	}
	#oct-banner .ob-sub {
		left: 5.128cqw;
		top: 46.026cqw;
		width: 89.487cqw;
		font-size: 6.23cqw;
		line-height: 7.29cqw;
	}
	#oct-banner .ob-hl {
		-webkit-text-stroke: 1.133cqw #009900;
	}
	#oct-banner .ob-cta {
		left: 22.821cqw;
		top: 71.282cqw;
		width: 54.103cqw;
		height: 11.538cqw;
		min-height: 0;
		font-size: 5.128cqw;
	}
	#oct-banner .ob-coin {
		display: none;
	}
}
@supports (text-box: trim-both cap alphabetic) {
	#oct-banner .ob-cta > span {
		display: block;
		text-box: trim-both cap alphabetic;
	}
}