@import url(common.css);
@import url(css/antena.css);

body {
  font-family: "Lato", "Noto Sans JP", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

/*
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

共通

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
*/
section {
  max-width: 700px;
  margin: 0 auto 5em;
}
/* .body-first-section,
.yagi-section,
.design-section,
.bs-section,
.another-antena-section,
.booster-section {
  padding-bottom: 5em;
} */

/*
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

セクション1

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
*/
section:nth-of-type(1) a img {
  max-width: 690px;
  margin: 0 auto 1em;
}

/* アンテナメイン画像4列2段 */
section .main-photo {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  padding-bottom: 0.5em;
}

/*
アンテナ他ページリンク
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
section:nth-of-type(1) .antena-link {
  margin: 1.5em auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5em;
}
section:nth-of-type(1) .antena-link a {
  flex-basis: 48%;
  margin-bottom: 0.5em;
}

/* ----------------------------
金額一覧テーブル
---------------------------- */
/* ※セクション跨いでも.table_blockの中のtable内は共通 */
.table_block table {
  width: 100%;
  border-collapse: collapse;
}
.table_block table th,
.table_block table td {
  border: 1px solid #8b8b8b;
  padding: 0.5em;
}
.table_block table th {
  background-color: rgb(0, 141, 212);
  color: #fff;
  padding: 0.5em;
}
/* 工事種類 */
.th-work {
  width: 30%;
}

/* 工事価格 */
.th-price {
  width: 20%;
}
.table_block table {
  margin-bottom: 0.5em;
}

.table_block table td sup {
  font-size: 10px;
  padding-left: 0.5em;
  color: rgb(230, 1, 1);
}
.table_block table td p {
  font-size: clamp(15px, 3.52vw, 15px);
}
/* 新規・取替chips
---------------------------- */
.table_block table .chips_new {
  display: block;
  max-width: 50px;
  background-color: #0000a0;
  color: #fff;
  padding: 0.2em 0.4em;
  text-align: center;
}
.table_block table .chips_change {
  display: block;
  max-width: 50px;
  background-color: rgb(206, 0, 0);
  color: #fff;
  padding: 0.2em 0.4em;
  text-align: center;
}
/* 補足事項の小さめテキスト
---------------------------- */
.table_block table td .red_minitext {
  display: block;
  font-size: clamp(13px, 3.52vw, 13px);
  color: rgb(230, 1, 1);
  padding-top: 0.5em;
}
/* 金額ブロック
---------------------------- */
.table_block table .price_block .large {
  color: #363636;
  font-size: clamp(18px, 3.52vw, 24px);
  font-weight: 600;
}