@charset "utf-8";

@import url(basic.css);
@import url(page-top.css);

/* -------------------------------------------------- index */
body#index {
  font-family: 'Inter', sans-serif;
  background-color: #f0f4f8;
  color: #333;
}
#index .container {
  max-width: 900px;
  margin: 2rem auto;
  padding: 2rem;
  background-color: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}
.property-card {
  background-color: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
  cursor: pointer;
}
.property-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}
.property-image {
  width: 100%;
  height: 200px;
  /* 画像の高さ固定 */
  object-fit: cover;
  background-color: #e2e8f0;
  /* プレースホルダー背景色 */
  display: flex;
  align-items: center;
  justify-content: center;
  color: #718096;
  font-size: 0.9rem;
}
.property-content {
  padding: 1.5rem;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}
.property-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: #2b6cb0;
  margin-bottom: 0.75rem;
}
.property-price {
  /* 価格は表示しないので、このスタイルは使われませんが念のため残しておきます */
  font-size: 1.25rem;
  font-weight: 600;
  color: #c53030;
  margin-bottom: 1rem;
}
.property-detail-item {
  display: flex;
  margin-bottom: 0.5rem;
  font-size: 0.95rem;
}
.property-detail-label {
  font-weight: 600;
  color: #4a5568;
  min-width: 90px;
}
.property-detail-value {
  color: #2d3748;
}
.no-data {
  text-align: center;
  color: #718096;
  font-size: 1.2rem;
  padding: 3rem;
}

/* -------------------------------------------------- page.php */
body#page {
  font-family: 'Inter', sans-serif;
  background-color: #f0f4f8;
  color: #333;
}
#page .container {
  max-width: 900px;
  margin: 2rem auto;
  padding: 2rem;
  background-color: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}
.property-image-detail {
  width: 100%;
  height: 400px;
  /* 詳細ページの画像高さ */
  object-fit: cover;
  border-radius: 8px;
  margin-bottom: 1.5rem;
  background-color: #e2e8f0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #718096;
  font-size: 1.2rem;
}
.property-detail-section {
  margin-bottom: 2rem;
  padding: 1rem 0;
  border-bottom: 1px solid #edf2f7;
}
.property-detail-section:last-child {
  border-bottom: none;
}
.detail-label {
  font-weight: 600;
  color: #4a5568;
  margin-bottom: 0.5rem;
}
.detail-value {
  color: #2d3748;
  line-height: 1.6;
}
.no-property {
  text-align: center;
  color: #e53e3e;
  font-size: 1.5rem;
  padding: 3rem;
}
.gallery-thumbnail {
  width: 100%;
  height: 120px;
  /* サムネイルの高さ */
  object-fit: cover;
  border-radius: 8px;
  transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
  cursor: pointer;
}
.gallery-thumbnail:hover {
  transform: scale(1.05);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}
.action-buttons-fixed {
  position: fixed;
  /* 画面に対して固定 */
  bottom: 20px;
  /* 下から20px */
  right: 20px;
  /* 右から20px */
  display: flex;
  flex-direction: column;
  /* 縦に並べる */
  gap: 10px;
  /* ボタン間のスペース */
  z-index: 1000;
  /* 他の要素の上に表示 */
}
.action-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  padding: 0.85rem 1.5rem;
  border-radius: 8px;
  transition: background-color 0.2s ease-in-out, transform 0.1s ease-in-out;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  color: white;
  /* デフォルトで白文字 */
  text-decoration: none;
  /* 下線を消す */
  min-width: 120px;
  /* ボタンの最小幅 */
}
.action-button:hover {
  transform: translateY(-2px);
}
.action-button:active {
  transform: translateY(0);
  box-shadow: none;
}
.button-back {
  background-color: #4299e1;
  /* Blue */
}
.button-back:hover {
  background-color: #3182ce;
}
.button-add {
  background-color: #1b7c31;
}
.button-add:hover {
  background-color: #164e23;
}
.button-edit {
  background-color: #f6ad55;
  /* Orange */
}
.button-edit:hover {
  background-color: #ed8936;
}
.button-delete {
  background-color: #e53e3e;
  /* Red */
}
.button-delete:hover {
  background-color: #c53030;
}
.button-login {
  background-color: #48bb78;
  /* Green */
}
.button-login:hover {
  background-color: #38a169;
}
.button-logout {
  background-color: #718096;
  /* Gray */
}
.button-logout:hover {
  background-color: #4a5568;
}
/* iframe_map */
iframe {
  width: 100%;
  height: 450px;
  border: #666 1ox solid;
  border-radius: 8px;
}



/* -------------------------------------------------- edit.php */
body#add {
  font-family: 'Inter', sans-serif;
  background-color: #f0f4f8;
  color: #333;
}
#add .container {
  max-width: 800px;
  margin: 2rem auto;
  padding: 2rem;
  background-color: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}
label {
  display: block;
  margin-bottom: 0.5rem;
  font-weight: 600;
  color: #4a5568;
}
input[type="text"],
input[type="number"],
textarea,
select {
  width: 100%;
  padding: 0.75rem;
  margin-bottom: 1.25rem;
  border: 1px solid #cbd5e0;
  border-radius: 8px;
  font-size: 1rem;
  transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
  box-sizing: border-box;
}
input[type="text"]:focus,
input[type="number"]:focus,
textarea:focus,
select:focus {
  border-color: #63b3ed;
  box-shadow: 0 0 0 3px rgba(66, 153, 225, 0.5);
  outline: none;
}
button {
  background-color: #4299e1;
  color: white;
  padding: 0.85rem 1.5rem;
  border-radius: 8px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.2s ease-in-out, transform 0.1s ease-in-out;
  box-shadow: 0 4px 10px rgba(66, 153, 225, 0.3);
  width: 100%;
}
button:hover {
  background-color: #3182ce;
  transform: translateY(-2px);
}
button:active {
  transform: translateY(0);
  box-shadow: none;
}
.message {
  padding: 1rem;
  border-radius: 8px;
  margin-bottom: 1.5rem;
  text-align: center;
  font-weight: 600;
}
.message.success {
  background-color: #d4edda;
  color: #155724;
  border: 1px solid #c3e6cb;
}
.message.error {
  background-color: #f8d7da;
  color: #721c24;
  border: 1px solid #f5c6cb;
}

