/*
Theme Name: FastLoad
Theme URI: 
Author: NinjaScript
Description: 超軽量・高速・シンプルなWordPressテーマ
Version: 1.1
   トップページにサムネイル＋タイトルリスト表示対応
License: GNU General Public License v2 or later
Text Domain: fastload
*/

html { box-sizing: border-box; }
*, *:before, *:after { box-sizing: inherit; }
body {
  margin: 0; padding: 0;
  font-family: system-ui, sans-serif;
  background: #fff; color: #222;
  line-height: 1.6;
}
a { color: #007acc; text-decoration: none; }
a:hover { text-decoration: underline; }
header, footer, main { width: 100%; max-width: 800px; margin: 0 auto; }
img { max-width: 100%; height: auto; display: block; }
@media (max-width: 600px) {
  header, footer, main { padding: 0 1em; }
}
a img {
  display: inline-block;
  vertical-align: middle;
}
ul img, ol img {
  display: inline-block;
  vertical-align: middle;
}
article h1,
section h1,
nav h1,
aside h1 {
  font-size: 2em; /* お好みのサイズに調整 */
}
.site-title {
  margin-bottom: 1em;
}
.site-description {
  color: #666;
  font-size: 1rem;
  margin-top: 0.3em;
  display: block;
}
.footer-widgets {
  display: flex;
  gap: 2%;
  margin-bottom: 1em;
}
.footer-widget-area {
  flex: 1;
  min-width: 200px;
}
@media (max-width: 600px) {
  .footer-widgets {
    flex-direction: column;
    gap: 1em;
  }
}
.video-poster {
  z-index: 1;
}
video {
  position: relative;
  z-index: 2;
}
/* 記事本文の横幅を最適化 */
main article {
    max-width: 700px; /* 800pxより狭くし、理想的な行長に近づける */
    margin: 0 auto;
}
/* テーブルのモバイル対応 */
table {
    display: block; /* テーブルをブロック要素化 */
    overflow-x: auto; /* はみ出した場合に横スクロール可能にする */
    white-space: nowrap; /* テーブルの内容が詰まりすぎないようにする */
}

/* ★★★ 記事リスト（トップページ用）ver1.1 ★★★ */
.post-list { max-width: 800px; margin: 2rem auto; }
.post-item { display: flex; gap: 1.5rem; padding: 1.5rem 0; border-bottom: 1px solid #eee; }
.post-thumbnail { flex-shrink: 0; }
.post-thumb { width: 120px; height: 80px; object-fit: cover; border-radius: 4px; }
.post-content { flex: 1; }
.post-title { margin: 0 0 0.5rem 0; font-size: 1.3em; }
.post-title a { color: #007acc; text-decoration: none; }
.post-title a:hover { text-decoration: underline; }
.post-meta { font-size: 0.85em; color: #666; margin-bottom: 0.5rem; }
.post-excerpt { margin: 0; color: #555; line-height: 1.5; }
@media (max-width: 600px) {
  .post-item { flex-direction: column; }
  .post-thumb { width: 100%; height: 200px; }
}

/* ★★★ 動画基本レスポンシブ（Gutenberg・汎用対応）ver1.1 ★★★ */
.entry-content video,
.entry-content iframe,
.wp-block-embed iframe,
.wp-embedded-content {
  max-width: 100% !important;
  width: 100%;
  height: auto;
}

/* スマホ横スクロール完全解消 ver1.1 */
@media (max-width: 600px) {
  .entry-content video,
  .entry-content iframe {
    max-width: 100vw;
    margin-left: calc(-50vw + 50%);
  }
}

/* ★★★ PC・スマホ共通 動画画面端ピッタリ（!importantなし）ver1.1 ★★★ */
.video-container {
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
}

/*ver1.1*/
.video-container video {
  width: 100%;
  max-width: 100%;
  height: auto;
}

/* PC: main 700px内に収まる ver1.1*/
@media (min-width: 601px) {
  .video-container {
    max-width: 700px;
    margin: 0 auto;
  }
}

/* スマホ: 画面端ピッタリ ver1.1*/
@media (max-width: 600px) {
  .video-container {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    padding-left: 0;
    padding-right: 0;
  }
}