/* 어그로체 */
@font-face {
    font-family: 'Aggravo';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SBAggroL.woff') format('woff');
    font-weight: 300;
    font-display: swap;
}

@font-face {
    font-family: 'Aggravo';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SBAggroM.woff') format('woff');
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: 'Aggravo';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SBAggroB.woff') format('woff');
    font-weight: 700;
    font-display: swap;
}

/* 프리텐다드 */
@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Thin.woff2') format('woff2');
    font-weight: 100;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-ExtraLight.woff2') format('woff2');
    font-weight: 200;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Light.woff2') format('woff2');
    font-weight: 300;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Regular.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Medium.woff2') format('woff2');
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Bold.woff2') format('woff2');
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-ExtraBold.woff2') format('woff2');
    font-weight: 800;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Black.woff2') format('woff2');
    font-weight: 900;
    font-display: swap;
}

:root {
	--goodjob-indigo: #6366f1;
	--goodjob-purple: #8b5cf6;

	--goodjob-navy: #111827;
	--goodjob-navy-deep: #0f172a;

	--goodjob-white: #ffffff;
	--goodjob-ivory: #f7f5f0;
	--goodjob-lavender: #f3f2ff;
	--goodjob-bluegray: #f4f6fb;

	--goodjob-line: #dde1ed;
	--goodjob-text: #111827;
	--goodjob-sub: #6b7280;

	--content-width: 1440px;

	--color-white: #ffffff;
	--color-black: #111111;
	--color-text: #16181d;
	--color-text-sub: #656b76;
	--color-line: #e8ebf0;
	--color-bg: #ffffff;
	--color-bg-soft: #f6f8fb;

	--color-primary: #5168ff;
	--color-secondary: #7657ff;

	--radius: 5px;

	--section-padding: 140px;
	--side-padding: 40px;
}

* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0;
}

html {
	width: 100%;
	scroll-behavior: auto;
}

body {
	width: 100%;
	min-width: 320px;
	margin: 0;
	background: var(--color-bg);
	color: var(--color-text);
	overflow-x: hidden;
	font-family: "Google Sans Flex", sans-serif;
}

img {
	/* display: block;
	max-width: 100%; */
    display: inline-block;
    border: 0;
}

a {
	color: inherit;
	text-decoration: none;
}

button,
input,
textarea,
select {
	font: inherit;
}

button {
	border: 0;
	background: none;
	cursor: pointer;
}

ul,
ol, li {
	list-style: none;
}

.section-common {
	position: relative;
	width: 100%;
	padding: var(--section-padding) var(--side-padding);
}

.sup-1 { font-size: 20px; }
.sup-5 { font-size: 11px; }

.section-inner {
	position: relative;
	width: 100%;
	max-width: var(--content-width);
	margin: 0 auto;
}


/* 1280px */
@media all and (max-width: 1280px) {
	:root {
		--section-padding: 120px;
		--side-padding: 32px;
	}
}


/* 1200px */
@media all and (max-width: 1200px) {
	:root {
		--section-padding: 110px;
		--side-padding: 30px;
	}
}


/* 937px */
@media all and (max-width: 937px) {
	:root {
		--section-padding: 90px;
		--side-padding: 24px;
	}
}


/* 768px */
@media all and (max-width: 768px) {
	:root {
		--section-padding: 76px;
		--side-padding: 20px;
	}
}


/* 578px */
@media all and (max-width: 578px) {
	:root {
		--section-padding: 64px;
		--side-padding: 18px;
	}
}


/* 연락 공통 */
.goodjob-contact-float {
	position: fixed;
	right: 28px;
	bottom: 30px;
	z-index: 100;
}

.goodjob-contact-float a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 25px;
	min-width: 145px;
	height: 50px;
	padding: 0 18px;
	border: 1px solid rgba(25, 34, 52, 0.14);
	background: rgba(255, 255, 255, 0.92);
	box-shadow: 0 8px 25px rgba(20, 29, 48, 0.09);
	backdrop-filter: blur(10px);
	font-size: 15px;
	font-weight: 600;
	color: #182033;
	transition:
		background 0.25s ease,
		color 0.25s ease,
		border-color 0.25s ease,
		transform 0.25s ease;
}

.goodjob-contact-float a:hover {
	border-color: var(--color-primary);
	background: var(--color-primary);
	color: #ffffff;
	transform: translateY(-3px);
}

.goodjob-contact-float i {
	font-size: 15px;
	font-style: normal;
	font-weight: 400;
}

@media all and (max-width: 1280px) {
	.goodjob-contact-float {
		right: 22px;
		bottom: 24px;
	}
}

@media all and (max-width: 1200px) {
	.goodjob-contact-float a {
		min-width: 130px;
	}
}

@media all and (max-width: 937px) {
	.goodjob-contact-float {
		right: 18px;
		bottom: 20px;
	}
}

@media all and (max-width: 768px) {
	.goodjob-contact-float {
		display: none;
	}
}

@media all and (max-width: 578px) {
}

