@charset "utf-8";


/* セクション全体の余白と背景 */
.club-section {
	padding: 20px 0;
	background-color: var(--color-beg3);
}
.club-section .cinner {
	position: relative;
}
.club-section .cinner .club-bird {
	position: absolute;
	top: -80px;
	right: 0;
	padding-right: var(--sp-20);
}

/* 見出し画像 */
.club-section h3 {
	margin-bottom: 50px;
	width: 100%;
}

.club-section h3 img {
	width: min(46%, 480px);
	display: block;
}

/* --- グリッドレイアウト（PC版：3カラム） --- */
.club-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 50px 30px;
}

.club-card {
	display: flex;
	flex-direction: column;
}

.club-card figure {
	margin: 0 0 20px 0;
}
.club-card figure img {
	width: 100%;
	border-radius: 10px;
	object-fit: cover;
}

.club-card .body h4 {
	font-weight: var(--fw-bold);
	border-bottom: 1px solid var(--color-bk);
	padding: 0 0 4px 0;
	margin: 0 0 4px 0;
}

.club-card .body p {
	line-height: 1.4;
	text-align: justify;
}



.sns_area {
	background: var(--color-beg5);
	border-top: 1px solid var(--color-bk);
	border-bottom: 1px solid var(--color-bk);
	padding: 40px;
	margin: 60px 0;
}

.sns_area h3 {
	font-size: var(--fz-20);
	font-weight: var(--fw-bold);
	margin-bottom: 20px;
}
.sns_area h3 img {
	width: 55px;
}

.sns_area ul {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 40px;
}

.sns_area li {
	width: 100%;
}





.year-section {
	padding: 20px 40px 40px 40px;
	background-color: var(--color-beg3);
}

.year-section h3 {
	font-size: var(--fz-24);
	font-weight: var(--fw-bold);
	text-align: center;
	margin-bottom: 20px;
}

.year-section .year-container {
	background: var(--color-wh);
	border-radius: 15px;
	overflow: hidden;
	display: flex;
	align-items: stretch;
}

.year-section .year-photo {
	width: 40%;
}

.year-section .year-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.year-section .year-list-wrapper {
	width: 60%;
	padding: 40px;
	display: flex;
	align-items: grid;
	grid-template-columns: repeat(2, 1fr); /* PCは2列 */
	gap: 20px;
}

.year-section ul {
	flex: 1;
}

.year-section ul li {
	display: flex;
	align-items: center;
	gap: 15px;
	margin-bottom: 10px;
}

/* 月の丸印 */
.year-section .month {
	flex-shrink: 0;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: var(--fz-16);
	font-weight: var(--fw-bold);
}
.year-section .month span {
	font-size: var(--fz-12);
}

.year-section ul p {
	font-size: var(--fz-16);
	font-weight: var(--fw-bold);
	padding-bottom: 0;
	line-height: 1.4;
}