/* -------------------------------------------------- edit.php */
body#edit {
  font-family: 'Inter', sans-serif;
  background-color: #f0f4f8;
  color: #333;
}
#edit .container {
  max-width: 800px;
  margin: 2rem auto;
  padding: 2rem;
  background-color: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}
label {
  display: block;
  margin-bottom: 0.5rem;
  font-weight: 600;
  color: #4a5568;
}
input[type="text"],
input[type="number"],
textarea,
select {
  width: 100%;
  padding: 0.75rem;
  margin-bottom: 1.25rem;
  border: 1px solid #cbd5e0;
  border-radius: 8px;
  font-size: 1rem;
  transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
  box-sizing: border-box;
}
input[type="text"]:focus,
input[type="number"]:focus,
textarea:focus,
select:focus {
  border-color: #63b3ed;
  box-shadow: 0 0 0 3px rgba(66, 153, 225, 0.5);
  outline: none;
}
button {
  background-color: #4299e1;
  color: white;
  padding: 0.85rem 1.5rem;
  border-radius: 8px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.2s ease-in-out, transform 0.1s ease-in-out;
  box-shadow: 0 4px 10px rgba(66, 153, 225, 0.3);
  width: 100%;
}
button:hover {
  background-color: #3182ce;
  transform: translateY(-2px);
}
button:active {
  transform: translateY(0);
  box-shadow: none;
}
.message {
  padding: 1rem;
  border-radius: 8px;
  margin-bottom: 1.5rem;
  text-align: center;
  font-weight: 600;
}
.message.success {
  background-color: #d4edda;
  color: #155724;
  border: 1px solid #c3e6cb;
}
.message.error {
  background-color: #f8d7da;
  color: #721c24;
  border: 1px solid #f5c6cb;
}

/* -------------------------------------------------- delete.php */
body#delete {
  font-family: 'Inter', sans-serif;
  background-color: #f0f4f8;
  color: #333;
}
#delete .container {
  max-width: 600px;
  margin: 4rem auto;
  padding: 2.5rem;
  background-color: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  text-align: center;
}
.message {
  padding: 1rem;
  border-radius: 8px;
  margin-bottom: 1.5rem;
  text-align: center;
  font-weight: 600;
}
.message.success {
  background-color: #d4edda;
  color: #155724;
  border: 1px solid #c3e6cb;
}
.message.error {
  background-color: #f8d7da;
  color: #721c24;
  border: 1px solid #f5c6cb;
}
.delete-button {
  background-color: #e53e3e;
  /* Red */
  color: white;
  padding: 0.85rem 1.5rem;
  border-radius: 8px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.2s ease-in-out, transform 0.1s ease-in-out;
  box-shadow: 0 4px 10px rgba(229, 62, 62, 0.3);
  width: 100%;
  max-width: 200px;
  /* ボタンの最大幅 */
  display: inline-block;
  /* 中央寄せ用 */
}
.delete-button:hover {
  background-color: #c53030;
  transform: translateY(-2px);
}
.delete-button:active {
  transform: translateY(0);
  box-shadow: none;
}
.back-button {
  background-color: #4299e1;
  /* Blue */
  color: white;
  padding: 0.85rem 1.5rem;
  border-radius: 8px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.2s ease-in-out, transform 0.1s ease-in-out;
  box-shadow: 0 4px 10px rgba(66, 153, 225, 0.3);
  width: 100%;
  max-width: 200px;
  /* ボタンの最大幅 */
  display: inline-block;
  /* 中央寄せ用 */
  margin-top: 1rem;
}
.back-button:hover {
  background-color: #3182ce;
  transform: translateY(-2px);
}
.back-button:active {
  transform: translateY(0);
  box-shadow: none;
}

/* -------------------------------------------------- admin_login.php */
body#admin-login {
  font-family: 'Inter', sans-serif;
  background-color: #f0f4f8;
  color: #333;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
}
.login-container {
  max-width: 400px;
  padding: 2.5rem;
  background-color: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  text-align: center;
}
input[type="password"] {
  width: 100%;
  padding: 0.75rem;
  margin-bottom: 1.5rem;
  border: 1px solid #cbd5e0;
  border-radius: 8px;
  font-size: 1rem;
  transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
  box-sizing: border-box;
}
input[type="password"]:focus {
  border-color: #63b3ed;
  box-shadow: 0 0 0 3px rgba(66, 153, 225, 0.5);
  outline: none;
}
button {
  background-color: #4299e1;
  color: white;
  padding: 0.85rem 1.5rem;
  border-radius: 8px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.2s ease-in-out, transform 0.1s ease-in-out;
  box-shadow: 0 4px 10px rgba(66, 153, 225, 0.3);
  width: 100%;
}
button:hover {
  background-color: #3182ce;
  transform: translateY(-2px);
}
.message {
  padding: 0.75rem;
  border-radius: 8px;
  margin-bottom: 1.5rem;
  text-align: center;
  font-weight: 600;
  color: #721c24;
  background-color: #f8d7da;
  border: 1px solid #f5c6cb;
}

/* -------------------------------------------------- admin_logout.php */