.book-term-section {
	border-radius:1.5rem;
	background:#fff;
	margin: 0 0 2rem;
}

.book-term-toggle {
	color: var(--main-blue2);
	background:var(--base-blue);
	
	padding: 2rem;
	position:Relative;
	border-radius:1.5rem;
	padding-left: 14rem;
}

.book-term-section.active .book-term-toggle {
	color: var(--base-blue);
}

.book-term-toggle:before {
	content: attr(data-book-no);
	
	
	width: 12rem;
	box-sizing:border-box;
	height:60%;
	display:inline-block;
	position:Absolute;
	top:20%;
	left:0;
	
	padding-left:2rem;
	font-family: "Anek Latin", sans-serif;
	font-size: 7rem;
	font-weight:700;
	line-height:0.75;
	
	border-right: 3px solid var(--main-blue2);
}

.book-term-section.active .book-term-toggle:before {
	border-right: 3px solid var(--base-blue);
}

@media all and (min-width: 768px) {
	.book-term-toggle:before {
		font-size: 8rem;
		line-height:0.85;
	}
}

.book-term-toggle .parsa-title {
	color:#fff;
	font-family: "Anek Latin", sans-serif;
	font-weight:700;
	font-size:30px;
	text-transform:uppercase;
}

.book-term-toggle .parsa-subtitle {
	color:#fff;
	font-family: "Anek Latin", sans-serif;
	font-weight:200;
	font-size:22px;
	
	display:block;
	text-transform:uppercase;
}

.book-term-toggle .toggle-state {
	display:block;
	width:75px;
	height:75px;
	background:#fff url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 44 25"><path stroke="%2323398c" stroke-linecap="round" stroke-linejoin="round" stroke-width="5" d="m40.5 2.5-19 19-19-19"/></svg>') center 60% no-repeat;
	background-size: 3.1rem auto;
	
	border-radius: 100%;
	
	position:Absolute;
	top:3rem;
	right:2rem;
}

@media all and (min-width: 768px) {

	.book-term-toggle .parsa-title {
		font-size:60px;
	}

	.book-term-toggle .parsa-subtitle {
		font-size:35px;
	}
}

.book-term-section.active {
	
}

.book-term-section.active .book-term-toggle {
	background:var(--black);
}

.book-term-section.active .book-term-toggle .toggle-state {
	background: var(--base-blue) url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 44 25"><path stroke="%230b0e1d" stroke-linecap="round" stroke-linejoin="round" stroke-width="5" d="m2.5 21.5 19-19 19 19"/></svg>') center center no-repeat;
	background-size: 3.1rem auto;
}

.book-term-posts {
	margin:2rem;
	padding:0 0 1rem;
	list-style-type:none;
}

.book-term-posts li {
	display:block;
}

.book-term-posts li + li {
	border-top: 2px solid var(--main-blue2);
}

.book-term-posts li a {
	display:flex;
	align-items: center;
	justify-content: flex-start;
	padding:1rem 0;
	
	font-size: 24px;
	font-weight:800;
	
	text-decoration:none;
}

.book-term-posts li a span {
	font-weight:300;
	color: var(--main-blue2);
	margin-left:auto;
}


.book-term-posts > li:hover > a {
	position:relative;
	overflow:hidden;
    padding-left: 2rem;
    padding-right: 2rem;
    margin-left: -2rem;
    margin-right: -2rem;
}

.book-term-posts > li:hover > a:after {
	content:"";
	display:block;
	position:absolute;
	background: var(--main-blue2);
	opacity:0.15;
	
	left:0;
	top:0;
	width:100%;
	height:100%;
}


ul.book-term-posts > li.active > a:before {
	content:" ";
	width: 3rem;
	height:2rem;
	background: #fff url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="none" width="30" height="30" viewBox="0 0 27 30"><path fill="%234C87C6" d="M26.2 22H0L13.1 0zM3.1 20.2h20l-10-16.8z"></path><path fill="%234C87C6" d="M0 7.2h26.2L13.1 30zM23.1 9h-20l10 17.4z"></path></svg>') left center no-repeat;
}
