/* =============================================
   PCC THEME - 50転職 LP Styles
   50転職ランディングページ固有スタイル
   ============================================= */

body { background: #ecf0ff; }

/* HERO */
.pcc-hero { background: #fff; height: 740px; position: relative; overflow: hidden; width: 100%; }
.pcc-hero-bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; pointer-events: none; }
.pcc-hero-bg img { position: absolute; height: 117.21%; left: -3.52%; top: -8.55%; width: 110%; max-width: none; object-fit: cover; }
.pcc-hero-photo { position: absolute; right: 0; top: 36px; width: 55%; height: 115%; overflow: hidden; }
.pcc-hero-photo img { width: 100%; height: 100%; object-fit: cover; }
.pcc-hero-logo { position: absolute; left: 6%; top: 8%; width: 42%; display: flex; flex-direction: column; gap: 16px; }
.pcc-hero-logo img.group1 { width: 100%; height: auto; max-width: none; position: static; }
.pcc-hero-logo img.group2 { width: 88%; height: auto; max-width: none; position: static; }

/* CONTENT SECTIONS (image-based) */
.pcc-section-img { position: relative; width: 100%; overflow: hidden; }
.pcc-section-img img { width: 100%; height: auto; object-fit: cover; display: block; }

/* RESPONSIVE - 50転職 */
@media (max-width: 768px) {
  .pcc-hero { height: 280px; }
  .pcc-hero-logo { width: 58%; left: 4%; top: 18%; }
  .pcc-hero-logo img.group1 { max-width: 100%; }
  .pcc-hero-photo { width: 48%; top: 8%; }
  .pcc-section-img img { width: 100%; height: auto; }
}
@media (max-width: 480px) {
  .pcc-hero { height: 240px; }
  .pcc-hero-logo { width: 60%; left: 3%; top: 16%; }
  .pcc-hero-photo { width: 50%; top: 5%; }
}