/* --- 月ごとの色分け（画像の色味に合わせる） --- */
.m04, .m05, .m06 { background: #FFEFC1; } /* 春：黄色系 */
.m07, .m08, .m09 { background: #FFE4D9; } /* 夏：オレンジ系 */
.m10, .m11 { background: #D3E0C3; }       /* 秋：緑系 */
.m12, .m01, .m02, .m03 { background: #D8E8F0; } /* 冬：青系 */



/* 外側のカラー背景 */
/* .event-outer {
		padding: 15px;
		border-radius: 25px;
		display: flex;
} */

/* 内側の白いプレート */
/* .event-inner {
		background-color: #ffffff;
		padding: 20px;
		border-radius: 20px;
		width: 100%;
		box-shadow: 0 4px 10px rgba(0,0,0,0.03);
} */

/* 背景色の指定（画像準拠） */
/* .bg-yellow { background-color: #fff9e6; }
.bg-green  { background-color: #f0f7ed; }
.bg-blue   { background-color: #f0f9ff; } */

/* 月数字の装飾（太字・下線） */
/* .month-num {
		font-size: 3rem;
		font-weight: 800;
		color: #4a4a4a;
		border-bottom: 3px solid #eee;
		padding-bottom: 2px;
}

.event-list li {
		font-weight: bold;
		color: #333;
		margin-bottom: 5px;
		list-style: none;
} */

/* 写真のスタイリング */
/* .event-photos {
		display: flex;
		gap: 8px;
		margin-top: 15px;
}
.event-photos img {
		width: 50%;
		aspect-ratio: 4/3;
		object-fit: cover;
		border-radius: 10px;
} */

/* レスポンシブ */
/* .event-grid {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 25px;
} */






.school-events {
	background: #FFEEC1;
	padding: 64px 0 40px;
	margin: 100px 0 0 0;
}

/* .school-events__inner {
	width: min(1120px, calc(100% - 40px));
	margin: 0 auto;
} */

.school-events h3 {
	margin: 0 0 40px;
	text-align: center;
	font-size: var(--fz-24);
	font-weight: var(--fw-bold);
}



.school-events .event-area__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
	align-items: stretch;
}
.school-events .mblock {
	display: flex;
	flex-direction: column;
}
.school-events .mblock header {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 12px;
	margin-bottom: -20px;
	z-index: 1;
}

.school-events .mblock .month {
	position: relative;
	bottom: -10px;
}

.school-events .mblock .month .num img {
	width: auto;
	height: 44px;
}

.school-events .mblock .month .ja {
	font-size: var(--fz-15);
	font-weight: var(--fw-bold);
}

.school-events .mblock .month .en {
	font-size: var(--fz-16);
	font-weight: var(--fw-medium);
	margin-left: 10px;
}

.school-events .mblock figure {
	width: 58px;
	flex: 0 0 58px;
	margin: 0;
}

.school-events .event-card {
	background: var(--color-wh);
	border-radius: 14px;
	padding: 20px;
	flex: 1;
	display: flex;
	flex-direction: column;
}

.school-events h4 {
	position: relative;
	margin: 0 0 16px;
	font-size: var(--fz-16);
	font-weight: var(--fw-bold);
}

.school-events h4::before {
	content: "● ";
	color: var(--color-org);
}

.school-events .event-card p {
	font-size: var(--fz-16);
	font-weight: var(--fw-medium);
	line-height: 1.8;
	margin: 0
}

.school-events  .event-card figure {
	margin: auto 0 0 0;
	width: 100%;
}







.school-events-sub {
	margin: 0 0 100px;
}

.school-events-sub .event-area__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-items: stretch;
}

.school-events-sub .mblock--november,
.school-events-sub .mblock--march {
}

.school-events-sub .mblock--november {
	background: #D3DFC4;
	padding-top: 40px;
}

.school-events-sub .mblock--march {
	background: #D8E6F0;
	padding-top: 40px;
}

/* 左右それぞれの中身だけ、school-events の内幅に合わせる */
.school-events-sub .mblock {
	display: flex;
	flex-direction: column;
	min-width: 0;
	padding-top: 0;
	padding-bottom: 48px;
	width: 100%;
	max-width: calc((var(--base-width) * 1px) / 2 + 20px);
}

/* 左側は左に余白を残して右へ寄せる */
.school-events-sub .mblock--november .mblock {
	margin-left: auto;
	padding-left: var(--sp-20);
	padding-right: var(--sp-20);
}

/* 右側は右に余白を残して左へ寄せる */
.school-events-sub .mblock--march .mblock {
	margin-right: auto;
	padding-right: var(--sp-20);
	padding-left: var(--sp-20);
}

.school-events-sub .mblock header {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 12px;
	margin-bottom: -20px;
}

.school-events-sub .mblock .month {
	position: relative;
	bottom: -10px;
}

.school-events-sub .mblock .month .num img {
	width: auto;
	height: 44px;
}

.school-events-sub .mblock .month .ja {
	font-size: var(--fz-15);
	font-weight: var(--fw-bold);
}

.school-events-sub .mblock .month .en {
	font-size: var(--fz-16);
	font-weight: var(--fw-medium);
	margin-left: 10px;
}

.school-events-sub .mblock header figure {
	width: 58px;
	flex: 0 0 58px;
	margin: 0;
	z-index: 1;
}

.school-events-sub .event-card {
	background: var(--color-wh);
	border-radius: 14px;
	padding: 20px;
	flex: 1;
	display: flex;
	flex-direction: column;
}

.school-events-sub h4 {
	position: relative;
	margin: 0 0 16px;
	font-size: var(--fz-16);
	font-weight: var(--fw-bold);
}

.school-events-sub h4::before {
	content: "● ";
	color: var(--color-org);
}

.school-events-sub .event-card p {
	font-size: var(--fz-16);
	font-weight: var(--fw-medium);
	line-height: 1.8;
	margin: 0;
}

.school-events-sub .event-card figure {
	margin: auto 0 0 0;
	width: 100%;
}
.school-events-sub .mblock--march .event-card figure {
	margin: auto 0 0 0;
	width: 50%;
}





.library {
	width: 100%;
	overflow: hidden;
}

.library img {
	width: 100%;
	height: 260px;
	object-fit: cover;
	object-position: center;
	display: block;
}

.senior-section {
	background: var(--color-beg3);
	padding: 60px 0 80px;
}
.junior-section {
	background: var(--color-org);
	padding: 60px 0 80px;
}

.senior-section .cinner {
	display: flex;
	gap: 48px;
	align-items: flex-start;
	position: relative;
	background: url(../../images/campuslife/interviewbg.webp) no-repeat top right 20px/40% auto;
}

.junior-section .cinner {
	display: flex;
	gap: 48px;
	align-items: flex-start;
	position: relative;
}
.senior-section aside,
.junior-section aside {
	flex: 0 0 30%;
	width: 200px;
	padding-top: 4px;
}
.junior-section aside {
	order: 2;
}
.junior-section aside .label {
	text-align: right;
}

.senior-section aside .label img,
.junior-section aside .label img {
	width: 135px;
}

.senior-section aside h3,
.junior-section aside h3 {
	font-size: var(--fz-32);
	font-weight: var(--fw-bold);
	line-height: 1.5;
	color: var(--color-org);
	margin-bottom: 60px;
	border-bottom: 1px solid var(--color-bk);
	padding-bottom: 5px;
}

.senior-section aside h3 span,
.junior-section aside h3 span {
	font-size: var(--fz-18);
	margin-bottom: 4px;
}

.senior-section aside .lead,
.junior-section aside .lead {
	font-size: var(--fz-18);
	font-weight: var(--fw-bold);
	line-height: 1.7;
	color: var(--color-org);
	margin-bottom: 10px;
}

.senior-section aside .body,
.junior-section aside .body {
	font-size: var(--fz-16);
	line-height: 1.85;
	color: var(--color-org);
}
.junior-section aside h3,
.junior-section aside .lead,
.junior-section aside .body {
	color: var(--color-wh);
}

.senior-section main,
.junior-section main {
	flex: 1;
	min-width: 0;
	position: relative;
	padding-top: 100px;
}
.junior-section main {
	order: 1;
	padding-top: 0;
}

.senior-section main ul,
.junior-section main ul {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px 16px;
}

.senior-section main ul li a,
.junior-section main ul li a {
	display: flex;
	flex-direction: column;
	gap: 6px;
	color: var(--color-bk);
	text-decoration: none;
	text-align: center;
}

.senior-section main ul li a:hover .thumb img,
.junior-section main ul li a:hover .thumb img {
	transform: scale(1.04);
}


.senior-section .thumb,
.junior-section .thumb {
	width: 100%;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border-radius: 4px;
	margin-bottom: 2px;
}

.senior-section .thumb img,
.junior-section .thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.3s ease;
}


.senior-section .special {
	font-size: var(--fz-16);
	font-weight: var(--fw-bold);
	line-height: 1.4;
	padding-bottom: 0;
}


.senior-section h4,
.junior-section h4 {
	font-size: var(--fz-16);
	font-weight: var(--fw-bold);
	line-height: 1.6;
	color: var(--color-org);
}
.junior-section h4 {
	color: var(--color-wh);
}
.senior-section h4::before,
.junior-section h4::before {
	content: '\201C'; /* " */
	font-size: var(--fz-16);
	color: var(--color-bk);
}

.senior-section h4::after,
.junior-section h4::after {
	content: '\201D'; /* " */
	font-size: var(--fz-16);
	color: var(--color-bk);
}

.senior-section .dept,
.junior-section .dept {
	font-size: var(--fz-16);
	font-weight: var(--fw-medium);
	line-height: 1.5;
	padding-bottom: 0;
}

.senior-section .name,
.junior-section .name {
	font-size: var(--fz-16);
	font-weight: var(--fw-medium);
	line-height: 1.5;
	padding-bottom: 0;
}








/* ============================================================
	 在校生インタビュー詳細ページ CSS
	 /campuslife/story/junior001/
	 campuslife.css に追記、または別ファイルで読み込み

	 サイト変数（style.css :root より）
	 --color-bk    : #3E3E3E
	 --color-wh    : #fff
	 --color-org   : #ED8000
	 --color-beg3  : #F2F0EA
	 --color-beg4  : #f6f4f0
	 --color-beg5  : #f3ebe3
	 --fw-bold     : 700
	 --fw-black    : 900
	 --fz-**       : clamp() レスポンシブfont-size
	 --sp-**       : clamp() レスポンシブspacing
	 ブレイクポイント : 769px
	 ============================================================ */


/* ============================================================
	 パンくず
	 ============================================================ */
.jd-pagetitle {
	padding-top: 24px;
	padding-bottom: 8px;
}

.jd-pagetitle p {
	font-size: var(--fz-13);
	color: var(--color-bk);
	margin: 0;
}

.jd-pagetitle a {
	color: var(--color-org);
	text-decoration: none;
}

.jd-pagetitle a:hover {
	text-decoration: underline;
}


/* ============================================================
	 ラッパー
	 ============================================================ */
.jd-wrap {
	padding-bottom: var(--sp-80);
}


/* ============================================================
	 ヘッダー（Interview02ラベル＋カテゴリ＋名前）
	 ============================================================ */
.jd-head {
	display: flex;
	align-items: flex-end;
	gap: 24px;
	padding-top: 32px;
	padding-bottom: 32px;
	border-bottom: 2px solid var(--color-bk);
	margin-bottom: 0;
}

.jd-head__label img {
	display: block;
	width: auto;
	height: auto;
	max-width: 140px;
}

.jd-head__info {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

/* 「年齢も立場も様々 在校生」 */
.jd-head__category {
	font-size: var(--fz-14);
	font-weight: var(--fw-bold);
	color: var(--color-bk);
	margin: 0;
	line-height: 1.4;
}

.jd-head__category span {
	font-size: var(--fz-13);
	font-weight: var(--fw-regular);
	display: block;
	color: var(--color-bk);
}

.jd-head__dept {
	font-size: var(--fz-14);
	color: var(--color-bk);
	margin: 0;
	line-height: 1.4;
}

.jd-head__name {
	font-size: var(--fz-20);
	font-weight: var(--fw-bold);
	color: var(--color-bk);
	margin: 0;
	line-height: 1.3;
}


/* ============================================================
	 キービジュアル
	 ============================================================ */
.jd-kv {
	position: relative;
	background: var(--color-beg4);
	margin-bottom: 56px;
}

.jd-kv__img {
	margin: 0;
	width: 100%;
	max-height: 560px;
	overflow: hidden;
}

.jd-kv__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
	display: block;
}

/* 吹き出し（キャッチコピー） */
.jd-kv__balloon {
	position: absolute;
	top: 32px;
	left: 50%;
	transform: translateX(-50%);
	background: var(--color-wh);
	border-radius: 6px;
	padding: 16px 32px;
	z-index: 1;
	white-space: nowrap;
	box-shadow: 0 2px 8px rgba(0,0,0,0.12);
}

.jd-kv__balloon::after {
	content: '';
	position: absolute;
	bottom: -10px;
	left: 50%;
	transform: translateX(-50%);
	border-style: solid;
	border-width: 10px 8px 0;
	border-color: var(--color-wh) transparent transparent;
}

.jd-kv__balloon p {
	font-size: var(--fz-24);
	font-weight: var(--fw-bold);
	color: var(--color-bk);
	margin: 0;
	line-height: 1.4;
}


/* ============================================================
	 記事本文エリア
	 ============================================================ */
.jd-article {
	max-width: calc(800px + var(--sp-20) * 2);
}


/* ============================================================
	 リード（プロフィール＋導入文）
	 ============================================================ */
.jd-lead {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 32px;
	margin-bottom: 56px;
	padding-bottom: 48px;
	border-bottom: 1px solid var(--color-beg1, #E3E0D9);
}

.jd-lead__profile {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 6px 16px;
	align-content: start;
	margin: 0;
	padding: 20px 24px;
	background: var(--color-beg4);
	border-radius: 8px;
	min-width: 220px;
}

.jd-lead__profile dt {
	font-size: var(--fz-13);
	font-weight: var(--fw-bold);
	color: var(--color-org);
	white-space: nowrap;
	line-height: 1.7;
}

.jd-lead__profile dt::after {
	content: '：';
}

.jd-lead__profile dd {
	font-size: var(--fz-13);
	color: var(--color-bk);
	line-height: 1.7;
	margin: 0;
}

.jd-lead__text {
	align-self: center;
}

.jd-lead__text p {
	font-size: var(--fz-15);
	line-height: 1.9;
	color: var(--color-bk);
	margin: 0;
	text-align: justify;
}


/* ============================================================
	 Q&Aリスト
	 ============================================================ */
.jd-qalist {
	display: flex;
	flex-direction: column;
	gap: 40px;
	margin-bottom: 48px;
}

/* Q（h3） */
.jd-qa__q {
	font-size: var(--fz-16);
	font-weight: var(--fw-bold);
	color: var(--color-bk);
	background: var(--color-beg3);
	border-left: 4px solid var(--color-org);
	padding: 12px 16px;
	margin: 0 0 0;
	line-height: 1.6;
}

/* A */
.jd-qa__a {
	padding: 16px 0 0;
}

.jd-qa__a p {
	font-size: var(--fz-16);
	line-height: 1.9;
	color: var(--color-bk);
	margin: 0;
	text-align: justify;
}

.jd-qa__a p + p {
	margin-top: 16px;
}

/* A 内の画像 */
.jd-qa__img {
	margin: 24px 0 0;
}

.jd-qa__img img {
	width: 100%;
	border-radius: 6px;
	display: block;
}

.jd-qa__img figcaption {
	font-size: var(--fz-13);
	color: var(--color-gray);
	margin-top: 6px;
	text-align: center;
}


/* ============================================================
	 日付
	 ============================================================ */
.jd-date {
	font-size: var(--fz-13);
	color: var(--color-gray);
	text-align: right;
	margin: 0;
	padding-top: 24px;
	border-top: 1px solid var(--color-beg1, #E3E0D9);
}


/* ============================================================
	 前後ナビ
	 ============================================================ */
.jd-pager {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 16px;
	padding: 40px 0;
	border-top: 1px solid var(--color-bk);
	border-bottom: 1px solid var(--color-bk);
	margin: 0 auto 0;
}

/* 前・次 共通 */
.jd-pager__prev,
.jd-pager__next {
	display: flex;
	flex-direction: column;
	gap: 4px;
	text-decoration: none;
	color: var(--color-bk);
	transition: color 0.2s;
}

.jd-pager__prev:hover,
.jd-pager__next:hover {
	color: var(--color-org);
}

.jd-pager__prev {
	align-items: flex-start;
}

.jd-pager__next {
	align-items: flex-end;
}

.jd-pager__arrow {
	font-size: var(--fz-18);
	color: var(--color-org);
	line-height: 1;
}

.jd-pager__label {
	font-size: var(--fz-12);
	color: var(--color-gray);
	line-height: 1.3;
}

.jd-pager__name {
	font-size: var(--fz-14);
	font-weight: var(--fw-bold);
	line-height: 1.4;
}

/* 一覧へ */
.jd-pager__index {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 10px 20px;
	background: var(--color-bk);
	color: var(--color-wh);
	font-size: var(--fz-14);
	font-weight: var(--fw-bold);
	border-radius: 4px;
	text-decoration: none;
	white-space: nowrap;
	transition: background 0.2s;
}

.jd-pager__index:hover {
	background: var(--color-org);
	color: var(--color-wh);
}








/* /////////////////////////// */
/* /////////////////////////// */
/* /////////////////////////// */
/* スマホ用 */
@media (max-width:769px) {



	.club-section {
		padding: 50px 0;
		margin-top: 100px;
	}
	
	.club-section .cinner .club-bird {
		top: -3%;
		width: 40%;
	}
	.club-section .cinner .club-bird img {
	}
	.club-section h3 {
			margin-bottom: 30px;
	}
	
	.club-section h3 img {
		max-width: 80%; /* スマホでは少し小さめに */
		width: 60%;
	}
	
	.club-grid {
			grid-template-columns: 1fr; /* 1列に固定 */
			gap: 40px;
	}
	
	.club-card .body h4 {
			font-size: 17px;
	}
	
	.club-card .body p {
			font-size: 14px;
	}


	.sns_area {
		padding: 40px 20px;
	}
	
	.sns_area h3 {
		font-size: var(--fz-20);
		font-weight: var(--fw-bold);
		margin-bottom: 20px;
	}
	.sns_area h3 {
		display: flex;
		line-height: 1.4;
	}
	.sns_area h3 img {
		width: 55px;
		margin-right: 10px;
	}
	
	.sns_area ul {
		display: flex;
		flex-direction: column;
		gap: 20px;
	}





	.year-container {
		flex-direction: column;
	}
	.year-section .year-photo,
	.year-section .year-list-wrapper {
		width: 100%;
		flex-direction: column;
		gap: 0;
	}
	.year-section .year-list {
		grid-template-columns: 1fr; /* スマホは1列 */
	}
	.year-section .year-list-wrapper {
		padding: 30px 20px;
	}


	.school-events .event-area__grid {
		grid-template-columns: 1fr;
	}



	.school-events-sub .event-area__grid {
		grid-template-columns: 1fr;
	}

	.school-events-sub .mblock {
		max-width: none;
		padding-left: var(--sp-20);
		padding-right: var(--sp-20);
		padding-bottom: 32px;
	}

	.school-events-sub .mblock--november .mblock,
	.school-events-sub .mblock--march .mblock {
		margin-left: 0;
		margin-right: 0;
		padding-left: var(--sp-20);
		padding-right: var(--sp-20);
	}



	.library img {
		height: 180px;
	}
	
	.senior-section,
	.junior-section {
		padding: 40px 0 60px;
	}
	
	.senior-section .cinner,
	.junior-section .cinner {
		flex-direction: column;
		gap: 28px;
	}
	
	.senior-section aside,
	.junior-section aside {
		flex: none;
		width: 100%;
	}
	.senior-section aside h3,
	.junior-section aside h3 {
		display: inline-block;
		padding-right: 40px;
	}
	
	.senior-section main ul li a,
	.junior-section main ul li a {
		text-align: left;
	}
	
	.junior-section aside .label {
		text-align: left;
		padding-left: 60px;
	}
	.senior-section main {
		padding-top: 0px;
	}
	.senior-section main ul,
	.junior-section main ul {
		grid-template-columns: repeat(2, 1fr);
		gap: 16px 12px;
	}
	.junior-section aside {
		order: 1;
	}
	.junior-section main {
		order: 2;
	}




	/* ヘッダー */
	.jd-head {
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
		padding-top: 20px;
		padding-bottom: 20px;
	}
	
	.jd-head__label img {
		max-width: 110px;
	}
	
	.jd-head__name {
		font-size: var(--fz-18);
	}
	
	/* KV 吹き出し */
	.jd-kv {
		margin-bottom: 36px;
	}
	
	.jd-kv__balloon {
		position: static;
		transform: none;
		border-radius: 0;
		padding: 14px 20px;
		box-shadow: none;
		white-space: normal;
	}
	
	.jd-kv__balloon::after {
		display: none;
	}
	
	.jd-kv__balloon p {
		font-size: var(--fz-18);
		text-align: center;
	}
	
	.jd-kv__img {
		max-height: 280px;
	}
	
	/* リード：縦積み */
	.jd-lead {
		grid-template-columns: 1fr;
		gap: 20px;
		margin-bottom: 36px;
		padding-bottom: 32px;
	}
	
	.jd-lead__profile {
		min-width: auto;
		width: 100%;
	}
	
	/* Q&A */
	.jd-qalist {
		gap: 28px;
		margin-bottom: 36px;
	}
	
	.jd-qa__q {
		font-size: var(--fz-15);
	}
	
	/* 前後ナビ：SP縦並び */
	.jd-pager {
		grid-template-columns: 1fr 1fr;
		grid-template-rows: auto auto;
		gap: 12px;
		padding: 28px 0;
	}
	
	.jd-pager__prev {
		grid-column: 1;
		grid-row: 1;
	}
	
	.jd-pager__next {
		grid-column: 2;
		grid-row: 1;
	}
	
	.jd-pager__index {
		grid-column: 1 / 3;
		grid-row: 2;
		width: 100%;
	}





}



