/* ==========================================================================
   名簿変更・登録手続きページ（/update/）
   ========================================================================== */
/* 2つのカードを横並びにする（PC版） */
.update-channels {
  display: flex;
  gap: 30px;
  margin-top: 40px;
  width: 100%;
}

/* 共通のカードデザイン */
.update-card {
  flex: 1;
  background-color: #ffffff;
  border: 1px solid #ede9e4;
  border-top: 4px solid #dfd9d0;
  padding: 40px 30px 30px;
  border-radius: 4px;
  position: relative;
  box-sizing: border-box;
  box-shadow: 0 4px 10px rgba(11, 11, 11, 0.03);
  display: flex;
  flex-direction: column;
}

/* ネットとFAXを区別するバッジ */
.update-badge {
  position: absolute;
  top: -14px;
  left: 24px;
  font-size: 0.75rem;
  font-weight: bold;
  padding: 4px 14px;
  border-radius: 20px;
  letter-spacing: 0.05em;
}
.badge-online {
  background-color: #9e2a2b;
  color: #fdfaf7;
}
.badge-fax {
  background-color: #1d3557;
  color: #fdfaf7;
}

/* カードの中の見出し */
.update-card h4 {
  font-family: "Shippori Mincho", Georgia, serif;
  font-size: 1.35rem;
  color: #0b0b0b;
  margin: 0 0 15px 0;
}

/* カードの中の説明文 */
.update-card p {
  font-size: 0.9rem;
  color: #555555;
  line-height: 1.7;
  margin: 0 0 20px 0;
}

/* FAX情報の特設エリア */
.fax-info {
  background-color: #fdfaf7;
  border: 1px dashed #dfd9d0;
  padding: 15px;
  margin-bottom: 25px;
  border-radius: 4px;
}
.fax-info p {
  margin: 0;
}
.fax-number {
  font-size: 1.25rem !important;
  font-weight: bold;
  color: #0b0b0b;
}
.fax-number span {
  font-size: 0.85rem;
  color: #555555;
  font-weight: normal;
}
.fax-target {
  font-size: 0.8rem !important;
  color: #666666;
  margin-top: 5px !important;
}

/* ボタンの配置エリア */
.update-action {
  text-align: center;
  margin-top: auto;
}

/* Googleフォームへのボタン */
.btn-form {
  display: block;
  background-color: #1d3557;
  color: #fdfaf7 !important;
  border: 1px solid #1d3557;
  padding: 14px;
  font-size: 0.95rem;
  font-weight: bold;
  text-decoration: none;
  border-radius: 4px;
  transition: all 0.3s ease;
}
.btn-form:hover {
  background-color: #457b9d;
  border-color: #457b9d;
}

/* PDFダウンロードボタン */
.btn-download {
  display: block;
  background-color: #ffffff;
  color: #9e2a2b !important;
  border: 1px solid #9e2a2b;
  padding: 14px;
  font-size: 0.9rem;
  font-weight: bold;
  text-decoration: none;
  border-radius: 4px;
  transition: all 0.3s ease;
}
.btn-download:hover {
  background-color: #9e2a2b;
  color: #fdfaf7 !important;
}

/* ==========================================================================
  スマホ対応（画面が狭いときは縦並びにする）
   ========================================================================== */
@media (max-width: 768px) {
  .update-channels {
    flex-direction: column;
    gap: 40px;
  }
  .update-card {
    padding: 35px 20px 25px;
  }
}