/* 中部版 CSS Document   */
/* 修正日 20260424       */

/*-----------------------------------*/
/* 共通                              */
/*-----------------------------------*/
/* 当ページで使用しているbreakpointについて  */
/* ～480  ･･･　スマホ　　					*/
/* ～960  ･･･　タブレット					*/
/* 961～  ･･･　ＰＣ　　　					*/


:root {
	/* フォントサイズ */
	--fontsize-p: clamp(1.4rem, calc(1.4rem + 0.2rem * ((100vw - 48rem) / 48rem)), 1.6rem);
	--fontsize-h1: clamp(2.6rem, calc(2.6rem + 1.0rem * ((100vw - 48rem) / 48rem)), 3.6rem);
	--fontsize-h2: clamp(2.2rem, calc(2.2rem + 0.6rem * ((100vw - 48rem) / 48rem)), 2.8rem);
	--fontsize-h3: clamp(1.9rem, calc(1.9rem + 0.5rem * ((100vw - 48rem) / 48rem)), 2.4rem);

	--fontsize-title: clamp(2.4rem, calc(2.4rem + 1.4rem * ((100vw - 48rem) / 48rem)), 3.8rem);
	--fontsize-title-badge: clamp(1.4rem, calc(1.4rem + 0.8rem * ((100vw - 48rem) / 48rem)), 2.2rem);
	--fontsize-title-sub: clamp(1.8rem, calc(1.8rem + 0.8rem * ((100vw - 48rem) / 48rem)), 2.6rem);
	--fontsize-title-min: 2.2rem;
	--fontsize-title-badge-min: 1.6rem;
	--fontsize-title-sub-min: 1.8rem;
	--fontsize-message: clamp(1.4rem, calc(1.4rem + 0.6rem * ((100vw - 48rem) / 48rem)), 2.0rem);
	--fontsize-section-title: clamp(2.1rem, calc(2.1rem + 1.3rem * ((100vw - 38rem) / 38rem)), 3.4rem);
	--fontsize-title-en: clamp(1.2rem, calc(1.2rem + 0.8rem * ((100vw - 58rem) / 58rem)), 2.0rem);

	/* スペースサイズ */
	--space-h1-block: clamp(1.2rem, calc(1.2rem + 0.8rem * ((100vw - 48rem) / 48rem)), 2rem);
	--space-h2-block: clamp(1.0rem, calc(1.0rem + 0.6rem * ((100vw - 48rem) / 48rem)), 1.6rem);
	--space-h3-block: clamp(0.8rem, calc(0.8rem + 0.6rem * ((100vw - 48rem) / 48rem)), 1.4rem);
	--space-intro-title-block: clamp(1.5rem, calc(1.5rem + 1.5rem * ((100vw - 48rem) / 48rem)), 3rem);
	--gap-columns: clamp(0rem, calc(0rem + 2.5rem * ((100vw - 48rem) / 48rem)), 2.5rem);

	/* 色コード */
	--color-base: rgba(255, 255, 255, 1);
	--color-main-light:rgba(30, 93, 190, 1);
	--color-main      :rgba(51, 0, 153, 1);
	--color-main-dark :rgba(18, 60, 136, 1);
	--color-accent: rgba(255, 140, 0, 1);
	--color-accent-vivid: rgba(245, 80, 80, 1);
	--color-text: rgba(77, 81, 86, 1);
	--color-surface: #fff;
	--color-brand: #2175e3;
	--color-brand-weak: #e8f0ff;
	--color-border: rgba(204, 204, 204, 1);

	--elevation-1: 0 6px 20px rgba(0, 0, 0, .06);
	--elevation-2: 0 8px 18px rgba(59, 123, 209, .12);

	--label-bg: #eef6ff;
	--label-fg: #2e6bb8;
	--label-bd: #d9e9ff;

	--title-gold-600: rgba(233, 188, 0, 1);  /* バッジの黄橙（彩度控えめ） */
	--bg-color-blue-light: rgba(230, 240, 255, 1);

	/* バッジ情報 */
	--badge-width: 2.6em;
	/* バッジ幅 */
	--badge-height: 1.6em;
	/* バッジ高さ */
	--badge-gap: 0.8em;
	/* バッヂと本文の間の余白 */
	--badge-indent: 0.8em;
	/* テキストの左余白（u-badge付与時に上書き）*/
	--badge-font: 1em;
	/* バッジ内文字サイズ */

	/* border-radius*/
	--border-radius-l: 15px;
	--border-radius-m: 10px;
	--border-radius-s: 5px;
}

/*********************/
/***** レイアウト *****/
/*********************/
.l-container {
	display: grid;
	grid-template-columns: 275px 1fr;
	max-width: 1152px;
	margin-inline: auto;
	padding-inline: 1em;
}

/* 中部版採用NAVIトップページのサイドバー */
.l-sidebar {
	position: sticky;
	width: 92%;
	top: 0;
	margin: 0 auto;
	margin-block: 64px;
	height: max-content;
}

/* 中部版採用NAVIトップページのメインエリア */
.l-main {
	min-width: 0;
}

.l-main__inner {
	margin-block: 64px;
	margin-left: 5px;
}

@media screen and (max-width: 960px) {
	.l-sidebar {
		display: none;
	}

	.l-container {
		grid-template-columns: 1fr;
	}
}

/************************************/
/***** ベース(style.cssの上書き) *****/
/************************************/
.base p {
	font-size: var(--fontsize-p);
	margin-bottom: 0.8em;
}

.base h1,
.base h2 {
	letter-spacing: 0.1em;
}

.base h1 {
	font-size: var(--fontsize-h1);
	margin-block: var(--space-h1-block);
}

.base h2 {
	font-size: var(--fontsize-h2);
	margin-block: var(--space-h2-block);
}

.base h3 {
	font-size: var(--fontsize-h3);
	margin-block: var(--space-h3-block);
}

.base ul {
	padding-left: 0.5em;
}

/*******************************************/
/***** アコーディオンのスタイル（Q&Aなど）*****/
/*******************************************/
.c-accordion__item {
	width: 95%;
	margin: 0 auto 7px;
	border-bottom: 2px solid #d0d0d0;
	font-size: var(--fontsize-p);
	letter-spacing: 0.01em;
}

