@charset "UTF-8";
.plan-card {
  display: block;
  transition: opacity 0.9s ease-in-out;
}

.plan-card:hover {
  opacity: 0.65;
}

/*スマホ*/
@media screen and (max-width:750px){
/* ===== plan-list ===== */

.plan-list {
  padding: 4% 0 4%;
}

.plan-list__inner {
  width: 100%;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  gap: 1%;
}

/* ===== plan-list__row ===== */

.plan-list__row {
  display: contents;
}

/* ===== plan-card ===== */

.plan-card {
  flex: 0 0 calc(50% - 2%);
  width: calc(50% - 2%);
}

}



/*PC*/
@media print, screen and (min-width:751px){
/* ===== plan-list ===== */

.plan-list {
  padding: 2% 0 0;
}

.plan-list__inner {
  width: 100%;
  margin: 0 auto;
}

/* ===== plan-list__row ===== */

.plan-list__row {
  display: flex;
  gap: 0%;
  justify-content: center;
}

.plan-list__row--top {
  margin-bottom: 3%;
}

.plan-list__row--top .plan-card {
  flex: 0 0 calc((100% - 1%) / 2);
}

.plan-list__row--bottom .plan-card {
  flex: 0 0 calc((100% - 1%) / 2);
}

/* ===== plan-card ===== */

.plan-card {
  display: block;
  transition: opacity 0.2s ease;
}

.plan-card:hover {
  opacity: 0.7;
}

.plan-card img {
  width: 100%;
  height: auto;
  display: block;
}

}
  /* 印刷時のみ適用されるスタイル */
@media print {
  /* 1. 全体を非表示にする */
  body * {
    visibility: hidden;
  }

  /* 2. 特定の範囲とその子要素だけを表示する */
  .print-content, .print-content * {
    visibility: visible;
  }

  /* 3. 表示位置を調整（任意） */
  .print-content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
  }
}