@charset "utf-8";

.event-wrapper {overflow:hidden; color:#242424;}
.event-wrapper .contain {max-width:1300px; padding-left:50px; padding-right:50px;}

.event-hero {display:flex; align-items:center; padding-top:70px; height:100vh; text-align:center; background:url('changeup/hero.jpg') 50% 50%/cover no-repeat;}
.event-hero .inner {width:100%; padding:50px;}
.event-hero .title-area {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:20px 30px; margin-bottom:45px;}
.event-hero .title-area h2 {font-size:150px; font-weight:800; color:#151515; line-height:1.3em; letter-spacing:-.04em;}
.event-hero .text-area {display:inline-block; width:80%; max-width:840px; padding:36px; border-radius:24px; background: rgba(255, 255, 255, 0.4); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);}
.event-hero .text-area .text-1 {margin-bottom:1em; font-size:26px; font-weight:700; line-height:1.5em; letter-spacing:-.03em;}
.event-hero .text-area .text-2 {font-size:22px; font-weight:600; line-height:1.5em; letter-spacing:-.03em;}

.event-heading {text-align:center; margin-bottom:55px;}
.event-heading .tit {font-size:36px; font-weight:700; line-height:1.3em; letter-spacing:-.03em;}
.event-heading .ev {display:inline-block; margin-top:15px; padding:9px 26px; border-radius:24px 24px 0 24px; background:#2b65fe; font-size:24px; font-weight:700; line-height:1.3em; letter-spacing:-.03em; color:#fff;}
.event-heading .txt {margin-top:15px; font-size:17px; line-height:1.6em; letter-spacing:-.03em; color:#454545;}

.event-service {padding:120px 0 100px;}
.event-service-cards {display:flex; padding-left:2%; margin-bottom:100px;}
.event-service-card {position:relative; width:27%; margin-left:-2%; border-radius:100%; color:#fff; text-align:center;}
.event-service-card:before {content:''; display:block; padding-bottom:100%;}
.event-service-card:nth-child(odd) {background:#5250aa}
.event-service-card:nth-child(even) {background:#7b5cd3}
.event-service-card .inner {position:absolute; inset:0; width:100%; height:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; padding:32px;}
.event-service-card h3 {font-size:24px; font-weight:600; line-height:1.45em; letter-spacing:-.03em;}
.event-service-card h3:after {content:''; display:block; width:32px; height:1px; background:#fff; margin:32px auto;}
.event-service-card p {font-size:17px; line-height:1.6em; letter-spacing:-.02em;}

.event-features-section {margin-bottom:55px;}
.event-features-section .cards {display:flex; gap:12px;}
.event-features-section .card {display:flex; align-items:center; gap:24px; padding:40px; background:#fff; border-radius: 24px; box-shadow: 0px 0px 32px 0px rgba(0, 0, 0, 0.1);}
.event-features-section .card:nth-child(1) {width:43%;}
.event-features-section .card:nth-child(2) {width:57%;}
.event-features-section .icon {width:120px; border-radius:16px;}
.event-features-section .content {flex:1 1 auto; min-width:0; width:1%; color:#454545; font-size:17px; line-height:1.6em; letter-spacing:-.03em;}
.event-features-section .content h3 {margin-bottom:4px; color:#242424; font-size:24px; font-weight:700; line-height:1.45em; letter-spacing:-.03em;}
.event-features-section .content ul li {padding-left:.6em; text-indent:-.6em;}
.event-features-section .content .ef1 {font-weight:600;}
.event-features-section .content .ef2 {color:#254699; font-weight:600;}
.event-features-section .note {margin-left:43%; margin-top:12px; text-align:center; color:#686868;}

.cta-section {text-align:center; font-size:28px; font-weight:700; line-height:1.4em; letter-spacing:-.03em;}
.cta-section em {display:inline-block; color:#3559ce; font-style: normal;}

.event-contact {padding:90px 0; background:url('changeup/contact-bg.jpg') 50% 100%/cover no-repeat; text-align:center;}
.event-contact h2 {margin-bottom:10px; font-size:26px; font-weight:700; line-height:1.45em;}
.event-contact p {margin-bottom:35px; font-size:18px; line-height:1.6em;}
.event-contact .btn {display:inline-flex; align-items:center; padding:17px 25px; border-radius:50px; background:#242424; font-size:18px; font-weight:600; line-height:1.3em; color:#fff;}
.event-contact .btn svg {margin-left:40px; transition:.2s;}
.event-contact .btn:hover svg {transform:translateX(10px);}

@media (max-width: 1600px) {
	.event-wrapper .contain {max-width:1200px;}

	.event-hero .title-area h2 {font-size:100px;}
	.event-hero .title-area p img {height:70px;}
	.event-hero .text-area {max-width:620px;}
	.event-hero .text-area .text-1 {font-size:22px;}
	.event-hero .text-area .text-2 {font-size:18px;}
	
	.event-heading .tit {font-size:32px;}
	.event-heading .ev {font-size:22px;}
	.event-heading .txt {font-size:16px;}

	.event-service {padding:80px 0;}
	.event-service-cards {margin-bottom:60px;}
	.event-service-card h3 {font-size:22px;}
	.event-service-card h3:after {margin:24px auto;}
	.event-service-card p {font-size:16px;}

	.event-features-section .card {padding:32px;}
	.event-features-section .icon {width:110px;}
	.event-features-section .content {font-size:16px;}
	.event-features-section .content h3 {font-size:22px;}
	.event-features-section .note {font-size:14px;}

	.cta-section {font-size:25px;}

}

@media (max-width: 1024px) {
	.event-hero .title-area h2 {font-size:88px;}
	.event-hero .title-area p img {height:60px;}

	.event-features-section .cards {flex-direction:column; gap:20px; max-width:640px; margin:0 auto;}
	.event-features-section .card {width:100% !important;}
	.event-features-section .note {font-size:14px; margin-left:0;}
}

@media (max-width: 900px) {
	.event-service-cards {flex-wrap:wrap; padding:2%;}
	.event-service-card {width:54%; margin:-3%;}
	.event-service-card:nth-child(1) {background:#5250aa}
	.event-service-card:nth-child(2) {background:#7b5cd3}
	.event-service-card:nth-child(3) {background:#7b5cd3}
	.event-service-card:nth-child(4) {background:#5250aa}
}

@media (max-width: 760px) {

	.event-wrapper .contain {padding-left:16px; padding-right:16px;}

	.event-hero .inner {padding:20px;}
	.event-hero .title-area {flex-direction: column; gap:16px;}
	.event-hero .title-area h2 {font-size:56px;}
	.event-hero .title-area p img {height:44px;}
	.event-hero .text-area {width:90%; max-width:300px; padding:20px;}
	.event-hero .text-area .text-1 {margin-bottom:10px; font-size:17px;}
	.event-hero .text-area .text-1 br {display:none;}
	.event-hero .text-area .text-2 {font-size:15px;}

	.event-heading {margin-bottom:30px;}
	.event-heading .tit {font-size:30px;}
	.event-heading .ev {margin-top:10px; padding:8px 24px; font-size:18px; border-radius:18px 18px 0 18px;}
	.event-heading .txt {font-size:15px;}

	.event-service {padding:65px 0;}
	.event-service-cards {padding:0 0 40px; margin:-1%;}
	.event-service-card {width:48%; margin:1%;}
	.event-service-card .inner {padding:10px;}
	.event-service-card h3 {font-size:17px;}
	.event-service-card h3:after {width:24px; margin:10px auto;}
	.event-service-card p {font-size:12px;}

	.event-features-section .card {padding:24px 16px; gap:16px; align-items: flex-start; border-radius:16px;}
	.event-features-section .icon {width:60px; border-radius:8px;}
	.event-features-section .content {font-size:14px;}
	.event-features-section .content h3 {font-size:18px;}
	.event-features-section .note {font-size:12px;}

	.cta-section {font-size:20px;}



	.event-contact {padding:60px 0; background-size:100% 160%;}
	.event-contact h2 {font-size:24px;}
	.event-contact p {margin-bottom:25px; font-size:16px;}
	.event-contact .btn {padding:12px 24px; font-size:16px;}
	.event-contact .btn svg {margin-left:25px; width:18px; height:auto;}

	
}