/* ===============================
基本レイアウト設定
=============================== */
body {
  background: #FFF;
  font-size: 1rem;
  line-height: 1.6;
  font-family: "メイリオ", Meiryo, "MS PGothic", "Hiragino Kaku Gothic Pro", Arial, sans-serif;
  color: #252525;
  padding: 0;
  text-align: left;
  overflow-x: hidden;
  margin: 0 auto;
}

.l-wrap {
  width: 1000px;
  margin: 0 auto;
  display: block;
}

/* ===============================
PC レイアウト 769px~
=============================== */
@media (min-width: 769px) {
  .column-300A,
  .sidebar-box {
    width: 300px;
    float: right;
  }

  .f1-table-wrapper {
    overflow-x: visible;
  }

  .f1-table2025 {
    min-width: unset;
  }
}

/* ===============================
中間レイアウト 941px-1323px
=============================== */
@media (min-width: 941px) and (max-width: 1005px) {
  html, body, .l-wrap {
    width: 100%;
    padding: 0 9px;
    box-sizing: border-box;
  }

  .column-680,
  .column-680-2023,
  .column-300A,
  .sidebar-box {
    width: 100%;
    float: none;
    margin: 0;
  }

  img,
  iframe,
  .f1-table2025 {
    max-width: 100%;
    height: auto;
  }

  p {
    word-break: break-word;
    overflow-wrap: break-word;
  }
}

/* ===============================
スマホ/タブレット 768px以下
=============================== */
@media (max-width: 768px) {
  html, body, .l-wrap {
    width: 100%;
    box-sizing: border-box;
    overflow-x: auto;
  }

  body {
    font-size: 1rem !important;
  }

  .column-680,
  .column-680-2023,
  .column-300A,
  .sidebar-box {
    width: 100%;
    float: none;
    margin: 0;
  }

  p, img, iframe {
    word-break: break-word;
    overflow-wrap: break-word;
    max-width: 100%;
    height: auto;
  }

  .hide-mobile {
    display: none !important;
  }
}

/* ===============================
テーブル統一設定
=============================== */
.entry-content table,
.entry-content table th,
.entry-content table td,
.entry-content table span.label-main,
.entry-content table span.label-sub {
  font-size: 1rem;
  line-height: 1.6;
}

/* ===============================
テーブルスタイル
=============================== */
.f1-table2025,
.indy-table2025 {
  display: table;
  width: 100%;
  border-collapse: collapse;
  table-layout: auto;
  word-break: break-word;
  overflow-wrap: break-word;
  border: none;
}

.f1-table2025 th, .f1-table2025 td,
.indy-table2025 th, .indy-table2025 td {
  padding: 9px;
  border-bottom: 1px solid #e0e0e0;
	position: relative;
}

.f1-table2025 th, .indy-table2025 thead th {
  background-color: #000;
  color: #fff;
}

.indy-table2025 .th-sub,
.indy-table2025 td span.label-main,
.indy-table2025 td span.label-sub {
  display: block;
}

.indy-table2025 .th-sub {
  font-size: 1rem;
  color: #ccc;
}

.indy-table2025 td span.label-main {
  font-weight: bold;
}

.indy-table2025 td span.label-sub {
  font-size: 1rem;
  color: #666;
}

/* テーブル上部カーブエッジ */
.f1-table2025 thead tr:first-child th:first-child,
.indy-table2025 thead tr:first-child th:first-child {
  border-top-left-radius: 12px;
}

.f1-table2025 thead tr:first-child th:last-child,
.indy-table2025 thead tr:first-child th:last-child {
  border-top-right-radius: 12px;
}

/* 小さい画面のテーブル調整 */
@media (max-width: 768px) {
  .f1-table2025 th,
  .f1-table2025 td,
  .indy-table2025 th,
  .indy-table2025 td {
    padding: 9px;
		font-size: 0.8rem;
		position: relative;
  }

  .indy-table2025 th {
    font-size: 0.8rem;
    line-height: 1.4;
  }

  .indy-table2025 td {
    font-size: 0.7rem;
    line-height: 1.4;
  }

  .indy-table2025 span.label-main {
    font-size: 0.8rem !important;
  }

  .indy-table2025 span.label-sub {
    font-size: 0.7rem !important;
  }
}

/* ===============================
その他ブロック要素
=============================== */
.sidebar-box iframe,
.sidebar-box ins,
iframe[src*="youtube.com"],
iframe[src*="ads"] {
  max-width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 16/9;
}

.lap-info,
.f1-info-box,
.gp-heading-block,
.team-label,
.ranking-row td {
  box-sizing: border-box;
}

.lap-info {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 10px;
  text-align: center;
  background-color: #f8f8f8;
  padding: 10px;
  border-radius: 5px;
}

@media (max-width: 768px) {
  .lap-info {
    font-size: 14px;
  }
}

.f1-info-box {
  padding: 10px;
  margin-bottom: 10px;
  border-left: 5px solid;
  font-weight: bold;
}

