@charset "UTF-8";
/****************************************
 * Service Page — 事業内容
 ****************************************/

/* セクション共通 */
.service-section { padding: clamp(56px, 7vw, 100px) 0; }
.service-section + .service-section { border-top: 1px solid #eee; }


.service-hero__title.en{
font-family: "Poppins", "Zen Kaku Gothic Antique", sans-serif;
    font-weight: 800;
    font-size: clamp(44px, 8vw, 140px);
    letter-spacing: .02em;
    line-height: 1.05;
    color: var(--blue);
    margin: 0 0 clamp(12px, 2vw, 18px);
}

/* リード*/
.service-section__lead {
color: var(--blue);
    font-weight: 800 !important;
    font-size: clamp(22px, 3.2vw, 48px);
    line-height: 1.7;
    letter-spacing: .04em;
    margin-bottom: clamp(8px, 1.6vw, 12px);
    margin-bottom: 40px;
}

.service-section__txt {
  font-size: 1.6rem; font-size: var(--fs-16);
  margin: 40px auto;
      line-height: 1.9;
    letter-spacing: .03em;
}
/* グリッド */
.service-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(18px, 3vw, 28px);
}
@media (max-width: 1024px) {
  .service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .service-grid { grid-template-columns: 1fr; }
}

/* カード */
.service-card {
  display: grid;
  grid-template-rows: auto auto 1fr;
  row-gap: 10px;
  margin-bottom: 40px;
}
.service-card__thumb {
  aspect-ratio: 4 / 3;
  border-radius: 12px;
  overflow: hidden;
  background: #f4f6f8;
}
.service-card__thumb img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.service-card__title {
  font-weight: 700;
   font-size: 2.4rem; font-size: var(--fs-24);
  color: #111;
  line-height: 1.5;
  text-align: center;
}
.service-card__desc {
  font-size: 14px;
  line-height: 1.9;
  color: #444;
  letter-spacing: .02em;
}

/* プロモーションの特集（商工あんない） */
.service-feature {
  grid-column: 1 / -1; /* 1行ぶち抜き */
/*   display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: clamp(16px, 3vw, 28px); */
  align-items: center;
  padding: clamp(12px, 2vw, 16px);
  border-radius: 14px;
  background: #fafafa;
  border: 1px solid #eee;
  margin: 40px auto;
}
.service-feature__area {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(18px, 3vw, 28px);
}
@media (max-width: 768px) {
  .service-feature__area {
    display: inherit;
  }
}
h3.service-feature__title {
    margin: 40px auto;
    font-weight: 700;
     font-size: 2.4rem; font-size: var(--fs-24);
    color: #111;
    line-height: 1.5;
    text-align: center;
}
@media (max-width: 768px) {
.service-feature__right {
  margin: 10px auto;
}
}
.service-feature__thumb {
  aspect-ratio: 16 / 9;
  border-radius: 10px; overflow: hidden; background: #f0f0f0;
}
.service-feature__thumb img { width: 100%; height: 100%; object-fit: cover; display:block; }
.service-feature__title {
  font-size: clamp(18px, 2.4vw, 22px);
  font-weight: 800; color: var(--blue); margin-bottom: 6px;
}
.service-feature__desc { font-size: 14px; line-height: 1.9; color: #444; margin-bottom: 8px; }
.service-feature .link-more { margin-top: 6px; }

@media (max-width: 900px) {
  .service-feature { grid-template-columns: 1fr; }
}

/* セクションごとの軽い差分（必要なら色を変更） */
.service-section--promotion .service-section__heading.en { color: var(--blue); }
.service-section--digital   .service-section__heading.en { color: var(--blue); }
.service-section--print     .service-section__heading.en { color: var(--blue); }

/* 画像のホバー（軽いズーム、任意） */
.service-card__thumb img,
.service-feature__thumb img {
  transition: transform .6s cubic-bezier(.22,.61,.36,1);
}
.service-card__thumb:hover img,
.service-feature__thumb:hover img { transform: scale(1.04); }

/* モーション配慮 */
@media (prefers-reduced-motion: reduce){
  .service-card__thumb img,
  .service-feature__thumb img { transition: none; }
}