@charset "utf-8";
/* CSS Document */

/* ===== LAYOUT STYLES ===== */

/* Main Container */
#wrapper {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  
}

/* Header */
header {
  margin: 1rem 0 2rem 0;
}

.header-image {
  text-align: center;
  margin-bottom: 2rem;
}

.header-image img {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* Main Content */
main {
  margin-bottom: 3rem;
}

/* Section Spacing */
section {
  margin-bottom: 2rem;
}

/* Info Grid */
.info-grid {
  display: grid;
  gap: 0.6rem;
  margin: 1.5rem 0;
}

.info-item {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.info-label {
  font-weight: 600;
  color: #495057;
  font-size: 0.9rem;
}

.info-value {
  font-size: 1rem;
  color: #212529;
}

/* Area Grid */
.area-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1rem;
  margin: 1.5rem 0;
}

/* Schedule List */
.schedule-list {
  margin: 1.5rem 0;
}

.schedule-item {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-bottom: 1rem;
  padding: 1rem;
  background: #f8f9fa;
  border-radius: 6px;
  border-left: 4px solid #007bff;
}

.schedule-label {
  font-weight: 600;
  color: #495057;
  font-size: 0.9rem;
}

.schedule-value {
  font-size: 1rem;
  color: #212529;
}

/* Payment Flow */
.payment-flow {
  margin: 2rem 0;
}

.flow-step {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 2rem;
  padding: 1.5rem;
  background: white;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.step-number {
  flex-shrink: 0;
  width: 2.5rem;
  height: 2.5rem;
  background: #007bff;
  color: white;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-size: 1.1rem;
}

.step-content h4 {
  margin-bottom: 0.5rem;
  color: #212529;
}

/* Lists */
.basic-info,
.notice-list,
.note-list,
.detail-list {
  margin: 1rem 0;
}

.basic-info li,
.notice-list li,
.note-list li,
.detail-list li {
  margin-bottom: 0.75rem;
  padding-left: 1rem;
  position: relative;
}

.basic-info li::before,
.notice-list li::before,
.detail-list li::before {
  content: "•";
  color: #007bff;
  font-weight: bold;
  position: absolute;
  left: 0;
}

.note-list li::before {
  content: "※";
  color: #6c757d;
  font-weight: bold;
  position: absolute;
  left: 0;
}

/* Contact Details */
.contact-details {
  margin: 1rem 0;
}

.contact-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

.contact-item i {
  width: 1.2rem;
  color: #007bff;
}

/* Address Info */
.address-info p {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

.address-info i {
  margin-top: 0.2rem;
  color: #007bff;
}

/* Manager Info */
.manager-info {
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid #dee2e6;
}

/* Company Info */
.company-info {
  margin: 1rem 0;
}

.registration-info {
  font-size: 0.9rem;
  color: #6c757d;
  margin-bottom: 1rem;
}

/* Certification Info */
.certification-info {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 1rem 0;
}

.certification-info img {
  height: 2rem;
  width: auto;
}

/* Footer Layout */
footer {
  background: #343a40;
  color: white;
  padding: 3rem 0 1rem 0;
  margin-top: 4rem;
}

footer section {
  margin-bottom: 2rem;
}

footer h2,
footer h3 {
  color: white;
}

footer a {
  color: #adb5bd;
}

footer a:hover {
  color: white;
}

.footer-info {
  text-align: center;
  margin: 2rem 0;
  padding: 1rem 0;
  border-top: 1px solid #495057;
  border-bottom: 1px solid #495057;
}

.footer-logos {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2rem;
  margin: 2rem 0;
  flex-wrap: wrap;
}

.footer-logos img {
  height: 3rem;
  width: auto;
}

.footer-links {
  display: flex;
  justify-content: center;
  gap: 2rem;
  margin: 2rem 0;
  flex-wrap: wrap;
}

.footer-links a {
  font-size: 0.9rem;
}

.copyright {
  text-align: center;
  font-size: 0.9rem;
  color: #adb5bd;
  padding-top: 1rem;
  border-top: 1px solid #495057;
}

/* CTA Section */
.cta-section {
  text-align: center;
  margin: 2rem 0;
}

/* Important Notes */
.important-notes {
  margin: 1.5rem 0;
}

/* Detail Sections */
.detail-section {
  margin: 2rem 0;
}

.detail-section h4 {
  margin-bottom: 1rem;
  color: #495057;
  border-bottom: 2px solid #007bff;
  padding-bottom: 0.5rem;
}

/* Subsection Title */
.subsection-title {
  font-size: 1.2rem;
  margin: 2rem 0 1rem 0;
  color: #495057;
  border-left: 4px solid #007bff;
  padding-left: 1rem;
}

/* Accommodation Section */
.accommodation-section {
  margin: 2rem 0;
}

/* Cancellation Section */
.cancellation-section {
  margin: 2rem 0;
}

/* Transportation Rates */
.transportation-rates {
  margin: 2rem 0;
}

.rate-section {
  margin: 1.5rem 0;
}

.rate-section h5 {
  margin-bottom: 1rem;
  color: #495057;
  font-size: 1.1rem;
}

/* Rental Info */
.rental-info {
  margin: 1.5rem 0;
  padding: 1rem;
  background: #e3f2fd;
  border-radius: 6px;
  border-left: 4px solid #2196f3;
}

/* Insurance List */
.insurance-list {
  margin: 1rem 0;
}

.insurance-item {
  display: flex;
  margin-bottom: 0.5rem;
  gap: 0.5rem;
}

.insurance-type {
  font-weight: 600;
  min-width: 120px;
}

.insurance-amount {
  flex: 1;
}

/* Compensation List */
.compensation-list {
  margin: 1.5rem 0;
}

.compensation-item {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  margin-bottom: 1rem;
  padding: 1rem;
  background: #f8f9fa;
  border-radius: 6px;
}

.compensation-type {
  font-weight: 600;
  color: #495057;
}

.compensation-detail {
  font-size: 0.9rem;
  color: #6c757d;
}

/* Other Area Info */
.other-area-info {
  margin: 1.5rem 0;
  padding: 1rem;
  background: #fff3cd;
  border-radius: 6px;
  border-left: 4px solid #ffc107;
}