@font-face {font-family: "MyCustomFont-1";src: url("./NeueHaasDisplayRoman.ttf") format("opentype");font-weight: normal;font-style: normal;}
@font-face {font-family: "MyCustomFont-2";src: url("./NeueHaasDisplayLight.ttf") format("opentype");font-weight: normal;font-style: normal;}
@font-face {font-family: "MyCustomFont-3";src: url("./NeueHaasDisplayMediu.ttf") format("opentype");font-weight: normal;font-style: normal;}
body {font-family: "MyCustomFont-2", sans-serif;}
:root {
	--title: clamp(2rem, 3vw, 3rem);
	--subtitle: clamp(1rem, 2vw, 2rem);
	--content-01: clamp(0.8rem, 2vw, 22px);
	--color-01: #FECE00E5;--color-02: #ED1A13;
}

.px-common {padding: 27px 3vw 0;}
header{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
header img {height: 64px;width: 350px;}
/*
header a.btn-home {color: #ffffff;font-size: 14px;font-weight: 900;letter-spacing: 1px;text-transform: uppercase;text-decoration: none;padding: 10px 20px;background: #ed1a13;border-radius: 7px;transition:all 500ms ease-in-out;}
header a.btn-home:hover{background: #000000;transition:all 500ms ease-in-out;}
*/
h1 {font-size: var(--title);}
p {font-size: var(--content-01);}

.form-container h1,
.form-container h2{text-align: left;}
.form-container h2{
	font-size: clamp(1rem,3vw,24px);
}

 a.btn-home {
	 color: #ffffff;
	 font-size: 10px; 
	 font-weight: 900;
	 letter-spacing: 1px;
	 text-transform: uppercase;
	 text-decoration: none;
	 padding: 10px 20px;
/*	 background: #ed1a13;*/
	 background: #ed1a13bf;
	 border-radius: 7px;
	 transition:all 500ms ease-in-out;
	 position: fixed;
	 width:fit-content;
	 bottom:50px;
	 right:10px;
	 z-index: 999;
	   opacity: 0;
  pointer-events: none;
  transform: translateX(20px);
}

a.btn-home.visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

a.btn-contact1{
	position: fixed;
     bottom:100px;
	 right:6px;
	 width:50px;
	 height:50px;
	border-radius:50%;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #02BA02;
	font-size: 30px;
	padding:5px 6px 5px 8px;
	 color:white;
	z-index:999;
}

/* a.btn-home:hover{background: #000000;transition:all 500ms ease-in-out;}*/

section.thank-you-for-schedule-your-school-visit{color: #fff;padding:40px;margin-top: 30px;margin-bottom: 30px;min-height: 70vh;background: linear-gradient(150grad, #36c3fe, #01ba01);display:flex;align-items:center;text-align:center;border-top: 1px solid #cccccc;border-bottom: 1px solid #cccccc;}
section.thank-you-for-schedule-your-school-visit h1 {letter-spacing: 2px;font-size: var(--title);margin-bottom:2rem;font-family: "MyCustomFont-1", sans-serif;}
section.thank-you-for-schedule-your-school-visit p{}

.sec-01 {}
.sec-01-content h1 {margin-bottom: 1rem;}
.sec-01-content img {width: min(420px, 40vw);margin-top: 2rem;}
.sec-01 .form-container {min-height: 80vh;background-color: var(--color-01);padding: 4.5vw 4.5vw;border-radius: 30px;max-width: 760px;display: inline-block;position:relative;}
.sec-01 .form-container h1 {letter-spacing: 1px;font-size: var(--title);margin-bottom:1rem;font-family: "MyCustomFont-1", sans-serif;}
.sec-01 .form-container label {font-size: var(--content-01);}
.sec-01 .form-container input {background-color: var(--color-01);border: none;border-bottom: 1px solid black;outline: none;box-shadow: none;border-radius: 0;}
.sec-01 .form-container input:focus {border: none;border-bottom: 1px solid black;outline: none;box-shadow: none;}
.sec-01 .form-container button {margin-top: 10px !important;width: 100%;border-radius: 4px;border: 1px solid #2B2B2B;background: rgba(43, 43, 43, 0.75);font-size: var(--content-01);letter-spacing: 0.48px;}
.sec-01 .form-container button:hover{background:#000000;}
.MuiContainer-root.mui-style-15paubg {padding: 0px;}
.MuiBox-root{position:relative;}
.MuiBox-root.mui-style-0{width:100%}
ul.MuiList-root.MuiList-padding.mui-style-866d6n {color: #ffffff;font-size: 11px;text-transform: uppercase;background: red;padding: 2px 5px;position: absolute;top: 100%;right: 0px;}
ul.MuiList-root.MuiList-padding.mui-style-866d6n svg{width:10px;height:10px}

.sec-01 .modal-content{background-color: #fed31a;}
.sec-01 .modal-content .form-container{ padding: 2.5vw 2.5vw; }
.sec-01 .modal-header .btn-close {font-size: 1.5rem;}

.sec-02 {position: relative;overflow: hidden;margin-bottom: 3vw;}
.sec-02 h2 {position: absolute;color: white;top: 50%;left: 3vw;transform: translate(0, -50%);font-size: var(--subtitle);}
.sec-03 .column1 #carousel-01 .carousel-inner img {/* margin-inline: auto; *//* width: 75%; */width: 80%;aspect-ratio: 1;object-fit: cover;}
.sec-03 .carousel-control-prev-icon, .sec-03 .carousel-control-next-icon, .sec-06 .carousel-control-prev-icon, .sec-06 .carousel-control-next-icon {filter: invert(1) grayscale(100);}
.sec-03-row .column2 .accordion {width: 101%;position: relative;right: 0px;}
.sec-03-row .column2 .accordion .accordion-item {border-radius: 0px;border-color: black;border-top: 0;border-left: 0;border-right: 0;}
.sec-03-row .column2 .accordion-button {font-size: clamp(1rem, 2vw, 26px);background-color: transparent;box-shadow: none;border: none;padding-top: 2rem;padding-left: 0rem;/* padding-bottom: 2rem; */padding-right: 0rem;position: relative;font-weight: 500;letter-spacing: 1px;transition: all 0.3s;}
.sec-03-row .column2 .accordion-button::after {display: none;}
.sec-03-row .column2 .icon::before {content: "+";display: inline-block;font-size: 1.6rem;font-weight: bold;transition: transform 0.3s;background-color: #BCEAF9;aspect-ratio: 1;width: 30px;text-align: center;border-radius: 50%;color: #36C2FD;align-content: center;}
.sec-03-row .column2 .accordion-button:not(.collapsed) .icon::before {transform: rotate(45deg);background-color: #36C2FD;color: white;}
.sec-03-row .column2 .accordion-button:not(.collapsed) {font-weight: 900;color: #36C2FD;}
.sec-03-row .column2 .accordion-button:focus, .sec-03-row .column2 .accordion-button:hover {background-color: transparent;}
.sec-03-row .column2 .accordion-body {padding: 5px 3rem 2rem 0rem;max-width: 750px;font-size: clamp(1rem, 1vw, 18px);font-size: var(--content-01);}
.sec-03-row .column2 .accordion-header {padding-top: 0px;}
.sec-04 {margin-top: 3vw;}
.sec-04 .column1 {color: var(--color-02);display: flex;flex-direction: column;justify-content: center;align-items: center;}
.sec-04 .column1 h2 {font-size: clamp(6rem, 10vw, 15rem);}
.sec-04 .column1 p {text-align: center;font-size: var(--content-01);width: 80%;}
.sec-04 .column2 {position: relative;}
.sec-04 .column2 .shape-container {width: 100%;align-content: center;position: relative;}
.sec-04 .column2 .shape-container svg, .sec-02 svg {width: 100%;height: auto;}
.sec-04 .column2 .shape-container h2 {position: absolute;color: white;top: 50%;transform: translateY(-50%);right: 3vw;text-align: right;font-size: var(--subtitle);}
.sec-05 {margin-top: 5vw;}
.sec-05 .progress, .progress-stacked {border-radius: 0;}
.sec-05 .progress:nth-of-type(1) .progress-bar, .sec-05 .progress:nth-of-type(5) .progress-bar {background-color: #02BA02;}
.sec-05 .progress:nth-of-type(2) .progress-bar {background: #36C2FD;}
.sec-05 .progress:nth-of-type(3) .progress-bar, .sec-05 .progress:nth-of-type(6) .progress-bar {background: #FECE00;}
.sec-05 .progress:nth-of-type(4) .progress-bar, .sec-05 .progress:nth-of-type(7) .progress-bar {background: #ED1A13;}
.sec-06-main {text-align: center;padding: 2vw 0 0px;}
.sec-06-main h2 {font-size: clamp(1.3rem, 3vw, 3rem);;margin-top: 3vw;}
.swiper {/* border:1px solid black; */width: 80%;}
.sec-06-main .card-wrapper {padding: 90px 0 2vw;max-width: 1100px;margin: 35px auto 35px;overflow: hidden;/* border:1px solid black; */}
.sec-06-main .card-list {padding: 0;/* display: flex; *//* justify-content: center; *//* gap:24px; */}
.sec-06-main .card-list .card-item {list-style: none;width: 100%;}
.sec-06-main .card-list .card-item .box {max-width: 400px;/* aspect-ratio: 1; */padding: 20px;position: relative;align-content: flex-end;user-select: none;}
.sec-06-main .card-list .card-item .box1 {background-color: #FFD319;}
.sec-06-main .card-list .card-item .box2, .sec-06-main .card-list .card-item .box4 {background-color: #36C2FD;}
.sec-06-main .card-list .card-item .box3 {background-color: #02BA02;}
.swiper-button-next, .swiper-button-prev {color: black;}
.sec-06-main .card-list .card-item video {/* position: absolute; *//* width: calc(85%); *//* aspect-ratio: 1; *//* object-fit: cover; *//* object-position: top; *//* top: -60px; *//* left: 50%; *//* transform: translateX(-50%); */margin-top: -60px;width: 100%;filter: drop-shadow(0px 4px 0px #fff) drop-shadow(4px 0px 0px #fff) drop-shadow(-4px 0px 0px #fff);}
.sec-06-main .card-list span {position: relative;top: -115px;}
.sec-06-main .card-list span .bi-play-circle-fill {font-size: 60px;line-height: 1;position: relative;top: 15px;left: 20px;color: #36C2FD;}
.modal video {aspect-ratio: 16 / 9;}
.sec-06-main .card-list .card-item p {font-size: clamp(0.8rem, 2vw, 1rem);min-height: 110px;}

.sec-06 a.btn-contact3 {
    margin-top: 50px;
    display: block;
    text-decoration: none;
    background-color: #36C2FD;
    color: #ffffff;
    letter-spacing: 1px;
    padding: 14px 18px;
    letter-spacing: 1px;
    font-weight: 600;
    border-radius: 8px;
    display: flex;
    justify-content: center;
    gap: 14px;
    border: none;
    max-width: 200px;
	margin-inline:auto;
	
}
footer h2 {font-size: var(--title);margin-bottom: 2vw;}
footer p {    
	margin-bottom: 0;
    font-size: 16px;
    display: flex;
    gap: 30px;}
footer p a{ text-decoration: none; color:inherit; transition: all .3s; }
footer p a:hover{
	border-bottom: 1px solid #02BA02; 
}
footer .row1 .column1 img {width: 15vw;margin-bottom: 2vw;}
footer .row1 .column2 img {width: 15vw;}
footer .row2 .column1 ul {display: flex;justify-content: flex-start;gap: 40px;font-size: 16px;padding-left: 0;}
footer .row2 .column1 ul li:first-child {list-style: none;}
footer .row2 ul li a {color: black;text-decoration: none;}
footer .row2 .column2 ul {display: flex;justify-content: flex-end;gap: 40px;flex-wrap: wrap;font-size: 16px;}
footer .row2 .column2 ul li:first-child {list-style: none;}
.MuiBox-root.mui-style-mvwult {
    padding: 0px !important;
    display: flex;
    height: auto !important;
}

.formaloo__form-container.formaloo_MFVm3A5F__form-container.inheritFont.MuiBox-root.mui-style-16pwkyz {
    padding-inline: 0px !important;
}

.MuiBox-root.mui-style-4eiif {
    padding-inline: 0px !important;
}


a.btn-contact2{
	margin-top:50px;
	display: block;
	text-decoration: none;
	background-color: #02BA02;
    color: #ffffff;
	letter-spacing: 1px;
	padding:14px 18px;
	letter-spacing: 1px;
	font-weight: 600;
	border-radius: 8px;
    display: flex;
	justify-content: center;
	gap:14px;
	border:none;
	max-width: 210px;
    
}

.modal .mui-style-1y83vyo{
	font-size:14px;
}
.sec-07{overflow: hidden; margin-bottom: 3rem;}
.sec-07 h2,.sec-08 h2{text-align: center;font-size: clamp(1.3rem, 3vw, 3rem);}
.sec-07 .accordion {width: 101%;position: relative;right: 0px;}
.sec-07 .accordion .accordion-item {border-radius: 0px;border-color: black;border-top: 0;border-left: 0;border-right: 0;border-bottom: 0.5px solid #0000003b;}
.sec-07 .accordion-button {font-size: clamp(1rem, 3vw, 22px);background-color: transparent;box-shadow: none;border: none;padding-top: 2rem;position: relative;font-weight: 500;letter-spacing: 1px;transition: all 0.3s;padding-inline:27vw; }
.sec-07 .accordion-button::after {display: none; }
.sec-07 .icon::before {content: "+";display: inline-block;font-size: 1.6rem;font-weight: bold;transition: transform 0.3s;background: #36C2FD;aspect-ratio: 1;width: 30px;text-align: center;border-radius: 50%;color: #fff;align-content: center;}
.sec-07 .accordion-button:not(.collapsed) .icon::before {transform: rotate(45deg); background: rgba(0, 0, 0, 0.46);}
.sec-07 .accordion-button:not(.collapsed) {font-weight: 900; background-color: #36C2FD; color: #fff;}
.sec-07 .accordion-button:not(.collapsed) .accordion-collapse{background-color: #36C2FD; color: #fff;}
/*.sec-07 .accordion-button:focus{}*/
.sec-07 .accordion-body {padding: 5px 27vw 2rem 27vw;font-size: clamp(0.9rem, 2vw, 1.2rem);  background-color: #36C2FD; color: #fff; }
.sec-07 .accordion-header { padding-top: 0px; }

.sec-08 {padding-top:3rem;min-height: 100vh;padding-inline:0px;overflow: hidden;position: relative;}

.sec-08 .custom-slider{
    padding-top: 7rem;
    padding-bottom: 5rem;
}

.sec-08 .custom-slider .slick-slide {
    opacity: 0.4;
    transition: all 0.4s ease;
    transform: scale(0.65);
    transform-origin: bottom center;
    background-color:  #FECE00;
}

.sec-08 .custom-slider .slick-center {
    transform: scale(1);
    opacity: 1;
}
.sec-08 .custom-slider .slick-center::before{
	content:"";
	position:absolute;
	inset:0;
	border: 40px solid #FECE00;
}

.sec-08 .custom-slider img {
    width: 100%;
    height: 500px;
    object-fit: cover;
	object-position: top;
}

.sec-08 .custom-slider .slick-center img {
    height: 600px;
    height: 500px;
	 object-fit: cover;
}

/* Bottom arrows */
.sec-08 .slider-arrows {
    text-align: center;
    margin-top: -2rem;
    position: relative;
    z-index: 20;
    position:absolute;
    top: 54%;
    width:100%;
}

.sec-08 .custom-arrow {
    background: transparent;
    border: none;
    width: 50px;
    height: 50px;
    cursor: pointer;
}

.sec-08 .custom-arrow span {
    width: 28px;
    height: 28px;
}
.custom-arrow .carousel-control-prev-icon,
.custom-arrow .carousel-control-next-icon {
    filter: invert(1); /* becomes black */
}
.sec-08 .slick-prev:before,.sec-08 .slick-next:before {
	display: none;
}
.sec-08 .slick-prev {
    left: 33%;
}
.sec-08 .slick-next {
    right: 33%;
}

/*
.sec-08 .slick-prev,.sec-08 .slick-next{
	top: 50%;
}
*/
@media(max-width:1440px){
	.sec-08 .slider-arrows{top: 62%;}
	.sec-08 .slick-prev {
    left: 21.5%;}
		.sec-08 .slick-next {right: 21.5%;}
}

@media(max-width:1366px) {
	.swiper {width: 90%;}
}
@media(max-width:1280px) {
	.swiper {width: 95%;}
	.sec-08 .custom-slider img {
	object-position: top;}
	.sec-08 .custom-slider .slick-center img,.sec-08 .custom-slider img  {
		height: 500px;}
	
    .sec-08 .slick-prev {
        left: 22.8%;
    }
	.sec-08 .slick-next {
    right: 22.8%;
}
	
	    .sec-08 .slider-arrows {
        top: 58%;
    }
}
@media(max-width:992px) {
	.swiper {width: 90%;/* border: 1px solid black; */padding: 0 50px;}
	.sec-03 .column1 #carousel-01 .carousel-inner img {width: 100%;}
}
@media (max-width:768px) {
	.sec-06-main .card-list span {position: relative;top: -12px;}
	.sec-07 .accordion-button,.sec-07 .accordion-body{padding-inline:20vw;}
	.sec-08 {min-height: 75vh; padding-top:0px;}
	.sec-08 .custom-slider {
    padding-top: 2rem;
    padding-bottom: 1rem;
}
	
	    .sec-08 .slider-arrows {
        top: 53%;
    }
    .sec-08 .slick-prev {
        left: 5.4%;
    }
	.sec-08 .slick-next {
    right:  5.4%;
}
	
}
@media (max-width:767px) {
	.px-common {padding: 27px 5vw 0;}
	.sec-02 h2 {left: 5vw;}
	.sec-01-content img {width: min(400px, 80vw);}
	.sec-01-content h1 br, .sec-01-content p br {display: none;}
	.sec-01-main {gap: 24px;}
	.sec-03 .column1 #carousel-01 .carousel-inner img {width: 100%;margin-inline: auto;}
	.carousel-control-prev {left: -15px;}
	.carousel-control-next {right: -15px;}
	.sec-03-row {gap: 24px;}
	.sec-04 .column2 .shape-container {padding-left: 3vw;}
	.sec-04 .column2 .shape-container h2 {/* width: 80%; */right: 10px;}
	footer .row1 .column1 img {width: 45vw;}
	footer .row1 .column2 img {width: 35vw;}
	footer .row2 .column2 ul {justify-content: center;padding-left: 0;}
	.sec-06-main .card-list span {position: relative;top: -60px;}
}
@media (max-width:576px) {
	.sec-01 .form-container {padding: 15vw 8vw;}
	.sec-06-main .card-wrapper {/* max-width: 1100px; */margin: 35px 10vw 35px;}
	.swiper-button-next, .swiper-button-prev {display: none !important;}
	.swiper-button-next, .swiper-button-prev {width: 16px;color: black;}
	.sec-06-main .card-list span {position: relative;top: -40px;}
	
	header { justify-content: center;}
	.sec-07 {
		margin-top:2rem;
	}
	.sec-07 .accordion-button, .sec-07 .accordion-body {
 padding-inline: 4vw;}
	.sec-08 .custom-slider img {
    width: 100%;height: 100%;}
	    .sec-08 .slider-arrows {
        top: 58%;
    }
	.sec-08 {
		min-height: 68vh;}
			.sec-08 .slick-prev {
    left: -1%;
}
	.sec-08 .slick-next {
    right: -1%;
}

}
@media (max-width:480px) {
	.sec-06-main .card-wrapper {margin: 35px auto 35px;}
	.swiper {padding: 0 20px;}
	.sec-06-main .card-list span {position: relative;top: -63px;}
	header img{width:100%;}
	footer p {    
    flex-direction: column;
    gap: 16px;}

	
	.sec-08 .custom-slider .slick-center img {width:100%; height:280px;}
	.sec-08 .custom-slider .slick-center::before {
    border: 14px solid #FECE00;
}
	
	a.btn-contact2{
	  max-width:300px;
		font-size: 14px;
	}
		.sec-08 {
		min-height: auto;}
	    .sec-08 .slider-arrows {
        top: 66%;
    }
				.sec-08 .slick-prev {
    left: -4%;
}
	.sec-08 .slick-next {
    right: -4%;
}

/*	header a.btn-home{font-size:10px;padding:6px 10px;}*/
}
@media (max-width:360px) {
	.sec-06-main .card-list span {position: relative;top: -18px;}
}