/* バッジをつけた場合のテキスト左余白 */
.u-badge {
	--badge-indent: calc(var(--badge-width) + var(--badge-gap));
}

details.c-accordion__item::details-content {
	transition: height 0.4s, opacity 0.4s, content-visibility 0.4s allow-discrete;
	height: 0;
	opacity: 0;
}

details[open].c-accordion__item .c-accordion__icon {
	transform: rotate(180deg);
}

/* interpolate-size が使える環境（height: 0 → auto の補間を許可） */
@supports (interpolate-size: allow-keywords) {
	:root {
		interpolate-size: allow-keywords;
	}

	details[open].c-accordion__item::details-content {
		height: auto;
		opacity: 1;
	}
}

/* interpolate-size が使えない環境（フォールバック：固定高＋スクロール） */
@supports not (interpolate-size: allow-keywords) {
	details[open].c-accordion__item::details-content {
		height: 150px;
		overflow-y: scroll;
		/* 溢れる場合はスクロール可能にする */
		opacity: 1;
	}
}

.c-accordion__summary {
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
	padding: 1em 0.7em 1em var(--badge-indent);
	font-weight: 600;
	cursor: pointer;
}

/* Safari系のデフォルトの三角マーカーを消す */
.c-accordion__summary::-webkit-details-marker {
	display: none;
}

/* 右側の矢印アイコン */
.c-accordion__summary::after {
	content: "";
	display: inline-block;
	width: 20px;
	height: 20px;
	margin-left: 6px;
	flex-shrink: 0;
	background: no-repeat center / 15px 15px url(../asset/arrow.svg);
	transform-origin: center 43%;
	transition: transform 0.4s;
}

details[open] .c-accordion__summary::after {
	transform: rotate(180deg);
}

/* アコーディオンの中身 */
.c-accordion__content {
	display: flex;
	flex-direction: column;
}

/* バッジ：既定はバッジなし */
.c-accordion__summary::before,
.c-accordion__content p::before {
	content: none;
}

/* サマリー前のバッジ */
.c-accordion__summary.u-badge::before {
	content: attr(data-badge);
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: var(--badge-width);
	height: var(--badge-height);
	border-radius: 46%;
	background: #0810e6;
	color: #fff;
	font-weight: 600;
	font-size: var(--badge-font);
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* pタグ前のバッジ */
.c-accordion__content p.u-badge {
	position: relative;
	display: block;
	padding: 0.5em 0.7em 1em var(--badge-indent);
}

.c-accordion__content p.u-badge::before {
	content: attr(data-badge);
	position: absolute;
	left: 0;
	top: 0.5em;
	width: var(--badge-width);
	height: var(--badge-height);
	border-radius: 46%;
	background: #d83605;
	color: #fff;
	font-weight: 600;
	font-size: var(--badge-font);
	display: inline-flex;
	align-items: center;
	justify-content: center;
}


/* コンポーネント */
/* ボタン（グラデーション）*/
a.c-button--gradation {
	display: flex;
	align-items: baseline;
	justify-content: center;

	position: relative;
	background-color: rgba(100, 100, 255, 1);
	text-align: center;
	color: #fff;
	text-decoration: none;

	width: 320px;
	height: 40px;
	padding-right: 20px;
	background-image: linear-gradient(to right, rgba(100, 100, 255, 1), rgba(0, 150, 255, 1), var(--color-main));
	background-size: 300% 100%;
	transition: all 0.6s;
}

.c-button--gradation:hover {
	background-position: 100% 0%;
}

.c-button--gradation::after {
	content: "";
	position: absolute;
	right: 10px;
	/* アイコンの右寄せ位置 */
	top: 50%;
	transform: translateY(-50%);
	width: 20px;
	height: 20px;

	/* 画像アイコン */
	background-image: url("../asset/arrow_square.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	pointer-events: none;        /* クリック領域を邪魔しない */
}

/* ナビ用ボタン */
.c-button--nav {
	width: 100%;
	padding-block: 0.3em;
	border-radius: var(--border-radius-s);
}

.c-button--nav a {
	display: block;
	position: relative;
	line-height: 1.4;
	color: rgb(86, 83, 83);
	text-decoration: none;
	padding-inline: 0.5em 0.2em;
	transition: color 0.5s ease;
}

.c-button--nav:hover {
	background-color: rgb(250, 250, 250);
}

.c-button--nav a:after {
  content: "";
  position: absolute;
  top: 50%;
  bottom: 0;
  right: 1.5rem;
  font-size: 90%;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: right 0.3s;
  width: 6px;
  height: 6px;
  border-top: solid 2px currentColor;
  border-right: solid 2px currentColor;
  transform: translateY(-50%) rotate(45deg);
}
.c-button--nav a:hover:after {
  right: 1rem;
}

/* 詳細遷移用ボタン */
.c-buttons--detail {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 320px));
  gap: 10px;
  width: 100%;
  justify-content: center;
}

.c-button--detail {
  width: 95%;
}

.c-button--detail a {
  display: flex;
  justify-content: space-around;
  align-items: center;
  width: 100%;
  padding: 8px 10px;
  padding-right: calc(2rem + 6px + 10px);   /* 右位置 + 矢印幅 + 余白10px */
  border-radius: 9999px;
  position: relative;
  margin: auto;
  text-decoration: none;
  line-height: 1.5;
  transition: 0.3s ease-in-out;
  border: 1px solid #330099;
  background-color: white;
}
.c-button--detail a:after {
  content: "";
  position: absolute;
  top: 50%;
  bottom: 0;
  right: 2rem;
  font-size: 90%;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: right 0.3s;
  width: 6px;
  height: 6px;
  border-top: solid 2px currentColor;
  border-right: solid 2px currentColor;
  transform: translateY(-50%) rotate(45deg);
}
.c-button--detail a:hover {
  background: #330099;
  color: #FFF;
}
.c-button--detail a:hover:after {
  right: 1.4rem;
}

