body {
  margin:0px;
}

.main {
  border: 1px solid black;
  width: 100%;
  min-height: calc(100vh-60px) ;
}
.main-top{
  display: flex;
  width: 100%;
}
.main-top>div {
  text-align: center;
}

.li-title{
  width: 70%;
  height: 35px;
  border-bottom: 0.5px double black ;
  border-right: 1px dotted black;
  line-height: 35px;
  padding-left: 2px;
  padding-right: 2px;
  overflow:hidden; /* 초과시 내용 숨기기 */
}

.li-date{
  width: 30%;
  min-width: 90px;
  border-bottom: 0.5px double black ;
  padding-top: 5px;
}

.upload {
  color: whitesmoke;
  margin-left: 0.35rem;
  margin-top: 7px;
  padding: 7px 1.1rem;
  border-radius: 3rem;
  background-color: #17a2b8;
  box-shadow: 2px 2px 1px rgb(0 0 0 / 20%);
  width: 120px;
  text-align: center;
  margin-bottom: 7px;
  position: fixed;
  z-index: 9999999;
  bottom: 80px;
  right: 30px;

}

a{
  text-decoration: none; /* 하이퍼링크 밑줄제거 */
}


.product {
    display: flex;
    padding: 10px;
    width: 80%;
    margin: auto;
/*     background-color: aquamarine; */
border: 1px;
  }

  .product .title {
    font-size: 25px;
    text-align: center;
    font-weight: 600;
/*     background-color: antiquewhite; */
    text-decoration: none; /* 하이퍼링크 밑줄제거 */
    color: black;
}
.link:visited{
    color: black;
}

  .product .date {
    color: grey;
    font-size: 13px;
/*     background-color: greenyellow; */
    text-align: right;
  }
  .detail-pic {
    width: 100%;
    height: 300px;
    background-size: cover;
    background-position: center;
  } 
.flex-grow-1{
/*   background-color: red; */
  width: 80px;
  border: 1px solid black;
}

.float-end {
/*   background-color: pink; */
  width: 100%;
  height: 40%;
  margin: auto;
  text-align: left;
  font-size: 13px;
}
  

/* 토글부분 디자인요소 */

.sec-1 {
  padding: 2rem 0.85rem;
  background-color: #fff;
  margin-right: 0;
  margin-left: 0;
  display: flex;
}

.col-4 {
  padding-right: 0;
  padding-left: 0;
  flex: 0 0 33.3333%;
  max-width: 0 0 33.3333%;
  position: relative;
  min-height: 1px;
}

.col-4>h5 {
  margin-bottom: 0.5rem;
  font-family: inherit;
  font-weight: 500;
  line-height: 1.2;
  color: inherit;
}

.col-8 {
  -ms-flex: 0 0 66.6666%;
  flex: 0 0 66.6666%;
  max-width: 66.6666%;
  padding-right: 0;
  padding-left: 0;
  position: relative;
  min-height: 1px;
}

.col-8>ul {
  margin: 0;
  margin-bottom: 0;
  padding: 0;
  list-style: none;
  line-height: 1.5;
}
.col-8>ul>li {
  float: left;
  margin-right: 0.35rem;
  display: block;
  margin-top: 7px;
  padding: 7px 1.1rem;
  border-radius: 3rem;
  background-color: #17a2b8;
  box-shadow: 2px 2px 1px rgb(0 0 0 / 20%);
}
.col-8>ul>li>a {
  text-decoration: none;
  color:white;
}
.col-8>i {
  text-align: center;
  width: 1.25em;

}

ul {
  display: block;
  list-style-type: disc;
  margin-block-start: 1em;
  margin-block-end: 1em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  padding-inline-start: 40px;
}
li {
  display: list-item;
  text-align: -webkit-match-parent;
}

.move-page-btn {
  display: block;
  border-radius: 3rem;
}

.test02>i {
  font-size: 25px
}


/* 푸터부분 */
.under-bar {
  width: 100%;
  height: 70px;
  position:fixed;
  bottom: 0;
  border: 1px solid black;
  font-size: 15px;
  align-items: center;
  background-color: white;
}

.footer-1 {
  float: left;
  width: 33.3%;
  height: 100%;
  padding-top: 10px;
  text-align: center;
  border: 1px solid black;
  font-weight: bold;
  cursor:pointer;
  background-color: white;
}
.footer-1>i {
  font-size: large;
}