/* 予約パネル(マーケットプレイス機能)。テーマの料金ブロックに馴染むトーン */
.single .reserve-panel {
  margin: 3em 0;
  border: 1px solid #e5e5e5;
  border-radius: 8px;
  padding: 2em;
  background: #fff;
}
.single .reserve-panel h3 {
  font-size: 1.25em;
  margin-bottom: 1em;
}
.single .reserve-panel h3 .mode {
  display: inline-block;
  margin-left: .75em;
  font-size: .65em;
  font-weight: 400;
  color: #555;
  border: 1px solid #ccc;
  border-radius: 1em;
  padding: .1em .8em;
  vertical-align: middle;
}
.single .reserve-panel .fields {
  display: flex;
  flex-wrap: wrap;
  gap: 1em 1.5em;
  margin-bottom: 1.25em;
}
.single .reserve-panel .fields > label {
  display: block;
  font-size: .85em;
  color: #444;
  flex: 1;
  min-width: 12em;
}
.single .reserve-panel input[type="date"],
.single .reserve-panel select,
.single .reserve-panel textarea {
  display: block;
  width: 100%;
  margin-top: .35em;
  padding: .5em .75em;
  font-size: 1em;
  font-family: inherit;
  border: 1px solid #d4d4d4;
  border-radius: 4px;
  background: #fff;
}
.single .reserve-panel textarea { min-height: 5em; }
.single .reserve-panel .payment .radios {
  display: flex;
  gap: 1.25em;
  margin-top: .5em;
}
.single .reserve-panel .payment .radios label {
  font-size: 1em;
  display: flex;
  align-items: center;
  gap: .35em;
}
.single .reserve-panel .submit {
  display: inline-block;
  border: none;
  cursor: pointer;
  font-family: inherit;
  font-size: 1em;
  font-weight: 700;
  color: #fff;
  background: #e8380d;
  border-radius: 4px;
  padding: .8em 2.5em;
}
.single .reserve-panel .submit:hover { opacity: .85; }
.single .reserve-panel .note,
.single .reserve-panel .guide {
  margin-top: .75em;
  font-size: .8em;
  color: #777;
}
.single .flash-message,
.single .flash-error {
  margin: 1em 0;
  padding: .8em 1.2em;
  border-radius: 6px;
  font-size: .9em;
}
.single .flash-message { background: #ecfdf5; border: 1px solid #34d399; color: #065f46; }
.single .flash-error { background: #fef2f2; border: 1px solid #f87171; color: #991b1b; }

/* 掲載希望ページ */
.publish-page { padding: 4em 0 6em; }
.publish-page .container { width: min(92%, 880px); margin: 0 auto; }
.publish-page h1 { font-size: 1.75em; margin-bottom: .75em; }
.publish-page .lead { color: #444; margin-bottom: 2.5em; line-height: 2; }
.publish-page .steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1em; margin-bottom: 3em; }
@media (max-width: 769px) { .publish-page .steps { grid-template-columns: 1fr 1fr; } }
.publish-page .step { border: 1px solid #e5e5e5; border-radius: 8px; padding: 1.25em; background: #fff; }
.publish-page .step .num { font-size: 1.5em; font-weight: 700; color: #e8380d; }
.publish-page .step h3 { font-size: 1em; margin: .25em 0 .5em; }
.publish-page .step p { font-size: .8em; color: #666; }
.publish-page .cta { text-align: center; margin-bottom: 2em; }
.publish-page .cta .btn-primary {
  display: inline-block; background: #e8380d; color: #fff; font-weight: 700;
  border-radius: 4px; padding: 1em 3em; text-decoration: none;
}
.publish-page .cta .btn-primary:hover { opacity: .85; }
.publish-page .cta .sub { margin-top: 1em; font-size: .85em; color: #666; }
.publish-page .contact-note { text-align: center; font-size: .85em; color: #777; }
