@charset "utf-8";
/* CSS Document */


/*ENGAGEMENT*/

	/*TITLE*/
	.engagement .content_engagement {padding-top: 170px; background-color: var(--white);}
		.engagement .content_engagement .section_title {display: flex; align-items: center; justify-content: center; padding: 25px 0;}
			.engagement .content_engagement .section_title hr {width: 25%; border-color: var(--white); border-width: 2px;}
			.engagement .content_engagement .section_title h1 {font-size: 3.75rem; color: var(--white); text-align: center; line-height: 1; padding: 0 30px;}

		/*Animations*/
		.engagement .content_engagement {transition: background 0.5s ease-in-out;}
			.engagement .content_engagement.show {background-color: var(--pink);}

		.engagement .content_engagement .section_title hr {transition: all 0.5s 0.5s ease-in-out; transform: scale(0);}
			.engagement .content_engagement.show .section_title hr {transform: scale(1);}

		.engagement .content_engagement .section_title h1 {transition: opacity 0.8s 0.5s ease-in-out; opacity: 0;}
			.engagement .content_engagement.show .section_title h1 {opacity: 1;}

	/*ENGAGEMENT*/
	.engagement .content_info {margin-top: 80px;}
		.engagement .content_info .content_container {display: flex; align-items: flex-start; justify-content: center; gap: 68px;}
			.engagement .content_info .content_half:first-child {width: 522px;}
			.engagement .content_info .content_half:last-child {width: calc(100% - 590px);}
				.engagement .content_info .content_half img {width: 100%;} 
				.engagement .content_info .content_half h5 {font-size: 2.25rem; margin-bottom: 44px;}
				.engagement .content_info .content_half p {font-weight: 400; font-size: 1.25rem; line-height: 1.4; margin-bottom: 30px;}
					.engagement .content_info .content_half p + h5 {margin-top: 95px;}

		/*Animations*/
		.engagement .content_info .content_half figure,
		.engagement .content_info .content_half h5 {transition: opacity 0.5s 0.3s ease-in-out; opacity: 0;}
			.engagement .content_info.show .content_half figure,
			.engagement .content_info.show .content_half h5 {opacity: 1;}
		.engagement .content_info .content_half p {transition: all 0.5s 0.3s ease-in-out; opacity: 0; transform: translateY(20px);}
			.engagement .content_info.show .content_half p {opacity: 1; transform: translateY(0px);}

	/*FORM*/
	.engagement .content_form {margin-top: 95px; background: var(--white); padding: 89px 0 194px;}
		.engagement .content_form h5 {font-size: 2.25rem; text-align: center; margin-bottom: 76px;}

			.engagement .content_form .contact_form_container {display: flex; align-items: flex-start; justify-content: flex-start; flex-wrap: wrap; gap: 37px 120px;}
				.engagement .content_form .contact_form_container .form_group {width: calc(50% - 60px); display: flex; align-items: center; gap: 82px;}
					.engagement .content_form .contact_form_container .form_group .form_input {width: calc(50% - 41px);}
				.engagement .content_form .contact_form_container .form_input {width: calc(50% - 60px);}
					.engagement .content_form .contact_form_container label {display: block; font-size: 1.25rem; margin-bottom: 15px;}
					.engagement .content_form .contact_form_container .label-check {display: flex;}
						.engagement .content_form .contact_form_container .label-check .checkbox {width: 26px;}
						.engagement .content_form .contact_form_container .label-check label {display: inline-block; font-weight: 400; margin-bottom: 5px; margin-left: 32px;}
					.engagement .content_form .contact_form_container input:not([type="checkbox"]),
					.engagement .content_form .contact_form_container textarea {width: calc(100% - 40px); border: 2px solid var(--pink); height: 55px; padding: 0 20px;}
					.engagement .content_form .contact_form_container textarea {height: 199px; padding: 20px;}

					.engagement .content_form .contact_form_container .form_half {width: calc(50% - 60px);}
						.engagement .content_form .contact_form_container .form_half .form_input {width: 100%; margin-bottom: 70px;}
						.engagement .content_form .contact_form_container .form_half label {font-weight: 400;}
						.engagement .content_form .contact_form_container .form_half .label-check {margin-bottom: 40px;}
					
				.engagement .content_form .contact_form_container hr {width: 100%; border-color: var(--white); margin-top: 44px; margin-bottom: 26px; border-width: 2px;}
				.engagement .content_form .contact_form_container button {font-weight: 700; font-size: 1.125rem; font-family: 'Montserrat', sans-serif; transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out;}

		/*Animations*/
		.engagement .content_form {transition: background 0.5s 0.3s ease-in-out;}
			.engagement .content_form.show {background: rgba(239, 147, 158, .15);}
		.engagement .content_form h5 {transition: opacity 0.5s 0.5s ease-in-out; opacity: 0;}
			.engagement .content_form.show h5 {opacity: 1;}
		.engagement .content_form .form_input {transition: all 0.5s 0.5s ease-in-out; opacity: 0; transform: translateY(20px);}
			.engagement .content_form.show .form_input {opacity: 1; transform: translateY(10px);}
			/*Delays*/
			.engagement .content_form .form_input:nth-of-type(2) {transition-delay: 0.6s;}
			.engagement .content_form .form_input:nth-of-type(3) {transition-delay: 0.7s;}
			.engagement .content_form .form_input:nth-of-type(4) {transition-delay: 0.8s;}
			.engagement .content_form .form_input:nth-of-type(5) {transition-delay: 0.9s;}
			.engagement .content_form .form_input:nth-of-type(6) {transition-delay: 1.0s;}
			.engagement .content_form .form_input:nth-of-type(7) {transition-delay: 1.1s;}
			.engagement .content_form .form_input:nth-of-type(8) {transition-delay: 1.2s;}
			.engagement .content_form .form_input:nth-of-type(9) {transition-delay: 1.3s;}
			.engagement .content_form .form_input:nth-of-type(10) {transition-delay: 1.4s;}
			.engagement .content_form .form_input:nth-of-type(11) {transition-delay: 1.5s;}
			.engagement .content_form .form_input:nth-of-type(12) {transition-delay: 1.6s;}
			.engagement .content_form .form_input:nth-of-type(13) {transition-delay: 1.7s;}
			.engagement .content_form .form_input:nth-of-type(14) {transition-delay: 1.8s;}

