.kin-news{
  width:100%;
  max-width:var(--kin-max-width,1200px);
  margin:2rem auto;
  box-sizing:border-box;
}
.kin-news__title{
  margin:0 0 1rem;
  padding:0;
  background:none!important;
  border:0!important;
  color:inherit;
  font:inherit;
  font-size:1.35rem;
  font-weight:700;
  line-height:1.4;
}
.kin-news__grid{
  display:grid;
  grid-template-columns:repeat(var(--kin-cols-pc,4),minmax(0,1fr));
  gap:var(--kin-gap-pc,18px);
  align-items:start;
}
.kin-news__card{
  display:block;
  min-width:0;
  color:inherit!important;
  text-decoration:none!important;
  background:transparent;
  border:0;
  box-shadow:none;
}
.kin-news__card--hide-pc{display:none}
.kin-news__media{
  position:relative;
  display:block;
  overflow:hidden;
  width:100%;
  aspect-ratio:var(--kin-ratio,3 / 4);
  background:#f2f2f2;
}
.kin-news__image{
  display:block;
  width:100%;
  height:100%;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  object-fit:cover;
  transition:opacity .18s ease,transform .18s ease;
}
.kin-news--ratio-auto .kin-news__media{aspect-ratio:auto}
.kin-news--ratio-auto .kin-news__image{height:auto;object-fit:contain}
.kin-news__image--empty{
  min-height:120px;
  background:linear-gradient(145deg,#f5f5f5,#ececec);
}
.kin-news__card:hover .kin-news__image{opacity:.94;transform:scale(1.008)}
.kin-news__play{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border-radius:50%;
  background:rgba(255,255,255,.92);
  color:#222;
  font-size:14px;
  line-height:1;
  box-shadow:0 2px 12px rgba(0,0,0,.14);
}
.kin-news__body{
  display:block;
  padding-top:10px;
}
.kin-news__caption{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:var(--kin-excerpt-lines,2);
  overflow:hidden;
  margin:0;
  color:inherit;
  font-family:inherit;
  font-size:16px;
  font-weight:400;
  line-height:1.7;
  letter-spacing:0;
  word-break:break-word;
}
@media (max-width:767px){
  .kin-news{margin:1.5rem auto}
  .kin-news__grid{
    grid-template-columns:repeat(var(--kin-cols-sp,3),minmax(0,1fr));
    gap:var(--kin-gap-sp,7px);
  }
  .kin-news__card--hide-pc{display:block}
  .kin-news__card--hide-sp{display:none}
  .kin-news__body{display:none!important}
  .kin-news__play{width:28px;height:28px;font-size:10px}
  .kin-news__card:hover .kin-news__image{transform:none}
}

.kin-news__card:focus-visible{outline:2px solid currentColor;outline-offset:3px}
