@charset "utf-8";
/*
 * 藤木病院 機能拡張プラグイン フロントCSS
 * 医師紹介 [fujiki_doctor] / 診療科目 [fujiki_course] の表示用。
 * テーマ staff_list.css 相当を .fujiki-doctor-list 配下に内蔵し、テーマ非依存にしている。
 */

/* ============================================================
 * 医師紹介 [fujiki_doctor] — 丸タイプ（代表医師）
 *   施設見出し＋円形写真＋右に本文テーブルのリッチ版
 * ============================================================ */
.fujiki-doctor { margin: 0 0 80px; }
/* テーマのh2スタイル（黒・小さめ）に勝たせるため主要プロパティを !important で固定 */
.fujiki-doctor-title {
	text-align: center !important; color: #6f9ba1 !important; font-size: 34px !important;
	font-weight: bold !important; letter-spacing: .12em; margin: 0 0 34px !important;
	line-height: 1.4 !important; border: none !important; padding: 0 !important;
}
.fujiki-doctor-intro { color: #777; line-height: 2; font-size: 15px; margin: 0 0 44px; }
.fujiki-doctor-cols { display: flex; gap: 5%; align-items: flex-start; }
.fujiki-doctor-left { flex: 0 0 36%; max-width: 36%; text-align: center; }
.fujiki-doctor-photo {
	width: 300px; height: 300px; max-width: 100%; margin: 0 auto 26px;
	border-radius: 50%; overflow: hidden; background: #f0f0f0;
}
/* テーマの「img{height:auto}」に負けて画像が縮み、円の下に空白が出るのを防ぐため
   height:100% を !important で確実に効かせ、object-fit:cover で円いっぱいに広げる。
   object-position は上基準(center top)。頭/足元の切れ方は 0%(上)〜100%(下) で調整可。 */
.fujiki-doctor-photo img {
	width: 100% !important; height: 100% !important; max-width: none !important;
	object-fit: cover !important; object-position: center top !important; display: block !important;
}
.fujiki-doctor-name { font-size: 24px; font-weight: bold; color: #333; margin: 0 0 8px; letter-spacing: .04em; }
.fujiki-doctor-en { font-size: 15px; font-weight: bold; color: #333; letter-spacing: .12em; margin: 0; }
.fujiki-doctor-right { flex: 1; min-width: 0; }

@media screen and (max-width: 768px) {
	.fujiki-doctor { margin: 0 0 56px; }
	.fujiki-doctor-title { font-size: 24px !important; }
	.fujiki-doctor-cols { flex-direction: column; gap: 24px; }
	.fujiki-doctor-left { flex: 0 0 auto; max-width: 100%; width: 100%; }
	.fujiki-doctor-photo { width: 220px; height: 220px; }
}

/* ============================================================
 * 医師紹介 [fujiki_doctor] — 角タイプ（代表以外・TCD staff_list風）
 * ============================================================ */
.fujiki-doctor-group { margin: 0 0 50px; }
.fujiki-doctor-heading {
	font-size: 22px; font-weight: bold; color: #6f9ba1;
	letter-spacing: .06em; margin: 0 0 24px; padding-bottom: 10px;
	border-bottom: 2px solid #e3edee;
}
/* モバイル：1カラム縦積み（枠付き） */
.fujiki-doctor-list { color: #666; font-size: 14px; line-height: 2; }
.fujiki-doctor-list .pb_staff_list-item {
	box-sizing: border-box; border: 1px solid #ddd; border-top: none; padding: 32px 6.66%;
}
.fujiki-doctor-list .pb_staff_list-item:first-child { border-top: 1px solid #ddd; }
.fujiki-doctor-list .pb_staff_list-item > :last-child { margin-bottom: 0; }
.fujiki-doctor-list .pb_staff_list-item-upside.has-image { display: flex; align-items: center; }
.fujiki-doctor-list .pb_staff_list-item-upside.has-image .pb_staff_list-image { width: 48%; }
.fujiki-doctor-list .pb_staff_list-item-upside.has-image .pb_staff_list-image img { display: block; width: 100%; height: auto; }
.fujiki-doctor-list .pb_staff_list-item-upside.has-image .pb_staff_list-names { width: 52%; padding-left: 7.4%; }
.fujiki-doctor-list .pb_staff_list-names { line-height: 1.8; }
.fujiki-doctor-list .pb_staff_list-position { color: #000; font-weight: 500; }
.fujiki-doctor-list .pb_staff_list-name { color: #000; font-size: 18px; line-height: 1.5; font-weight: 500; margin: 0; padding: 0; }
.fujiki-doctor-list .pb_staff_list-othername { font-size: 12px; }
.fujiki-doctor-list .pb_staff_list-item-upside { margin-bottom: 24px; }
.fujiki-doctor-list .pb_staff_list-description { margin-bottom: 20px; }
.fujiki-doctor-list .pb_staff_list-career { font-size: 14px; }

/* 本文（経歴・学歴などの表。HTML許可）＝丸タイプ・角タイプ共通。
   テーマの table/th/td スタイルに勝たせるため背景・色・枠を !important で固定 */
.fujiki-doctor-body table { border-collapse: collapse !important; width: 100%; margin: 18px 0; background: none !important; }
.fujiki-doctor-body th, .fujiki-doctor-body td {
	border: 1px solid #ececec !important; padding: 12px 16px !important; text-align: left; vertical-align: top; line-height: 1.9;
}
.fujiki-doctor-body th { background: #f7f7f7 !important; color: #6f9ba1 !important; font-weight: normal !important; white-space: nowrap; width: 96px; text-align: center !important; }
.fujiki-doctor-body td { background: #fff !important; color: #555 !important; }
.fujiki-doctor-body p { line-height: 1.9; color: #555; margin: 0 0 1em; }

/* PC：横2列のカードグリッド（代表以外） */
@media only screen and (min-width: 768px) {
	.fujiki-doctor-list { display: flex; flex-wrap: wrap; line-height: 2.2; }
	.fujiki-doctor-list .pb_staff_list-item { width: 50%; border: 1px solid #ddd; padding: 44px 3.6%; }
	.fujiki-doctor-list .pb_staff_list-item:nth-child(even) { border-left: none; }
	.fujiki-doctor-list .pb_staff_list-item:nth-child(n+3) { border-top: none; }
	.fujiki-doctor-list .pb_staff_list-item-upside.has-image .pb_staff_list-image { width: 50%; }
	.fujiki-doctor-list .pb_staff_list-item-upside.has-image .pb_staff_list-names { width: 50%; padding-left: 8%; }
	.fujiki-doctor-list .pb_staff_list-name { font-size: 20px; line-height: 1.5; }
	.fujiki-doctor-list .pb_staff_list-item-upside { margin-bottom: 28px; }
	.fujiki-doctor-list .pb_staff_list-description { margin-bottom: 24px; }
	/* 2列カードでは表が窮屈になるため見出し列をやや狭める */
	.fujiki-doctor-list .fujiki-doctor-body th { width: 72px; padding: 10px 10px; }
	.fujiki-doctor-list .fujiki-doctor-body td { padding: 10px 12px; }
}

/* ============================================================
 * 診療科目 [fujiki_course]
 * ============================================================ */
.fujiki-course-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 20px; }
.fujiki-course-list > li { width: calc(33.333% - 14px); box-sizing: border-box; }
.fujiki-course-list > li > a {
	display: block; text-decoration: none; color: inherit;
	border: 1px solid #e5e5e5; border-radius: 4px; overflow: hidden; height: 100%; transition: .3s;
}
.fujiki-course-list > li > a:hover { box-shadow: 0 4px 14px rgba(0, 0, 0, .08); }
.fujiki-course-list .image_area { display: block; line-height: 0; }
.fujiki-course-list .image { width: 100%; height: auto; }
.fujiki-course-list .title { display: block; padding: 14px 16px 0; font-weight: bold; font-size: 17px; }
.fujiki-course-list .excerpt { display: block; padding: 6px 16px 16px; font-size: 14px; color: #666; line-height: 1.7; }

@media screen and (max-width: 768px) {
	.fujiki-course-list > li { width: 100%; }
}