.c-button--detail__external {
  width: 1.5em;
  height: 1.5em;
  display: inline-block;
  flex-shrink: 0;

  color: inherit;
  background-color: currentColor;

  mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><polyline points="27 12 36 12 36 21" fill="none" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><polyline points="32 26 32 34 14 34 14 16 22 16" fill="none" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><line x1="24" y1="24" x2="35" y2="13" stroke="black" stroke-width="2" stroke-linecap="round"/></svg>');
  -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><polyline points="27 12 36 12 36 21" fill="none" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><polyline points="32 26 32 34 14 34 14 16 22 16" fill="none" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><line x1="24" y1="24" x2="35" y2="13" stroke="black" stroke-width="2" stroke-linecap="round"/></svg>');

  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
}


/* 下側遷移用ボタン */
.c-buttons--scroll {
  display: grid;
  grid-template-columns: repeat(auto-fit, clamp(155px, calc(155px + 45 * ((100vw - 480px) / 480)), 200px));
  column-gap: 8px;
  row-gap: 10px;
  width: 100%;
  justify-content: center;
}
@media screen and (max-width: 365px) {
  .c-buttons--scroll {
	grid-template-columns: 1fr;
  }
}


.c-button--scroll {
  width: 100%;
}

.c-button--scroll a {
  display: flex;
  justify-content: center;
  width: 100%;
  height: 55px;
  position: relative;
  margin: auto;
  text-decoration: none;
  line-height: 1.5;
  transition: 0.3s ease-in-out;
  border: 1px solid var(--color-main);
  background-color: white;
  box-sizing: border-box;
  padding: 8px 0 0;
  color: var(--color-main);
  text-align: center;
  font-size: var(--fontsize-p);
}

.c-button--scroll a::before {
	content: '';
	width: 8px;
	height: 8px;
	border: 0;
	border-top: 2px solid var(--color-main);
	border-right: 2px solid var(--color-main);
	transform: translateX(-50%) rotate(135deg);
	position: absolute;
	top: auto;
	bottom: 10px;
	left: 50%;
	right: auto;
	margin-top: 0;
}

.c-button--scroll a:hover {
	background: var(--color-main);
	color: white;
}

.c-button--scroll a:hover::before {
	border-top: 2px solid white;
	border-right: 2px solid white;
}

.c-label {
	display: inline-block;
	font-size: 12px;
	padding: 4px 8px;
	border-radius: 5px;
	background: var(--label-bg);
	color: var(--label-fg);
	border: 1px solid var(--label-bd);
	margin-right: 5px;
	margin-bottom: 8px;
}

.c-label--ended {
	font-size: clamp(1.2rem, calc(1.2rem + 0.2rem * ((100vw - 48rem) / 48rem)), 1.4rem);
	background: rgba(125, 125, 125, 1);
	color: rgba(255, 255, 255, 1);
	text-align: center;
}

.c-label--canceled,
.c-label--open {
	font-size: clamp(1.2rem, calc(1.2rem + 0.2rem * ((100vw - 48rem) / 48rem)), 1.4rem);
	background: rgba(255, 100, 100, 1);
	color: rgba(255, 255, 255, 1);
	text-align: center;
}

.c-label--accent {
	background: #fff3ee;
	color: #d45d2d;
	border-color: #ffd9cb;
}

/* ユーティリティ */
.u-bg-blue-light {
	background-color: var(--bg-color-blue-light);
}

@media screen and (min-width: 960px) {
	.u-sp-only {
		display: none;
	}
}

/* 文章途中での折れ曲がり防止用*/
.u-inline-block {
	display: inline-block;
	/* white-space: nowrap; */
}

@media screen and (min-width: 481px) {
	.u-pc-inline-block {
		display: inline-block;
		/* white-space: nowrap; */
	}
}

/* 下線強調 */
.highlight {
	text-decoration: underline;
	text-decoration-thickness: 0.5em;
	text-decoration-color: rgba(135, 215, 255, 0.4);
	/* 線の水色 */
	text-underline-offset: -0.2em;
	text-decoration-skip-ink: none;
}

.highlight_red {
	text-decoration: underline;
	text-decoration-thickness: 0.5em;
	text-decoration-color: rgba(255, 30, 30, 0.4);
	/* 線のピンク */
	text-underline-offset: -0.2em;
	text-decoration-skip-ink: none;
}

.highlight_yellow {
	text-decoration: underline;
	text-decoration-thickness: 0.5em;
	text-decoration-color: rgba(255, 255, 66, 0.4);
	/* 線の黄色 */
	text-underline-offset: -0.2em;
	text-decoration-skip-ink: none;
}

/* --------------------------------- */
/* 中部版採用情報NAVI用のスタイル     */
/* --------------------------------- */
/* 中部用国家公務員試験採用NAVIへの誘導バナー */
.p-header__logo {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
}

@media screen and (max-width:960px) {
	.p-header__logo {
		width: calc(100% - 60px)
	}
}

.p-header__navigation-top {
	margin-bottom: 2px;
}

@media screen and (max-width: 960px) {
	.p-header__banner {
		text-align: center;
	}
}

@media screen and (max-width: 600px) {
	.p-header__banner {
		display: flex;
		justify-content: center;
		margin-bottom: 30px;
	}
}



/* 中部採用NAVIのトップタイトル */
/*                 */
/*    タイトル部    */
/*                 */
.p-snavi-title {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	margin-bottom: 10px;
}

.p-snavi-title__inner {
	width: 100%;
	margin: 0 auto;
	text-align: center;
	flex-shrink: 1;
}

.p-snavi-title__main {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 15px;

	margin: 0;
	font-weight: 600;
	letter-spacing: .04em;
	line-height: 1.15;
	font-size: var(--fontsize-title);
	color: var(--color-main-dark);
	background-color: rgba(255, 255, 255, 0.2);
	padding-block: 5px;
}

.p-snavi-title__inner .p-snavi-title__main {
	font-size: var(--fontsize-title-min);
}

/* 「中部版」バッジ */
.p-snavi-title__badge {
	display: inline-block;
	font-weight: 600;
	font-size: var(--fontsize-title-badge);
	letter-spacing: .06em;
	color: var(--color-main-dark);
	background-color: var(--title-gold-600);
	padding: 3px 5px;
	box-shadow: 0 0 0 1px rgba(0, 0, 0, .08), 0 10px 24px rgba(16, 40, 80, .18);
	transform: skewX(-15deg);
}

