@charset "UTF-8";

/* ====================================================
   プロフィール 共通スタイル
   ==================================================== */

/* ====================================================
   プロフィールA 専用（写真センター・グレーボックスオーバーラップ）
   ※ プロフィールBを使う場合はこのセクション全体をコメントアウト
   ====================================================

.prof-img {
	display: flex; margin: 0 auto;
	width: 350px; height: 350px; object-fit: cover; }
.top-section-body-wrap.prof01 {
	margin-top: -160px; padding-top: 180px;
	padding-left: 4em; padding-right: 4em; padding-bottom: 3em;
	background: #f2f2f2; border: none; border-radius: 0px; }
.prof-body { padding-top: 0; }

.prof-name {
	font-size: 3em; font-weight: 900 !important; color: #003f88;
	text-align: center !important; line-height: 1.4em; margin-top: 0em; margin-bottom: 0em; }
.prof-name-kana {
	font-size: 1em; font-weight: 700 !important; color: #003f88;
	letter-spacing: .2em; text-align: center; margin-bottom: 1em; }

@media (max-width: 768px) {
	.prof-img { width: 200px; height: 200px; }
	.top-section-body-wrap.prof01 {
		margin-top: -100px; padding-top: 100px;
		padding-left: 1.5em; padding-right: 1.5em; padding-bottom: 2em; }
	.prof-name { font-size: 2.2em; margin-top: 10px; }
}

*/

/* ====================================================
   プロフィールB 専用（グレーボックス内・キャッチ＋画像左テキスト右）
   ※ プロフィールAを使う場合はこのセクション全体をコメントアウト
   ====================================================

.prof-elements { display: flex; justify-content: space-between; padding-top: 15px; padding-bottom: 20px; }
.prof-element-left { width: 40%; }
.prof-element-right { width: 60%;}
.prof-element-left ul, .prof-element-right p { margin-top: 0px; }
@media all and (max-width: 768px) {
	.prof-elements { display: block; padding-bottom: 0px; }
	.prof-element-left,.prof-element-right { width: 100% }
	}
.prof-body { background: #f2f2f2; border: none; border-radius: 0;
	padding-left: 4em; padding-right: 4em; padding-top: 3em; padding-bottom: 4em; }
@media screen and (max-width: 768px) {
	.prof-body { padding-left: 1em; padding-right: 1em; padding-top: 1em; padding-bottom: 1.5em; }
	}
.prof-intoro { font-weight: 500; border-bottom: 3px solid #003f88; padding-bottom:.5em; margin-bottom: 2em;
	text-align: justify; }
.prof-name { font-size: 2em; font-weight: 900; margin-top: 0em; margin-bottom: 5px; }
.prof-name-kana { font-size: .9em; letter-spacing: .2em; text-align: left; margin-bottom: 1em; }
@media (max-width: 768px) {
	.prof-name { font-size: 1.8em; text-align: center; margin-top: 10px; }
	.prof-name-kana { text-align: center; }
	}

*/

/* ====================================================
   プロフィールHana 専用（profile-bのコピー・今後こちらを編集）
   ==================================================== */

.prof-elements { display: flex; justify-content: space-between; padding-top: 15px; padding-bottom: 20px; }
.prof-element-left { width: 40%; }
.prof-element-right { width: 60%;}
.prof-element-left ul, .prof-element-right p { margin-top: 0px; }
@media all and (max-width: 768px) {
	.prof-elements { display: block; padding-bottom: 0px; }
	.prof-element-left,.prof-element-right { width: 100% }
	}
.prof-body { background: #fff; border: none; border-radius: 20px;
	padding-left: 4em; padding-right: 4em; padding-top: 3em; padding-bottom: 4em; }
@media screen and (max-width: 768px) {
	.prof-body { padding-left: 1em; padding-right: 1em; padding-top: 1em; padding-bottom: 1.5em; }
	}
.prof-intoro { font-weight: 500; border-bottom: 3px solid #003f88; padding-bottom:.5em; margin-bottom: 2em;
	text-align: justify; }
.prof-name { font-size: 2em; font-weight: 900; margin-top: 0em; margin-bottom: 5px; }
.prof-name-kana { font-size: .9em; letter-spacing: .2em; text-align: left; margin-bottom: 1em; }
@media (max-width: 768px) {
	.prof-name { font-size: 1.8em; text-align: center; margin-top: 10px; }
	.prof-name-kana { text-align: center; }
	}

