/* 窓香房 /security/ 記事内カード修正 | 2026-11-13
   WordPress「外観 → カスタマイズ → 追加CSS」へ貼り付け可。
   既存の投稿HTMLは変更不要。 */
.index-content {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 22px !important;
  margin: 28px 0 38px !important;
  padding: 0 !important;
  width: 100% !important;
  box-sizing: border-box;
}
.index-content::before,
.index-content::after { display: none !important; content: none !important; }
.index-content > [class*="col-"] {
  float: none !important;
  clear: none !important;
  display: block !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  flex: none !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box;
}
.index-content > [class*="col-"] > .card {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  min-width: 0;
  overflow: hidden;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid #e3ebe6 !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: 0 5px 20px rgba(0, 65, 42, .08) !important;
  transition: transform .2s ease, box-shadow .2s ease;
}
.index-content .card:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 26px rgba(0, 65, 42, .13) !important;
}
.index-content .card > a:first-child {
  display: block !important;
  overflow: hidden;
  width: 100%;
  line-height: 0;
}
.index-content .card > a:first-child img {
  display: block !important;
  width: 100% !important;
  height: 165px !important;
  max-width: none !important;
  object-fit: cover !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
}
.index-content .card h3 {
  position: relative;
  margin: 0 !important;
  padding: 17px 16px 14px !important;
  color: #00583c !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  background: #fff !important;
  border: 0 !important;
  box-shadow: none !important;
}
.index-content .card h3::after {
  content: "" !important;
  position: absolute;
  bottom: 0;
  left: 16px;
  right: 16px;
  height: 3px;
  background: linear-gradient(to right, #00704a 50%, #a6ce39 50%);
}
.index-content .card p {
  flex-grow: 1;
  margin: 0 !important;
  padding: 13px 16px !important;
  color: #56665e !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
  background: transparent !important;
}
.index-content .card a.blue-button {
  display: block !important;
  width: auto !important;
  min-height: 44px;
  margin: 0 16px 16px !important;
  padding: 11px 10px !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: #00704a !important;
  color: #fff !important;
  text-align: center !important;
  text-decoration: none !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  box-shadow: none !important;
  box-sizing: border-box;
}
.index-content .card a.blue-button:hover,
.index-content .card a.blue-button:focus-visible {
  background: #00583c !important;
  color: #fff !important;
}
@media (max-width: 767px) {
  .index-content { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; }
  .index-content .card > a:first-child img { height: 130px !important; }
  .index-content .card h3 { font-size: 15px !important; padding: 12px 10px !important; }
  .index-content .card h3::after { left: 10px; right: 10px; }
  .index-content .card p { font-size: 12px !important; padding: 10px !important; }
  .index-content .card a.blue-button { margin: 0 10px 10px !important; padding: 10px 6px !important; font-size: 12px !important; }
}
@media (max-width: 360px) {
  .index-content { grid-template-columns: 1fr !important; }
  .index-content .card > a:first-child img { height: 175px !important; }
}