.p-snavi-title__inner .p-snavi-title__badge {
	font-size: var(--fontsize-title-badge-min);
}

.p-snavi-title__badge-inner {
	transform: skewX(10deg);
	/* テキストを少し元に戻す */
	white-space: nowrap;
}

/* サブ行「採用情報NAVI」：ブルー帯 */
.p-snavi-title__sub {
	text-align: center;
	font-weight: 600;
	letter-spacing: 0.25em;
	line-height: 1;
	font-size: var(--fontsize-title-sub);
	color: #fff;
	width: 100%;
	background: linear-gradient(110deg,
			white 2%,
			var(--color-main-light) 30%,
			var(--color-main-light) 70%,
			white 98%);
	padding: 8px 14px 10px;
}

.p-snavi-title__inner .p-snavi-title__sub {
	font-size: var(--fontsize-title-sub-min);
	padding: 5px 5px 6px;
}

/*                    */
/*    セクション部     */
/*                    */

.p-section-title {
	display: flex;
	flex-direction: column;
	margin-bottom: 0.3em;
}

.p-section-title__en {
	font-size: var(--fontsize-title-en);
	font-weight: 600;
	color: var(--color-main-dark);
}

.p-section-title h2 {
	font-size: var(--fontsize-section-title);
	margin: 0;
}


/*                  */
/*    ヒーロー部     */
/*                  */
.p-hero__inner {
	position: relative;
	overflow: hidden;
	border-radius: var(--border-radius-m);
}

.p-hero__inner img {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	object-position: center 70%;
	display: block;
}

/*                     */
/*    スライドバー部    */
/*                     */
.p-sidebar {
	display: grid;
	grid-template-columns: 1fr;
	justify-items: center;
	margin-block: 0.5em;
	padding-block: 0.5em 1em;
	background-color: rgba(230, 230, 230, 0.7)	;
	border-radius: var(--border-radius-m);
}

.p-sidebar ul {
	padding-left: 0;
}

.p-sidebar ul li {
	list-style: none;
	margin-bottom: 0;
}

.p-sidebar .c-button--detail {
	width: 90%;
}

.p-sidebar__list {
	width: 95%;
}

.p-message {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.p-message p {
	margin: 0 auto;
	font-size: var(--fontsize-message);
	color: var(--color-main-dark);
	font-weight: 600;
	line-height: 1.5;
	width: 90%;
	margin-block: 5px;
}

/* 枠 */
.p-panel {
	padding: 1em 1em 1.5em 1em;
	margin-bottom: 2em;
	background-color: var(--bg-color-blue-light);

}

/*                             */
/* topics部（Swiper）           */
/*                             */
.p-topics {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 2em;
}

@media screen and (max-width:768px) {
	.p-topics {
		grid-template-columns: 1fr;
		gap: 1em;
	}
}

.p-topics__card {
	border: 1px solid gray;
	box-shadow: 2px 2px 4px gray;
	margin-bottom: 30px;
	display: flex;
	flex-direction: column;
	width: 100%;
}

h2.p-topics__title {
	display: block;
	text-align: center;
	color: var(--color-main-dark);
	font-weight: 600;
}

.p-topics__card img {
	display: block;
	aspect-ratio: 16 / 9;
	width: 100%;
	height: 150px;
	object-fit: cover;
}

.p-topics__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	/* 左右方向で中央に配置 */
	padding-block: 1rem 3rem;
	background-color: rgba(255, 255, 248, 0.9);
}


/*                      */
/* コンテンツのエリア定義 */
/*                      */
.p-media {
	display: grid;
	grid-template-columns: 4fr 3fr;
	gap: 20px;
}

.p-media__image {
	grid-column: 1 / 2;
	min-width: 0;
}

.p-media__image img {
	aspect-ratio: 16 / 9;
	width: 100%;
	object-fit: cover;
	border-radius: var(--border-radius-m);
}

.p-media__content {
	grid-column: 2 / 3;
}

@media screen and (max-width:768px) {
	.p-media {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 10px;
	}

	.p-media__image,
	.p-media__content {
		display: block;
		width: 100%;
	}
}


/*                             */
/* Government Agency部（Swiper）*/
/*                             */
.p-media__image .swiper-agency {
	width: 100%;
	border-radius: var(--border-radius-m);
}

.p-media__image .swiper-slide {
	overflow: hidden;
}

.p-media__image .swiper-slide img {
	aspect-ratio: 16 / 9;
	width: 100%;
	object-fit: cover;
	display: block;
}

.p-media__image .swiper-text {
	color: #fff;
	left: 3%;
	position: absolute;
	text-shadow: 0 0 10px RGBA(0, 5, 58, 1);
	top: 3%;
	width: 50%;
	font-size: clamp(12px, 3vw, 18px);
	font-weight: 600;
}

.p-media__content p {
	text-align: center;
}

/* スプラッシュ */
#p-splash {
	position: fixed;
	inset: 0;
	background: var(--color-base);
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 1;
	transition: opacity 0.5s ease;
}

.p-splash__inner {
	font-size: 45px;
	z-index: 9999;
}

.p-splash__blur-text {
	animation: blurIn 1.8s ease-out both;
}

.p-splash__blur-text:nth-child(1) {
	animation-delay: 0s;
}

.p-splash__blur-text:nth-child(2) {
	animation-delay: 1.7s;
}

.p-splash__blur-text:nth-child(3) {
	animation-delay: 3.4s;
}

@keyframes blurIn {
	0% {
		filter: blur(10px);
		opacity: 0;
	}

	100% {
		filter: blur(0);
		opacity: 1;
	}
}


/* section部 */
.p-section__inner {
	padding-block: 0.3em 1.5em;
	margin: 0 auto;
	border-radius: var(--border-radius-m);
}

@media screen and (max-width:480px) {
	.p-section__inner p {
		text-align: left;
	}

	.p-section__inner br {
		display: none;
	}
}

