@charset "utf-8";

.board-list {
}
.board-list .img-item {
	opacity: .9;
	background: #ccc;
}
.board-list .img-item:hover {
	opacity: 1;
  transform: scale3d(1.1, 1.1, 1.1);
	transition: all 250ms linear;
	-o-transition: all 250ms linear;
	-ms-transition: all 250ms linear;
	-moz-transition: all 250ms linear;
	-webkit-transition: all 250ms linear;
}
/* List */
.list-item h2 {
	display: block;
  font-size: 18px;
  line-height: 22px;
  margin: 2.5rem 0px;
  padding: 0px;
  letter-spacing: 1.5px;
  font-weight: 600;
}
.list-item .list-img { position:relative; overflow:hidden; }
.list-item .list-img img { width:100%; height:auto; }
.list-item .list-date {
	position: relative;
	font-size: 1.5rem;
	letter-spacing: .05em;
	line-height: 1.6;
  font-weight: 400;
	color: #777777;
	-webkit-text-size-adjust: none;
  -webkit-font-smoothing: subpixel-antialiased;
	padding: 0;
}
.list-item .list-date.left { left:0px; }
.list-item .list-date.right { right:0px; }
.list-item .tack-icon {
	position: absolute;
  top: -1.2rem;
  padding: 1px 4px 1px 2px;
  left: -1rem;
  font-family: 'Lato', sans-serif;
  font-size: 5px;
  color: #fff;
  background: #666;
  text-align: center;
  border-radius: 2px;
}
.list-item .list-content {
	padding: 15px;
  background: #f9faf9;
}
@media (min-width: 768px) {
	.list-item .list-content {
    padding: 25px 7% 30px;
	}
}
@media (min-width: 1200px) {
	.list-item .list-content {
    padding: 34px 10% 45px;
	}
}
.list-item .list-details { padding-bottom:5px; border-bottom:1px dotted #ccc; }
.list-item .list-details .member, .list-item .list-details .guest { color:#787878 !important; }
.list-item .list-cont {
	margin: 0px;
  padding: 0;
  line-height: 20px;
  overflow: hidden;
  word-break: break-all;
}
.list-item .list-sp { margin:0 7px; color:#ddd; font-size:11px; }
.list-item .list-read { margin-top:15px; padding-top:5px; border-top:1px dotted #ccc;}
.list-item .read-more i { margin-left:4px; }
.list-row.clearfix { float:none !important; padding:0 !important; margin:0 !important; width:100% !important }

/* Responsive */
@media all and (max-width:767px) {
	.responsive .list-row { width:50% !important }
}
@media all and (max-width:420px) {
	.responsive .list-row { width:100% !important }
}