@charset "utf-8";

/* ----------------------------------------------------------------------------------------------------
Set
@media screen and (max-width: 1920px) {}
@media screen and (max-width: 1536px) {}
@media screen and (max-width: 1366px) {}
@media screen and (max-width: 1280px) {}
@media print, screen and (max-width: 1024px) {}
@media screen and (max-width: 560px) {}
---------------------------------------------------------------------------------------------------- */
:root {
	--fontFamily-ja: "Inter", "Noto Sans JP", sans-serif;
	--color-text: rgb(33 33 33);
	--color-bg: rgb(255 255 255);
	--color-white: rgb(255 255 255);
	--color-black: rgb(33 33 33);
	--color-black-pure: rgb(0 0 0);
	--color-gray: rgb(158 158 158);
	--color-gray-bg: rgb(238 238 238);
	--color-bluegray: #607D8B;
	--color-bluegray-bg: #ECEFF1;
	--color-red: #e5014f;
	--color-yellow: #efe800;
	--color-purple: #9da1cf;
	--color-blue: #2461ad;
	--color-blue-bg: color-mix(in srgb, var(--color-blue) 16%, white);
	--color-green: #61c2d6;
	--color-green-light: #a7d9da;
	--color-green-dark: #30a8c3;
	--color-green-bg: color-mix(in srgb, var(--color-green) 24%, white);
	--color-skyblue: #1e8bcc;
	--color-skyblue-bg: #d2ebf9;
	--easing-fast-2: all 0.04s ease-out;
	--easing-fast-1: all 0.08s ease-out;
	--easing-normal: all 0.12s ease-out;
	--easing-slow-1: all 0.16s ease-out;
	--easing-slow-2: all 0.20s ease-out;
	--easing-slow-3: all 0.24s ease-out;
	--fontSize-small-5: 0.55em;
	--fontSize-small-4: 0.62em;
	--fontSize-small-3: 0.70em;
	--fontSize-small-2: 0.79em;
	--fontSize-small-1: 0.89em;
	--fontSize-normal: 1em;
	--fontSize-large-1: 1.13em;
	--fontSize-large-2: 1.27em;
	--fontSize-large-3: 1.42em;
	--fontSize-large-4: 1.60em;
	--fontSize-large-5: 1.80em;
	--fontSize-large-6: 2.03em;
	--fontSize-large-7: 2.28em;
	--fontSize-large-8: 2.57em;
	--fontSize-large-9: 2.89em;
	--fontWeight-light-3: 300;
	--fontWeight-light-2: 400;
	--fontWeight-light-1: 500;
	--fontWeight-normal: 600;
	--fontWeight-bold-1: 700;
	--fontWeight-bold-2: 800;
	--fontWeight-bold-3: 900;
	--lineHeight-narrow-3: 1.2;
	--lineHeight-narrow-2: 1.4;
	--lineHeight-narrow-1: 1.6;
	--lineHeight-normal: 1.8;
	--lineHeight-wide-1: 2.0;
	--lineHeight-wide-2: 2.2;
	--lineHeight-wide-3: 2.4;
	--borderRadius-small-2: 0.2rem;
	--borderRadius-small-1: 0.4rem;
	--borderRadius-normal: 0.8rem;
	--borderRadius-large-1: 1.2rem;
	--borderRadius-large-2: 1.6rem;
	--borderWidth-light-1: 1px;
	--borderWidth-normal: 2px;
	--borderWidth-heavy-1: 3px;
	--borderWidth-heavy-2: 4px;
	--borderWidth-heavy-3: 5px;
	--paddingSection-narrow-4: 2.4rem;
	--paddingSection-narrow-3: 3.2rem;
	--paddingSection-narrow-2: 4.8rem;
	--paddingSection-narrow-1: 6.4rem;
	--paddingSection-normal: 8rem;
	--paddingSection-wide-1: 9.6rem;
	--paddingSection-wide-2: 11.2rem;
	--paddingSection-wide-3: 12.8rem;
}

@media screen and (max-width: 1280px) {}

@media print,
screen and (max-width: 1024px) {}

@media screen and (max-width: 560px) {
	:root {
		--paddingSection-narrow-4: 2.0rem;
		--paddingSection-narrow-3: 2.4rem;
		--paddingSection-narrow-2: 3.2rem;
		--paddingSection-narrow-1: 4.8rem;
		--paddingSection-normal: 6.4rem;
		--paddingSection-wide-1: 8rem;
		--paddingSection-wide-2: 9.6rem;
		--paddingSection-wide-3: 11.2rem;
	}
}

/* ----------------------------------------------------------------------------------------------------
 * Common
---------------------------------------------------------------------------------------------------- */
html {
	font-size: min(113%, 1vw);
}

body {
	color: var(--color-text);
	font-family: var(--fontFamily-ja);
	font-weight: var(--fontWeight-normal);
	line-height: var(--lineHeight-normal);
	overflow-wrap: anywhere;
	text-autospace: normal;
	text-spacing-trim: trim-start;
	line-break: strict;
	background-color: var(--color-bg);
}

*,
*::before,
*::after {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	font-family: inherit;
	font-weight: inherit;
	font-size: inherit;
	font-style: normal;
}

body.loadAct * {
	transition: none !important;
}

.noselect,
.noselect * {
	-webkit-user-select: none;
	user-select: none;
}

a,
button {
	outline: none;
	transition: var(--easing-normal);
}

a {
	color: var(--color-text);
}

a:not(.not):hover {
	color: var(--color-red);
}

a:not(.not) .photo,
a:not(.not) .image,
a:not(.not) img {
	transition: var(--easing-slow-1);
}

a:not(.not):hover .photo,
a:not(.not):hover .image,
a:not(.not):hover img {
	filter: brightness(80%);
}

ol,
ul {
	list-style: none;
}

img,
svg {
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}

video,
iframe {
	max-width: 100%;
	vertical-align: middle;
}

