페이지 클래스리스트 제거 해줬을때

(() => {
	const leaflet = document.querySelector('.leaflet');
	const pagesElem = document.querySelector('.page');
	let pageCount = 0;

	function getTarget(target,className) {
		while (!target.classList.contains(className)) {
			target = target.parentNode;

			if (target.nodeName === 'BODY') {
				return;
			}
		}
		return target;
	}
	leaflet.addEventListener('click', (e) => {
		let pageElem = getTarget(e.target, 'page');
		pageElem.classList.add('page-flipped');
		pageCount++;

		if (pageCount === 2) {
			document.body.classList.add('leaflet-opened');
		}

		let closeElem = getTarget(e.target, 'close-btn');
		if (closeElem) {
			console.log(pagesElem);
			closeElem.classList.remove('leaflet-opened');
			pageElem.classList.remove('page-flipped');
			pageCount = 0;
		}
	});
})();

page 첫번째를 선택을 해줘도 close 버튼을 클릭했을때 3번째 페이지의 page-flipped가 제거 되면서 세번째 페이지가 접어 지는데 이유가 뭔가요?