/**********/
/* News部 */
/**********/
.p-saiyo-news__item {
	list-style-type: none;
	padding-block: 1.2em;
	border-bottom: 1px solid #bab5b5;
	line-height: 1.5;
	font-size: var(--fontsize-p);
}

.p-saiyo-news__link {
	display: grid;
	grid-template-columns: clamp(100px, calc(100px + 20 * ((100vw - 480px) / 480)), 120px) auto 1fr;
	/* 日付 / ラベル / 余白 */
	column-gap: 0.5em;
	row-gap: 0.1em;
	align-items: center;
}

.p-saiyo-news__date {
	grid-column: 1;

	padding: 0.1em;
	color: var(--color-main-dark);
	font-weight: 600;
}

.p-saiyo-news__label {
	grid-column: 2;
	font-size: calc(var(--fontsize-p)*0.9);
	color: var(--color-main-dark);
	border: 1px solid var(--color-main-dark);
	padding: 0.1em 0.5em;
	min-width: 140px;
	text-align: center;
	background: white;
	margin-top: 3px;
	align-self: flex-start;
	border-radius: 5px;
}

.p-saiyo-news__description {
	grid-column: 1 / -1;
	margin-top: 0.5em;
	color: #333;
}

.p-saiyo-news__item a:hover {
	text-decoration: none;
}

.p-saiyo-news__label:hover {
	text-decoration: none;
}


/* 採用情報について　*/
.p-caution {
	display: grid;
	grid-template-columns: 2fr 1fr;
	gap: 10px;
}

.p-cution__leftbutton {
	display: flex;
	justify-content: center;
	margin-bottom: 20px;
}

@media screen and (max-width:768px) {
	.p-caution {
		grid-template-columns: 1fr;
		gap: 0;
	}
}


/* 人を知る */
.swiper-people .swiper-slide {
	display: flex;
	flex-direction: column;
	width: auto;
	padding: 20px 0;
	overflow: hidden;
	justify-content: center;
	align-items: center;
}

.swiper-people .swiper-slide img {
	width: 100%;
	aspect-ratio: 3/4;
	display: block;
	object-fit: cover;
	border-radius: var(--border-radius-m);
}


.p-people__inner {
	display: flex;
	justify-content: center;
	width: 100%;
}

.p-people__inner .detail {
	width: 100%;
}

.swiper-caption {
	width: 100%;
	font-size: 14px;
	color: #333;
	padding-left: 10px;
}

p.swiper-caption {
	margin: 0;
}


/* ＳＮＳについて */
.p-sns img.pic {
	align-self: flex-start;
	max-width: 100%;
	width: 350px;
	object-fit: contain;
}

/* 各種SNSのアイコン */
div.logo {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}

div.logo_box {
	width: 80px;
	height: 40px;
}

/* --------------------------------- */
/* こころの健康相談室用のスタイル     */
/* --------------------------------- */

div.pic {
	text-align: center;
}

/* ------------------------- */
/* イベント一覧用のスタイル    */
/* ------------------------- */
/* Event list */
.p-eventList {
	display: grid;
	grid-template-columns: 1fr;
	gap: clamp(1.4rem, calc(1.4rem + 2.2rem * ((100vw - 48rem) / 48rem)), 3.6rem);
}

/* Event card */
.p-eventCard {
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: var(--border-radius-l);
	box-shadow: var(--elevation-1);
	display: grid;
	grid-template-columns: 250px 1fr;
	overflow: hidden;
}

