@font-face {
	font-family  : "Montserrat";
	src          : url("/g/fonts/montserrat/montserrat-b.woff2") format("woff2"),
	url("/g/fonts/montserrat/montserrat-b.woff") format("woff");
	font-weight  : 700;
	font-style   : normal;
	font-display : swap;
}

.mg-unpaid {
	position : fixed;
	z-index : 1111111;
	left : 8px;
	right : 8px;
	bottom : 0;
	min-height: 64vh;
	backdrop-filter: blur(10px);
	background: rgba(255, 255, 255, 0.96);
	border-radius: 16px 16px 0 0;
	padding : 20px 16px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	font-family : "Montserrat", sans-serif;
}

.mg-unpaid__image {
	line-height : 0;
	margin-bottom : 16px;
}

.mg-unpaid__image img {
	width : 47.7vw;
	height: auto;
}

.mg-unpaid__title {
	font-weight    : 700;
	font-size      : 24px;
	line-height    : 1.1;
	letter-spacing : -0.01em;
	text-align     : center;
	color          : #000;
	margin-bottom  : 8px;
}

.mg-unpaid__desc {
	font-weight    : 500;
	font-size      : 16px;
	line-height    : 1.2;
	letter-spacing : -0.01em;
	text-align     : center;
	color          : #737373;
	margin-bottom  : 16px;
}

.mg-unpaid__btn {
	display: inline-block;
	text-decoration: none;
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box;
	border-radius: 40px;
	background: linear-gradient(180deg, #15B746 0%, #1CA345 100%);
	box-shadow: 0px 8px 16px 0px rgba(28, 163, 69, 0.24);
	padding: 20px 36px;
	color: #FFF !important;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: -0.01em;
}

@media all and (min-width: 640px) {
	.mg-unpaid {
		left : 16px;
		right : 16px;
		padding-top: 40px;
		padding-bottom: 40px;
	}

	.mg-unpaid__image {
		margin-bottom : 24px;
	}

	.mg-unpaid__image img {
		width : 280px;
	}

	.mg-unpaid__title {
		font-size : 40px;
		margin-bottom: 10px;
	}
	
	.mg-unpaid__desc {
		font-size      : 20px;
		margin-bottom  : 24px;
	}
	
	.mg-unpaid__btn {
		font-size: 16px;
	}
}

@media all and (min-width: 1200px) {
	.mg-unpaid {
		border-radius: 24px 24px 0 0;
		padding-top: 80px;
		padding-bottom: 80px;
	}

	.mg-unpaid__image {
		margin-bottom : 26px;
	}

	.mg-unpaid__image img {
		width : 400px;
	}

	.mg-unpaid__title {
		font-size : 48px;
	}
	
	.mg-unpaid__desc {
		font-size      : 20px;
		margin-bottom  : 24px;
	}
	
	.mg-unpaid__btn {
		font-size: 16px;
	}
}