二つのクラスに同じ値の「height: 92 vh;」と指定しているのですが、同じスタイルになりません

質問

二つのクラスに同じ値のheight: 92 vh;と指定しているのですが、同じスタイルになりません。具体的には画像の左の白い四角と右の白い四角の縦の長さが同じになりません。

ソースコード

html
1<!DOCTYPE html>
2<html lang="ja">
3	<head>
4		<meta charset="utf-8">
5		<title>Prodiary</title>
6		<meta name="description" content="プログラミング独学を支え合う。">
7		<meta name="keywords" content="プログラミング学習,プログラミング独学">
8		<link rel="stylesheet" href="../css/style.css">
9		<!--[if lt IE 9]>
10		<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
11		<script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
12		<![endif]-->
13	</head>
14
15	<body>
16		<div class="wrapper">
17			<div class="contents">
18				
19				<!----- メインコンテンツ ----->
20				<div class="nav-box">
21					<div class="nav-box__inner icon">
22						prodiary
23					</div>
24					<div class="nav-box__inner nav-box">
25						<nav>
26							<div class="myicon">マイページ</div>
27							<ul class="item_box">
28								<li class="item">新規作成</li>
29								<li class="item">ブログ</li>
30								<li class="item">タイムライン</li>
31								<li class="item">設定</li>
32							</ul>
33						</nav>
34					</div>
35				</div>
36				<div class="main">
37					<div class="search-box">
38						<button class="serch-button"></button>
39						<form action=""></form>
40					</div>
41					<h1>ブログ一覧</h1>
42					<div class="blog-box">
43						<div class="blog-box__left">
44							<div class="blog-title">Dockerでrailsの環境構築をする方法</div>
45							<div class="blog-description">再度MacOSをクリーンインストールしようかとも思いましたが、Adobe系のソフトはGNU系の代替ソフトで我慢すれば、もはやMacに固執する必要もないと思った</div>
46							<div class="article-button">
47								<button>記事を読む ≫</button>
48							</div>
49						</div>
50						<div class="blog-box__right">
51							<div class="thumbnail"></div>
52						</div>
53					</div>
54				</div>
55				<aside class="aside">
56					<h1>タイムライン</h1>
57					<ul class="timeline_box">
58						<li class="timeline-item">
59							<div class="post-time">2023/03/01</div>
60							<div class="usrename">@sample-spz</div>
61							<div class="item-box">Lorem ipsum dolor sit amet consectetur adipisicing elit. Beatae corporis iure deserunt, eveniet aliquid dolor nemo, commodi quam quae amet expedita nulla, et sapiente laborum doloremque dolores fugit non omnis!</div>
62						</li>
63					</ul>
64				</aside>
65				<!----- メインコンテンツ END ----->
66				
67				<!----- フッター ----->
68				<footer>
69					
70				</footer>
71				<!----- フッター END ----->
72			</div>
73		</div>
74	</body>
75</html>

scss
1$home-box__color: white;
2
3html {
4  width: 100%;
5  height: 100%;
6  padding: 0;  
7}
8
9ul {
10  list-style: none;
11  padding: 0;
12}
13
14body {
15  width: 100%;
16  height: 100%;
17  padding: 0;
18  background-color: #ededed;
19}
20
21.contents {
22  display: flex;
23  justify-content: space-between;
24  width: 100%;
25  max-width: 1400px;
26  margin: 20px auto 0;
27}
28
29/*=====================質問箇所=====================*/
30.nav-box, .aside {
31  padding: 0;
32  height: 92vh;
33  border-radius: 30px;
34  background-color: $home-box__color;
35}
36/*=================================================*/
37
38/* ナビバー */
39.nav-box {
40  width: 18%;
41  .nav-box__inner {
42    width: 100%;
43  }
44}
45
46/* センター */
47.main{
48  width: 48%;
49}
50
51/* タイムライン */
52.aside {
53  width: 28%;
54}