@media (max-width: 1000px) {
	.engagement .p_left_1 {padding-left: 0;}
	.engagement > section .center_content.c_10,
	.engagement > section .center_content.c_12 {width: 676px;}

	/*Title*/
	.engagement .content_engagement {padding-top: 115px;}
		.engagement .content_engagement .section_title {width: 100% !important; justify-content: space-between;}
			.engagement .content_engagement .section_title hr {width: 21%;}
			.engagement .content_engagement .section_title h1 {font-size: 3rem;}

	/*Engagement*/
	.engagement .content_info .content_container {flex-direction: column;}
		.engagement .content_info .content_half {width: 100% !important;}
			.engagement .content_info .content_half:nth-child(1) {order: 2;}
			.engagement .content_info .content_half:nth-child(2) {order: 1;}
			.engagement .content_info .content_half figure {width: 332px; margin: auto;}
			.engagement .content_info .content_half h5 {font-size: 1.75rem; margin-bottom: 50px;}
			.engagement .content_info .content_half p {font-size: 1.125rem;}

	/*Form*/
	.engagement .content_form {margin-top: 80px;}
		.engagement .content_form h5 {font-size: 1.75rem; width: 318px;}
			.engagement .content_form .contact_form_container .form_group,
			.engagement .content_form .contact_form_container .form_half,
			.engagement .content_form .contact_form_container .label-check,
			.engagement .content_form .contact_form_container textarea,
			.engagement .content_form .contact_form_container .form_input {width: 100%;}
			.engagement .content_form .contact_form_container label {font-size: 1.125rem;}
			.engagement .content_form .contact_form_container input:not([type="checkbox"]) {width: calc(100% - 44px);}
}

@media (max-width: 750px) {
	.engagement > section .center_content.c_10,
	.engagement > section .center_content.c_12 {width: 100%;}

	/*Title*/
	.engagement .content_engagement {padding-top: 165px;}
		.engagement .content_engagement .section_title {padding: 43px 0;}
			.engagement .content_engagement .section_title hr {width: 7%;}
			.engagement .content_engagement .section_title h1 {font-size: 1.875rem;}

	/*Engagement*/
	.engagement .content_info {padding: 0 36px; margin-top: 46px;}
		.engagement .content_info .content_half figure {width: 100%;}

	/*Form*/
	.engagement .content_form {padding: 81px 36px 165px;}
		.engagement .content_form h5 {width: auto;}
		.engagement .content_form .contact_form_container .form_group {flex-wrap: wrap; gap: 37px;}
			.engagement .content_form .contact_form_container .form_group .form_input {width: 100%;}
		.engagement .content_form .contact_form_container button {width: 100%; margin-top: -60px;}
}