/* * =========================================
 * seminarsディレクトリ配下のスタイル
 * =========================================
 */

/* * =========================================
 * コンポーネントのオーバーライド【seminars/index.html】
 * =========================================
 */

.c-article-list {
	padding: 64px 0 80px;
}

.c-article-card__image {
	padding: 16px 0;
}

@media (width <= 767px) {
	.c-article-list {
		padding: 32px 0 64px;
	}
}



/* * =========================================
 * リスト
 * =========================================
 */
.c-article-ul {
	padding: 0;
	margin: 0;
	list-style: none;
}

.c-article-ul li {
	position: relative;
	padding: 3px 8px 3px 32px; /* ドットの分、左に余白を作る */
	line-height: 1.8; /* 行間を少しゆったりさせる */
}

/* 疑似要素でピンクの丸を作る */
.c-article-ul li::before {
	position: absolute;
	top: 0.8em; /* 文字の高さに合わせて中央寄りに調整 */
	left: 16px;
	width: 8px;
	height: 8px;
	content: '';
	background-color: #deaaca; /* 変数があれば使用 */
	border-radius: 50%; /* 正円にする */
}

/* * =========================================
 * 見出し
 * =========================================
 */

/* H1 */
.c-heading-1 {
	position: relative;
	padding: 48px 20px 24px;
}

.c-heading-1__bg {
	opacity: 0.6;
}

.c-heading-1__bg img {
	position: absolute;
	bottom: 0;
	width: auto;
	max-width: 40%;
	height: 95%;
}

.c-heading-1 h1 {
	padding: 0 32px 16px;
	font-family: var(--font-family-sub1);
	font-size: 28px;
	font-style: normal;
	font-weight: var(--font-weight-medium);
	line-height: 120%; /* 33.6px */
	letter-spacing: 2.24px;
	border-bottom: 2px solid var(--bcf-common-pale, #deaaca);
}

/* H2 */
.c-heading-2 {
	padding: 40px 0 16px;
}

.c-heading-2 h1,
.c-heading-2 h2,
.c-heading-2 h3,
.c-heading-2 h4 {
	width: 100%;
	padding: 6px 16px 8px;
	font-family: var(--font-family-sub1);
	font-size: 20px;
	font-style: normal;
	font-weight: var(--font-weight-bold);
	line-height: 100%; /* 20px */
	color: var(--bc-common-white, #fff);
	letter-spacing: 1.6px;
	background-color: rgb(173 5 107 / 44%);
	border-radius: 40px;
}

/* H3 */
.c-heading-3 {
	padding: 24px 0 8px;
}

.c-heading-3 h1,
.c-heading-3 h2,
.c-heading-3 h3,
.c-heading-3 h4 {
	padding: 0 8px 12px 16px;
	font-family: var(--font-family-sub1);
	font-size: 20px;
	font-style: normal;
	font-weight: var(--font-weight-bold);
	line-height: 100%; /* 20px */
	color: #e994c8;
	letter-spacing: 1.6px;
	border-bottom: 1.6px dashed #deaaca;
}

.c-heading-3 .date {
	width: 100%;
	padding: 8px 4px 0 0;
	font-family: var(--font-family-sub2);
	font-size: 16px;
	font-style: normal;
	font-weight: 600;
	line-height: 100%; /* 16px */
	color: #e994c8;
	text-align: end;
	letter-spacing: 1.28px;
}

/* H4 */
.c-heading-4 {
	padding: 10px 0 16px;
}

.c-heading-4 h1,
.c-heading-4 h2,
.c-heading-4 h3,
.c-heading-4 h4 {
	padding: 12px 8px 12px 16px;
	font-family: var(--font-family-sub1);
	font-size: 20px;
	font-style: normal;
	font-weight: var(--font-weight-medium);
	line-height: 100%; /* 20px */
	letter-spacing: 1.6px;
	background-color: #ff62c038;
	border-left: 10px solid #eb90c7;
}

/* * =========================================
 * レシピなどグレー背景のノート
 * =========================================
 */
.c-article-note-2 {
	padding: 5px 0;
}

.c-article-note-2 article {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 10px;
	background: rgb(235 235 235 / 80%);
	border-radius: 8px;
}

/* 色の付きテキスト */
.u-color-2 {
	color: #8091d8;
}

/* * =========================================
 * 画像とテキストのセット
 * =========================================
 */
.c-media-block {
	padding: 25px 0;
}

.c-media-block article {
	display: flex;
	flex-direction: row;
	gap: 0px;
	justify-content: flex-start;
}

.c-media-block__item--text {
	flex: 1;
}

.c-media-block__item--image {
	width: 40%;
}

.c-media-block__item--image img {
	width: 70%;
}



/* 横並び */

.flex {
		display: flex; /*横並び*/
}
.flex .image {
	margin: 0;
	padding: 0;
	overflow: hidden;
	position: relative;
	top: 2.8px;
}
.flex .text {
	margin: 0 0 0 0px;
	padding: 0;
}