#boardBox #listBox .list-checkbox {
  padding: 0 10px 25px;
}

#boardBox #listBox .list-check {
  padding-bottom: 15px;
}

#boardBox #listBox .post-wrap {
  display: flex;
  align-items: center;
  gap: 35px;
}

#boardBox #listBox .list-item:first-child {
  border-top: 2px solid var(--color-text);
}

#boardBox #listBox .list-item {
  border-bottom: 1px solid #e5e5e5;
  padding: 35px 30px;
}

#boardBox #listBox .thumb {
  width: 100%;
  max-width: 360px;
  height: auto;
  aspect-ratio: 3/2;
  overflow: hidden;
}

#boardBox #listBox .thumb .bg {
  width: 100%;
  height: 100%;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  transition: transform 0.3s ease-in-out;
}

#boardBox #listBox .thumb .nodata-bg {
  background-color: #f5f5f5;
  background-image: url(/themes/basic/assets/images/empty_logo.png);
  background-size: 33%;
}

#boardBox #listBox .post-wrap:hover .thumb .bg {
  transform: scale(1.05);
}

#boardBox #listBox .post-wrap .contents {
  flex: 1;
}

#boardBox #listBox .post-title {
  font-weight: 600;
}

#boardBox #listBox .post-content {
  font-size: var(--f16);
  font-weight: 400;
  line-height: 1.7;
  color: #aaa;
  margin: 20px 0 30px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

#boardBox #listBox .date {
  font-size: var(--f16);
  color: var(--color-mute);
}

#boardBox #writeBox .image-upload-area .label,
#boardBox #writeBox .upload-area .multi-file-image .preview-file-box.active {
  min-width: 150px !important;
  height: auto;
  aspect-ratio: 3/2;
}

#boardBox #viewBox .view-writer > div p.date {
  color: var(--color-mute);
  font-size: var(--f16);
  padding: 0;
  margin: 0;
}

#boardBox #viewBox .view-writer > div p.date:before {
  display: none;
}

/* Desktop ( 1024px ~)*/
@media all and (min-width: 1024px) {
}

/* Laptop ( 1024px ~ 1360px)*/
@media all and (min-width: 1024px) and (max-width: 1360px) {
}

/* Tablet ( 768px ~ 1023px)*/
@media all and (min-width: 768px) and (max-width: 1023px) {
  #boardBox #listBox .list-item:first-child {
    border-width: 1px;
  }

  #boardBox #listBox .thumb {
    max-width: 280px;
  }
}

/* Mobile ( ~ 767px)*/
@media all and (max-width: 767px) {
  #boardBox #listBox .list-checkbox {
    padding: 0 10px 15px;
  }

  #boardBox #listBox .post-wrap {
    flex-direction: column;
    align-items: flex-start;
  }

  #boardBox #listBox .list-item:first-child {
    border-width: 1px;
  }

  #boardBox #listBox .list-item {
    padding: 25px 20px;
  }

  #boardBox #listBox .thumb {
    max-width: 100%;
  }

  #boardBox #listBox .post-content {
    margin: 12px 0 20px;
  }

  #boardBox #writeBox .image-upload-area .label,
  #boardBox #writeBox .upload-area .multi-file-image .preview-file-box.active {
    min-width: 120px !important;
  }
}