/* 로고 */
.logo-text {
    font-family: 'Aggravo';
    font-weight: 500;
    color: #222;
    font-size: 30px;
}

.hd__logo-ai {
    background: linear-gradient(135deg, #6366f1, #3b82f6);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 12px;
}

/* aside */
.goodjob-contact-float {
	position: fixed;
	right: 28px;
	bottom: 30px;
	z-index: 100;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.goodjob-contact-float a:hover {
	transform: translateY(-2px);
}

.goodjob-contact-float a:nth-child(1):hover {
	border-color: #6366f1;
	background: #6366f1;
	color: #ffffff;
}

.goodjob-contact-float a:nth-child(2):hover {
	border-color: #111827;
	background: #111827;
	color: #ffffff;
}

.goodjob-contact-float a:nth-child(3):hover {
	border-color: var(--color-primary);
	background: var(--color-primary);
	color: #ffffff;
}

.goodjob-contact-float i {
	font-size: 15px;
	font-style: normal;
	font-weight: 400;
}

@media all and (max-width: 1280px) {
	.goodjob-contact-float {
		right: 22px;
		bottom: 24px;
	}
}

@media all and (max-width: 937px) {
	.goodjob-contact-float {
		right: 18px;
		bottom: 20px;
	}
}

@media all and (max-width: 768px) {
	.goodjob-contact-float {
		display: none;
	}
}

/* 헤더 */
/* HEADER */
.goodjob-header {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 200;
	width: 100%;
	height: 85px;
	border-bottom: 1px solid transparent;
	background: transparent;
	backdrop-filter: none;
	transition:
		background 0.3s ease,
		border-color 0.3s ease,
		backdrop-filter 0.3s ease;
}

.goodjob-header.is-scrolled {
	border-bottom-color: rgba(17, 24, 39, 0.08);
	background: rgba(255, 255, 255, 0.88);
	backdrop-filter: blur(14px);
}

.goodjob-header__inner {
	display: flex;
	align-items: center;
	width: 100%;
    height: 100%;
    margin: 0 auto;
    padding: 0 var(--side-padding);
}

.goodjob-header__logo {
	display: flex;
	align-items: center;
	gap: 9px;
	flex-shrink: 0;
}

.goodjob-header__logo img {
	display: block;
	width: 35px;
	height: 35px;
	object-fit: contain;
}

.goodjob-header__logo span {
	font-family: 'Aggravo';
	font-size: 22px;
	font-weight: 500;
	color: #fff;
}

.is-scrolled .goodjob-header__logo span {
	color: #20242d;
}

.goodjob-header__logo sup {
	margin-left: 1px;
	font-size: 8px;
	color: #6366f1;
}

.goodjob-header__nav {
	display: flex;
	align-items: center;
	gap: 32px;
	margin-left: auto;
}

.goodjob-header__nav a {
	position: relative;
	font-size: 17px;
	font-weight: 500;
	color: #fff;
	transition: color 0.25s ease;
}

.is-scrolled .goodjob-header__nav a {
	color: #68707d;
}

.goodjob-header__nav a::after {
	content: "";
	position: absolute;
	right: 0;
	bottom: -8px;
	left: 0;
	height: 1px;
	background: #6366f1;
	transform: scaleX(0);
	transform-origin: right center;
	transition: transform 0.25s ease;
}

.goodjob-header__nav a:hover {
	color: #6366f1;
}

.goodjob-header__nav a:hover::after {
	transform: scaleX(1);
	transform-origin: left center;
}

.goodjob-header__visit {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	height: 45px;
	margin-left: 34px;
	padding: 0 15px;
	border: 1px solid #6366f1;
	border-radius: 2px;
	background: #6366f1;
	font-size: 17px;
	font-weight: 600;
	color: #ffffff;
	transition:
		background 0.25s ease,
		color 0.25s ease,
		transform 0.25s ease;
}

.goodjob-header__visit:hover {
	background: #ffffff;
	color: #6366f1;
	transform: translateY(-2px);
}

.goodjob-header__visit i {
	font-size: 13px;
	font-style: normal;
}


/* 1200px */
@media all and (max-width: 1200px) {
	.goodjob-header__nav {
		display: none;
	}

	.goodjob-header__visit {
		margin-left: 24px;
	}
	.goodjob-header__inner {
	    justify-content: space-between;
	}
}


/* 768px */
@media all and (max-width: 768px) {
	.goodjob-header {
		height: 62px;
	}

	.goodjob-header__logo span {
		font-size: 18px;
	}

	.goodjob-header__visit {
		height: 34px;
		margin-left: auto;
	}
}


/* 578px */
@media all and (max-width: 578px) {
	.goodjob-header__visit span {
		display: none;
	}

	.goodjob-header__visit {
		width: 34px;
		padding: 0;
		justify-content: center;
	}
}

/* 푸터 */
.goodjob-footer {
	padding: 24px var(--side-padding);
	border-top: 1px solid #e8ebf0;
	background: #ffffff;
}

.goodjob-footer p {
	font-size: 16px;
	color: #9aa1ac;
}