.f1-info-box.red-flag { background-color: #d32f2f; border-color: #b71c1c; color: #fff; }
.f1-info-box.yellow-sc { background-color: #f9a825; border-color: #f57f17; color: #222; }
.f1-info-box.blue-wet { background-color: #0288d1; border-color: #01579b; color: #fff; }
.f1-info-box.default-info { background-color: #eceff1; border-color: #90a4ae; color: #222; }

.team-label {
  border-left: 5px solid transparent;
  position: absolute;
  top: 10%;
  bottom: 10%;
  left: 0;
}

/* 各チームカラーだけここに指定 */
.mclaren { border-left-color: #FF8000; }
.redbull { border-left-color: #000080; }
.mercedes { border-left-color: #27F4D2; }
.racingbulls{ border-left-color: #6692FF; }
.williams { border-left-color: #0000FF; }
.ferrari { border-left-color: #E80020; }
.alpine { border-left-color: #00a1e8; }
.astonmartin { border-left-color: #229971; }
.kicksauber { border-left-color: #52e252; }
.haas { border-left-color: #b6babd; }

/* ▼タイム差2段目のグレー表記 */
.sub-gap {
  color: #666;
  font-size: 0.9em;
	font-weight: normal;
}

/* グランプリッドヘッダー */
.gp-heading-block {
  position: relative;
  padding: 0.6rem 2rem 0.6rem 0.6rem;
  border: .4rem solid #e00400;
  border-radius: 16px;
  background-color: #1e1e1e;
  color: #fff;
  margin-bottom: 1rem;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.gp-heading-main { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; }
.gp-heading-text { display: flex; flex-direction: column; line-height: 1; }
.gp-meta-bar { font-size: 14px; margin-bottom: 6px; }
.gp-title { font-weight: bold; font-size: 1.6em; margin-bottom: 4px; }
.gp-title-en { font-size: 14px; color: #ccc; line-height: 1.4; white-space: normal; word-break: break-word; }
.gp-flag-box { position: absolute; top: 0.6rem; right: 0.6rem; z-index: 1; }
.flag-img { width: 60px; height: auto; border-radius: 8px; border: 1px solid #ccc; }

@media (max-width: 768px) {
  .gp-heading-text { padding-right: 80px; }
}

@media (max-width: 480px) {
  .gp-title { font-size: 1.2em; }
  .gp-title-en { font-size: 12px; }
  .flag-img { width: 50px; }
}

@media screen and (max-width: 941px) {
  .sidebar-box {
    display: none; /* スマホ画面で非表示にする */
  }
}

/* points */
.pts {
  font-size: 1.5em;
  font-weight: 900;
}

/* ===============================
テーブル：ポイント
=============================== */
.car-info-cell {
  align-items: center;
}

.car-number {
  width: 20px;
  text-align: center;
	white-space: nowrap;
}

.driver-line {
  display: flex;
  align-items: flex-start;
}

.team-label {
  width: 4px;
  flex-shrink: 0;
	white-space: nowrap;
}

.rank-cell, .constructor-cell {
  font-size: 1.2em;
  font-weight: 900;
  vertical-align: middle;
}

.driver-cell {
  vertical-align: middle;
}

.driver-line {
  display: flex;
  align-items: center;
}

.driver-content {
  display: flex;
  flex-direction: column;
}

.driver-first {
  font-size: 1em;
  line-height: 1.2;
  color: #666;
}

.driver-last {
  font-size: 1.3em;
  font-weight: 900;
  line-height: 1.2;
}

.team-name {
  font-size: 0.8em;
  color: #666;
}

.pts-cell {
  vertical-align: middle;
  text-align: right;
}

.gap-cell {
  vertical-align: middle;
  text-align: right;
}

.gap-cell .sub-gap {
  display: block;
  font-size: 0.9em;
  color: #666;
}

.tab-container {
  display: flex;
  width: 100%;
  margin: 10px 0 0; /* 上マージンは維持 */
}

.tab-link {
  flex: 1;
  text-align: center;
  font-size: 18px;
  font-weight: bold;
  line-height: 50px;
  height: 50px;
  background: #e10600;
  color: #fff;
  text-decoration: none;
  opacity: 0.7;
  /* 下ボーダーを追加して、下の線と揃える */
  border-bottom: 2px solid #e10600; /* 選択時の色と同じ */
}

.drivers-tab {
  border-radius: 9px 0 0 0;
}

.constructors-tab {
  border-radius: 0 9px 0 0;
  border-left: 1px solid #D9D9D9;
}

.tab-container > a:target {
  height: 60px;
  line-height: 60px;
  opacity: 1;
  /* 下ボーダーを太くして強調 */
  border-bottom: 4px solid #e10600;
  /* 上マージンを調整して縦に伸びるように見せる */
  margin-top: -10px;
  padding-top: 10px;
}

.tab-container > a:not(:target) {
  background-color: #D9D9D9;
  color: #333;
  border-bottom: 2px solid #D9D9D9; /* 非選択時はグレーのボーダー */
}

/* ランキングの見出しのmargin-topを調整してタブと揃える */
h2 {
  margin-top: 0;
  padding-top: 10px; /* 必要に応じて調整 */
}