/* ====================================================
   prof-main-img（プロフィール画像）
   ==================================================== */

.prof-main-img-wrap {
	text-align: center;
}
.prof-main-img {
	width: 80%;
}

@media (max-width: 768px) {
	.prof-main-img { width: 100%; }
}

/* ====================================================
   prof-qa（プロフィールQ&A）
   ==================================================== */

.prof-qa {
	margin-top: 2.5em;
}

.prof-qa-item {
	padding: 1.4em 0 1.4em 0;
	border-bottom: 1px solid #e0e0e0;
}
.prof-qa-item:first-child {
	border-top: 1px solid #e0e0e0;
}

.prof-qa-q {
	display: flex;
	align-items: baseline;
	gap: .6em;
	font-size: 1.15em;
	font-weight: 700;
	color: #003f88;
	margin: 0 0 .6em 0;
}

.prof-qa-num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 1.6em;
	height: 1.6em;
	background: #ffc000;
	color: #fff;
	font-size: .85em;
	font-weight: 900;
	font-family: "Fraunces", sans-serif;
	border-radius: 50%;
	line-height: 1;
}

.prof-qa-a {
	margin: 0;
	padding-left: 2.2em;
	font-size: 1em;
	color: #333;
	text-align: justify;
}

@media (max-width: 768px) {
	.prof-qa-item { padding: 1.2em 0; }
	.prof-qa-q { font-size: 1.05em; }
	.prof-qa-a { padding-left: 2em; font-size: 1em; line-height: 1.5em; }
}

/* ====================================================
   media-container 共通（A・Bどちらでも使用）
   ==================================================== */

