/* layout */
.setup-guide section {
	margin-bottom: 0;
	scroll-margin-top: 200px;
}

.setup-guide__cover {
	z-index: 3;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 100px;
	width: 100%;
	height: calc(100dvh - 118px);
	background: url("../../assets/images/img_bg_order.jpg") no-repeat center /
		cover;
}

.setup-guide__cover .setup-guide__text-box {
	flex: 0 0 50%;
}

.setup-guide__cover .setup-guide__text-box {
	width: 620px;
}

.setup-guide__tit {
	font-size: 55px;
}

.setup-guide__tit span {
	color: var(--ci-blue);
	font-size: 55px;
	font-weight: 400;
}

.setup-guide__subject {
	color: var(--grayScale-10);
	font-size: 18px;
	font-weight: 400;
	margin-top: 20px;
}

/* scroll ani */
.scroll-ani {
	position: absolute;
	bottom: 30px;
	left: calc(50%);
	transform: translateX(-50%);
}

.scroll-ani__arrow {
	animation: topDown 1s linear infinite;
}

.scroll-ani__text {
	animation: fadeInOut 1s linear infinite;
}

/* nav */
.setup-guide-nav {
	background: var(--ci-blue);
	position: sticky;
	top: 145px;
	z-index: 2001;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 100px;
}

.setup-guide-nav__item {
	display: inline-flex;
	align-items: center;
	text-align: center;
	height: 80px;
	line-height: 85px;
	flex: 0 0 auto;
	color: var(--grayScale-01);
	font-size: 24px;
	font-weight: 600;
}

.setup-guide-nav__item:not(:last-of-type):after {
	content: "";
	width: 2px;
	height: 20px;
	display: block;
	margin-left: 100px;
	background-color: #029dd3;
}

.setup-guide__cover .inner {
	width: 1280px;
}

/* content */
.setup-guide__contents .inner {
	width: 1280px;
	display: flex;
	flex-direction: column;
	gap: 50px;
	padding: 150px 0;
}

.setup-guide__contents:nth-of-type(2n) {
	background-color: var(--grayScale-03);
}

.setup-guide__contents .setup-guide__text-box {
	font-size: 32px;
	text-align: center;
	font-weight: 600;
	color: var(--grayScale-15);
	word-break: keep-all;
}

.setup-guide__sub-tit {
	font-size: 22px;
	color: var(--grayScale-12);
	margin-bottom: 16px;
}

.setup-guide__contents .setup-guide__text-box span {
	color: var(--ci-blue);
}

/* content list */
.guide-list {
	display: none;
	animation: fadeInUp 0.8s ease-out;
}

.guide-list.active {
	display: block;
}

.guide-list.active {
	display: flex;
	justify-content: space-between;
	gap: 40px;
}

.guide-list__item {
	flex: 0 1 auto;
}

.guide-list__img {
	flex: 0 0 auto;
	position: relative;
	border-radius: 20px;
}

.guide-list__img img {
	border-radius: inherit;
}

.guide-list__item:not(:last-of-type) .guide-list__img::after {
	content: "";
	width: 40px;
	height: 40px;
	display: block;
	position: absolute;
	right: -60px;
	top: 50%;
	font-size: 30px;
	transform: translate(-50%, 0) rotate(180deg);
	background: url("../../assets/images/ico_btn_prev_gry.svg") no-repeat
		center / contain;
}

.guide-list__dsc {
	margin-top: 32px;
	text-align: center;
	word-break: keep-all;
}

.guide-list__dsc h3 {
	color: var(--grayScale-12);
	font-size: 24px;
	font-weight: 900;
}

.guide-list__dsc p {
	color: var(--grayScale-08);
	text-align: center;
	font-size: 18px;
	font-weight: 400;
	margin-top: 8px;
}

/* etc */
.info_txt {
	text-align: center;
	color: var(--grayScale-06);
	font-size: 16px;
	margin-top: auto;
}