header,
footer,
div,
ul,
li,
h1,
h2,
h3,
h4,
nav,
button,
blockquote,
dt,
dd,
figure,
section,
p,
a,
span {
	position: relative;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

.clear::after {
	content: '';
	display: block;
	clear: both;
}

.none {
	display: none;
}

.none-show {
	clip-path: polygon(0 0);
}

p {
	margin-bottom: 1.6em;
}

p:not(.not):last-child,
ul:not(.not):last-child,
ol:not(.not):last-child,
li:not(.not):last-child,
figure:not(.not):last-child,
table:not(.not):last-child,
blockquote:not(.not):last-child {
	margin-bottom: 0 !important;
}

mark {
	background-color: var(--color-yellow);
	color: inherit;
}

label {
	display: inline-block;
}

sup {
	font-weight: var(--fontWeight-normal);
	font-size: var(--fontSize-small-3);
	padding: 0 0.2em;
	vertical-align: middle;
}

strong,
.text-bold {
	font-weight: var(--fontWeight-bold-2);
}

.text-normal {
	font-weight: var(--fontWeight-normal);
}

.text-underline {
	text-decoration: underline;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

.text-vertical {
	writing-mode: vertical-rl;
}

.in-center {
	text-align: center !important;
}

.in-right {
	text-align: right !important;
}

.in-left {
	text-align: left !important;
}

.pos-center {
	display: flex;
	justify-content: center;
	align-items: center;
}

.nowrap {
	white-space: nowrap;
}

.block {
	display: block;
}

.inline-block {
	display: inline-block;
}

.inline {
	display: inline;
}

.block-note {
	padding-left: 1em;
	text-indent: -1em;
}

.block-note::before {
	content: '※';
}

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

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

.margin-bt0 {
	margin-bottom: 0 !important;
}

.margin-bt02 {
	margin-bottom: 0.2em !important;
}

.margin-bt04 {
	margin-bottom: 0.4em !important;
}

.margin-bt06 {
	margin-bottom: 0.6em !important;
}

.margin-bt08 {
	margin-bottom: 0.8em !important;
}

.margin-bt10 {
	margin-bottom: 1.0em !important;
}

.margin-bt12 {
	margin-bottom: 1.2em !important;
}

.margin-bt14 {
	margin-bottom: 1.4em !important;
}

.margin-bt16 {
	margin-bottom: 1.6em !important;
}

.margin-bt18 {
	margin-bottom: 1.8em !important;
}

.margin-bt20 {
	margin-bottom: 2.0em !important;
}

.margin-bt22 {
	margin-bottom: 2.2em !important;
}

.margin-bt24 {
	margin-bottom: 2.4em !important;
}

.list-disc,
.list-decimal {
	display: grid;
	gap: 0.2em;
}

.list-disc {
	list-style: disc;
	margin-left: 1.4em;
	margin-bottom: 1.6em;
}

.list-decimal {
	list-style: decimal;
	margin-left: 1.6em;
	margin-bottom: 1.6em;
}

input[type="text"],
input[type="number"],
input[type="email"],
input[type="tel"],
input[type="password"],
textarea,
select {
	border: var(--borderWidth-light-1) solid color-mix(in srgb, var(--color-black-pure) 100%, transparent) !important;
	background-color: var(--color-white) !important;
	color: var(--color-black) !important;
	line-height: var(--lineHeight-narrow-1) !important;
	border-radius: var(--borderRadius-small-2) !important;
	padding: 0.6em 0.8em !important;
	max-width: 100% !important;
	transition: var(--easing-normal) !important;
	display: inline-block !important;
}

textarea {
	width: 100% !important;
	height: 12.0em !important;
}

input[type="text"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="password"]:focus,
textarea:focus {
	border-color: var(--color-black) !important;
	box-shadow: inset 0 0 4px color-mix(in srgb, var(--color-black-pure) 8%, transparent) !important;
	background-color: var(--color-gray-bg) !important;
	outline: none !important;
}

.pd {
	width: 100%;
	margin-inline: auto;
	padding-inline: min(8rem, 4.8vw);
	max-width: 80rem;
	text-align: left;
}

.pd.narrow {
	max-width: 60rem;
}

.pd.wide {
	max-width: 104rem;
}

.pd.full {
	max-width: none;
}

.show-tb,
.show-sp {
	display: none !important;
}

.hide-tb,
.hide-sp {}

/* #wrap {
	width: 100%;
	max-width: 100vw;
	overflow: clip;
	display: grid;
	grid-template-rows: auto auto 1fr auto;
	min-height: 100vh;
	min-height: 100lvh;
	&>* {
		min-width: 0;
	}
} */
@media screen and (max-width: 1536px) {
	html {
		font-size: min(100%, 4vw);
	}
}

@media print,
screen and (max-width: 1024px) {
	.show-tb {
		display: inline !important;
	}

	.show-tb.block {
		display: block !important;
	}

	.show-tb.inline-block {
		display: inline-block !important;
	}

	.hide-tb {
		display: none;
	}
}

@media screen and (max-width: 560px) {
	.show-sp {
		display: inline !important;
	}

	.show-sp.block {
		display: block !important;
	}

	.show-sp.inline-block {
		display: inline-block !important;
	}

	.hide-sp {
		display: none;
	}
}

/* ----------------------------------------------------------------------------------------------------
Loading
---------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------------
Wrap
---------------------------------------------------------------------------------------------------- */
:root {
	--wrap-pd: min(2.0em, 4.0vw);
}

#wrap {
	min-height: 100vh;
	min-height: 100lvh;
	display: grid;
	grid-template-columns: 1fr repeat(2, auto) 1fr;
	grid-template-rows: var(--wrap-pd) repeat(3, 1fr) var(--wrap-pd);

	&>#content {
		grid-column: 2 / 4;
		grid-row: 2 / 5;
		z-index: 1;
		background-color: var(--color-white);
		width: calc(100vw - calc(var(--wrap-pd) * 2));
		max-width: 70em;
		overflow: clip;
		padding-inline: min(4.0vw, 2.4rem);
		display: grid;
		grid-template-rows: auto 1fr auto;
		grid-template-columns: minmax(0, 1fr);
	}

	&>.noise {
		position: absolute;
		inset: 0;
		background-image: url(../images/site-bg-noise.png);
		background-size: 20em auto;
		background-repeat: repeat;
		mix-blend-mode: multiply;
		opacity: 0.24;
	}

	&>.bg01 {
		grid-column: 1 / 2;
		grid-row: 1 / 2;
	}

	&>.bg02 {
		grid-column: 2 / 3;
		grid-row: 1 / 2;
	}

	&>.bg03 {
		grid-column: 3 / 4;
		grid-row: 1 / 2;
	}

	&>.bg04 {
		grid-column: 4 / 5;
		grid-row: 1 / 2;
	}

	&>.bg05 {
		grid-column: 1 / 2;
		grid-row: 2 / 3;
	}

	&>.bg06 {
		grid-column: 4 / 5;
		grid-row: 2 / 3;
	}

	&>.bg07 {
		grid-column: 1 / 2;
		grid-row: 3 / 4;
	}

	&>.bg08 {
		grid-column: 4 / 5;
		grid-row: 3 / 4;
	}

	&>.bg09 {
		grid-column: 1 / 2;
		grid-row: 4 / 5;
	}

	&>.bg10 {
		grid-column: 4 / 5;
		grid-row: 4 / 5;
	}

	&>.bg11 {
		grid-column: 1 / 3;
		grid-row: 5 / 6;
	}

	&>.bg12 {
		grid-column: 3 / 4;
		grid-row: 5 / 6;
	}

	&>.bg13 {
		grid-column: 4 / 5;
		grid-row: 5 / 6;
	}

	&>.color01 {
		background-color: var(--color-purple);

		&::before {
			content: '';
			inset: 0;
			position: absolute;
			display: block;
			background-color: var(--color-green);
			mix-blend-mode: multiply;
		}
	}

	&>.color02 {
		background-color: var(--color-green);
	}

	&>.color03 {
		background-color: var(--color-purple);

		&::before {
			content: '';
			inset: 0;
			position: absolute;
			display: block;
			background-color: var(--color-black-pure);
			mix-blend-mode: overlay;
			opacity: 0.48;
		}
	}

	&>.color04 {
		background-color: var(--color-purple);

		&::before,
		&::after {
			content: '';
			inset: 0;
			position: absolute;
			display: block;
			background-color: var(--color-green);
			mix-blend-mode: multiply;
		}
	}

	&>.color05 {
		background-color: var(--color-purple);
	}
}