.p-eventCard__date {
	background: linear-gradient(90deg, #f9fbff, #dee6f5), #dee6f5;
	border-right: 1px solid var(--color-border);
	display: grid;
	place-items: center;
	text-align: center;
}

.p-eventCard__dateContent {
	min-height: 120px;
	background: #fff;
	border-radius:  var(--border-radius-m);
	box-shadow: var(--elevation-2);
	padding: 20px;
	align-content: center;
}

.p-eventCard__dateContent .year {
	margin-top: 2em;
	font-size: 1.6rem;
}

.p-eventCard__dateContent .md {
	font-size: 2.8rem;
	padding-inline: 0.1em;
}

.p-eventCard__dateContent .hour {
	font-size: 1.6rem;
	/* display: inline-block; */
}

.p-eventCard__body {
	padding: clamp(8px, calc(8px + 17 * ((100vw - 480px) / 480)), 25px) clamp(8px, calc(8px + 17 * ((100vw - 480px) / 480)), 25px);
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 12px 18px;
	align-items: start;
}

.p-eventCard__content {
	grid-column: 1 / -1;
}

.p-eventCard__title {
	font-weight: 700;
	font-size: var(--fontsize-h3);
	margin: 2px 0 0;
}

.p-eventCard__meta {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-block: 20px;
	font-size: var(--fontsize-p);
}

.p-eventCard__metaItem {
	padding-left: 72px;
	padding-block: 3px;
	position: relative;
}

.p-eventCard__metaItem::before {
	content: attr(data-label);
	font-size: 0.9em;
	position: absolute;
	left: 0;
	width: 66px;
	border: 1px solid #000;
	border-radius:  var(--border-radius-s);
	padding: 0.1em;
	justify-content: center;
	text-align: center;
}

.p-eventCard__metaItem.event-date,
.p-eventCard__metaItem.event-term {
	font-weight: 600;
	color: var(--color-main-dark);
}

.p-eventCard__metaItem.event-date::before {
	content: "実施日";
	background-color: var(--color-main-dark);
	color: white;
	font-weight: normal;
}

.p-eventCard__metaItem.event-term::before {
	content: "実施期間";
	background-color: var(--color-main-dark);
	color: white;
	font-weight: normal;
}

.p-eventCard__button {
	display: flex;
	flex-wrap: wrap;
	column-gap: 15px;
}

.p-eventCard__button .detail {
	flex: 1 1 200px;
	width: 90%;
	height: 2.5em;
	max-width: 280px;
}

/* レスポンシブ（カード内を1カラム化） */
@media (max-width: 768px) {
	.p-eventCard {
		grid-template-columns: 1fr;
		margin-bottom: 30px;
	}

	.p-eventCard__date {
		display: none;
	}

	.p-eventCard__dateContent {
		min-height: 0;
	}

	.p-eventCard__metaRow {
		grid-template-columns: 64px 1fr;
		/* 若干詰める */
	}
}

@media (max-width: 480px) {
	.p-eventCard__button {
		display: block;
	}
}

/*-----------------------------------*/
/* スマートホン用                    */
/*-----------------------------------*/
@media screen and (max-width:480px) {

	/* 上に戻るボタンを常時表示 */
	a.c-back-to-top.c-back-to-top--square.c-back-to-top--blue {
		position: fixed;
		bottom: 1em;
		right: 1em;
		width: 60px;
		height: 60px;
		background: rgba(255, 255, 255, 0.5);
		border: 2px solid #bbb;
		border-radius: 50%;
		display: inline-block;
		text-decoration: none;
		z-index: 99999;
	}

	a.c-back-to-top.c-back-to-top--square.c-back-to-top--blue::before {
		content: '';
		display: block;
		position: absolute;
		width: 1em;
		height: 1em;
		top: 1.5em;
		left: 1.3em;
		border: 5px solid;
		border-color: #bbb #bbb transparent transparent;
		transform: rotate(-45deg);
	}

	svg.c-back-to-top__icon {
		display: none;
	}
}

/* ------------------------- */
/* 採用までの流れのスタイル    */
/* ------------------------- */
.p-flow {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 20px 0 20px 10px;
}

.p-flow ul {
	padding: 0;
}

.p-flow li {
	list-style-type: none;
}

.p-flow dd {
	margin-left: 0;
}

.p-flow__inner {
	position: relative;
}

.p-flow__inner::before {
	content: "";
	width: 15px;
	height: 100%;
	background: #eee;
	margin-left: -129px;
	display: block;
	position: absolute;
	top: 0;
	left: 120px;
	border-radius: 20px;
}

.p-flow__inner > li {
	position: relative;
}

.p-flow__inner > li:not(:last-child) {
	margin-bottom: 60px;
}

.p-flow__inner > li .icon {
	font-size: 0.8em;
	width: 2em;
	height: 2em;
	line-height: 2;
	text-align: center;
	font-weight: bold;
	border-radius: 100vh;
	color: #fff;
	/* background: #8EB83C; */
	background: var(--color-main-dark);
	display: inline-block;
	margin-right: 0.5em;
}

.p-flow__inner > li dl {
	padding-left: clamp(20px, calc(20px + 50 * ((100vw - 480px) / 480)), 70px);
	position: relative;
}

.p-flow__inner > li dl::before,
.p-flow__inner > li dl::after {
	content: "";
	display: block;
	position: absolute;
	top: 15px;
}

.p-flow__inner > li dl::before {
	width: 7px;
	height: 7px;
	margin-top: -3px;
	background: var(--color-main-dark);
	border-radius: 50%;
	left: -4px;
}

.p-flow__inner > li dl::after {
	/* width: 50px; */
	width: clamp(10px, calc(10px + 40 * ((100vw - 480px) / 480)), 50px);
	border-bottom: 1px dashed #999;
	position: absolute;
	left: 5px;
}

.p-flow__inner > li dl dt {
  font-size: 1.3em;
  font-weight: 600;
  color: var(--color-main-dark);;
  margin-bottom: 0.5em;
  display: flex;
  align-items: center;
}

.p-intro__inner {
	padding: 1em;
	display: flex;
	flex-direction: column;
}

.p-intro__link {
	display: grid;
	grid-template-columns: 1fr 1fr;
	/* max-width: 350px; */
	text-align: left;
	font-size: var(--fontsize-p);
}


/* -------------------------- */
/* 国家公務員採用試験のスタイル　*/
/* -------------------------- */
.p-exam {
  display: grid;
  grid-template-columns: 1fr;
  column-gap: 10px;
  row-gap: 30px;
  --exam-color: rgba(226, 226, 226, 1);
}

.p-exam__item--sogo {
	--exam-color: rgba(47, 128, 237, 1);
	--exam-color-light: rgba(86, 204, 242, 1);
}
.p-exam__item--ippan {
	--exam-color: rgba(33, 150, 83, 1);
	--exam-color-light: rgba(111, 207, 151, 1);
}
.p-exam__item--senmon {
	--exam-color: rgba(242, 153, 74, 1);
	--exam-color-light: rgba(242, 201, 76, 1);
}
.p-exam__item--keiken {
	--exam-color: rgba(155, 81, 224, 1);
	--exam-color-light: rgba(187, 107, 217, 1);
}

.p-exam__item {
  border-radius: var(--border-radius-m);
  box-shadow: 1px 1px 3px var(--exam-color);
  overflow: hidden;
}

.p-exam__header {
  color: #fff;
  text-align: center;
  display: flex;
  flex-direction: column;
  background: linear-gradient(135deg, var(--exam-color), var(--exam-color-light));
}

.p-exam__catch {
  color: white;
}

.p-exam__list {
  padding-top: 0.7em;
  padding-left: 0.2em;
  margin-bottom: 1em;
  font-size: var(--fontsize-p);

  display: grid;
  grid-template-rows:
    auto   /* 概要 */
    auto   /* 主な対象 */
    auto   /* 特徴 */
    auto;  /* こんな人におすすめ */
  row-gap: 15px;
}

.p-exam__row {
  display: grid;
  grid-template-columns: 1fr;
  align-content: start;
  gap: 3px;
}

.p-exam__row dt {
  justify-self: start; 
  font-weight: 600;
  padding-inline: 0.3em;
  text-decoration: underline;
}

.p-exam__row dd {
  font-size: 1.4rem;
  padding-top: 0;
  margin-inline: 0.6em 0.1em;
}

.p-exam__row ul {
  padding-left: 0.7em;
  list-style-type:none;
}
.p-exam__row ul li {
  position:relative;
  margin-bottom: 0.2em;
}
.p-exam__row ul li:before {
  content: "▶";
  position:absolute;
  top: 0.34em;
  left: -1.3em;
  font-size: 0.7em;
  color: var(--exam-color);
}

@media (min-width: 600px) {
  .p-exam {
    grid-template-columns: repeat(2, 1fr);
    column-gap: 15px;
  }
}

@media (min-width: 1024px) {
  .p-exam {
    grid-template-columns: repeat(4, 1fr);
    column-gap: 3px;
  }
  .p-exam__row--summary dd   { min-height: 4.5em;}
  .p-exam__row--target dd    { min-height: 7.0em;}
  .p-exam__row--feature dd   { min-height: 11em; }
  .p-exam__row--recommend dd { min-height: 8em;  }
}

.p-examselect {
  display: grid;
  grid-template-rows: 1fr;
  gap: 10px;
  margin-top: 64px;
  --exam-color: rgba(198, 198, 198, 1);
}

@media (min-width: 600px) {
  .p-examselect {
    grid-template-columns: repeat(2, 1fr);
    column-gap: 15px;
  }
}
@media (min-width: 1024px) {
  .p-examselect {
    grid-template-columns: repeat(3, 1fr);
    column-gap: 15px;
  }
}

.p-examselect__title {
  font-weight: 600;
  margin-bottom: 10px;
}

.p-examselect__item {
  border-radius: var(--border-radius-m);
  box-shadow: 1px 1px 3px var(--exam-color);
  overflow: hidden;
  border: 1px solid var(--exam-color);
}

#examselect > .c-buttons--detail {
  grid-template-columns: repeat(auto-fit, minmax(190px, 190px));
  gap: 5px;
}

