/* ---  card --- */
.card-items {
  align-content: flex-start;
  align-items: stretch;
  display: flex;
  flex-direction: row;
  flex-grow: 1;
  flex-wrap: wrap;
  /* justify-content: space-between; */
}
.card-items a {color: #000; }
.card-items .card {
  width: calc(20% - 25.6px);
  margin: 0 25px 25px 0;
  display: flex;
  flex-direction: column;
  border: 0;
  border-left: 1px solid rgba(0,0,0,.125);
  border-bottom: 1px solid rgba(0,0,0,.125);
  border-top: 1px solid rgba(0,0,0,.125);
  border-radius: 1rem;
}
.card-items .card:hover {
  box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
}
.card-items .card .card-image-box {
  align-items: center;
  display: flex;
  justify-content: center;
  overflow: hidden;
  float: none;
  height: 240px;
  position: relative;
  border-radius: 12px;
	margin: 10px;
}
.card-items .card .card-image {
  max-height: 100%;
  max-width: 100%;
  border: none;
  outline: none;
  background-size: cover;
  background-repeat: no-repeat;
  -webkit-transition: all .5s;
  -moz-transition: all .5s;
  -o-transition: all .5s;
  transition: all .5s;
}
.card-items .card .card-image-box:hover .card-image,
.card-items .card .card-image-box:focus .card-image {
  transform: scale(1.2);
}
.card-items .card .card-body {
  padding: 15px;
}
.card-items .card .card-price-box {
  align-items: center;
  display: inline-flex;
  flex-wrap: wrap;
  margin-top: 2px;
}
.card-items .card .card-price {
  border-radius: 6px;
  font-size: 14px;
  font-weight: 700;
  line-height: 26px;
  margin: 0 4px 2px 0;
  padding: 0 6px;
  white-space: nowrap;
  color: var(--main-color);
}
.card-items .card .card-price-new {
  color: #fff!important;
  background-color: var(--main-color)!important;
}
.card-items .card .card-price-old {
  text-decoration: line-through;
}
.card-items .card .card-price-del {
  color: #fff!important;
  background-color: var(--secondary);
  font-size: 14px!important;
}
.card-items .card-price-no {
  color: #fff!important;
  background-color: var(--secondary);
  font-size: 14px!important;
}
.card-items .card .card-name-box {
  font-size: 12px;
  letter-spacing: 0.2px;
  line-height: 20px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  height: 40px;
  margin-top: 4px;
  font-weight: 600;
}
.card-items .card .card-name-box:last-child {margin-bottom: 0;}
.card-items .card .card-name {color: black;}
.card-items .card-control {padding: 0 15px 15px 15px; font-size: 12px;}
.card-items .card-control button {border-radius: 8px;}
.card-items .card-feedback-box {padding: 3px 0 3px 0;}
.card-items .card-info-box {padding: 3px 0 3px 0; font-size: 10px; font-weight: 700;}

.card-items .card-myshop {
  border: 0;
  border-left: 1px solid var(--main-color2)!important;
  border-bottom: 1px solid var(--main-color2)!important;
  border-top: 1px solid var(--main-color2)!important;
  box-shadow: 0 .5rem 1rem rgba(196, 48, 43,.15)!important;
}
}
.card-items .card-video {
  border: 0;
  border-left: 1px solid var(--main-color2)!important;
  border-bottom: 1px solid var(--main-color2)!important;
  border-top: 1px solid var(--main-color2)!important;
}
.card-items .card-article {
  border: 0;
  border-left: 1px solid var(--main-color-article)!important;
  border-bottom: 1px solid var(--main-color-article)!important;
  border-top: 1px solid var(--main-color-article)!important;
}
.card-items .card-book {
  border: 0;
  border-left: 1px solid var(--main-color-book)!important;
  border-bottom: 1px solid var(--main-color-book)!important;
  border-top: 1px solid var(--main-color-book)!important;
}
.card-items .card-ms {
  border: 0;
  border-left: 1px solid var(--main-color2)!important;
  border-bottom: 1px solid var(--main-color2)!important;
  box-shadow: 0 .5rem 1rem rgba(196, 48, 43,.15)!important;
}
/* --- end card --- */
/* --- gallery card --- */
.gallery-card {
	width: 100%;
	height: 100%;
  margin-bottom: 18px;
  padding: 10px;
}
.gallery-caption {
	font-size: 14px;
	line-height: 24px;
	overflow: hidden;
	color: #000;
	word-wrap: break-word;
	margin: 0;
}
/* --- end gallery card --- */
/* --- news card --- */
.news-card {
	width:100%;
	height:auto;
	border: 1px solid #8dd9ac;
	border-radius: 10px;
	padding: 10px;
}
.news-card a {color: var(--main-black)}
.news-card:hover { box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important; }
.news-card .news-card-body { color: var(--main-black); }
.news-card .note { font-weight: 600; }
.news-card img {
    max-width: 200px;
    max-height: 100px;
}
.news-card .red-icon{
  font-size:14px;
  color: var(--main-color2);
  margin: 0 5px 0 5px;
}
.news-card-mini {
	width:100%;
	height:auto;
	border: 1px solid #8dd9ac;
	border-radius: 10px;
	padding: 10px;
}
.news-card-mini:hover { box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important; }
.news-card-mini .news-card-body {
	color: var(--main-black);
	font-size: 12px !important;
}
.news-card-mini .note { font-weight: 600; }
.news-card-mini-lock {
	font-weight: 600;
	border: 3px solid #8dd9ac;
}
.news-card-mini img {
    max-width: 100px;
    max-height: 50px;
}
/* --- end news card --- */