.news-wrap {
 /* background-color: #3e3e3e;*/
  background-color: #fff;
  padding: 80px 10px 20px;
  min-height: 1000px;
  position: relative;
}
.news-content .title {
  /*color: #d8d8d8;*/
  color: #333;
  font-size: 2.8em;
  font-weight:bold;
  margin: 0 0 10px;
}
.news-content .info {
    /*color: #c8c8c8;*/
    /*color: #b0b0b0;*/
    font-size: 16px;
    color: #333333bd;
}
.news-content .info span {
  margin-right: 20px;
}
.news-content .info span.icon {
  margin-right: 4px;
}
/*.news-content .content {
  color: #d8d8d8;
  padding-top: 10px;
  text-align: justify;
  min-height: 400px;
}*/

.news-content .content {
    color: #333;
    padding-top: 10px;
    text-align: justify;
    min-height: 400px;
}

.news-wrap .content img {
  max-width: 100%;
}

.prev-wrap > span,
.next-wrap > span {
  /*color: #d8d8d8;*/
  color: #333;
}

.prev-wrap > a,
.next-wrap > a {
    text-decoration: none;
    color: #333;
}

@media (max-width: 767px) {
    .news-wrap {
        padding: 40px 20px;
    }

    .content-main {
        flex-wrap: wrap;
        justify-content: center;
        gap: 0;
    }
    .content-main > div {
        padding: 0;
    }

    .news-content .title {
        font-size: 24px;
    }
        .content-main .news-detail-container,
        .content-main .news-list-container {
            width: 100%;
            padding: 0 10%;
        }
        .news-list-container {
            padding-bottom: 10%;
        }
}

@media (min-width: 768px) {
  .news-wrap {
    padding: 40px 20px;
  }
    .content-main {
        flex-wrap: wrap;
        justify-content: center;
        gap: 0;
    }
    .news-list-container,
    .news-detail-container {
        width: 100%;
        padding: 0 10%;
    }
}
@media (min-width: 992px) {
    .content-main {
        padding: 130px 0px 80px;
        display: flex;
        flex-wrap: nowrap;
        justify-content: space-between;
        align-items: flex-start;
        gap: 50px;
    }

    .news-wrap {
        padding: 40px 0;
    }

    .news-detail-container{
        width: fit-content;
        max-width: 970px;
        padding: 0;
    }
    .news-list-container {
        width: 270px;
        padding: 0;
    }
    .render-body {
        position: relative;
        overflow: scroll;
    }
    .reco-wrap {
        margin: 0;
        position: sticky;
        position: -webkit-sticky;
        top: 180px;
    }

}

@media (min-width: 1200px) {
    .content-main {
        padding: 130px 60px 80px;
    }
   /* .news-wrap {
        padding: 40px 60px;
    }*/
}