/**
 * Webinar Pages Styles
 *
 * ウェビナーページ専用のスタイル
 *
 * @package Onwords
 */

/* ========================================
   Webinar Form Section
   ======================================== */

.webinar-form {
	max-width: 1188px;
	margin-block: 40px;
	padding: 0 16px;
}

.webinar-form--top {
	margin-block: 40px;
}

.webinar-form--bottom {
	margin-block-start: 40px;
	margin-block-end: 0;
}

.webinar-form .hs-form-frame {
	width: 100%;
	max-width: 100%;
}

/* ========================================
   Webinar Finished Message
   ======================================== */

.webinar-finished-message {
	max-width: 728px;
	margin-block-start: 40px;
	margin-block-end: 24px;
	margin-inline: auto;
	padding-block-end: 4px;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.6;
	color: rgb(34, 34, 34);
	border-bottom: 1px solid rgb(230, 1, 18);
}

/* ========================================
   Responsive
   ======================================== */

@media (max-width: 840px) {
	.webinar-form {
		margin-block: 32px;
	}

	.webinar-form--top {
		margin-block: 32px;
	}

	.webinar-form--bottom {
		margin-block-start: 32px;
		margin-block-end: 0;
	}

	.webinar-finished {
		max-width: calc(100% - 64px);
		margin-block-start: 32px;
		padding: 48px 32px;
	}

	.webinar-finished__title {
		font-size: 20px;
	}
}

@media (max-width: 540px) {
	.webinar-form {
		margin-block: 24px;
	}

	.webinar-form--top {
		margin-block: 24px;
	}

	.webinar-form--bottom {
		margin-block-start: 24px;
		margin-block-end: 0;
	}

	.webinar-finished {
		max-width: calc(100% - 32px);
		margin-block-start: 24px;
		padding: 40px 24px;
	}

	.webinar-finished__title {
		font-size: 18px;
	}
}