@media screen and (max-width: 768px) {
	html,
	body {
		margin: 0;
		padding: 0;
		overflow-x: hidden;
		height: 100%;
	}

	body {
		display: flex;
		flex-direction: column;
		min-height: 100vh;
	}

	.container {
		display: flex;
		flex-direction: column;
		flex: 1;
	}

	.sidebar {
		display: flex;
		flex-direction: column;
		background-color: #D6CCC2;
	}

	/* ✅ 1행 묶기 */
	.sidebar > .sidebar-header {
		display: flex;
		width: 100%;
	}

	.sidebar-title {
		width: 66.6%;
		text-align: center;
		background-color: #D6CCC2;
		color: white;
		font-size: 14px;
		font-weight: bold;
		cursor: default;
		padding: 10px 0;
		border: none;
	}

	.menu-button.back {
		width: 33.3%;
		box-sizing: border-box;
		padding: 10px 0;
		font-size: 12px;
		background-color: #F5EBE0;
		border: none;
		color: #333;
		cursor: pointer;
		transition: background-color 0.2s ease;
	}

	.menu-group {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		width: 100%;
	}

	.menu-button.active {
		background-color: #D5BDAF;
		color: white;
		font-weight: bold;
	}

	.menu-button {
		width: 100%;
		box-sizing: border-box;
		padding: 10px 0;
		font-size: 14px;
		background-color: #F5EBE0;
		border: none;
		color: #333;
		cursor: pointer;
		transition: background-color 0.2s ease;
	}

	.content {
		flex-direction: column;
		width: 90%;
		padding: 5%;
		font-size: small;
		flex: 1;
		font-family: -apple-system, BlinkMacSystemFont, "Segoe UI",
			"Malgun Gothic", "Apple SD Gothic Neo", "Helvetica Neue", Helvetica, Arial, sans-serif;
	}

	.post-title {
		font-size: large;
		margin-bottom: 20px;
	}

	.post-view-body{
		margin-top: 3%;
		word-wrap: break-word;
		overflow-wrap: break-word;
		word-break: break-word;
		white-space: normal;
	}

	.post-view-body img {
		max-width: 80%;
	}
	
	
}