/* ----------------------------------------------------------------------------------------------------
Header
---------------------------------------------------------------------------------------------------- */
header {
	display: grid;
	grid-template-columns: 4.0em 1fr 4.0em;
	align-items: start;
	font-size: min(1em, 3.2vw);

	&::before {
		content: '';
	}

	& .logo {
		width: min(6.4em, 20.0vw);
		margin-inline: auto;
		padding-block: 0.4em;

		& a {
			display: block;
			padding-block: 1.6em;
		}

		&::before {
			content: '';
			content: '';
			display: block;
			position: absolute;
			top: 0;
			height: 100%;
			left: -20%;
			right: -20%;
			background-image: url(../images/site-logo-bg.svg);
			opacity: 0.24;
			background-size: contain;
		}

		& img {}
	}

	& .toggle {
		translate: var(--wrap-pd) 0;
		aspect-ratio: 1;
		cursor: pointer;

		&>span {
			content: '';
			display: block;
			position: absolute;
			border-bottom: var(--borderWidth-heavy-1) solid var(--color-black);
			left: 24%;
			right: 24%;
			transition: all 0.48s cubic-bezier(0.33, 1, 0.68, 1);

			&.line01 {
				top: 34%;
			}

			&.line02 {
				top: 50%;
				translate: 0 -50%;
			}

			&.line03 {
				bottom: 34%;
			}
		}
	}

	&.show .toggle {
		&>span {
			&.line01 {
				top: 50%;
				translate: 0 -50%;
				rotate: 225deg;
			}

			&.line02 {
				left: 50%;
				right: 50%;
			}

			&.line03 {
				bottom: 50%;
				translate: 0 50%;
				rotate: -225deg;
			}
		}
	}

	& nav {
		grid-column: 1 / -1;
		padding-block: 2.0em;
		padding-inline: min(2.0em, 3.2vw);
		background-color: var(--color-bluegray-bg);
		border-radius: var(--borderRadius-normal);
		display: none;
		margin-bottom: 2.0em;
	}

	& .menu {
		display: grid;
		text-align: center;

		& li {
			border-bottom: var(--borderWidth-normal) dotted var(--color-bluegray);
			padding-block: 0.8em;

			&:first-child {
				border-top: var(--borderWidth-normal) dotted var(--color-bluegray);
			}
		}

		& a {
			text-decoration: none;
			line-height: var(--lineHeight-narrow-1);

			& .sub {
				font-size: var(--fontSize-small-2);
				color: var(--color-red);
			}

			& .main {}
		}
	}
}

body#home header {
	& .logo {
		& a {
			display: none;
		}
	}
}

@media screen and (max-width: 1280px) {}

@media print,
screen and (max-width: 1024px) {}

@media screen and (max-width: 560px) {
	header {
		& .toggle {
			&>span {
				border-bottom-width: var(--borderWidth-normal);
			}
		}
	}
}

/* ----------------------------------------------------------------------------------------------------
Footer
---------------------------------------------------------------------------------------------------- */
footer {
	padding-block: 1.2em;
}

.list-footer {
	text-align: center;
	font-size: var(--fontSize-small-2);
	line-height: var(--lineHeight-narrow-1);
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 0.2em 1.6em;
}

/* ----------------------------------------------------------------------------------------------------
Common
---------------------------------------------------------------------------------------------------- */
.block-link {
	margin-top: 1.4em;

	& a {
		font-size: var(--fontSize-small-1);
		display: block;
		text-align: center;
		border: var(--borderWidth-heavy-1) solid var(--color-red);
		background-color: var(--color-white);
		border-radius: 100vh;
		text-decoration: none;
		font-weight: var(--fontWeight-bold-1);
		padding: 0.7em 0;
		margin-inline: auto;
		overflow: hidden;
		max-width: 24em;
		min-width: 0;
		line-height: var(--lineHeight-narrow-2);

		& .title {
			display: block;
			font-size: var(--fontSize-small-2);
			margin-bottom: 0.1em;
		}

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

		&:hover {
			color: var(--color-white);
		}

		&.blue {
			border-color: var(--color-blue);
		}

		&.green {
			border-color: var(--color-green-dark);
		}

		&.min {
			max-width: 18em;
			padding: 0.6em 0;
		}

		&::before {
			content: '';
			display: block;
			background-color: var(--color-red);
			left: 0;
			top: 0;
			height: 100%;
			width: 0;
			position: absolute;
			transition: all 0.32s cubic-bezier(0.33, 1, 0.68, 1);
		}

		&.blue::before {
			background-color: var(--color-blue);
		}

		&.green::before {
			background-color: var(--color-green-dark);
		}

		&:hover::before {
			width: 100%;
		}

		&::after {
			content: '';
			display: block;
			width: 1.6em;
			aspect-ratio: 1;
			border-radius: 100vh;
			background-image: url(../images/icon-allow.svg);
			background-size: 56% auto;
			position: absolute;
			right: 0.5em;
			top: 50%;
			translate: 0 -50%;
			background-color: var(--color-red);
			transition: all 0.32s cubic-bezier(0.33, 1, 0.68, 1);
		}

		&:hover::after {
			scale: 1.4;
		}

		&.blue::after {
			background-color: var(--color-blue);
		}

		&.green::after {
			background-color: var(--color-green-dark);
		}
	}
}

.marker {
	background: linear-gradient(transparent 50%, var(--color-yellow) 50%);
}

@media screen and (max-width: 1280px) {}

