@charset "UTF-8";
.card-calendar {
		padding: 0;
		color: var(--title);
		font-size: 16px;
		line-height: 1.2;
}
.card-calendar .head, .card-calendar .wrap {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 16px;
		padding: var(--side-block);
}
.card-calendar .head {
		position: relative;
		min-height: 136px;
		padding-right: 20px;
		padding-left: 128px;
		border-style: solid;
		border-width: 0;
		border-color: var(--stroke50);
}
.card-calendar .image-circle {
		width: 72px;
		height: 72px;
		top: var(--side-block);
		left: var(--side-block);
		position: absolute !important;
}
.card-calendar .head > *:not(.card-pattern) {
		position: relative;
}
.card-calendar .head .big {
		font: bold 24px/1.1 var(--font-title);
		font-variant-numeric: lining-nums;
		color: var(--title);
		margin-bottom: -8px;
}
.card-calendar .head .card-pattern {
		display: none;
}
.style-plant .card-calendar .head .card-pattern:before {
		left: 240px;
		top: 50%;
		transform: translate3d(0, -50%, 0);
}
.card-calendar .text {
		display: -webkit-box;
		-webkit-line-clamp: 4;
		-webkit-box-orient: vertical;
		overflow: hidden;
		text-overflow: ellipsis;
}
.card-calendar .title {
		font-weight: bold;
		font-size: 24px;
		margin-bottom: -8px;
}
@media only screen and (max-width: 699.99px) {
		.card-calendar .head {
				border-radius: var(--radius) var(--radius) 0 0;
				border-bottom-width: 1px;
		}
}
@media only screen and (min-width: 700px) {
		.card-calendar {
				display: flex;
		}
		.card-calendar .wrap {
				gap: 16px;
				flex: 0 0 auto;
				order: 2;
		}
		.card-calendar .head {
				flex: 0 0 auto;
				order: 1;
				border-right-width: 1px;
		}
}
@media only screen and (min-width: 700px) {
		.card-calendar .wrap {
				flex: 1;
		}
		.card-calendar .head {
				width: clamp(360px, 50%, 460px);
		}
}
@media only screen and (min-width: 1200px) {
		.card-calendar {
				font-size: 18px;
		}
		.card-calendar .head {
				padding-right: 20px;
				padding-left: 220px;
				min-height: 240px;
		}
		.card-calendar .image-circle {
				width: 160px;
				height: 160px;
		}
}
.card-calendar .btn.link-more {
		color: var(--golddark);
		border-color: var(--golddark);
}
.card-calendar .btn.link-more:before {
		background-color: var(--golddark);
}