body {
	background: #FBFCFD;
}
html,
body {
	width: 100%;
	height: 100%;

	overflow: hidden;
	overscroll-behavior: none;
}

/* -------------- HEADER ----------- */
#header {
	position: fixed;
	top: 0;
	left: 0;

	width: 100%;
	height: 60px;

	display: flex;
	align-items: center;
	justify-content: space-between;


	box-sizing: border-box;

	background: rgba(255,255,255,0.9);

	-webkit-backdrop-filter: blur(20px);
	backdrop-filter: blur(20px);

	border-bottom: 1px solid #F0F1F4;

	z-index: 1000;
}
.centerheader {
	position: relative;

	margin: 0 auto;

	width: 100%;
	max-width: 1000px;
	height: 100%;  
}
.logo {
	position: absolute;
	left: 50%;
	top: 19px;
	
	transform: translateX(-50%);
	
	width: 150px;
	height: 22px;

	background: url('../images/logo/workoo.png') center center / contain no-repeat;
}
.button_menu {
	display: block;
	position: absolute; 
	top: 20px; left: 18px;
	width: 20px; height: 20px; 
}
.icon_menu {
	position: absolute;
	left: 0; top: 0;
	width: 20px;
	height: 20px;
	background: url('../images/icon/menu.svg') center center / contain no-repeat;
}
.button_alert {
	display: block;
	position: absolute; 
	top: 18px; right: 18px;
	width: 24px; height: 24px; 
}
.icon_alert {
	position: absolute;
	left: 0; top: 0;
	width: 24px;
	height: 24px;
	background: url('../images/icon/alert.svg') center center / contain no-repeat;
}











/* -------------- MAIN MENU ----------- */
#main_menu {
	position: fixed;
	bottom: 0;
	left: 0;

	width: 100%;
	height: 70px;

	display: flex;
	align-items: center;
	justify-content: space-between;


	box-sizing: border-box;

	background: rgba(255,255,255,0.9);

	-webkit-backdrop-filter: blur(20px);
	backdrop-filter: blur(20px);

	border-top: 1px solid #F0F1F4;
	border-top-left-radius: 32px;
	border-top-right-radius: 32px;
	box-shadow:
	0 -10px 30px rgba(0,0,0,0.05),
	0 -2px 10px rgba(0,0,0,0.03);
	z-index: 1000;
}
.centermain_menu {
	position: relative;

	margin: 0 auto;

	width: 100%;
	max-width: 1000px;
	height: 100%;  
}
.button_mm_list {
	display: flex;
	align-items: center;
	justify-content: space-between;

	width: 100%;
	height: 100%;
}
.button_mm_list .button_mm {
	position: relative;

	flex: 1;
	height: 100%;

	display: flex;
	flex-direction: column;

	align-items: center;
	justify-content: center;

	gap: 4px;
	margin-top: -12px;
	cursor: default;
}

.icon_home { 
	width: 18px;
	height: 18px;
	background: url('../images/icon/home.svg') center center / contain no-repeat;
}
.icon_home_active {
	width: 18px;
	height: 18px;
	background: url('../images/icon/home_active.svg') center center / contain no-repeat;
}

.icon_search {
	width: 20px;
	height: 20px;
	background: url('../images/icon/search.svg') center center / contain no-repeat;
}
.icon_search_active {
	width: 20px;
	height: 20px;
	background: url('../images/icon/home_active.svg') center center / contain no-repeat;
}

.icon_like {
	width: 20px;
	height: 20px;
	background: url('../images/icon/like.svg') center center / contain no-repeat;
}
.icon_like_active {
	width: 20px;
	height: 20px;
	background: url('../images/icon/like_active.svg') center center / contain no-repeat;
}

.icon_msg {
	width: 20px;
	height: 20px;
	background: url('../images/icon/msg.svg') center center / contain no-repeat;
}
.icon_msg_active {
	width: 20px;
	height: 20px;
	background: url('../images/icon/msg_active.svg') center center / contain no-repeat;
}

.icon_profile {
	width: 20px;
	height: 20px;
	background: url('../images/icon/profile.svg') center center / contain no-repeat;
}
.icon_profile_active {
	width: 20px;
	height: 20px;
	background: url('../images/icon/profile_active.svg') center center / contain no-repeat;
}

.mm_txt {
	font-size: 10px;
	font-weight: 500;
	line-height: 1;

	color: rgb(93, 86, 86);

	white-space: nowrap;

	font-family:
		-apple-system,
		BlinkMacSystemFont,
		"Segoe UI",
		Roboto,
		Helvetica,
		Arial,
		sans-serif;
}
.txt_active { color: #0F5DF3; }




@media (max-width: 768px){

	#header{ height: 50px; }
	.logo { top: 10px; }
	.button_menu { top: 15px; }
	.button_alert { top: 13px; }
}