#examselect > .c-buttons--detail > .c-button--detail {
  width: 100%;
  font-size: var(--fontsize-p);
}


/* ========================================================== 
   中部管内の官庁案内　ページ　　　　　　　　　　　　　　　　　　　 
   ========================================================== */

/* -------------------------
   官庁案内 検索エリア
   ------------------------- */
.p-agentSearch {
  margin: 2em 0;
}

.p-agentSearch__title {
  font-size: 1.6rem;
  font-weight: 600;
  margin-bottom: 0.8em;
}

.p-agentSearch__box {
  border: 1px solid rgba(204, 204, 204, 1);
  padding: 1em;
  border-radius: 8px;
  background: rgba(250, 250, 250, 1);
}

.p-agentSearch__row {
  display: grid;
  grid-template-columns: 1.5fr repeat(3, 1fr) auto;
  gap: 10px;
  align-items: start;  /* 上揃えに変更 */
}

.p-agentSearch__button--reset {
  margin-top: 8px;   /* ボタン間の余白 */
  background: #777; /* 検索と区別する色 */
}

.p-agentSearch__button--reset:hover {
  opacity: 0.85;
}

.p-agentSearch__input,
.p-agentSearch__select {
  height: 40px;
  padding: 0 0.6em;
  font-size: 1.4rem;
  border: 1px solid #aaa;
  border-radius: 4px;
  background: #fff;
}

