.form-playnow {
	display: flex;
	display: flex;
	align-items: center;
	justify-content: center;
	::-webkit-input-placeholder {
		/* Edge */
		color: #6427f8;
	}
	:-ms-input-placeholder {
		/* Internet Explorer 10-11 */
		color: #6427f8;
	}
	::placeholder {
		color: #6427f8;
	}
	.input-tel {
		margin-right: 9.26px;
	}
	@include media-breakpoint-up(md) {
		.input-tel {
			margin-right: 10.41px;
		}
	}
	@include media-breakpoint-up(xl) {
		.input-tel {
			margin-right: 13.5px;
		}
	}
}
.form-large {
	@include media-breakpoint-up(md) {
		.input-tel {
			margin-right: 15.31px;
			line-height: 88.25px;
			height: 88.25px;
			width: 340.65px;
			border-width: 1.59px;
			border-radius: 43.3px;
			box-shadow: 0 0 61px 11px #260050;
			padding: 0 31.22px;
			font-size: 16.56px;
		}
		.large-button {
			height: 88.25px;
			line-height: 88.25px;
			min-width: 191.96px;
			padding: 0 23px 0 22px;
			border-width: 1.59px;
			border-radius: 43.3px;
			box-shadow: 0 0 61px 11px #260050;
			letter-spacing: 2.55px;
			font-size: 38.2px;
		}
	}
	@include media-breakpoint-up(xl) {
		.input-tel {
			margin-right: 27.16px;
			line-height: 106.84px;
			height: 106.84px;
			width: 412.19px;
			border-width: 1.93px;
			border-radius: 52.57px;
			box-shadow: 0 0 74px 14px #260050;
			padding: 0 37.75px;
			font-size: 20.1px;
		}
		.large-button {
			height: 106.84px;
			line-height: 106.84px;
			min-width: 232.18px;
			padding: 0 26.85px 0 28.89px;
			border-width: 1.93px;
			border-radius: 52.57px;
			box-shadow: 0 0 74px 14px #260050;
			letter-spacing: 3.09px;
			font-size: 46.38px;
		}
	}
	@include media-breakpoint-up(xxl) {
		.input-tel {
			line-height: 156.84px;
			height: 156.84px;
			width: 604.84px;
			border-width: 2.84px;
			border-radius: 77.18px;
			box-shadow: 0 0 109px 20px #260050;
			padding: 0 55.42px;
			font-size: 29.51px;
		}
		.large-button {
			height: 156.84px;
			line-height: 156.84px;
			min-width: 340.84px;
			padding: 0 39.42px 0 42.42px;
			border-width: 2.84px;
			border-radius: 77.18px;
			box-shadow: 0 0 109px 20px #260050;
			letter-spacing: 4.54px;
			font-size: 68.1px;
		}
	}
}

.large-button {
	display: inline-block;
	background: $color_purple;
	border: 0.94px solid $color_pink;
	font-family: $font_secondary;
	font-style: italic;
	color: $color_pink;
	text-align: center;
	padding: 0 12.71px 0 14.74px;
	box-shadow: 0 0 36px 7px #260050;
	min-width: 115.14px;
	height: 52.94px;
	line-height: 52.94px;
	border-radius: 25.5px;
	font-size: 24px;
	letter-spacing: 1.5px;

	@include media-breakpoint-up(md) {
		line-height: 55.42px;
		height: 55.42px;
		min-width: 119.63px;
		border-width: 1.25px;
		border-radius: 34px;
		box-shadow: 0 0 48px 9px #260050;
		letter-spacing: 1.6px;
		padding: 0 15.5px;
		font-size: 24px;
	}
	@include media-breakpoint-up(lg) {
		&:hover {
			color: $color_white;
			background-color: $color_pink;
		}
	}
	@include media-breakpoint-up(xl) {
		height: 68px;
		line-height: 68px;
		min-width: 148px;
		letter-spacing: 2px;
		font-size: 30px;
		padding: 0 17.5px;
	}
}

.input-tel {
	display: inline-block;
	height: 52.94px;
	line-height: 52.94px;
	width: 203.84px;
	border: 0.94px solid $color_pink;
	border-radius: 25.5px;
	background-color: $color_purple;
	box-shadow: 0 0 36px 7px #260050;
	padding: 0 18.82px;
	font-size: 12px;
	color: $color_pink;
	@include media-breakpoint-up(lg) {
		height: 55.42px;
		line-height: 55.42px;
		width: 212.93px;
		border-width: 1.25px;
		border-radius: 34px;
		box-shadow: 0 0 48px 9px #260050;
		padding: 0 20px;
		font-size: 13px;
	}
	@include media-breakpoint-up(xl) {
		line-height: 65.5px;
		height: 68px;
		width: 265px;
		padding: 0 24px;
	}
}

/*
Mobile
>>------------->
*/

.mobile-play-button {
	position: fixed;
	z-index: 999;
	background-color: #310167;
	border: 1px solid #f32b94;
	box-shadow: 0 0 38px 7px #260050;
	font-family: 'BigNoodleTitling';
	font-size: 16px;
	color: #f32b94;
	letter-spacing: 1.07px;
	text-align: center;
	line-height: 26.4px;
	font-style: italic;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	right: 20px;
	top: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	transform: translate(100px);
	transition: transform 500ms ease;

	@at-root .mobile-play-button-active & {
		transform: translate(0);
	}
}

/*
Desktop
>>------------->
*/
@include media-breakpoint-up(xl) {
	.mobile-play-button {
		display: none;
	}

	.desktop-break {
		display: block;
	}
}
