/* ============================================================================================
	FAQ ACCORDION / BLOCK
============================================================================================ */
.resola-faq-accordion {
	max-width: 1000px;
	margin: 0 auto;
	box-shadow: 0 1px 0 white inset;
	border-top: 1px solid rgba(0,0,0,.1)
}
.resola-faq-item {
	position: relative
}
.resola-faq-title {
	display: flex;
	align-items: center;
	position: relative;
	margin: 0 !important;
	padding: .8em 28px .8em 6px !important;
	box-shadow: 0 1px 0 white;
	border-bottom: 1px solid rgba(0,0,0,.1);
	font-weight: normal;
	font-size: var(--wp--preset--font-size--small);
	cursor: pointer
}

/* エディタ状態でのカーソル/イベント処理を調整 */
.block-editor-block-list__layout .resola-faq-accordion .resola-faq-title {
	user-select: text;
}

.block-editor-block-list__layout .resola-faq-accordion .resola-faq-title * {
	pointer-events: auto;
	user-select: text;
}

.resola-faq-title.is-active {
	margin-bottom: 1em !important;
	background: var(--wp--preset--color--cream);
	color: var(--wp--preset--color--contrast);
	font-weight: bold
}
.resola-faq-title::before {
	content: "\02713";
	flex-shrink: 0;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 26px;
	height: 26px;
	margin: 0 1em 0 0;
	border: 1px solid currentColor;
	color: currentColor;
	font-size: 14px
}
.resola-faq-title::after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	right: 8px;
	bottom: 0;
	width: 8px;
	height: 8px;
	margin: auto;
	border-right: 1px solid currentColor;
	border-bottom: 1px solid currentColor;
	transform: rotate(45deg);
	transition: .3s
}
.resola-faq-title.is-active::after {
	transform: rotate(45deg) scale(-1,-1)
}
.resola-faq-content {
	height: 0;
	padding: 0 8px;
	overflow: hidden;
	font-size: var(--wp--preset--font-size--x-small);
	transition: height .3s
}
.resola-faq-title.is-active + .resola-faq-content {
	margin-bottom: 3em
}
