dtとddを横並びにしてborder-bottomを繋げたい

dtとddを横並び、border-bottomを繋げたいのですが、上手くいきません。
id="news"に＊とcontainerを当ててだけだと上手くデザインが出来ます。
他の場所に問題があるのでしょうか？

HTML
1<body>
2    <div class="container">
3        <header>
4        <h1 class="logo">MyWork</h1>
5        <nav>
6        <ul>
7            <li><a href="#about">About</a></li>
8            <li><a href="#work">Work</a></li>
9            <li><a href="#news">News</a></li>
10            <li><a href="#contact">Contact</a></li>
11            <li><a href="https://www.instagram.com/?hl=ja"><i class="fab fa-instagram"></i></a></li>
12        </ul>
13        </nav>
14    </header>
15    </div>
16    <img  class="top" src="http://placehold.jp/150x50.png">
17   <div class="container">
18    <div class="main"> 
19        <h2 id="about">About</h2>
20        <ul>
21            <li>テキスト</li>
22            <li>住所</li>
23            <li>電話番号</li>
24            <li>URL</li>
25            <li>mail</li>
26        </ul>
27        <p>プロフィールテキストテキストテキストテキストテキストテキストテキストテキスト</p>
28
29    </div>
30</div>
31<div class="container">
32    <div id="work">
33        <h2>Work</h2>
34        <div class="img-list">
35        <img src="http://placehold.jp/150x50.png">
36        <img src="http://placehold.jp/150x50.png">
37        <img src="http://placehold.jp/150x50.png">
38        <img src="http://placehold.jp/150x50.png">
39        <img src="http://placehold.jp/150x50.png">
40        <img src="http://placehold.jp/150x50.png">
41        </div>
42    </div>
43
44    <div id="news">
45        <dl>
46            <dt>2021.xx.xx</dt>
47            <dd>テキストテキストテキスト</dd>
48            <dt>2021.xx.xx</dt>
49            <dd>テキストテキストテキスト</dd>
50            <dt>2021.xx.xx</dt>
51            <dd>テキストテキストテキスト</dd>
52            <dt>2021.xx.xx</dt>
53            <dd>テキストテキストテキスト</dd>
54            <dt>2021.xx.xx</dt>
55            <dd>テキストテキストテキスト</dd>
56        </dl>
57    </div>
58 </div>   
59</body>
60</html>

CSS
1*{
2    margin: 0;
3    padding: 0;
4}
5
6header {
7    height: 200px;
8    margin-top: 30px;
9    display: flex;
10}
11
12.container {
13    margin-right: auto;
14    margin-left: auto;
15    max-width: 960px;
16}
17
18nav {
19    margin-left: auto;
20    margin-top: 15px;
21}
22nav ul{
23    display: flex;
24}
25nav ul li {
26    list-style:none ;
27    margin-left: 20px;
28    display: inline-block;
29    }
30
31nav ul li a{
32  color: black; 
33  text-decoration: none;
34}  
35
36.top {
37    width: 100vw;
38    height: 500px;
39}
40.main {
41    margin-top: 100px;
42    height: 500px;
43
44}
45.main h2 {
46    text-align: center;
47}
48.main ul {
49    margin-top: 100px;
50}
51.main ul li {
52    list-style: none;
53}
54
55.main ul li:first-child,:last-child {
56    margin-bottom: 20px;
57}
58
59#work {
60    text-align: center;
61
62}
63.img-list{
64    display: flex;
65    flex-wrap: wrap;
66    justify-content: center;
67}
68
69.img-list img{
70    width: 300px;
71    height: 150px;
72    margin-right: 20px;
73    margin-top: 30px;
74}
75
76
77
78#news{
79    margin-top: 50px;
80}
81dl {
82    width:100%;
83    border-top: solid 1px #c8c8c8;
84    
85}
86.list {
87    display: flex;
88    height: 50px;
89}
90dt{
91    border-bottom: solid 1px #c8c8c8; 
92    width: 30%; 
93   
94}
95dd { 
96    width: 70%;
97   border-bottom: solid 1px #c8c8c8; 
98   padding-bottom: 10px;
99   
100}
101