.media-container { display: flex; gap: 20px; margin-bottom: 10px; align-items: flex-start; }
.image-area { flex-shrink: 0; }
.image-area img { width: 100%; height: 100%; min-height: 300px; object-fit: cover; border: 1px solid #ccc; }
.text-area { flex: 1; }

@media (max-width: 768px) {
	.media-container { flex-direction: column; }
}

/* ====================================================
   プロフィールリスト（共通）
   ==================================================== */

.profile-list { margin-top: 2em; margin-bottom: 1em; }
.profile-item { display: grid; grid-template-columns: 8em 1fr; gap: 20px; margin-bottom: .25em; }
.profile-title { font-weight: 700; }
@media (max-width: 768px) {
	.profile-list { margin-top: 0; margin-bottom: 2em; }
	.profile-item { grid-template-columns: 1fr; gap: 0; margin-bottom: .5em; }
	.profile-title { font-size: 1em; }
	.profile-text { font-size: 1em; }
}

/* ---- 経歴のアコーディオン -------------------- */

.accordion__list_prof .qah2-2 {
	font-size: 1.2em; font-weight: 700; text-align: left; padding-left: .3em; padding-right: 2em;
	margin-top: 0em !important; margin-bottom: .75em; color: #003f88; }
.accordion__list_prof .accordion__head { border-top: 2px solid #003f88; }
.accordion__list_prof .accordion__head::after {
	font-family: "FontAwesome"; content: "\f107"; position: absolute; top: 17px; right: 10px; font-size: 1.4em !important;
	color: #003f88; }
.accordion__list_prof .accordion__item.active .accordion__head::after {
	font-family: "FontAwesome"; content: "\f106"; right: 10px; font-size: 1.4em; }
.accordion__list_prof .accordion__item-last { border-bottom: 2px solid #003f88 !important; }
.accordion__list_prof .accordion__body p { font-size: 1em; margin-top: 0; }
.accordion__list_prof .accordion__item.active .accordion__body { padding-left: .5em; }
.accordion__list_prof .accordion__body ul { margin-top: 0; padding-left: 0; padding-right: 0; }
.accordion__list_prof .accordion__body ul li { margin-top: 0; margin-left: 0; }
.accordion__list_prof .accordion__body .card-container { display: flex; flex-wrap: wrap; justify-content: left;
	padding-left: 0px; margin-bottom: 0px; }
.accordion__list_prof .accordion__body .card-container .card-img { width: 30%; }
.accordion__list_prof .accordion__body .card-container .card-text { width: 67%; margin-left: 1em; text-align: justify; }
.accordion__list_prof .accordion__body .card-container .card-img img { width: 100%; height: auto !important;
	aspect-ratio: 1/1; }

@media (max-width: 768px) {
	.accordion__list_prof { margin-top: 1em; margin-bottom: 2em; padding-top: 0; }
	.accordion__list_prof .qah2-2 { font-size: 1em; font-weight: 700; color: #003f88;
		text-align: left; padding-left: .3em; padding-right: 2em; margin-top: 0em !important; margin-bottom: .6em; }
	.accordion__list_prof .accordion__head::after { position: absolute; font-family: "FontAwesome"; content: "\f107";
		top: 11px; right: 10px; font-size: 1em !important; color: #003f88; }
	.accordion__list_prof .accordion__item.active .accordion__head::after { font-family: "FontAwesome"; content: "\f106";
		top: 11px; right: 10px; font-size: 1em !important; color: #003f88; }
	.accordion__list_prof .accordion__body { margin-bottom: 0 !important; }
	.accordion__list_prof .accordion__body .card-container { display: block; }
	.accordion__list_prof .accordion__body .card-container .card-img { width: 100%; }
	.accordion__list_prof .accordion__body .card-container .card-img img { margin-bottom: 1em; }
	.accordion__list_prof .accordion__body .card-container .card-text { width: 100%; margin-left: 0; text-align: justify; }
}

.profile-history-caption {
	margin-top: 10px !important; margin-bottom: 10px !important; font-size: .9em !important; line-height: 1.4em;
	width: 100%; word-break: break-all; overflow-wrap: break-word; white-space: normal;
}

/* ====================================================
   ミニギャラリー（共通）
   ==================================================== */

.close-button { -webkit-tap-highlight-color: transparent; }

.photo-container {
	display: flex; flex-wrap: wrap; justify-content: center;
	gap: 1.2%; list-style: none; padding-left: 0;
	margin-top: 60px; margin-bottom: 0;
}

.photo-card-container { width: 24%; padding-bottom: 0.5%; }

.photo-card-container img {
	width: 100%; border: 1px solid #ccc;
	object-fit: cover; aspect-ratio: 1/1; cursor: pointer;
}

.image-wrapper { position: relative; }

.mushimegane {
	position: absolute; bottom: 7px; right: 0;
	background: #003f88; width: 30px; height: 30px;
	display: flex; justify-content: center; align-items: center; cursor: pointer;
}

.fa-solid.fa-magnifying-glass {
	font-size: .9em; color: #ffffff; background: #003f88; padding: 3px;
}

@media screen and (max-width: 768px) {
	.photo-container { margin-top: 30px; }
}

/* ---- ライトボックス -------------------- */

.lightbox {
	position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;
	background: rgba(0, 0, 0, 0.85);
	display: flex; justify-content: center; align-items: center;
	z-index: 9999; opacity: 0; pointer-events: none; transition: opacity 0.4s ease;
}

.lightbox.active { opacity: 1; pointer-events: auto; }

.lightbox-content { position: relative; display: block; max-width: 90%; z-index: 10000; }

.polaroid-frame {
	background: #ffffff; padding: 15px;
	box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
	display: flex; flex-direction: column; align-items: center;
	width: fit-content; margin: 0 auto;
	transform: scale(0.85); transition: transform 0.4s ease;
}

.lightbox.active .polaroid-frame { transform: scale(1.0); }

#lightbox-image {
	display: block; width: auto; max-width: 100%; max-height: 75vh; height: auto;
}

.lightbox-caption {
	margin-top: 10px; margin-bottom: 0; font-size: .9em; line-height: 1.4em;
	width: 100%; word-break: break-all; overflow-wrap: break-word; white-space: normal;
}

.close-button {
	display: none; position: absolute;
	top: calc(100% + 10px); left: calc(50% - 20px);
	font-size: 32px; color: white; background: #003f88;
	width: 40px; height: 40px; line-height: 36px;
	text-align: center; cursor: pointer; user-select: none; padding: 0;
}
@media screen and (max-width: 768px) {
	.close-button { left: 45%; }
}

.lightbox.active .close-button { display: block; }