@charset "utf-8";
body {
	background-image: url("../image/common/back-02.png");
	background-position: right;
	background-size: contain;
	background-repeat: repeat-y;
}
/* ======================================================
   業務内容セクション（section--service）　
   ====================================================== */

.service--list {
  margin: 50px auto;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 100px;
  row-gap: 50px;
  align-items: start;
  list-style-type: none;
}
.service--image img {
  max-width: 100%; /* 画像の幅を親要素に合わせる */
  height: auto; /* 高さは自動で調整 */
}
.service--description dt {
  font-size: var(--font-m);
  font-weight: bold;
  padding: 10px 5px;
  border-bottom: 1px solid var(--gray-3);
}
.service--description dd {
  padding: 5px;
}
/* -------------------------
   レスポンシブ
   ------------------------- */
/* パソコン */
@media (min-width: 1280px) { /* PC ＋ iPad Pro 横（1280px〜） */
}
@media (min-width: 1280px) and (max-height: 800px) { /* ノートPC（1366×768 など高さが低いPC） */
}
/* タブレット */
@media (max-width: 1024px) { /* タブレット以下のサイズ */
}
@media (min-width: 768px) and (max-width: 1279px) { /* タブレット（768〜1279px） */
}
/* スマホ  */
@media (max-width: 767px) { /* スマホ以下のサイズ */
	  .service--list {
    grid-template-columns: 1fr;
  }
}
@media (min-width: 401px) and (max-width: 767px) { /* スマホ Ｌ（401〜767px） */
}
@media (max-width: 400px) { /* スマホ S（〜400px） */
}
/* ======================================================
   施工実績セクション（section--work）　
   ====================================================== */

.work--box a:not(:first-of-type) {
  display: none;
}
/* 施工実績リスト（PC基準） */
.work--list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr)); /* PC：4カラム */
  gap: 24px 24px; /* 行・列の余白 */
  list-style: none;
  margin: 0;
  padding: 0;
}

.work--box {
  /* 必要ならカード風に */
  /* background: #f8f8f8; */
  /* padding: 16px; */
  /* border-radius: 4px; */
}

.work--image img {
  width: 100%;
  height: auto;
  display: block;
}
/* -------------------------
   レスポンシブ
   ------------------------- */
/* パソコン */
@media (min-width: 1280px) {/* PC ＋ iPad Pro 横（1280px〜） */ }
@media (min-width: 1280px) and (max-height: 800px) {/* ノートPC（1366×768 など高さが低いPC） */ }

/* タブレット */
/* タブレット以下のサイズ：3カラムにする */
@media (max-width: 1024px) {
  .work--list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* タブレット（768〜1279px） */
/* 必要ならここで微調整（フォントサイズなど） */
@media (min-width: 768px) and (max-width: 1279px) {}

/* スマホ  */
/* スマホ以下のサイズ：2カラム */
@media (max-width: 767px) {
  .work--list {
    grid-template-columns: 1fr; /* 一列表示 */
  }
}

/* スマホ Ｌ（401〜767px） */
@media (min-width: 401px) and (max-width: 767px) {/* 必要なら微調整 */}

@media (max-width: 400px) {/* スマホ S（〜400px） */
}

