@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');


:root {
	--content-max-width: 1325px;
	--content-side-margin-pc: 25px;
	--content-side-margin-sp: 16px;
}

/* Childrens CSS */
body:not(.page-content) #main {
		max-width: none;
		padding: 0;
}

.leadership_team {

	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;

	/* トップページ */
	&.top {
		/* 共通 */
		.orig-container+.orig-container {
				margin-top: 3.125em;

				@media (max-width: 767px) {
						margin-top: 1.375em;
				}
		}

		.hdg-l2 {
				margin: 0;
				padding: 0;
				height: auto;

				@media (max-width: 767px) {
						height: 1.15em;
				}

				svg {
						@media (max-width: 767px) {
								height: 100%;
								width: auto;
						}
				}

		}

		/* 見出し */
		.head {
			background: url(https://d1uzk9o9cg136f.cloudfront.net/f/portal/16777633/rc/2025/09/12/805cfde886539d3ae0cfb333f1218138e1d71ea9.png) no-repeat center center;
			width: 100%;
			background-size: cover;

			@media (max-width: 767px) {
				background: url(https://d1uzk9o9cg136f.cloudfront.net/f/portal/16777633/rc/2025/09/19/43d02fdabca1e3683313d55ea38490e49c725c8b.png) no-repeat center center;
			}
			.orig-container-head {
				max-width: var(--content-max-width);
				width: 100%;
				padding: 0 var(--content-side-margin-pc);
				margin: 0 auto;
				display: flex;
				align-items: center;
				height: 140px;
				@media (max-width: 767px) {
						height: 18.655vw;
						padding: 0 16px;
				}
			}

			.orig-container-head .hdg-l1 {
					width: 272px;
					height: auto;

					@media (max-width: 767px) {
							width: 36.1357%;
					}

					svg {
							width: 100%;
					}
			}
		}

		/* メッセージ */
		.message {
				max-width: var(--content-max-width);
				width: 100%;
				padding: 0 var(--content-side-margin-pc);
				margin: 0 auto;

				@media (max-width: 767px) {
						padding: 0 var(--content-side-margin-sp);
				}



			.l-2col_inner {
					margin: 2em 0 0;
					display: flex;
					align-items: flex-start;
					justify-content: flex-start;
					gap: 0 1.875em;

					@media (max-width: 767px) {
							flex-direction: column-reverse;
							margin: 1.2em 0 0;
							gap: 2em 0;
					}
			}

			.l-2col_inner .l-2col_container-left {

					@media (min-width: 768px) {
							flex: 0 0 405px;
					}
			}

			.l-2col_inner .l-2col_container-right {
					@media (min-width: 768px) {
							flex: 1 1 auto;
					}
			}



			.l-2col_inner .l-2col_container-right .message-about p {
					font-size: 1.25em;
					line-height: 1.6;
					margin: 0;

					@media (max-width: 767px) {
							font-size: 1em;
					}
			}

			.l-2col_inner .l-2col_container-right .message-about p+p {
					margin: 1em 0 0;
			}

			.l-2col_inner .l-2col_container-right .message-about p small {
					font-size: 1.125rem;
					display: block;
					@media (max-width: 767px) {
							font-size: .95em;
					}
			}

			.l-2col_inner .l-2col_container-right .message-about p strong {
					font-size: 1.5rem;
					display: inline-block;
					margin: .2em 0 0;
					font-size: 1.5rem;
					font-weight: normal;

					@media (max-width: 767px) {
							font-size: 1.375em;
					}
			}

			.l-2col_inner .l-2col_container-right .message-about .lead {
					font-size: 1.5rem;
					font-weight: bold;

					@media (max-width: 767px) {
							font-size: 1.125rem;
					}
			}

			.l-2col_inner .l-2col_container-right .message-about .sns {
					margin: 2rem 0 0;

					@media (max-width: 767px) {
							margin: 1em 0 0;
					}
			}

			.l-2col_inner .l-2col_container-right .message-about .sns a {
					display: flex;
					align-items: center;
					justify-content: flex-start;
					text-decoration: none;
					color: #2867b2;
					font-size: 1.5rem;
					gap: 0 .875%;
			}

			.l-2col_inner .l-2col_container-right .message-about .sns a img {
					width: 40px;
			}
		}

		/* 役員一覧 */
		.members {
				background: #000;
				padding: 4.25rem 0;

				@media (max-width: 767px) {
						padding: 1.575rem 0;
				}


				.orig-inner {
						max-width: var(--content-max-width);
						width: 100%;
						padding: 0 var(--content-side-margin-pc);
						margin: 0 auto;
						@media (max-width: 767px) {
							padding: 0 var(--content-side-margin-sp);
						}
				}

				.orig-contents {
						gap: 38px 30px;
						flex-wrap: wrap;
						margin: 2.5em 0 0;
						display: grid;
						grid-template-columns: repeat(3, 1fr);

						@media (max-width: 767px) {
								grid-template-columns: repeat(1, 1fr);
						}
				}

				.members-item {
						display: block;
						cursor: pointer;
						text-decoration: none;
						position: relative;
						color: #fff;


						.members-thum {
								@media (max-width: 767px) {
										flex: 0 0 29.4vw;
								}
						}

						.members-about {
								@media (max-width: 767px) {
										flex: 1 1 auto;
								}
						}


						&[data-col="2"] {
								grid-column: span 2;
						}

						&.hidden {
								display: none;
						}

						&:hover {
								.members-thum {
										filter: saturate(1.1) contrast(1.1) brightness(1.05);
								}
						}

				}

				.members-name {
						display: flex;
						color: #fff;
						align-items: start;
						justify-content: start;
						flex-direction: column;
						font-size: 1.875rem;
						line-height: 1;
						margin: 1em 0 0;
						font-weight: normal;
						@media (max-width: 767px) {
								font-size: 1.125em;
						}
				}

				.members-catchphrase {
						margin: 1.25rem 0 0;
						line-height: 1.4;
				}

				@media (max-width: 767px) {

						.orig-contents {
								gap: 1.25rem 4.424%;
								margin: 1.25rem 0 0;
						}

						.members-item {
								display: flex;
								gap: 0 0.725em;
						}

						.members-name {
								margin: 1.15em 0 0;
						}

						.members-catchphrase {
								font-size: 0.725em;
								margin: 0.575rem 0 0;
								color: #fff;
								line-height: 1.3;
						}
				}

		}
	}

	/* 詳細ページ */
	&.profile {
		background: #000;
		padding: 2.5rem 0;
		

		.orig-container {
			max-width: var(--content-max-width);
			width: 100%;
			padding: 0 var(--content-side-margin-pc);
			margin: 0 auto;
			@media (max-width: 767px) {
				padding: 0 var(--content-side-margin-sp);
			}
		}

		.head {
			display: flex;
			align-items: flex-end;
			justify-content: space-between;
			flex-wrap: wrap;
		}

		.head h1 {
			color: #fff;
			margin: 0;
			display: flex;
			align-items: center;
			justify-content: flex-start;
			line-height: 1.6em;
			width: 100%;
			font-weight: normal;
			@media (max-width: 767px) {
				line-height: 1;
				align-items: center;
			}
		}

		.head h1 span.name-jp {
			font-size: 2.5rem;
			padding-right: 2.5rem;
			border-right: 1px solid #fff;
			margin-right: 2.15rem;
			
			@media (max-width: 767px) {
				font-size: 1.025em;
				padding-right: 1.025em;
				margin-right: 1.05em;
			}
		}

		.head h1 span.name-en {
			font-size: 1.25em;
			@media (max-width: 767px) {
				font-size: 0.65em;
			}
		}

		.detail {
			margin-top: 2.625rem;
		}

		.detail .orig-contents {
			display: grid;
			gap: 32px;
			flex-wrap: wrap;
			display: grid;
			grid-template-columns: 31.84% auto;
			grid-auto-rows: min-content 1fr;
			color: #fff;
			font-size: 1.125em;
			
			@media (max-width: 767px) {
				display: block;
				font-size: 1em;
			}
		}

		.detail .orig-contents .detail-post {
			grid-column: 2 / 3;
			grid-row: 1 / 2;
			border-bottom: 1px solid #FF0000;
			padding: 0 0 2em;
			display: flex;
			align-items: end;
			justify-content: space-between;
			@media (max-width: 767px) {
				border-bottom: none;
				flex-direction:column;
				justify-content: flex-start;
				align-items: flex-start;
				font-size: 1rem;
				padding: 0 0 0.625em;
				
			}
		}

		.detail .orig-contents .detail-sns {
			width: 3.375em;
			max-width: 54px;
			@media (max-width: 767px) {
					width: 40px;margin: 1em 0 0;
			}
		}

		.detail .orig-contents .detail-sns a {
			display: block;
		}

		.detail .orig-contents .detail-sns a:hover {
			opacity: .7;
		}

		.detail .orig-contents .detail-sns a img {
			display: block;
		}

		.detail .orig-contents .detail-photo {
			max-width: 406px;
			width: 100%;
			grid-column: 1 / 2;
			grid-row: 1 / 3;
		}

		.detail .orig-contents .detail-message {
			grid-column: 2 / 3;
			grid-row: 2 / 3;
			@media (max-width: 767px) {
					margin: 1em 0 0;
			}
		}

		.detail .orig-contents .detail-message p + p {
					margin: 1em 0 0;
		}

		.detail .link-back {
					margin: 3.35em 0 0;
					@media (max-width: 767px) {
							margin: 1.25em 0 0;
					}
			}

		.detail .link-back a {
				text-decoration: none;
				font-size: 1.12em;
				@media (max-width: 767px) {
						font-size: 0.875em;
				}
		}

		.detail .link-back a:hover {
				text-decoration: underline;
		}

		.detail .link-back i {
				margin-right: 1em;
		}

	}
}