@charset "utf-8";


/* ******************** component ******************** */

/* input */ 
@import "../../component/input-style";

/* button */ 
@import "../../component/button-style";

/* sub-cont */ 
@import "../common/_sub-cont";

/* title-style */ 
@import "../../component/title-style.scss";

/* board */
@import "../../component/vertical-table";

/* board */
@import "../../component/normal-table";


/* ******************** sub-common ******************** */ 

/* sub-banner */ 
@import "../common/_sub-banner";

/* sub-tab */ 
@import "../common/_sub-tab";

/* sub-cont */ 
@import "../common/_sub-cont";



/* ******************** RISE ******************** */

/* banner */ 
@import "./banner";





.s-title {
	text-align: center; font-weight: 600; font-size: 2.2rem; margin: 50px 0 30px;
	&:before {
		display: none;
	}
}
.s-title-description {
	text-align: center; font-weight: 600; font-size: 2.2rem; margin: 50px 0 15px;
}
.s-description {
	text-align: center; font-weight: 300; font-size: 1.5rem; margin: 0 0 25px;
}
.application-wrap {
	margin: 0 auto;
	.app-box {
		margin-bottom: 25px; border: 1px solid var(--line-color);
		ul {
			display: flex; flex-wrap: wrap; gap: 10px; padding: 20px 20px 0;
			li {
				width: calc(50% - 5px); margin-bottom: 25px;
				&:nth-of-type(even) {
					margin-right: 0;
				}
				> label {
					cursor: default; color: #444; font-weight: 600;
				}
				label {
					width: 100%; display: block; font-size: 1.4rem; 
				}
				input[type=text] {
					width: 100%; height: 40px; padding: 0 10px; margin-top: 10px; border: 1px solid var(--line-color); border-radius: 4px; font-family: 'Noto Sans KR', sans-serif;
					&:hover {
						border-color: #b5b5b5;
					}
				}
				textarea {
					resize: none; width: 100%; height: 100px; padding: 10px; margin-top: 7px; border: 1px solid var(--line-color); border-radius: 4px; font-family: 'Noto Sans KR', sans-serif;
					&:hover {
						border-color: #b5b5b5;
					}
				}
				.check-wrap {
					display: flex; gap: 15px; flex-wrap: wrap; margin-top: 15px;
					.check {
						line-height: 9px;
					}
					input[type=radio],
					input[type=checkbox] {
						& + label {
							width: auto; display: inline-block; padding-left: 3px; 
						}
					}
				}
				.check-wrap.position {
					position: relative; top: 5px;
				}
				.file-input {
					>.label {
						color: #333; white-space: nowrap; vertical-align: top; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; padding-right: 55px; display: block;
					}
					>.label.empty {
						color: #888; opacity: .5;
					}
				}
			}
			li.description {
				margin-bottom: 0;
			}
			li.w-100 {
				width: 100%;
			}
		}
		p.title {
			width: 100%; font-size: 1.6rem; font-weight: 500; padding: 10px 20px; background: #f0f0f0; border-bottom: 1px solid var(--line-color); position: relative;
			.icon {
				width: 20px; height: 20px; margin-right: 7px;
			}
			span.del-btn {
				.icon {
					position: absolute; color: #b51212; top: 5px; right: 10px; font-size: 2.5rem; border-radius: 4px; cursor: pointer; padding-right: 0; width: 28px; height: 28px;
					&:hover {
						opacity: .7;
					}
				}
			}
		}
	}
	>.add-btn {
		width: 100%; margin-bottom: 20px; cursor: pointer;
		span {
			display: inline-flex; align-items: center; justify-content: center; width: 100%; height: 45px; line-height: 45px; background: #dfe9f7; text-align: center; font-size: 1.5rem; font-weight: 500; border-radius: 5px; color: #314561;
			.icon {
				margin-right: 7px; width: 20px; height: 20px;
			}
		}
		&:hover {
			span {
				background: #d7e1ef;
			}
		}
	}
}
.application-wrap02 {
	.app-box {
		ul {
			li {
				width: 100%; margin-right: 0;
			}
		}
	}
}
.im {
	font-size: 1.3rem; color: #c50808;
}
.content-box {
	margin-bottom: 20px;
}
.app-btn {
	margin: 0 auto 20px;
	button {
		cursor: pointer; display: inline-block; width: 100%; height: 45px; line-height: 45px; background: var(--main-color); text-align: center; font-size: 1.5rem; font-weight: 600; border: 0; border-radius: 5px; color: #fff;
	}
	&:hover {
		button {
			background: #3f62d9;
		}
	}
	.loading-btn {
		cursor: pointer; display: inline-block; width: 100%; height: 45px; line-height: 45px; background: #ffc3a3; text-align: center; font-size: 1.5rem; border: 0; border-radius: 5px; color: #fff;
	}
}
.private-info-agreement {
	margin: 0 auto 30px;
	.title {
		display: block; font-size: 1.5rem; font-weight: bold; margin-bottom: 10px;
	}
	.textbox {
		background: #f0f0f0; padding: 15px; font-size: 1.3rem; line-height: 21px; border: 1px solid var(--line-color);
	}
	.check {
		padding: 10px; border: 1px solid var(--line-color); margin: 10px 0;
		.check-label {
			font-size: 1.25rem; height: 20px; margin: 9px 15px 6px 5px; cursor: pointer;
			.imp {
				color: #c50808; font-size: 1.2rem;
			}
		}
	}
}
.file-input {
	display: inline-block; text-align: left; width: 700px; max-width: 100%; position: relative; padding-left: 10px; font-size: 1.2rem; line-height: 40px; vertical-align: middle; background-color: #fff; cursor: pointer; border: 1px solid var(--line-color); font-weight: 400; border-radius: 5px; margin-top: 7px;
	>input[type='file'] {
		position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; z-index: 301; cursor: pointer; margin-top: 0 !important;
	}
	>.button {
		display: inline-block; padding: 0; font-size: 1.2rem; vertical-align: top; background-color: #1f1f1f; cursor: pointer; border: 1px solid #1f1f1f; border-bottom-color: #1f1f1f; border-radius: 4px; font-weight: 400; color: #fff; height: 42px; border-top-left-radius: 0; border-bottom-left-radius: 0; position: absolute; z-index: 2; top: -1px; right: -1px; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; width: 70px; text-align: center; line-height: 40px;
	}
	&:hover {
		>.button {
			background: #000; color: #fff; border-color: #000;
		}
	}
}
.file-row {
	&:not(:first-child) {
		margin: 5px 0 0;
	}
}
.down-file-wrap {
	margin-top: 20px;
	a.file {
		height: 40px; display: inline-block; margin: 2.5px 2.5px 2.5px 0; height: 100%; border: 1px solid #d1dae6; border-radius: 50px; padding: 5px 20px 5px 40px; font-size: 1.4rem; position: relative; background: #f7f7f7; line-height: 20px;
	}
	a {
		&:hover {
			background: #F0F0F0;
		}
		&:before {
			position: absolute; content: ''; width: 16px; height: 16px; background: url('../../../../../img/sub/linc/common/down_icon.svg'); background-size: 16px 16px; left: 16px; top: 7px; opacity: .6;
		}
	}
}
@media (max-width: 1270px) {
	.application-wrap {
		.app-box {
			ul {
				li {
					.check-wrap {
						gap: 20px 15px;
					}
				}
			}
		}
	}
}
@media (max-width: 970px) {
	.content-area {
		.content-box.info {
			.text {
				width: 100%; font-size: 1.5rem;
			}
		}
	}
	.down-file-wrap {
		a.file {
			font-size: 1.3rem;
		}
	}
}
@media (max-width: 600px) {
	.content-area {
		.content-box.info {
			.text {
				word-break: keep-all; padding: 30px 20px;
				br {
					display: none;
				}
			}
		}
	}
	.down-file-wrap {
		a.file {
			padding: 10px 20px 10px 45px;
		}
		a {
			&:before {
				top: 50%; margin-top: -3.5px; background-size: 20px 20px; width: 20px; height: 20px; margin-top: -10px;
			}
		}
	}
	.private-info-agreement {
		.check {
			.check-label {
				margin: 9px 0px 6px 0;
			}
		}
	}
}