.p-agentSearch__select {
  appearance: none;          /* 標準UIを消す */
  -webkit-appearance: none;
  -moz-appearance: none;

  padding-right: 2.2em;      /* ▼の分の余白 */
  background-image: 
    linear-gradient(45deg, transparent 50%, #555 50%),
    linear-gradient(135deg, #555 50%, transparent 50%);
  background-position:
    calc(100% - 14px) 50%,
    calc(100% - 9px) 50%;
  background-size: 5px 5px;
  background-repeat: no-repeat;
}

.p-agentSearch__buttons {
  display: flex;
  flex-direction: column;
	  justify-content: flex-start;
  align-self: start; 
  max-width: 100px;
}

.p-agentSearch__button {
  height: 40px;
  padding: 0 1.2em;
  font-size: 1.4rem;
  background: var(--color-main);
  color: #fff;
  border: none;
  border-radius: var(--border-radius-s);
  cursor: pointer;
}

.p-agentSearch__button:hover {
  opacity: 0.85;
}

.p-agentSearch__buttons .p-agentSearch__button {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}

/* リセットボタン用スタイル */
.p-agentSearch__button--reset {
  background: #777;       /* 検索ボタンと色を分ける */
  margin-left: 8px;       /* 検索ボタンとの間隔 */
}

.p-agentSearch__button--reset:hover {
  opacity: 0.85;
}

@media (max-width: 768px) {
  .p-agentSearch__row {
    grid-template-columns: 1fr;
  }

  .p-agentSearch__filters {
    grid-template-columns: 1fr;
  }

  .p-agentSearch__button,
  .p-agentSearch__button--reset {
    width: 100%;
  }

}

/* --------------------------
   官庁案内 各官庁の紹介 エリア
   -------------------------- */
.p-agentList {
	display: grid;
	grid-template-columns: 1fr;
	gap: 30px;
}

.p-agentCard {
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: var(--border-radius-s);
	display: block;
	overflow: hidden;
	padding: 10px;
	background-color: rgba(250, 250, 250, 1);
}

@media (max-width: 480px) {
	.p-agentCard {
		padding: 5px;
	}
}

.p-agentCard__title {
	grid-area: title;
	font-weight: 600;
	font-size: var(--fontsize-h3);
	color: var(--color-main-dark);
	margin: 2px 0 2px 10px;
}
.p-agentCard__media {
	grid-area: media;
  	display: flex;
  	flex-direction: column;
  	align-items: center; 
}
.p-agentCard__content {
	grid-area: body;
	align-self: start;
}


@media (min-width: 769px) {
  .p-agentCard {
    display: grid;
    grid-template-columns: 2fr 3fr;
    column-gap: 20px;
  }
  .p-agentCard__media {
    grid-column: 1;
  }
  .p-agentCard__title {
    grid-column: 2;
    margin-bottom: 6px;
  }
  .p-agentCard__content {
    grid-column: 2;
    margin-top: 35px;
  }
}

.p-agentCard__media img {
	aspect-ratio: 16 / 9;
	width: 100%;
	object-fit: cover;
	border-radius: var(--border-radius-s);
}

@media (max-width: 768px) {
  .p-agentCard {
    grid-template-columns: 1fr;
  }
  .p-agentCard__media img {
	width: 80%;
  }
}

@media (max-width: 480px) {
  .p-agentCard__media img {
	width: 100%;
  }
}

.p-agentCard__content {
	padding-left: 15px;
}
@media (max-width: 480px) {
	.p-agentCard__content {
		padding-left: 0;
	}
}

.p-agentCard__meta {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-block: 20px;
	font-size: var(--fontsize-p);
}

.p-agentCard__metaItem {
 	--label-width: 70px;
	--label-gap: 10px;
  	padding-left: calc(var(--label-width) + var(--label-gap));
	margin-top: 15px;
	position: relative;
}

.p-agentCard__metaItem::before {
	content: attr(data-label);
	font-size: 0.9em;
	position: absolute;
	left: 0;
	width: var(--label-width);
	border: 1px solid #000;
	border-radius:  var(--border-radius-s);
	padding: 0.1em;
	justify-content: center;
	text-align: center;
	white-space: nowrap;
}

.p-agentCard__metaItem[data-label="概要"] {
  --label-gap: 20px;
}

.p-agentCard__metaItem[data-label="採用時の勤務地"] {
  --label-width: 120px;
}

.p-agentCard__gaiyou {
	font-size: 1.4rem;
}

.p-agentCard__text {
	font-size: 1.4rem;
	margin-bottom: 0.5em;
	position: relative; 
}

.p-agentCard__text:before {
  content: "▶";
  position:absolute;
  top: 0.35em;
  left: -1.3em;
  font-size: 0.7em;
  color: rgba(130,130,130,1)
}

.p-agentCard__text ul,
.p-agentCard__text ol {
	margin-bottom: 5px;
}

.p-agentCard__text ul li, 
.p-agentCard__text ol li {
	margin: 3px 0 0 10px;
	list-style-position: outside;
}

/* ========================================================== 
   各機関が実施する業務説明会　ページ　　　　　　　　　　　　　　　　　　　 
   ========================================================== */
/* -------------------------
   官庁案内 検索エリア
   ------------------------- */
.p-sessionSearch {
  margin: 2em 0;
}

.p-sessionSearch__title {
  font-size: 1.6rem;
  font-weight: 600;
  margin-bottom: 0.8em;
}

.p-sessionSearch__box {
  border: 1px solid rgba(204, 204, 204, 1);
  padding: 1em;
  border-radius: 8px;
  background: rgba(250, 250, 250, 1);
}

.p-sessionSearch__row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  align-items: start;  /* 上揃えに変更 */
}

.p-sessionSearch__button--reset {
  margin-top: 8px;   /* ボタン間の余白 */
  background: #777; /* 検索と区別する色 */
}

.p-sessionSearch__button--reset:hover {
  opacity: 0.85;
}

.p-sessionSearch__input,
.p-sessionSearch__select {
  height: 40px;
  padding: 0 0.6em;
  font-size: 1.4rem;
  border: 1px solid #aaa;
  border-radius: 4px;
  background: #fff;
}

.p-sessionSearch__select {
  appearance: none;          /* 標準UIを消す */
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-right: 2.2em;      /* ▼の分の余白 */
  background-image: 
    linear-gradient(45deg, transparent 50%, #555 50%),
    linear-gradient(135deg, #555 50%, transparent 50%);
  background-position:
    calc(100% - 14px) 50%,
    calc(100% - 9px) 50%;
  background-size: 5px 5px;
  background-repeat: no-repeat;
}

.p-sessionSearch__buttons {
  display: flex;
  flex-direction: column;
	  justify-content: flex-start;
  align-self: start; 
}

.p-sessionSearch__button {
  height: 40px;
  padding: 0 1.2em;
  font-size: 1.4rem;
  background: var(--color-main);
  color: #fff;
  border: none;
  border-radius: var(--border-radius-s);
  cursor: pointer;
}

.p-sessionSearch__button:hover {
  opacity: 0.85;
}

.p-sessionSearch__buttons .p-sessionSearch__button {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}

/* リセットボタン用スタイル */
.p-sessionSearch__button--reset {
  background: #777;       /* 検索ボタンと色を分ける */
  margin-left: 8px;         /* 検索ボタンとの間隔 */
}

.p-sessionSearch__button--reset:hover {
  opacity: 0.85;
}

@media (min-width: 768px) {
  .p-sessionSearch__row {
  	grid-template-columns: 1.5fr repeat(3, 1fr) auto;
  }

  .p-sessionSearch__button,
  .p-sessionSearch__button--reset {
    max-width: 120px;
  }
}

/* 検索結果が見つからなかった場合の表示 */
.p-sessionList__noResult {
  margin: 1.5em 0;
  padding: 1em;
  text-align: center;
  color: #555;
  background: #f5f5f5;
  border-radius: 6px;
  font-size: 1.4rem;
}

/* セッションの説明カード */
.p-sessionList {
    display: grid;
    grid-template-columns: 1fr;
    column-gap: 12px;
    row-gap: 20px;
}

/* ② 769px〜1024px：2カラム（横幅いっぱい） */
@media (min-width: 769px) {
    .p-sessionList {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ③ 1025px以上：3カラム（横幅いっぱい） */
@media (min-width: 1025px) {
    .p-sessionList {
        grid-template-columns: repeat(3, 1fr);
    }
}

.p-sessionCard {
	display: grid;
	grid-template-rows: auto 1fr auto;
	row-gap: 2px;
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: var(--border-radius-l);
	box-shadow: var(--elevation-1);
	padding: 10px 10px 20px 10px;
	align-content: start;
}

.p-sessionCard__agent {
	grid-row: 1;
	font-size: var(--fontsize-h3);
	font-weight: 600;
	color: var(--color-main-dark);
	margin: 0;
}

.p-sessionCard__meta {
	display: flex;
  	flex-direction: column;
  	gap: 6px;
  	margin-block: 5px 15px;
}

.p-sessionCard__metaItem {
	padding-left: 75px;
	padding-block: 3px;
	position: relative;
}

.p-sessionCard__metaItem::before {
	content: attr(data-label);
	font-size: 0.8em;
	line-height: 1.5em;
	position: absolute;
	left: 0;
	width: 68px;
	border: 1px solid #000;
	border-radius:  var(--border-radius-s);
	padding: 0.1em;
	justify-content: center;
	text-align: center;
}

.p-sessionCard__metaItem[data-label="名称"] {
    grid-row: 2;
}