@media print,
screen and (max-width: 1024px) {}

@media screen and (max-width: 560px) {}

/* ----------------------------------------------------------------------------------------------------
Home
---------------------------------------------------------------------------------------------------- */
.title-home-section {
	text-align: center;
	line-height: var(--lineHeight-narrow-3);
	letter-spacing: 0.04em;
	margin-bottom: 1.0em;

	& .ja {
		display: block;
		font-size: var(--fontSize-small-3);
		font-weight: var(--fontWeight-bold-1);
	}

	& .en {
		display: block;
		font-size: var(--fontSize-large-5);
	}
}

@media screen and (max-width: 1280px) {}

@media print,
screen and (max-width: 1024px) {}

@media screen and (max-width: 560px) {}

.block-home-main {
	display: grid;
	padding-bottom: var(--paddingSection-narrow-3);
	grid-template-columns: 1fr 0.8fr;
	gap: 3.2em;
	align-items: end;

	& .title {
		&::before {
			content: '';
			display: block;
			position: absolute;
			top: 0;
			height: 100%;
			left: -16%;
			right: -16%;
			background-image: url(../images/site-logo-bg.svg);
			opacity: 0.24;
			background-size: contain;
		}

		& .logo {
			display: block;
		}

		& .copy {
			display: block;
			margin-top: 4.8%;

			& img {
				width: 30em;
			}
		}
	}
}

@media screen and (max-width: 1280px) {}

@media print,
screen and (max-width: 1024px) {
	.block-home-main {
		grid-template-columns: 1fr;
		gap: 1.6em;
		text-align: center;

		& .title {
			& .logo {
				& img {
					width: 32em;
				}
			}
		}

		& .info {
			& img {
				max-width: 30em;
			}
		}
	}
}

@media screen and (max-width: 560px) {}

.block-home-about {
	padding-top: 2.4em;
	padding-bottom: 2.4em;

	&>.inner {
		display: grid;
		grid-template-columns: 1fr auto;
		gap: 2.4em;
	}

	&::before {
		content: '';
		display: block;
		position: absolute;
		top: 0;
		height: 100%;
		left: 50%;
		background-color: var(--color-skyblue-bg);
		width: 100vw;
		translate: -50% 0;
	}

	&::after {
		content: '';
		display: block;
		position: absolute;
		bottom: calc(100% - 1px);
		height: 6px;
		left: 50%;
		width: 100vw;
		translate: -50% 0;
		background-image: url(../images/bg-wave.svg);
		background-size: contain;
		background-repeat: repeat-x;
	}

	& .text {
		& .title {
			padding: 0.2em 0.8em 0.1em;
			font-weight: var(--fontWeight-bold-1);
			background-color: var(--color-skyblue);
			color: var(--color-white);
			text-align: center;
			line-height: var(--lineHeight-narrow-1);

			& .name {
				font-size: min(var(--fontSize-large-4), 2.6vw);
				letter-spacing: 0.08em;
			}
		}

		& .lead {
			font-size: var(--fontSize-large-1);
			margin-top: 0.8em;
		}
	}

	& .link {
		text-align: center;

		& .copy {
			font-size: min(var(--fontSize-large-4), 2.2vw);
			font-weight: var(--fontWeight-bold-2);
			color: var(--color-blue);
			line-height: var(--lineHeight-narrow-2);
			letter-spacing: 0.08em;
			margin-bottom: 0;
		}

		& .comment {
			margin-top: 1.4em;
			background-color: var(--color-yellow);
			line-height: var(--lineHeight-narrow-1);
			border-radius: var(--borderRadius-normal);
			padding: 0.8em 1.2em;
			font-weight: var(--fontWeight-bold-1);
			font-size: var(--fontSize-small-1);
			display: inline-block;

			&::before {
				content: '';
				display: block;
				position: absolute;
				bottom: 100%;
				background-color: var(--color-yellow);
				aspect-ratio: 2 / 3;
				width: 0.8em;
				clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
				rotate: 16deg;
				right: 50%;
				translate: 0 20%;
			}
		}
	}
}

@media screen and (max-width: 1280px) {}

@media print,
screen and (max-width: 1024px) {
	.block-home-about {
		&>.inner {
			grid-template-columns: 1fr;
			gap: 1.2em;
		}

		& .text {
			& .title {
				font-size: var(--fontSize-small-2);

				& .name {
					font-size: min(var(--fontSize-large-6), 4.8vw);
				}
			}

			& .lead {
				font-size: var(--fontSize-normal);
				margin-top: 0.8em;
			}
		}

		& .link {
			& .copy {
				font-size: min(var(--fontSize-large-4), 4.8vw);

				& br {
					display: none;
				}
			}

			& .comment {
				font-size: var(--fontSize-small-2);
			}
		}
	}
}

@media screen and (max-width: 560px) {}

.block-home-info {
	padding-block: var(--paddingSection-narrow-3);
	display: grid;
	gap: 1.2em;

	&>.item {
		border-radius: var(--borderRadius-large-1);
		padding: 1.2em min(1.6em, 4.8vw) 1.6em;

		&.seminar {
			background-color: var(--color-blue-bg);
		}

		&.workshop {
			background-color: var(--color-green-bg);
		}

		&>.title {
			text-align: center;
			padding: 0.8em 0.6em 0.4em;
			margin-bottom: 0.8em;

			&::before {
				content: '';
				position: absolute;
				top: 0;
				height: 100%;
				left: -0.8em;
				right: -0.8em;
				clip-path: polygon(0.8em 0%, calc(100% - 0.8em) 0%, 100% 50%, calc(100% - 0.8em) 100%, 0.8em 100%, 0% 50%);
			}

			& .sub {
				display: inline-block;
				color: var(--color-red);
				font-weight: var(--fontWeight-bold-2);
				line-height: var(--lineHeight-narrow-1);
				margin-bottom: 0.5em;
				padding: 0.3em 0.8em 0.2em;
				font-size: min(var(--fontSize-normal), 3.2vw);
			}

			& .main {
				display: block;
				line-height: var(--lineHeight-narrow-1);
				font-size: min(var(--fontSize-large-3), 4.8vw);
				font-weight: var(--fontWeight-bold-2);
			}
		}

		&.seminar .title {
			& .sub {
				background-color: var(--color-blue-bg);
			}
		}

		&.workshop .title {
			& .sub {
				background-color: var(--color-green-bg);
			}
		}

		&.seminar .title {
			color: var(--color-white);

			&::before {
				background-color: var(--color-blue);
			}
		}

		&.workshop .title {
			&::before {
				background-color: var(--color-green);
			}
		}

		& .block-note {
			font-size: var(--fontSize-small-1);
			line-height: var(--lineHeight-narrow-1);
			margin-top: -1.2em;
		}
	}
}

