/* 比較用ページ(index-photo.html / pattern-b-photo.html)専用。
   写真枠(.photo-ph)を見本イラストの <img> に置き換えたときの表示調整 */
.sample-img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  padding: 0;
  border: none;
  background: none;
}
/* B案ヒーローは背景として全面に敷く。人物は右側にいるので右寄せで切り抜く */
.b-hero__photo.sample-img { height: 100%; object-position: right center; }
/* お客様の声は丸く切り抜く。顔が中心に来るよう上寄せ */
.b-voice__photo.sample-img,
.testimonial-card__photo.sample-img { object-position: center 30%; }
.b-voice__photo.sample-img { width: 96px; height: 96px; }
.testimonial-card__photo.sample-img { width: 72px; height: 72px; }

.sample-banner {
  background: #2A7A86;
  color: #FFFFFF;
  font-size: 15px;
  font-weight: 700;
  text-align: center;
  padding: 8px 16px;
  line-height: 1.6;
}
/* A案ヒーローもB案と同じ横長写真(左半分が空いた構図)を使うので、人物のいる右側で切り抜く */
.hero__photo.sample-img { object-position: right center; }