.btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap: .5em;
	padding: 12px 18px;
	border-radius: 999px;
	font-weight: 700;
	border: 0;
}

.btn--sm{ padding: 8px 12px; font-size: 13px; }
.btn--lg{ padding: 14px 22px; font-size: 16px; }

.btn--green{ background: var(--c-green); color: #fff; }
.btn--accent{ background: #f77266; color:#fff; } /* ヘッダー用も一旦同色 */
.btn--primary{ background: var(--c-primary); color:#fff; }

.btn--block{ width:100%; border-radius: 14px; padding: 14px 16px; }

.tag{
	display:inline-block;
	padding: 6px 10px;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.2;
}

.tag--green{ background: var(--c-green); color: #fff; }

.marker{
	background: linear-gradient(transparent 60%, #ffe48a 60%);
	padding-inline: .15em;
}

.icon-text{
	display:flex;
	align-items:center;
	gap: 15px;
	padding: 10px 12px;
	border: 1px solid rgba(0,0,0,.08);
	border-radius: 10px;
	background: #fff;
}
.icon-text__icon{ width: 80px; height: 80px; }
.icon-text__text{ font-weight: 600; }

.section-heading{
	position: relative;
	padding-top: 0px; /* beforeのスペース分 */
}


.section-heading::before {
	content: "";
	background: url(../assets/img/logo-icon.png) no-repeat center center;
	width: 37px;
	height: 30px;
	display: block;
	margin: 0 auto 15px;
	background-size: contain;
}

/* components.css */
.btn--accent::after{
	content:"";
	width: 30px;
	height: 30px;
	background: url(../assets/img/arrow_icon.png) no-repeat center / contain;
}

/* components.css：ボタン内アイコンの縦ズレ防止 */
.btn--accent::after{
	display:inline-block;
	vertical-align: middle;
}