.sec-first { margin-top: 88px; }
.aside { margin-top: 24px; font-size: 14px; line-height: 1.9; color: #6E5A4E; }

/* 見本：1つずつ、画面の写真を大きく見せ、その下に説明とボタン */
.sample { margin-top: 160px; }
.sample + .sample { margin-top: 140px; }
/* 見出しは A・B・C の1文字だけ（依頼主の指定）。読み上げでは「見本A」と読ませる */
.sample-no { font-family: 'Geist', sans-serif; font-weight: 600; font-size: 40px; line-height: 1.2; }
.shot { margin: 28px 0 0; aspect-ratio: 16 / 10; border: 1px solid #E2DDD3; overflow: hidden; }
.shot img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top; }
.sample-foot { margin-top: 28px; display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 48px; align-items: end; }
.sample-foot .btn { width: 100%; }

/* 3つに共通していること */
.common li { padding: 22px 0; border-bottom: 1px solid #E2DDD3; }
.common { border-top: 1px solid #E2DDD3; }
.common .name { display: block; font-size: 17px; font-weight: 700; }
.common .note { display: block; margin-top: 4px; color: #6E5A4E; }

@media (max-width: 880px) {
  .sec-first { margin-top: 40px; }
  .sec-first h2 { margin-bottom: 16px; }
  .sample { margin-top: 96px; }
  .sample + .sample { margin-top: 88px; }
  .sample-no { font-size: 32px; }
  .shot { margin-top: 20px; }
  .sample-foot { grid-template-columns: minmax(0, 1fr); gap: 20px; margin-top: 20px; }
  .common li { padding: 18px 0; }
}
