@charset "utf-8";


#centerguide {
	margin-bottom:100px;
}
#centerguide .guideTitleBox {
	border:3px solid #ddd;
	border-top:3px solid #1dbecf;
	position:relative;
	padding:40px 30px 30px;
	text-align:center;
}
#centerguide .guideTitleBox::before,
#centerguide .guideTitleBox::after {
	content:'';
	width:3px;
	height:40%;
	background-color:#1dbecf;
	position:absolute;
	top:-2px;
}
#centerguide .guideTitleBox::before {
	left:-3px;
}
#centerguide .guideTitleBox::after {
	right:-3px;
}
#centerguide .guideTitleBox p {
	font-size:20px;
	letter-spacing:-0.5px;
	line-height:1.6;
}
#centerguide .guideTitleBox p + p {
	margin-top:20px;
}

#centerguide .guideCont {
	margin-top:65px;
}
#centerguide .guideCont .contTit {
	font-size:24px;
	letter-spacing:-0.6px;
	text-align:center;
	font-family: 'ONE-Mobile-Title';
}
#centerguide .guideCont .guideList {
	display:flex;
	align-items: flex-start;
	justify-content:center;
	margin-top:30px;
}
#centerguide .guideCont .guideList ul {
	width:170px;
	height:170px;
	text-align:center;
	border-radius: 50%;
    border-style: solid;
    border-width: 4px;
    border-image-source: linear-gradient(to top, #d4bbe8, #6bd4df);
    border-image-slice: 1;
    background-image: linear-gradient(to bottom, #fff, #fff), linear-gradient(to top, #d4bbe8, #6bd4df);
    background-origin: border-box;
    background-clip: content-box, border-box;
	display: flex;
    align-items: stretch;
    justify-content: center;
    flex-wrap: wrap;
    align-content: center;
}
#centerguide .guideCont .guideList .listImg {}
#centerguide .guideCont .guideList .listT {
	font-weight:500;
	letter-spacing:-0.45px;
	line-height:1.33;
	width:100%;
}
#centerguide .guideCont .guideList .arrow {
	margin:0 1%;
	position: relative;
	top:75px;
}
#centerguide .guideCont .guideList .listTxt {
	border:1px solid #ddd;
	padding:10px;
	text-align:center;
	margin-top:25px;
	position:relative;
	font-size:16px;
	letter-spacing:-0.4px;
	max-width:170px;
	font-weight:500;
}
#centerguide .guideCont .guideList .listTxt::before {
	content:'';
	width:1px;
	height:23px;
	background-color:#ddd;
	position:absolute;
	left:50%;
	top:-25px;
	transform:translateX(-50%);
}

#centerguide .guideCont .guideBtnBox {
	display:flex;
	align-items:center;
	justify-content:center;
	flex-wrap:wrap;
}
#centerguide .guideCont .guideBtnBox a {
	display:block;
	width:300px;
	margin:0 20px;
	border:3px solid;
	border-radius:30px;
	font-family: 'ONE-Mobile-Title';
	letter-spacing:-0.45px;
	text-align:center;
	padding:15px 0;
}
#centerguide .guideCont .guideBtnBox .btn01 {
	color:#1dbecf;
	border-color:#8ce6ed;
}
#centerguide .guideCont .guideBtnBox .btn02 {
	color:#9970b9;
	border-color:#c8addc;
}

/*---------------반응형 미디어쿼리----------------*/

@media (max-width:1440px) {
	#centerguide .guideCont .guideList .guideListBox {
		width:170px;
		margin-bottom:2%;
	}
	#centerguide .guideCont .guideList ul {
		width:auto;
	}
}

@media (max-width:1200px) {
	#centerguide .guideTitleBox {
		padding:40px 20px 30px;
	}
	#centerguide .guideTitleBox p {
		font-size:19px;
	}

	#centerguide .guideCont .contTit {
		font-size:22px;
	}
	#centerguide .guideCont .guideList .arrow img {
		max-width:40px;
		width:80%
	}

}

@media (max-width:1024px) {

	#centerguide .guideTitleBox p {
		font-size:18px;
	}
	#centerguide .guideCont .contTit {
		font-size:20px;
	}
	#centerguide .guideCont .guideList {
		flex-wrap: wrap;
	}
	#centerguide .guideCont .guideList ul,
	#centerguide .guideCont .guideList .arrow {
		margin:1%;
	}

	#centerguide .guideCont .guideList .arrow img {
		max-width:40px;
		width:80%
	}
	#centerguide .guideCont .guideBtnBox a {
		margin:1%;
		width:98%;
		max-width:300px;
	}
}

@media (max-width:991px) {}

@media (max-width:768px) {
	#centerguide .guideTitleBox p {
		font-size:17px;
	}
	#centerguide .guideCont .contTit {
		font-size:18px;
	}
	#centerguide .guideCont .guideList .guideListBox {
		width:100%;
	}
	#centerguide .guideCont .guideList .listTxt {
		width:100%;
		max-width:100%;
	}
	#centerguide .guideCont .guideList ul {
		width:100%;
		height:130px;
		border-radius:0;
		margin:0 auto;
	}
}

@media (max-width:480px) {
	#centerguide .guideCont .guideList {
		flex-direction: column;
		align-items: center;
	}

	#centerguide .guideCont .guideList .arrow {
		text-align:center;
		top:0;
	}
	#centerguide .guideCont .guideList .arrow img {
		transform:rotate(90deg);
	}
}

@media (max-width:400px) {}
@media (max-width:320px) {}