/* ============================================================
   company.html - page-specific stylesheet
   PC-first / breakpoints: 1200px, 960px, 568px
============================================================ */

/* ------------------------------------------------------------
   Profile (会社概要)
------------------------------------------------------------ */
.profile { padding: 160px 0; background: var(--c_white); }
.profile_inner { max-width: 896px; }
.profile_label { margin-bottom: 32px; }
.profile_table { border-top: 1px solid var(--c_accent); }
.profile_row {
  display: flex;
  flex-wrap: wrap;
  gap: 32px;
  padding: 24px 0;
  border-bottom: 1px solid var(--c_border);
}
.profile_row dt { flex: 0 0 168px; font-size: 13px; letter-spacing: 0.15em; color: var(--c_label); }
.profile_row dd { flex: 1 1 400px; letter-spacing: 0.02em; color: var(--c_dark); margin: 0; }

@media (max-width: 1200px) {
  .profile { padding: 120px 0; }
}
@media (max-width: 960px) {
  .profile_row dt { flex-basis: 100%; }
}
@media (max-width: 568px) {
  .profile { padding: 80px 0; }
  .profile_row { gap: 8px; padding: 20px 0; }
}

/* ------------------------------------------------------------
   CEO Message
------------------------------------------------------------ */
.ceo_message { padding: 160px 0; background: var(--c_white); }
.ceo_message_inner {
  display: flex;
  gap: 96px;
  align-items: flex-start;
}
.ceo_message_media { width: 528px; flex-shrink: 0; overflow: hidden; }
.ceo_message_media img { width: 100%; height: 704px; object-fit: cover; }
.ceo_message_body { flex: 1; min-width: 0; padding-top: 32px; }
.ceo_message_heading {
  font-size: 36px;
  font-weight: 500;
  color: var(--c_accent);
  letter-spacing: 0.03em;
  line-height: 1.15;
  margin: 0 0 32px;
}
.ceo_message_text { display: flex; flex-direction: column; gap: 24px; margin: 0 0 32px; }
.ceo_message_text p { letter-spacing: 0.04em; margin: 0; }
.ceo_message_profile { border-top: 1px solid var(--c_border); padding-top: 33px; }
.ceo_message_role { color: var(--c_text_strong); margin: 0 0 4px; }
.ceo_message_name { font-size: 20px; font-weight: 500; color: var(--c_black); letter-spacing: 0.03em; margin: 0; }

@media (max-width: 1200px) {
  .ceo_message { padding: 120px 0; }
  .ceo_message_inner { gap: 56px; }
  .ceo_message_media { width: 420px; }
  .ceo_message_media img { height: 560px; }
}
@media (max-width: 960px) {
  .ceo_message_inner { flex-direction: column; }
  .ceo_message_media { width: 100%; }
  .ceo_message_media img { height: 70vw; max-height: 480px; }
  .ceo_message_body { padding-top: 40px; width: 100%; }
}
@media (max-width: 568px) {
  .ceo_message { padding: 80px 0; }
  .ceo_message_heading { font-size: 26px; }
}

/* ------------------------------------------------------------
   Office
------------------------------------------------------------ */
.office { padding: 160px 0; background: var(--c_bg_alt); }
.office_head { text-align: center; margin-bottom: 112px; }
.office_head .section_label { text-align: center; margin-bottom: 16px; }
.office_heading {
  font-size: 48px;
  font-weight: 500;
  color: var(--c_accent);
  letter-spacing: 0.02em;
  text-align: center;
  margin: 0;
}
.office_grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;
}
.office_media { width: 100%; aspect-ratio: 560 / 420; overflow: hidden; }
.office_media img { width: 100%; height: 100%; object-fit: cover; }

@media (max-width: 1200px) {
  .office { padding: 120px 0; }
  .office_head { margin-bottom: 88px; }
}
@media (max-width: 960px) {
  .office_grid { grid-template-columns: 1fr; gap: 24px; }
}
@media (max-width: 568px) {
  .office { padding: 80px 0; }
  .office_head { margin-bottom: 56px; }
  .office_heading { font-size: 36px; }
}

/* ------------------------------------------------------------
   Access (Tokyo main office + Osaka branch)
------------------------------------------------------------ */
.access { padding: 160px 0; background: var(--c_white); }
.access_head { text-align: center; margin-bottom: 96px; }
.access_head .section_label { text-align: center; margin-bottom: 16px; }
.access_heading {
  font-size: 48px;
  font-weight: 500;
  color: var(--c_accent);
  letter-spacing: 0.02em;
  text-align: center;
  margin: 0;
}

.access_locations { display: flex; flex-direction: column; gap: 96px; }
.access_location_label { font-size: 14px; letter-spacing: 0.2em; color: var(--c_label); margin: 0 0 8px; }
.access_location_name {
  font-size: 30px;
  font-weight: 500;
  color: var(--c_accent);
  letter-spacing: 0.02em;
  margin: 0 0 24px;
}

.access_inner {
  display: flex;
  gap: 64px;
  align-items: flex-start;
}
.access_body { flex: 1 1 400px; min-width: 0; }
.access_address { color: var(--c_text_strong); line-height: 2; margin: 0 0 16px; }
.access_directions { color: var(--c_text); line-height: 2; margin: 0; }
.access_map {
  flex: 1 1 400px;
  background: #efeeec;
  aspect-ratio: 544 / 306;
  overflow: hidden;
}
.access_map iframe { width: 100%; height: 100%; }

@media (max-width: 1200px) {
  .access { padding: 120px 0; }
  .access_head { margin-bottom: 72px; }
  .access_locations { gap: 72px; }
  .access_inner { gap: 40px; }
}
@media (max-width: 960px) {
  .access_head { margin-bottom: 56px; }
  .access_inner { flex-direction: column; }
  .access_body,
  .access_map { width: 100%; flex-basis: auto; }
}
@media (max-width: 568px) {
  .access { padding: 80px 0; }
  .access_heading { font-size: 36px; }
  .access_location_name { font-size: 24px; }
  .access_locations { gap: 56px; }
}