@charset "UTF-8";

/* WordPress版だけの補正
   ------------------------------------------------------------------
   共通のスタイルシートには手を入れず、WordPress特有の事情だけをここで補う。
   デザインの変更は含めない。
   ------------------------------------------------------------------ */

/* JavaScript無効時の表示
   .js-more は CSS で display:none にしているため、JavaScriptが使えない環境では
   View More で開く項目が読めない。html.js が付かないときだけ全件を表示し、
   操作できない View More ボタンを隠す。
   html 要素への .js 付与は inc/enqueue.php の同期スクリプトで行う。 */
:root.no-js #top-page .graduate__list .grad-card.js-more,
:root.no-js #top-page .media__list li.js-more {
	display: block;
}

:root.no-js #top-page .viewmore {
	display: none;
}

/* 同じ理由で、フェードアップも JavaScript が無いときは最初から表示しておく。
   #top-page .js-fade { opacity: 0 } のままだと、JavaScriptが動かないときに
   本文が見えなくなるため。 */
:root.no-js body#top-page .js-fade,
:root.no-js body:not(#top-page) .js-fade {
	opacity: 1;
	transform: none;
	transition: none;
}

/* WordPressが本文へ出力する画像のはみ出し防止。
   今回のTOPでは本文エディターを使わないが、フォールバックテンプレート
   （index.php / 404.php）で the_content() を出力する場合に効かせる。 */
.entry-content img {
	max-width: 100%;
	height: auto;
}

/* スキップリンク。フォーカスされたときだけ表示し、色は既存のボタンに合わせる。 */
.skip-link {
	position: absolute;
	z-index: 10000;
	top: 0;
	left: 0;
	padding: 10px 16px;
	color: #fff;
	font-size: 14px;
	background: #a8233b;
	transform: translateY(-200%);
}

.skip-link:focus {
	transform: translateY(0);
}

/* 研究レポート一覧は、WordPressのページ送りで全件へ到達する。
   静的コーディングデータはSPで5件目以降を隠しているが、同じ16件へ
   到達できる必要があるため、この指定を打ち消す。 */
@media screen and (max-width: 1024px) {
	.p-labs-report .report-grid > li:nth-child(n+5) {
		display: flex;
	}
}

/* 研究レポート詳細の本文。WordPressのブロックが入っても体裁を保つ。 */
.p-labs-report .detail__body.entry-content > * {
	margin-top: 1.5em;
}

.p-labs-report .detail__body.entry-content > *:first-child {
	margin-top: 0;
}

.p-labs-report .detail__body.entry-content h2,
.p-labs-report .detail__body.entry-content h3,
.p-labs-report .detail__body.entry-content h4 {
	margin-top: 2em;
	font-weight: 700;
	line-height: 1.5;
}

.p-labs-report .detail__body.entry-content h2 {
	font-size: 1.5em;
}

.p-labs-report .detail__body.entry-content h3 {
	font-size: 1.25em;
}

.p-labs-report .detail__body.entry-content h4 {
	font-size: 1.1em;
}

.p-labs-report .detail__body.entry-content img {
	max-width: 100%;
	height: auto;
}

.p-labs-report .detail__body.entry-content figure {
	margin-left: 0;
	margin-right: 0;
}

.p-labs-report .detail__body.entry-content figcaption {
	margin-top: 0.5em;
	font-size: 0.875em;
	opacity: 0.8;
}

.p-labs-report .detail__body.entry-content ul,
.p-labs-report .detail__body.entry-content ol {
	padding-left: 1.5em;
	list-style: revert;
}

.p-labs-report .detail__body.entry-content li + li {
	margin-top: 0.5em;
}

.p-labs-report .detail__body.entry-content blockquote {
	padding: 0.75em 1.25em;
	border-left: 3px solid currentColor;
	opacity: 0.9;
}

.p-labs-report .detail__body.entry-content a {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.p-labs-report .detail__body.entry-content table {
	display: block;
	max-width: 100%;
	overflow-x: auto;
	border-collapse: collapse;
}

.p-labs-report .detail__body.entry-content th,
.p-labs-report .detail__body.entry-content td {
	padding: 0.5em 0.75em;
	border: 1px solid rgba(34, 34, 34, 0.2);
}

/* 研究レポート詳細の資料リンク（PDF・関連ページ）。 */
.p-labs-report .detail__links {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin-top: 32px;
}

.p-labs-report .detail__link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* 卒業生カードの画像未設定時 */
#top-page .grad-card__thumb--noimage,
.p-graduate .grad-card__thumb--noimage {
  box-sizing: border-box;
  border: 1px solid var(--c-accent, #a02424);
  background: #fff;
}
#top-page .grad-card__thumb--noimage img,
.p-graduate .grad-card__thumb--noimage img {
  object-fit: contain;
}