#pageWrap {
	height: 100vh;
	width: 100vw;
	background-image: url("../assets/img/site/site_back.webp");
	background-size: cover;
	background-position: center center;
}

.site-content {
	padding-top: 5%;
	padding-left: 5%;
	display: flex;
	flex-direction: column;
}

.site-content > p {
	font-size: 15pt;
	font-weight: bold;
	padding-left: 30px;
	padding-bottom: 20px;
}

.site-inner {
	position: relative;
}

.site-inner .sub {
	position: absolute;
	text-align: center;
	font-size: 10pt;
}

.site-inner .sub p {
	margin: 20px 0px;
}
.site-inner .sub a {
	padding: 6px 12px;
	color : #7F7F7F;
	outline: 2px solid transparent;
	border-radius: 50px;
	transition: background-color 0.3s, outline 0.3s; /* Add transition for both properties */
}

.site-inner .sub a:hover {
	outline: 2px solid #A6A6A6; /* 크기 변동 없이 테두리 효과 */
	border-radius: 50px;
	background-color: #F2F2F2;
}

.site-inner .pos-1 {
	left: 58px;	
}

.site-inner .pos-2 {
	left: 161px;	
}

.site-inner .pos-3 {
	left: 295px;	
}

.site-inner .pos-4 {
	left: 450px;	
}

.site-inner .pos-5 {
	left: 577px;	
}

.site-inner .pos-6 {
	left: 713px;	
}

.site-inner .pos-7 {
	left: 872px;	
}