@import "../lib/swiper/swiper-bundle.min.css";
@import "font.css";
@import "reset.css";
@import "animate.css";
@import "filter.css";
@import "typography.css";
@import "grid.css";
@import "layer.css";
@import "form.css";
@import "exclusive.css";


/* component */
.scroll::-webkit-scrollbar { /* Chrome/Opera/Safari */
	display: none;
}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	color: #000;
	opacity: 0.3;
 }
 ::-moz-placeholder { /* Firefox 19+ */
	color: #000;
	 opacity: 0.3;
 }
 :-ms-input-placeholder { /* IE 10+ */
	color: #000;
	 opacity: 0.3;
 }
 :-moz-placeholder { /* Firefox 18- */
	color: #000;
	 opacity: 0.3;
 }

 .m0 {
	 margin: 0 !important;
 }

 .p0 {
	 padding: 0 !important;
 }

/* Colors */
.line-primary {
	border: 1px solid var(--blue) !important;
	color: var(--blue) !important;
}
.line-primary.lg {
	border-width: 2px !important;
}
.text-primary {
	color: var(--blue) !important;
}
.bg-primary {
	background-color: var(--blue) !important;
	color: #fff !important;
}
.bg-success {
	background-color: var(--green) !important;
	color: #000 !important;
}
.bg-warning {
	background-color: var(--yellow) !important;
	color: #000 !important;
}
.bg-light-sky {
	background-color: var(--light-sky) !important;
}
.bg-white {
	background-color: var(--white) !important;
	color: #000 !important;
}

/* Align */
.text-right {
	text-align: right;
}
.text-center {
	text-align: center;
}

/* Layout */
.flex-between {
	display: flex;
	justify-content: space-between;
}
.flex-center {
	display: flex;
	justify-content: center;
	align-items: center;
}
.flex-end {
	display: flex;
	justify-content: flex-end;
	flex-wrap: wrap;
}

/* icons */
.ico {
	display: block;
	font-size: 1px;
	text-indent: -9999px;
	overflow: hidden;
}
.ico.ico-person-plus {
	background: url('../assets/images/icons/ico-people-plus.svg') center no-repeat;
	background-size: 2.1rem 2.1rem;
	width: 2.1rem;
	height: 2.1rem;
}
.ico.ico-filter {
	background: url('../assets/images/icons/ico-filter.svg') center no-repeat;
	background-size: 2.6rem 2.6rem;
	width: 2.6rem;
	height: 2.6rem;
}
.ico.ico-clamp-left {
	background: url('../assets/images/icons/ico-clamp-left.svg') center no-repeat;
	background-size: contain;
	width: 1.3rem;
	height: 2.3rem;
}
.ico.ico-clamp-right {
	background: url('../assets/images/icons/ico-clamp-right.svg') center no-repeat;
	background-size: .5rem 1rem;
	width: 0.5rem;
	height: 1rem;
}
.ico.ico-question-circle {
	background: url('../assets/images/icons/ico-question-circle.svg') center no-repeat;
	background-size: 1.8rem 1.8rem;
	width: 1.8rem;
	height: 1.8rem;
}
.ico.ico-gender-female {
	background: url('../assets/images/icons/ico-ribbon.svg') center no-repeat;
	background-size: contain;
	width: 5rem;
	height: 3.3rem;
}
.ico.ico-gender-male {
	background: url('../assets/images/icons/ico-necktie.svg') center no-repeat;
	background-size: contain;
	width: 2.2rem;
	height: 4rem;
}
.ico.ico-building-big {
	background: url('../assets/images/icons/ico-building-big.svg') center no-repeat;
	background-size: contain;
	width: 4.9rem;
	height: 5.4rem;
}
.ico.ico-talented {
	background: url('../assets/images/icons/ico-person-male.svg') center no-repeat;
	background-size: contain;
	width: 6.1rem;
	height: 5.4rem;
}
.ico.ico-check-circle {
	background: url('../assets/images/icons/ico-check-circle.svg') center no-repeat;
	background-size: contain;
	width: 6.4rem;
	height: 6.4rem;
}
.ico.ico-plus {
	background: url('../assets/images/icons/ico-plus.svg') center no-repeat;
	background-size: contain;
	width: 1.8rem;
	height: 1.8rem;
}
.ico.ico-arrow-left {
	background: url('../assets/images/icons/ico-arrow-left.svg') center no-repeat;
	background-size: contain;
	width: 2.6rem;
	height: 2.6rem;
}
.ico.ico-arrow-down {
	background: url('../assets/images/icons/ico-arrow-down.svg') center no-repeat;
	background-size: contain;
	width: 1.5rem;
	height: 0.8rem;
}
.ico.ico-merit-protected {
	background: url('../assets/images/icons/ico-merit-protected.svg') center no-repeat;
	background-size: contain;
	width: 6rem;
	height: 6rem;
}
.ico.ico-merit-location {
	background: url('../assets/images/icons/ico-merit-location.svg') center no-repeat;
	background-size: contain;
	width: 6rem;
	height: 6rem;
}
.ico.ico-merit-sns {
	background: url('../assets/images/icons/ico-merit-sns.svg') center no-repeat;
	background-size: contain;
	width: 6rem;
	height: 6rem;
}
.ico.ico-merit-program {
	background: url('../assets/images/icons/ico-merit-program.svg') center no-repeat;
	background-size: contain;
	width: 6rem;
	height: 6rem;
}
.ico.ico-search-blue {
	background: url('../assets/images/icons/ico-search-blue.svg') center no-repeat;
	background-size: contain;
	width: 4.2rem;
	height: 4.2rem;
}
.ico.ico-menu {
	background: url('../assets/images/icons/ico-triple-line.svg') center no-repeat;
	background-size: contain;
	width: 2.4rem;
	height: 2.4rem;
}