.list-home-schedule {
	& li {
		padding: 1.2em;
		background-color: var(--color-white);
		display: grid;

		& .day {
			font-weight: var(--fontWeight-normal);
			line-height: 1.0;
			padding-bottom: 0.7em;
			font-size: min(var(--fontSize-large-3), 5.6vw);
		}

		& .capacity {
			position: absolute;
			top: 0.8em;
			right: 0.8em;
			display: flex;
			justify-content: center;
			align-items: center;
			border-radius: 100vh;
			aspect-ratio: 1;
			width: 6.0em;
			text-align: center;
			font-size: var(--fontSize-small-2);
			font-weight: var(--fontWeight-bold-1);
			line-height: 1.1;

			& .number {
				font-size: var(--fontSize-large-6);
				font-weight: var(--fontWeight-bold-2);
				display: inline-block;
				padding-right: 0.08em;
			}
		}
	}

	&.seminar li {
		& .capacity {
			background-color: var(--color-blue);
			color: var(--color-white);
		}
	}

	&.workshop {
		display: grid;
		grid-template-columns: 1fr 26em;
		gap: var(--borderWidth-heavy-1);

		& li {
			& .capacity {
				background-color: var(--color-green);
			}

			&.day2::before {
				content: '';
				display: block;
				width: min(8em, 28vw);
				aspect-ratio: 1;
				position: absolute;
				background-size: contain;
				background-position: center bottom;
				right: 1.2em;
				bottom: 0.8em;
				background-image: url(../images/home-info-workshop.svg);
			}
		}
	}
}

.block-home-info-seminar {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.2em;

	&>.text::before {
		content: '';
		display: block;
		width: min(10em, 32vw);
		aspect-ratio: 1;
		position: absolute;
		left: 0.6em;
		bottom: -6.4em;
		background-size: contain;
		background-position: center bottom;
		background-image: url(../images/home-info-seminar.svg);
	}
}

.list-home-schedule-more {
	display: grid;
	grid-template-columns: auto 1fr;
	line-height: var(--lineHeight-narrow-1);
	gap: 0.4em 0.8em;
	align-items: start;

	& dt {
		font-size: var(--fontSize-small-2);
		letter-spacing: 0.08em;
		padding: 0.2em 1.2em 0.1em;
		font-weight: var(--fontWeight-bold-1);
		text-align: center;
		clip-path: polygon(0.4em 0%, calc(100% - 0.4em) 0%, 100% 50%, calc(100% - 0.4em) 100%, 0.4em 100%, 0% 50%);
	}

	&.seminar dt {
		background-color: var(--color-blue);
		color: var(--color-white);
	}

	&.workshop dt {
		background-color: var(--color-green);
	}

	& dd {
		& .date {
			line-height: 1.0;
			display: inline-block;

			& .number {
				font-size: min(var(--fontSize-large-9), 10.0vw);
				font-weight: var(--fontWeight-light-2);
			}

			& .week {
				display: inline-block;
				font-size: var(--fontSize-small-2);
				vertical-align: text-bottom;
				width: 2.0em;
				line-height: 2.0em;
				text-align: center;
				border-radius: 100vh;
				margin-left: 0.4em;
				margin-right: 0.6em;
				font-weight: var(--fontWeight-bold-1);
			}
		}

		&.dd-date {
			padding-right: 4.4em;
		}

		& .time {
			font-weight: var(--fontWeight-bold-1);
			font-size: var(--fontSize-large-1);
			display: inline-block;
		}
	}

	&.seminar dd {
		& .date {
			& .week {
				background-color: var(--color-blue);
				color: var(--color-white);
			}
		}
	}

	&.workshop dd {
		& .date {
			& .week {
				background-color: var(--color-green);
			}
		}
	}
}

.block-home-workshop-note {
	background-color: var(--color-green);
	line-height: var(--lineHeight-narrow-1);
	border-radius: var(--borderRadius-normal);
	font-size: var(--fontSize-small-1);
	padding: 0.8em 1.2em;
	margin-top: 1.6em;
}

.list-home-speaker {
	margin-top: 0.4em;
	gap: 0.6em 0.8em;
	display: grid;
	grid-template-columns: repeat(2, 1fr);

	& .item {
		display: grid;
		grid-template-columns: auto 1fr;
		align-items: center;
		line-height: var(--lineHeight-narrow-1);
		gap: 0.5em;

		& img {
			width: 3.6em;
			aspect-ratio: 1;
			object-fit: cover;
		}

		& .name {
			font-size: var(--fontSize-small-1);
			font-weight: var(--fontWeight-bold-1);
			margin-bottom: 0.08em;
		}

		& .profile {
			font-size: var(--fontSize-small-3);
		}
	}

	& .item:nth-child(1) {
		grid-column: 2 span;

		& img {
			width: 4.8em;
		}

		& .name {
			font-size: var(--fontSize-normal);
		}

		& .profile {
			font-size: var(--fontSize-small-2);
		}
	}
}

@media screen and (max-width: 1280px) {
	.list-home-speaker {
		display: flex;
		flex-wrap: wrap;

		& .item:nth-child(1) {
			width: 100%;
		}
	}
}

@media print,
screen and (max-width: 1024px) {
	.list-home-schedule {
		& li {
			& .capacity {
				font-size: var(--fontSize-small-3);
			}
		}

		&.seminar {
			& .capacity {
				top: 0.4em;
				right: 0.4em;
			}
		}

		&.workshop {
			grid-template-columns: repeat(1, 1fr);

			& li {
				& .capacity {
					background-color: var(--color-green);
				}

				&.day2::before {
					right: 0.4em;
					bottom: 0.6em;
				}
			}
		}
	}

	.block-home-info-seminar {
		grid-template-columns: repeat(1, 1fr);

		&>.text::before {
			left: auto;
			right: -0.8em;
			bottom: auto;
			top: 1.6em;
			background-position: center top;
		}
	}
}

@media screen and (max-width: 560px) {
	.list-home-schedule {
		& li {
			grid-template-columns: 1fr;

			& .capacity {
				font-size: var(--fontSize-small-4);
			}
		}
	}

	.list-home-schedule-more {
		grid-template-columns: 1fr;

		& dt {
			width: 8em;
			translate: -0.4em 0;
		}

		& dd {
			padding-bottom: 0.3em;

			&.dd-date {
				padding-right: 0;
			}

			&:last-of-type {
				padding-bottom: 0;
			}
		}
	}

	.list-home-speaker {
		margin-top: 0;
	}
}

