:root {
	/* 色の定義 */
	--primary-bg-color: #eee;
	/* デフォルトの背景色 */
	--secondary-bg-color: #fffca3;
	/* サブ背景色 */
	--accent-bg-color: #fff;
	/* アクセント背景色 */
	--light-bg-color: #ff8d00;
	/* 明るい背景色 */
	--dark-bg-color: #aad250;
	/* 暗い背景色 */
	--primary-text-color: #333;
	/* デフォルトのテキスト色 */
	--secondary-text-color: #000;
	/* サブテキスト色 */
	--accent-text-color: #28a838;
	/* アクセントテキスト色 */
	--light-text-color: #f4f4f4;
	/* 明るいテキスト色 */
	--dark-text-color: #333;
	/* 暗いテキスト色 */
	/* フォントサイズ */
	--font-size-base: 16px;
	/* 基本のフォントサイズ */
	--font-size-small: 14px;
	/* 小さいフォントサイズ */
	--font-size-medium: 18px;
	/* 中くらいのフォントサイズ */
	--font-size-large: 24px;
	/* 大きいフォントサイズ */
	--font-size-xlarge: 32px;
	/* 特大のフォントサイズ */
	--font-size-ularge: 40px;
	/* 超特大のフォントサイズ */
	/* スマホ用フォントサイズ */
	--font-size-base-sm: 14px;
	/* 基本のフォントサイズ */
	--font-size-small-sm: 12px;
	/* 小さいフォントサイズ */
	--font-size-medium-sm: 16px;
	/* 中くらいのフォントサイズ */
	--font-size-large-sm: 20px;
	/* 大きいフォントサイズ */
	--font-size-xlarge-sm: 24px;
	/* 特大のフォントサイズ */
	--font-size-ularge-sm: 28px;
	/* 超特大のフォントサイズ */
}

/* フォントサイズを調整する汎用的なクラス */
.font-small {
	font-size: var(--font-size-small-sm);
}

.font-base {
	font-size: var(--font-size-base-sm);
}

.font-medium {
	font-size: var(--font-size-medium-sm);
}

.font-large {
	font-size: var(--font-size-large-sm);
}

.font-xlarge {
	font-size: var(--font-size-xlarge-sm);
}

.font-ularge {
	font-size: var(--font-size-ularge-sm);
}

.font-bold {
	font-weight: bold;
}

/* テキスト色の汎用クラス */
.text-primary {
	color: var(--primary-text-color);
}

.text-secondary {
	color: var(--secondary-text-color);
}

.text-accent {
	color: var(--accent-text-color);
}

.text-light {
	color: var(--light-text-color);
}

.text-dark {
	color: var(--dark-text-color);
}

/* レイアウトとスタイル */
html {
	font-size: var(--font-size-large);
	background: var(--secondary-bg-color);
}

body {
	font-family: Arial, sans-serif;
	line-height: 1.6;
	color: var(--primary-text-color);
}

.wrap-all, .header, .wrap-main {
	box-sizing: border-box;
	margin: 0 auto;
}

.wrap-all {
	width: 100%;
	background-size: auto auto;
	background-color: rgba(255, 252, 163, 1);
	background-image: repeating-linear-gradient(135deg, transparent, transparent 20px, rgba(255, 249, 71, 1) 20px, rgba(255, 249, 71, 1) 27px);
}

.header, .wrap-main {
	max-width: 1200px;
	padding: 20px;
}

.time {
	background: var(--light-bg-color);
}

.kkblogo, .main_image {
	max-width: 1200px;
	margin: 0 auto;
}

.kkblogo {
	padding: 10px;
}

.contents {
	margin-bottom: 20px;
	padding: 20px;
}

.footer {
	background-color: var(--footer-bg-color);
	color: var(--footer-text-color);
	padding: 20px;
	text-align: center;
	font-size: var(--font-size-small);
}

.image-container {
	display: flex;
	gap: 16px;
	flex-wrap: wrap;
}

.content-box {
	flex: 1 1 calc(33.333% - 16px);
	box-sizing: border-box;
}

.kkblogo img {
	width: 100px;
}

/* モバイル向けのテキストスタイル */
.responsive-text {
	text-align: left;
}

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

.cast {
	text-align: center;
}

/* 画像が親要素に収まるようにする汎用的なクラス */
.img-responsive {
	max-width: 100%;
	height: auto;
	display: block;
	margin: 0 auto;
}


/* タブレット以上css: 画面幅が768px以上 */
@media (min-width: 767px) {
	.text-md-left {
		text-align: left;
	}

	.font-small {
		font-size: var(--font-size-small);
	}

	.font-base {
		font-size: var(--font-size-base);
	}

	.font-medium {
		font-size: var(--font-size-medium);
	}

	.font-large {
		font-size: var(--font-size-large);
	}

	.font-xlarge {
		font-size: var(--font-size-xlarge);
	}

	.font-ularge {
		font-size: var(--font-size-ularge);
	}

	.wrap-main {
		padding: 10px;
	}

	.footer {
		font-size: var(--font-size-small);
	}

	.responsive-text {
		text-align: center;
	}

	.pc_none {
		display: none;
	}

.minogashi {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-around;
	justify-content: space-around;
	-webkit-align-items: center;
	align-items: center;
}

}

/* スマートフォン用スタイル: 画面幅が767px以下の場合 */
@media (max-width: 767px) {
	.sp_none {
		display: none;
	}

	.responsive-text, .cast {
		font-size: var(--font-size-medium);
	}
}

.kaisei-opti-bold {
	font-family: "Kaisei Opti", serif;
	font-weight: 700;
	font-style: normal;
}