/*----------------------------------
    MEDIUM LAYOUT: 1280px
-----------------------------------*/


@media only screen and (min-width: 1024px) and (max-width: 1200px) {
    

}


/*----------------------------------
    TABLET LAYOUT: 768px
------------------------------------*/

@media (min-width: 768px) and (max-width: 1023px) {	

	section { padding:48px 0;}	
	.section-header { margin-bottom: 24px;}
	.section-header h1 { font-size: 32px;}
	.section-header h2 { font-size: 28px; line-height: 40px; text-align: center;}	
	.section-header h2 span { display: flex; font-size: 24px; width: 100%; justify-content: center;}
	.section-header p { font-size: 16px;}

	.order-btn { font-size: 16px; height: 48px;}
	
	#header { height:80px; padding:0;}
	#header.header-scrolled { height:80px;}
	#header .logo { margin: 0; padding: 0; border: 0px none;}
	#header .logo img { max-height: 48px;}
	#header .logo { margin: 0; padding: 0; border: 0px none; display: flex;}
	.navmenu-logo { display: none;}
	#header .header-inner { display: flex; justify-content: space-between; } 
	.nav-wrapper { gap: 12px;}
	.nav-wrapper .navbar { order: 2;}

	.inner-banner p:last-child strong { font-size: 16px;}

	.address-head {}
	.address-head p, .address-head ul li { font-size: 16px;}
	.address-head ul { flex-wrap: wrap; column-gap: 24px; row-gap: 10px;}

	.event-section-content:nth-child(odd) .event-text-section { margin-top: 36px;}

	.event-section-content:nth-child(even) .event-text-section { margin-bottom: 48px;}


	.event-text-section p.event-include-head { font-size: 20px;}
	.event-text-section ul li { font-size: 16px;}
	.event-text-highlight { padding: 16px; font-size: 16px;}
	.event-text-btn { margin-block-start: 16px;}

	#our-philosophy p { font-size: 16px;}
	#our-philosophy p:last-child { font-size: 18px;}

	#how-it-works ul { flex-wrap: wrap;}
	#how-it-works ul li i { font-size: 30px;}
	#how-it-works ul li span { font-size: 18px;}
	#how-it-works p { font-size: 16px;}
	#how-it-works p strong { font-size: 16px;}
	
}

/*----------------------------------
    MOBILE LAYOUT: 320px
-----------------------------------*/

@media only screen and (max-width: 767px) {
	
	section { padding:48px 0;}	
	.section-header { margin-bottom: 24px;}
	.section-header h1 { font-size: 32px;}
	.section-header h2 { font-size: 28px; line-height: 40px; text-align: center;}	
	.section-header h2 span { display: flex; font-size: 24px; width: 100%; justify-content: center;}
	.section-header p { font-size: 16px;}

	.order-btn { font-size: 16px; height: 48px;}
	
	#header { height:80px; padding:0;}
	#header.header-scrolled { height:80px;}
	#header .logo { margin: 0; padding: 0; border: 0px none;}
	#header .logo img { max-height: 48px;}
	#header .logo { margin: 0; padding: 0; border: 0px none; display: flex;}
	.navmenu-logo { display: none;}
	#header .header-inner { display: flex; justify-content: space-between; } 
	.nav-wrapper { gap: 12px;}
	.nav-wrapper .navbar { order: 2;}

	.inner-banner p:last-child strong { font-size: 16px;}

	.address-head {}
	.address-head p, .address-head ul li { font-size: 16px;}
	.address-head ul { flex-wrap: wrap; column-gap: 24px; row-gap: 10px;}

	.event-section-content:nth-child(odd) .event-text-section { margin-top: 36px;}

	.event-section-content:nth-child(even) .event-text-section { margin-bottom: 48px;}

	.event-img-section img { object-fit: cover; height: 320px; max-width: 100%; width: 100%;}
	.event-text-section p.event-include-head { font-size: 20px;}
	.event-text-section ul li { font-size: 16px;}
	.event-text-highlight { padding: 16px; font-size: 16px;}
	.event-text-btn { margin-block-start: 16px;}

	#our-philosophy p { font-size: 16px;}
	#our-philosophy p:last-child { font-size: 18px;}

	#how-it-works ul { flex-wrap: wrap;}
	#how-it-works ul li i { font-size: 30px;}
	#how-it-works ul li span { font-size: 18px;}
	#how-it-works p { font-size: 16px;}
	#how-it-works p strong { font-size: 16px;}
	
}


/*----------------------------------
    WIDE MOBILE LAYOUT: 480px
-----------------------------------*/

@media only screen and (min-width: 480px) and (max-width: 767px) {	
	

}