/* Button */
a.btn {
	display: block;
}
.btn {
	border-radius: .8rem;
	height: 3.5rem;
	line-height: 3.5rem;
	font-size: 1.4rem;
	font-weight: 700;
	text-align: center;
	padding: 0 1.4rem;
	cursor: pointer;
}
.btn.lg {
	height: 4.2rem;
	line-height: 4.2rem;
	font-size: 1.6rem;
	padding: 0 3.6rem
}
.btn.bigger {
	width: 100%;
	height: 7rem;
	line-height: 7rem;
	font-size: 1.6rem;
	font-weight: 700;
}
.btn-more {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0.6rem;
	border-radius: 1.2rem;
	border: 1px solid #EAEBF0;
	background: #FFF;
	width: 39.2rem;
	height: 5.2rem;
	margin-top: 8rem;
}
.btn-my-menu {
	border: 1px solid #258FFF;
	border-radius: 1.2rem;
	width: 7.8rem;
	height: 3.6rem;
	line-height: 3.6rem;
	color: #258FFF;
	font-size: 1.3rem;
	font-weight: 700;
}
.btn-shadow {
	border: none;
	border-radius: 1.2rem;
	background: #FFF;
	box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.20);
	width: 5.4rem;
	height: 5.4rem;
	flex-shrink: 0;
	color: #000;
	text-align: center;
	line-height: 1.6rem;
}

/* link */
.link {
	display: flex;
	color: #000;
	font-size: 1.6rem;
	font-weight: 700;
	line-height: 2.2rem;
	gap: 0 4px;
}
.link em {
	color: var(--blue);
	font-weight: 700;
}
.banner-wrap {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 3.2rem;
	margin-top: 10rem;
}
.banner-wrap a {
	flex: 1;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 2rem;
	background-color: #D9D9D9;
	width: 100%;
	height: 22rem;
	color: #fff;
	font-size: 1.6rem;
	font-weight: 700;
	overflow: hidden;
}

