/*
* Good PLUS (CSS) / update: 2021.08.15
* 
* This code add the 3rd function after Favorite(like) and Bookmark.
* 
*/

.btn{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 40px;
	color: #657786;
	user-select: none;
}

.btn:hover{
	color: #1da1f2;
}

.nav-btn{
	width: 218px;
	height: 54px;
	line-height: 54px;
	font-size: 19px;
	font-family: "Segoe UI";
	font-weight: 400;
	margin: 1px 0;
	cursor: pointer;
}

.nav-btn__inner-wrap{
	display: inline-flex;
	justify-content: center;
	align-items: center;
	height: 46.25px;
	padding-right: 30px;
	border-radius: 30px;
}

.nav-btn:hover .nav-btn__inner-wrap{
	background: rgba(15, 20, 25, 0.1);
	transition: .2s;
}

.nav-btn__inner-wrap img{
	margin: 0px 20px 0px 12px;
}

.nav-btn-display{
	display: none;
}

.display{
	width: 216px;
	height: 190px;
	background: #fff;
	border: 1px solid #aaa;
	font-size: 8px;
	overflow-x: hidden;
	overflow-y: scroll;
}

#displayCheckbox{
	margin: 2px 0;
}

@media screen and (max-width:1282px){
	.nav-btn{
		width: 46.25px;
		padding: 7px 0;
		cursor: pointer;
	}

	.nav-btn-display{
		display: block;
	}

	.nav-btn__inner-wrap{
		display: flex;
		justify-content: center;
		align-items: center;
		width: 46.25px;
		height: 46.25px;
		padding-right: 0;
		border-radius: 30px;
	}

	.nav-btn__inner-wrap img{
		margin: 0 auto;
		user-select: none;
	}

	.nav-btn__inner-wrap span{
		display: none;
	}

	.display{
		display: none;
	}

	.display.show{
		display: block;
		width: 320px;
		height: 100%;
		background: #fff;
		border: 1px solid #aaa;
		font-size: 8px;
		position: fixed;
		top: 0;
		right: 0;
		overflow-x: hidden;
		overflow-y: scroll;
		z-index: 1;
	}

	#displayCheckbox{
		display: none;
	}
}