@media screen and (max-width: 1280px) {}

@media print,
screen and (max-width: 1024px) {}

@media screen and (max-width: 560px) {}

.block-home-case {
	padding-block: var(--paddingSection-narrow-3);

	&::before {
		content: '';
		display: block;
		position: absolute;
		top: 0;
		height: 100%;
		left: 50%;
		background-color: var(--color-skyblue-bg);
		width: 100vw;
		translate: -50% 0;
	}

	&::after {
		content: '';
		display: block;
		position: absolute;
		top: calc(100% - 1px);
		height: 6px;
		left: 50%;
		width: 100vw;
		translate: -50% 0;
		background-image: url(../images/bg-wave.svg);
		background-size: contain;
		background-repeat: repeat;
		rotate: 180deg;
	}
}

.block-home-case-en {
	position: absolute;
	top: -0.16em;
	left: 50%;
	color: var(--color-white);
	font-size: min(5.85em, 14vw);
	font-weight: var(--fontWeight-normal);
	letter-spacing: 0.02em;
	line-height: 1;
	translate: -50% 0;
	white-space: nowrap;
}

.title-home-case {
	z-index: 1;
	font-weight: var(--fontWeight-bold-2);
	font-size: min(var(--fontSize-large-4), 5.6vw);
	line-height: var(--lineHeight-narrow-1);
	margin-bottom: 0.2em;
	text-align: center;
	letter-spacing: 0.04em;
}

.block-home-case-lead {
	z-index: 1;
}

.list-home-case {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.2em;
	z-index: 1;

	& li {
		& a {
			background-color: var(--color-white);
			border-radius: var(--borderRadius-small-1);
			display: block;
			text-decoration: none;
			height: 100%;
			padding: 0.4em;
			box-shadow: 0 0 4px color-mix(in srgb, var(--color-black-pure) 6%, transparent);
			overflow: hidden;
			transition: all 0.40s cubic-bezier(0.22, 1, 0.36, 1);

			& img {
				transition: var(--easing-normal);
			}

			&:hover {
				scale: 1.04;
				box-shadow: 0 0 12px color-mix(in srgb, var(--color-black-pure) 12%, transparent);

				& img {
					filter: brightness(80%);
				}
			}

			& .image {
				& img {
					width: 100%;
					aspect-ratio: 3 / 2;
					object-fit: cover;
					border-radius: var(--borderRadius-small-1);
				}
			}

			& .text {
				padding: 0.6em;
				text-align: center;
				line-height: var(--lineHeight-narrow-1);
			}

			& .genre {
				display: inline-block;
				background-color: var(--color-skyblue);
				color: var(--color-white);
				font-size: var(--fontSize-small-3);
				margin-bottom: 0.7em;
				padding: 0.2em 0.8em 0.1em;
			}

			& .title {
				margin-bottom: 0.5em;
				font-weight: var(--fontWeight-bold-1);
				font-size: var(--fontSize-large-1);
				line-height: var(--lineHeight-narrow-2);
				transition: var(--easing-normal);

				& .name {
					display: block;
				}

				& .cross {
					display: block;
				}
			}

			&:hover .title {
				color: var(--color-red);
			}

			& p {
				font-size: var(--fontSize-small-1);
				color: var(--color-black);
				text-align: left;
				padding-top: 1.0em;

				&::before {
					content: '';
					display: block;
					position: absolute;
					left: -100vw;
					right: -100vw;
					top: 0;
					border-bottom: var(--borderWidth-normal) solid var(--color-skyblue-bg);
				}
			}
		}
	}
}

.block-pop-genre {
	line-height: var(--lineHeight-narrow-1);
	font-size: min(var(--fontSize-small-1), 2.8vw);
	margin-bottom: 0.4em;
}

.block-pop-title {
	line-height: var(--lineHeight-narrow-2);
	font-size: min(var(--fontSize-large-5), 5.8vw);
	margin-bottom: 0.64em;
}

.pop-image {
	text-align: center;

	&+.pop-image {
		margin-top: 1.2em;
	}

	&.min {
		& img {
			width: 28em;
		}
	}
}

.block-pop {
	display: grid;
	grid-template-columns: auto 1fr;
	align-items: start;
	gap: 0.8em 0.8em;
	margin-block: 1.4em;

	&>.title {
		text-align: center;
		background-color: var(--color-skyblue);
		color: var(--color-white);
		line-height: var(--lineHeight-narrow-1);
		margin-bottom: 0.6em;
		padding: 0.2em 0.8em;
		font-size: var(--fontSize-small-1);
	}

	&>.more {
		padding-top: 0.1em;
	}

	& ul {
		list-style: disc;
		margin-left: 1.4em;
	}

	& .creator {
		display: grid;
		grid-template-columns: auto 1fr;
		align-items: center;
		gap: 0.8em;

		& img {
			width: 5.6em;
			aspect-ratio: 1;
			object-fit: cover;
			border-radius: 100vh;
		}

		& .name {
			line-height: var(--lineHeight-narrow-1);

			& a {
				font-size: var(--fontSize-small-2);
				display: inline-block;
				line-height: var(--lineHeight-narrow-2);
			}
		}
	}
}

.modaal-container {
	border-radius: var(--borderRadius-normal);
	max-width: 48em;
	max-height: 80vh;
	overflow-x: auto;
}

.modaal-content-container {
	padding: min(2.0em, 4.8vw);
}