/* wrapper */
.wrapper {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
}
.contents-wrap {
	position: relative;
	height: calc(100% - 11.2rem);
	margin-top: 11.2rem;
	z-index: 100;
}
.contents {
	width: 100%;
	max-width: 124rem;
	margin: 0 auto;
}
.contents.pad {
	padding-top: 5rem;
}
.filter-category dt {
	line-height: 2.7rem;
	color: #000;
	font-size: 2rem;
	font-weight: 700;
	margin-bottom: 2rem;
}
.filter-category dd {
	margin-bottom: 4rem;
}
.filter-category dd:last-child {
	margin: 0;
}

/* Box */
.box-round-gray {
	border-radius: 1.2rem;
	background: #F5F5F5;
	padding: 1.5rem 0;
}
.box-round-sky-blue {
	border-radius: 1.2rem;
	background: #F6FAFF;
}
.box-round-white {
	border-radius: 1.2rem;
	background: var(--white);
	padding: 2.4rem;
	margin-bottom: 4rem;
}
.box-round-blue {
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 1.2rem;
	background: #E7EEF6;
	width: 100%;
	min-height: 13rem;
	margin-bottom: 4rem;
}

/* Quick bar */
.quick-bar {
	position: fixed;
	top: 17rem;
	left: 50%;
	transform: translateX(65rem);
	z-index: 10;
}
.quick-bar button {
	margin-bottom: 0.8rem;
}

/* 라디오, 체크박스 리스트 */
.rdo-list,
.chk-list {
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 2.4rem
}
.rdo-list,
.chk-list li {
	flex: 0 0 auto;
	position: relative;
}

/* Loading indicator */
.loading {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 0.8rem;
}
.loading i {
	flex: 0 0 auto;
	border-radius: calc(100% / 2);
	background-color: var(--blue);
	width: 0.8rem;
	height: 0.8rem;
	animation: toggleScale infinite 2s;
}
.loading i:nth-child(2) {
	animation-delay: 0.5s;
}
.loading i:nth-child(3) {
	animation-delay: 1s;
}
.loading i:nth-child(4) {
	animation-delay: 1.5s;
}
.loading i:nth-child(5) {
	animation-delay: 2s;
}
.loading i:nth-child(6) {
	animation-delay: 2.5s;
}


@media all and (max-width:1440px) {
	.contents-wrap {
		height: calc(100% - 9.6rem);
		margin-top: 9.6rem;
	}
	.contents {
		max-width: 92.8rem;
	}
	.contents.pad {
		padding-top: 3.4rem;
	}
	.banner-wrap {
		margin-top: 8rem;
	}
	.quick-bar {
		display: none;
	}
}

@media all and (max-width:1024px) {
	.btn.lg {
		width: 100%;
		height: 5.6rem;
		line-height: 5.6rem;
	}
	.contents-wrap {
		height: calc(100% - 12rem);
		margin-top: 12rem;
		padding: 0 2rem;
	}
	.contents-wrap.single {
		height: calc(100% - 6rem);
		margin-top: 6rem;
		padding: 0 2rem;
	}
	.contents {
		max-width: 100%;
	}
	.contents.pad {
		padding-top: 3rem;
	}
	.banner-wrap {
		flex-direction: column;
		gap: 2rem;
		margin-top: 6rem;
	}
	.banner-wrap a {
		flex: 0 0 auto;
		border-radius: 1.2rem;
		height: 11rem;
	}
	.banner-wrap a img {
		border-radius: 1.2rem;
	}
	.filter-category dt {
		line-height: 2.2rem;
		font-size: 1.6rem;
		margin-bottom: 1.6rem;
	}
	.filter-category dd {
		margin-bottom: 3rem;
	}
	.filter-category dd:last-child {
		margin: 0;
	}
	.rdo-list,
	.chk-list {
		gap: 1.2rem 3rem;
		flex-wrap: wrap;
	}
	.btn-more {
		width: 100%;
		height: 4.6rem;
		margin-top: 4rem;
	}
	.flex-between.column {
		flex-direction: column;
	}
	.box-round-white {
		padding: 2rem;
		margin-bottom: 1.2rem;
	}
}
