.blog-wrap{max-width:960px;margin:auto;padding:36px 20px}.blog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}.blog-card{border:1px solid #ddd;padding:20px;background:white}.blog-card img{aspect-ratio:4/3;object-fit:cover;margin-bottom:16px}.blog-body{white-space:pre-wrap;overflow-wrap:anywhere}.blog-photo{margin:24px 0;max-height:900px;object-fit:contain}.blog-form label{display:block;font-weight:bold;margin:20px 0 8px}.blog-form input,.blog-form textarea{display:block;width:100%;font:inherit;padding:12px;border:1px solid #aaa}.blog-form textarea{min-height:240px}.blog-form input[type=checkbox]{width:auto;display:inline}.notice{padding:16px;background:#fff0f1;border-left:4px solid #ce182b;margin:20px 0}.blog-form button{margin-top:20px}.blog-admin-list{border-top:1px solid #ddd;padding:18px 0}.blog-nav{display:flex;flex-wrap:wrap;gap:20px;margin-bottom:32px}@media(max-width:600px){.blog-grid{grid-template-columns:1fr}}
.blog-form .photo-select{padding:12px;border:1px solid #ddd;margin:12px 0}.blog-form .photo-select img{max-width:220px;margin:10px 0}

/* 記事内の動画：縦横比を保って画面内に収めます。 */
.blog-wrap .blog-video {
  display: block;
  box-sizing: border-box;
  width: auto;
  height: auto;
  max-width: 100%;
  max-width: min(100%, 640px);
  max-height: 400px;
  max-height: min(60vh, 400px);
  object-fit: contain;
  background: #111;
  margin: 24px auto;
}

@supports (height: 1svh) {
  .blog-wrap .blog-video {
    max-height: min(60svh, 400px);
  }
}

@media (max-width: 600px) {
  .blog-wrap .blog-video {
    max-height: 320px;
    max-height: min(50vh, 320px);
  }

  @supports (height: 1svh) {
    .blog-wrap .blog-video {
      max-height: min(50svh, 320px);
    }
  }
}

/* 動画プレーヤーの全画面ボタンはこれまでどおり使えます。 */
.blog-wrap .blog-video:fullscreen {
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  margin: 0;
}

.blog-wrap .blog-video:-webkit-full-screen {
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  margin: 0;
}
.video-label{padding:48px 20px;background:#17191d;color:white;text-align:center;font-weight:bold}
.blog-article-new{display:inline-block;margin-right:.65rem;color:#ce182b;font:700 12px/1.2 Arial,Helvetica,sans-serif;letter-spacing:.04em;vertical-align:middle;white-space:nowrap}
.blog-card h2,.blog-wrap article h1{overflow-wrap:anywhere}