@media print,
screen and (max-width: 1024px) {
	.list-home-case {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media screen and (max-width: 560px) {
	.list-home-case {
		grid-template-columns: repeat(1, 1fr);
	}

	.block-pop {
		display: block;
		margin-bottom: 0 !important;

		&>.title {
			display: inline-block;
		}

		&>.more {
			padding-bottom: 1.6em;
		}
	}
}

.block-home-topics {
	padding-block: var(--paddingSection-narrow-3);
}

.swiper-home-topics-wrap {}

.swiper-home-topics {
	width: 100%;
	min-width: 0;
}

.swiper-button-next,
.swiper-button-prev {
	position: absolute;
	top: 0 !important;
	bottom: 0 !important;
	left: auto !important;
	right: auto !important;
	height: auto !important;
	width: var(--wrap-pd);
	background-image: url(../images/icon-allow-line.svg);
	background-size: contain;
	transform: translate(100%, 0);

	& svg {
		display: none !important;
	}
}

.swiper-button-next {
	right: 0 !important;
}

.swiper-button-prev {
	rotate: 180deg;
	left: 0 !important;
}

.list-home-topics {
	& li {
		& a {
			display: block;
			text-decoration: none;
			line-height: var(--lineHeight-narrow-1);
			font-size: var(--fontSize-small-1);

			& .photo {
				margin-bottom: 0.8em;

				& img {
					width: 100%;
					aspect-ratio: 3 / 2;
					object-fit: cover;
					border-radius: var(--borderRadius-small-1);
				}

			}


			& .date {
				display: inline-block;
				background-color: var(--color-bluegray);
				color: var(--color-white);
				font-size: var(--fontSize-small-2);
				font-weight: var(--fontWeight-light-1);
				padding: 0.2em 0.4em 0.1em;
				margin-bottom: 0.4em;
			}
		}
	}
}

@media screen and (max-width: 1280px) {}

@media print,
screen and (max-width: 1024px) {}

@media screen and (max-width: 560px) {

	.swiper-button-next,
	.swiper-button-prev {
		display: none;
	}
}

.block-home-more {
	padding-block: var(--paddingSection-narrow-3);

	&::before {
		content: '';
		display: block;
		position: absolute;
		top: 0;
		height: 100%;
		left: 50%;
		width: 100vw;
		transform: translate(-50%, 0);
		background-color: var(--color-bluegray-bg);
	}

	&>.inner {
		text-align: center;
		display: grid;
		gap: 2.4em var(--wrap-pd);
		margin-inline: auto;
		/* grid-template-columns: 1fr repeat(2, 16em); */
		grid-template-columns: repeat(2, 1fr);/* 追加後削除 */
		max-width: 32em;
	}

	& .block-link {
		margin-top: 1.2em;
	}

	& .note {
		grid-column: 1 / -1;

		& a {
			display: block;
			border: var(--borderWidth-normal) solid var(--color-black);
			background-color: var(--color-white);
			text-decoration: none;
			max-width: 36em;
			margin-inline: auto;
			display: grid;
			grid-template-columns: auto 1fr auto;
			align-items: center;
			gap: 0.8em;

			&:hover {
				filter: brightness(80%);
			}

			&::before,
			&::after {
				content: '';
				display: block;
				width: 6.4em;
				aspect-ratio: 1;
			}

			&::before {
				background-image: url(../images/home-banner-note01.jpg);
			}

			&::after {
				background-image: url(../images/home-banner-note02.jpg);
			}
		}
	}

	& .facebook {
		/* display: none; */
	}
}

@media screen and (max-width: 1280px) {}

@media print,
screen and (max-width: 1024px) {
	.block-home-more {
		&>.inner {
			grid-template-columns: repeat(2, 1fr);
			width: 34em;

			&>.facebook {
				/* grid-column: 1 / -1; */
			}
		}
	}
}

@media screen and (max-width: 700px) {
	.block-home-more {
		&>.inner {
			width: 18em;
			grid-template-columns: repeat(1, 1fr);
		}

		& .note {
			& a {
				grid-template-columns: 1fr;
				padding: 0.6em 0.8em;

				&::before,
				&::after {
					display: none;
				}
			}
		}
	}
}

/* ----------------------------------------------------------------------------------------------------
Page
---------------------------------------------------------------------------------------------------- */
.title-page {
	color: var(--color-white);
	clip-path: polygon(0.6em 0%, calc(100% - 0.6em) 0%, 100% 50%, calc(100% - 0.6em) 100%, 0.6em 100%, 0% 50%);
	font-size: min(var(--fontSize-large-3), 4.0vw);
	display: inline-block;
	line-height: var(--lineHeight-narrow-1);
	padding: 0.3em 1.4em 0.2em;
	margin-bottom: 0.8em;

	&.blue {
		background-color: var(--color-blue);
	}

	&.green {
		background-color: var(--color-green-dark);
	}

	&.skyblue {
		background-color: var(--color-skyblue);
	}
}

.block-page-capacity {
	float: right;
	text-align: center;
	color: var(--color-white);
	width: 6.8em;
	aspect-ratio: 1;
	display: flex;
	justify-content: center;
	align-items: center;
	line-height: 1.18;
	font-size: min(var(--fontSize-small-2), 2.8vw);
	border-radius: 100vh;
	margin-left: 0.4em;

	&.blue {
		background-color: var(--color-blue);
	}

	&.green {
		background-color: var(--color-green-dark);
	}

	& .inner {
		padding-top: 0.2em;
	}

	& .number {
		font-size: var(--fontSize-large-6);
	}
}

.block-page-lead {
	color: var(--color-red);
	font-weight: var(--fontWeight-bold-2);
	line-height: var(--lineHeight-narrow-1);
	margin-bottom: 0.2em;
	font-size: min(var(--fontSize-large-5), 5.6vw);
}

.block-page {
	border-radius: var(--borderRadius-normal);
	display: grid;
	grid-template-columns: auto 1fr;
	line-height: var(--lineHeight-narrow-1);
	padding: 2.0em min(2.0em, 4.0vw);
	gap: 1.0em 1.2em;
	align-items: start;

	&.blue {
		background-color: var(--color-blue-bg);
	}

	&.green {
		background-color: var(--color-green-bg);
	}

	&+.block-page {
		margin-top: 1.6em;
	}

	&>.title-more {
		grid-column: 1 / -1;
		color: var(--color-blue);
		font-size: min(var(--fontSize-large-4), 4.8vw);
		font-weight: var(--fontWeight-bold-2);
		border-bottom: var(--borderWidth-normal) solid;
		padding-bottom: 0.2em;
		margin-bottom: 0.2em;
	}

	&.blue>.title-more {
		color: var(--color-blue);
		border-color: var(--color-blue);
	}

	&.green>.title-more {
		color: var(--color-green-dark);
		border-color: var(--color-green-dark);

		& .day {
			background-color: var(--color-green-dark);
			color: var(--color-white);
			font-weight: var(--fontWeight-normal);
			display: inline-block;
			padding: 0.1em 0.4em;
			margin-right: 0.5em;
			line-height: var(--lineHeight-narrow-2);
			color: var(--color-yellow);
			font-size: var(--fontSize-small-1);
			translate: 0 -0.1em;
		}
	}

	&>.block-link {
		grid-column: 1 / -1;
		margin-top: 0.6em;
	}

	& .title-more-sub {
		color: var(--color-white);
		text-align: center;
		clip-path: polygon(0.6em 0%, calc(100% - 0.6em) 0%, 100% 50%, calc(100% - 0.6em) 100%, 0.6em 100%, 0% 50%);
		font-size: var(--fontSize-small-1);
		padding: 0.2em 1.6em;
	}

	&.blue .title-more-sub {
		background-color: var(--color-blue);
	}

	&.green .title-more-sub {
		background-color: var(--color-green-dark);
	}

	& .date {
		line-height: var(--lineHeight-narrow-3);
		margin-top: -0.4em;

		& .day {
			font-size: min(var(--fontSize-large-4), 5.2vw);
			font-weight: var(--fontWeight-bold-1);

			& .number {
				font-size: var(--fontSize-large-4);
				font-weight: var(--fontWeight-normal);
			}
		}

		& .time {
			font-weight: var(--fontWeight-bold-1);
			font-size: var(--fontSize-large-2);
		}

		& .deadline {
			font-size: var(--fontSize-small-1);
		}
	}

	& .info {
		& p {
			margin-bottom: 0;

			&+.title-more-info {
				margin-top: 1.0em;
			}
		}

		& .title-more-info {
			background-color: var(--color-white);
			display: inline-block;
			color: var(--color-blue);
			font-weight: var(--fontWeight-bold-2);
			font-size: min(var(--fontSize-large-1), 4.2vw);
			padding-inline: 0.3em;
			margin-bottom: 0.4em;
		}
	}

	& .speaker {
		display: grid;
		grid-template-columns: auto 1fr;
		gap: 1.2em;

		&>.photo {
			width: min(10.0em, 28vw);
			aspect-ratio: 1;
		}

		& .name {
			font-size: var(--fontSize-large-2);
			font-weight: var(--fontWeight-bold-1);
		}

		& .profile {
			font-size: var(--fontSize-small-1);
		}

		& .other {
			grid-column: 1 / -1;
			display: flex;
			gap: 1.2em;
			flex-wrap: wrap;
			font-size: var(--fontSize-small-1);

			& .item {
				display: flex;
				gap: 0.6em;

				& .photo {
					width: 5.6em;
					aspect-ratio: 1;
				}
			}
		}
	}
}

.block-seminar-subsidy {
	background-color: var(--color-green);
	border-radius: var(--borderRadius-normal);
	display: grid;
	grid-template-columns: auto 1fr;
	line-height: var(--lineHeight-narrow-1);
	padding: 2.0em min(2.0em, 4.0vw);
	gap: 1.0em 0.8em;
	align-items: start;
	margin-top: 1.6em;

	& .title {
		grid-column: 1 / -1;
		border-bottom: var(--borderWidth-normal) solid var(--color-white);
		padding-bottom: 0.6em;

		& .sub {
			font-weight: var(--fontWeight-bold-2);
			font-size: min(var(--fontSize-large-2), 4.2vw);
			margin-bottom: 0.3em;
		}

		& .main {
			background-color: var(--color-yellow);
			font-weight: var(--fontWeight-bold-2);
			font-size: min(var(--fontSize-large-3), 4.6vw);
			display: inline-block;
			margin-bottom: 0.4em;
			clip-path: polygon(0.6em 0%, calc(100% - 0.6em) 0%, 100% 50%, calc(100% - 0.6em) 100%, 0.6em 100%, 0% 50%);
			padding: 0.2em 1.2em;
		}
	}

	& .title-sub {
		text-align: center;
		border-radius: 100vh;
		font-size: var(--fontSize-small-1);
		padding: 0.2em 1.6em;
		background-color: var(--color-white);

		&.yellow {
			background-color: var(--color-yellow);
		}
	}

	& .date {
		font-weight: var(--fontWeight-bold-1);
		margin-top: -0.2em;
		line-height: var(--lineHeight-narrow-2);

		& .number {
			font-size: var(--fontSize-large-4);
		}
	}
}

@media screen and (max-width: 1280px) {}

@media print,
screen and (max-width: 1024px) {
	.block-page {
		&.green>.title-more {
			& .day {
				display: block;
				width: 3.6em;
				text-align: center;
				margin-bottom: 0.1em;
			}
		}

		& .speaker {
			display: block;

			&>.photo {
				float: right;
				margin-left: 0.8em;
				margin-bottom: 0.8em;
			}
		}

		& .other {
			padding-top: 1.2em;
		}
	}
}

@media screen and (max-width: 560px) {
	.block-page {
		grid-template-columns: 1fr;
		padding-block: 1.6em;
		gap: 0.6em;

		&>.more {
			padding-bottom: 0.4em;
		}

		& .title-more-sub {
			width: 10em;
		}

		& .date {
			margin-top: -0.2em;
		}

		& .info {
			padding-top: 0.4em;
		}
	}

	.block-seminar-subsidy {
		grid-template-columns: 1fr;
		gap: 0.4em;
		padding-block: 1.6em;

		&>.more {
			padding-bottom: 0.4em;
		}

		& .title {
			border-bottom: none;

			& .main {
				display: block;
				text-align: center;
			}
		}
	}
}


/* ----------------------------------------------------------------------------------------------------
Topics
---------------------------------------------------------------------------------------------------- */
.list-topics {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(16em, 1fr));
	gap: 2.4em min(4.0vw, 2.4rem);

	& li {
		& a {
			display: block;
			text-decoration: none;
			line-height: var(--lineHeight-narrow-1);
			font-size: var(--fontSize-small-1);

			& .photo {
				margin-bottom: 0.8em;

				& img {
					width: 100%;
					aspect-ratio: 3 / 2;
					object-fit: cover;
					border-radius: var(--borderRadius-small-1);
				}

			}


			& .date {
				display: inline-block;
				background-color: var(--color-bluegray);
				color: var(--color-white);
				font-size: var(--fontSize-small-2);
				font-weight: var(--fontWeight-light-1);
				padding: 0.2em 0.4em 0.1em;
				margin-bottom: 0.4em;
			}
		}
	}
}

.block-entry-eyecatch {
	margin-inline: calc(min(4.0vw, 2.4rem) * -1);
	margin-bottom: 2.0em;
}

.block-entry {
	max-width: 44em;
	margin-inline: auto;

	& .block-entry-date {
		background-color: var(--color-bluegray);
		display: inline-block;
		color: var(--color-white);
		font-size: var(--fontSize-small-2);
		padding: 0.2em 0.6em 0.1em;
	}

	& h1 {
		font-size: min(var(--fontSize-large-4), 5.2vw);
		font-weight: var(--fontWeight-bold-1);
		line-height: var(--lineHeight-narrow-1);
		margin-top: 0.3em;
		margin-bottom: 0.6em;
	}
}


.wp-pagenavi {
	display: flex;
	justify-content: center;
	margin-block: 2.0em;
	font-size: var(--fontSize-small-1);
	gap: 0.2em;

	&>* {
		border: var(--borderWidth-normal) solid var(--color-black);
		padding: 0.1em 0.4em 0;
		text-decoration: none;
		text-align: center;
		min-width: 1.8em;

		&.current {
			background-color: var(--color-black);
			color: var(--color-white);
		}
	}
}