@charset "UTF-8";

.info-text--frame {
	display:block;
	width:100%;
	border-top:2px solid #000;
	border-bottom:1px solid #000;
	padding:30px;
}
.info-text--frame.no-br-top {
	padding-top:10px;
	border-top:0px;
}
	.info-text--frame .block {
		display:block;
		width:100%;
		font-weight:600;
		font-size:0.91rem;
		color:#000;
		line-height:1.4;
	}
	.info-text--frame .block:not(:last-of-type) { margin-bottom:6px; }

.apply-form--frame .req-text {
	display:block;
	width:100%;
	font-weight:600;
}
	.apply-form--frame .required { color:#f00; font-weight:600; }

/**********  **********/
.form-frame {
	display:block;
	width:100%;
}
	.form-frame .form-group {
		display:block;
		width:100%;
	}
	.form-frame .form-group:not(:last-of-type) { margin-bottom:25px; }
		.form-frame .form-group--title {
			display:block;
			width:100%;
			font-weight:600;
			color:#000;
			font-size:1rem;
		}

			.form-frame .input-type--text {
				border:1px solid #b2b2b2;
				padding:10px;
			}
			.form-frame .input-type--select {
				display:block;
				padding:10px;
				background-color:#fff;
				border:1px solid #b2b2b2;
				border-radius:5px;
				font-weight:600;
			}

			.form-frame .form-btn--frame {
				display:flex; 
				justify-content:center;
				width:100%;
			}
				.form-frame .form-btn--frame .btn {
					display:block;
					border:0px;
					transition:0.3s all ease-in-out;
				}

				.form-frame .login-btn {
					display:block;
					width:100%;
					padding:15px;
					background-color:#007fc7;
					text-align:center;
					color:#fff;
					font-weight:600;
					font-size:1rem;
				}
				.form-frame .login-btn:hover,
				.form-frame .login-btn:focus {
					text-decoration:none;
					background-color:#0095d9;
				}

				 .chkbox-frame {
					display:flex; 
					justify-content:space-between;
					flex-wrap:wrap;
					width:100%;
					padding:20px;
					background-color:#fafafa;
					border:1px solid #ccc;
					border-radius:10px;
				}
				.chkbox-frame .chkbox-text,
				.chkbox-frame .chkbox-check { align-self:center; }

				.chkbox-frame .chkbox-text { display:block; }
				.chkbox-frame .chkbox-check {
					display:flex; 
					justify-content:flex-start;
				}

				.chkbox-frame .chk-label,
				.chkbox-frame .chk {
					align-self:center;
					display:block;
				}
				.chkbox-frame .chk-label:hover,
				.chkbox-frame .chk-label:focus,
				.chkbox-frame .chk:hover,
				.chkbox-frame .chk:focus { cursor:pointer; }
				
				.chkbox-frame .chk { margin-right:10px; }

				.chkbox-frame .chkbox-text,
				.chkbox-frame .chk-label {
					font-weight:600;
					font-size:0.85rem;
					color:#000;
				}
				
				.form-frame .form-flex--group {
					display:flex;
					justify-content:flex-start;
					flex-wrap:wrap;
					width:100%;
					margin-bottom:25px;
				}

/********** 공통 신청 폼 디자인 **********/
.cmn-form { display:block; width:100%; }
	.cmn-form select {
		-webkit-appearance:none;
		-moz-appearance:none;
		appearance:none;
		background:url('/res/img/home/sub/image_bg_form_select_arrow.png') no-repeat 95% center;
	}
	.cmn-form select::-ms-expand { display:none; }
	.cmn-form select:invalid { color:gray; }

		.cmn-form .form-item-list.normal {
			display:block;
			width:100%;
		}
		.cmn-form .form-item-list.flex {
			display:flex;
			justify-content:flex-start;
			width:100%;
		}

			.cmn-form .form-item-list .item-title { 
				display:block;
				width:100%;
				font-weight:600;
				color:#000;
				letter-spacing:-.9px;
			}
			.cmn-form .form-item-list .item {
				width:100%;
				padding-top:12px;
			}
			.cmn-form .form-item-list .item:not(.flex-box) { display:block; }
				.cmn-form .form-item-list .item input,
				.cmn-form .form-item-list .item select,
				.cmn-form .form-item-list .item button {
					padding:10px;
					border:1px solid #b2b2b2;
					border-radius:5px;
					font-weight:600;
				}

				.cmn-form .form-item-list textarea {
					display:block;
					width:100%;
					height:300px;
					padding:10px;
					border:1px solid #b2b2b2;
					border-radius:5px;
					font-size:0.85em;
					font-weight:600;
					resize:none;
					overflow-y:auto;
				}
				
				.cmn-form .form-item-list.normal .form-item { display:block; width:100%; }
				.cmn-form .form-item-list .flex-item { display:block; }

/* 회원가입 */
.apply-form--frame.sign-up .input-area {
	padding-bottom:40px;
	border-bottom:1px solid #ccc;
}

	.apply-form--frame.sign-up .input-area .textarea {
		display:block;
		width:100%;
		min-height:200px;
		resize:none;
	}
	
	
	.apply-form--frame .form-group-flex {
		display:flex;
		justify-content:flex-start;
		flex-wrap:wrap;
		width:100%;
	}
	.apply-form--frame .form-group-flex:not(:last-of-type) { margin-bottom:25px; }

		.apply-form--frame .form-group-flex .form-group-flex--title {
			display:block;
			font-weight:600;
			color:#000;
		}
		.apply-form--frame .form-group-flex .input-type--text-sm,
		.apply-form--frame .form-group-flex .input-type--select-sm {
			display:block;
			padding:10px;
			border:1px solid #b2b2b2;
			border-radius:5px;
			font-weight:600;
			font-size:0.85rem;
		}
		.apply-form--frame .form-group-flex .input-type--btn {
			padding-left:15px;
			padding-right:15px;
			background-color:#07496e;
			border:1px solid #07496e;
			border-radius:5px;
			color:#fff;
			font-size:0.85rem;
			font-weight:600;
		}
		.apply-form--frame .form-group-flex .input-type--btn:hover,
		.apply-form--frame .form-group-flex .input-type--btn:focus { background-color:#0095d9; }
	
	.info-text {
		display:block;
		width:100%;
		margin-top:7px;
		font-weight:600;
		font-size:0.8rem;
		color:rgba(0,0,0,.7);
	}
		.info-text.c-error { color:#f00; }

.signup-form {
	display:block;
	width:100%;
	padding:50px 0;
}
	.signup-form .signup-form-frame { display:block;  }

	.apply-form--frame .cmn-form .form-item-list .adr-search-btn {
		margin-left:10px;
		padding-left:20px;
		padding-right:20px;
		background-color:#27945b;
		border-color:#27945b;
		color:#fff;
		transition:0.3s all ease-in-out;
	}
	.apply-form--frame .cmn-form .form-item-list .adr-search-btn:hover,
	.apply-form--frame .cmn-form .form-item-list .adr-search-btn:focus { background-color:#105330; }
	
		.apply-form--frame .account-info .account-select select { font-size:0.85rem }
			
			.apply-form--frame input[readonly] {
				background-color:#ddd;
				border-color:#ccc;
				color:#646464;
				outline:none;
			}
		
	.overflow-box {
		display:none;
		width:100%;
		height:350px;
		padding:15px 30px;
		margin:20px 0;
		background-color:#fff;
		border:1px solid #ccc;
		border-radius:10px;
		overflow-y:auto;
	}

	.apply-form--frame .law-more--title {
		display:flex;
		justify-content:space-between;
		align-items:center;
	}
		.apply-form--frame .law-more--title .title-text { display:block; }
		.apply-form--frame .law-more--title .more-law--btn {
			display:flex; 
			justify-content:flex-start;
			align-items:center;
			width:auto;
			padding:5px 10px;
			background-color:#fff;
			border:1px solid #249e5d;
			border-radius:20px;
			transition:0.3s all ease-in-out;
		}
		.apply-form--frame .law-more--title .more-law--btn:hover,
		.apply-form--frame .law-more--title .more-law--btn:focus {
			background-color:#fafafa;
			text-decoration:none;
		}
			.apply-form--frame .law-more--title .more-law--btn .text,
			.apply-form--frame .law-more--title .more-law--btn .icon {
				display:block;
				font-size:0.8rem;
				color:#249e5d;
			}
			.apply-form--frame .law-more--title .more-law--btn .text { margin-right:20px; }
			
		.apply-form--frame .law-more--title .more-law--btn.active { background-color:#249e5d; }
			.apply-form--frame .law-more--title .more-law--btn.active .text,
			.apply-form--frame .law-more--title .more-law--btn.active .icon { color:#fff; }

.custom-checkbox {
	display:flex;
	justify-content:flex-end;
}
	.custom-checkbox input[type="checkbox"]{ display:none; }

	.custom-checkbox .custom-chk {
		display:flex;
		justify-content:flex-start;
		-ms-flex-pack:start;
		width:108px;
		padding:12px;
		border:1px solid #ccc;
		position:relative;
	}
	.custom-checkbox .custom-chk .square,
	.custom-checkbox .custom-chk .text { align-self:center; display:block; }
	.custom-checkbox .custom-chk .square {
		width:14px;
		height:14px;
		margin-right:10px;
		border:1px solid #ccc;
	}

	.custom-checkbox .custom-chk .text {
		font-size:0.85rem;
		font-weight:600;
		color:#000;
	}

	.custom-checkbox input[id="checkAll"]:checked + .custom-chk {
		background-color:#30ae9e;
		border-color:#30ae9e;
	}
	.custom-checkbox input[id="checkAll"]:checked + .custom-chk .text { color:#fff; }

	.custom-checkbox input[id="checkAll"]:checked + .custom-chk .square {
		background-color:#30ae9e;
		border-color:#fff;
		border-width:3px;
	}

	.custom-checkbox .custom-chk:hover,
	.custom-checkbox .custom-chk:focus { cursor:pointer; }

/****************** 회원가입 완료화면 - 회원번호 안내 ******************/
.member-Number {
	display:flex;
	justify-content:center;
	align-items:center;
	flex-wrap:wrap;
	margin-top:10px;
	padding:20px;
	background-color:#fafafa;
	border:1px solid #ccc;
	border-radius:10px;
}
	.member-Number .number-title {
		display:inline-block;
		width:auto;
		padding:10px 20px;
		background-color:#00a59d;
		border-radius:30px;
		color:#fff;
		font-weight:600;
		font-size:0.85rem;
	}
		.member-Number .number-cont {
			display:block;
			width:100%;
			margin-top:10px;
			font-size:1.5rem;
			font-family:'SEBANG_Gothic_Regular', sana-serif;
			font-weight:400;
			letter-spacing:-.9px;
		}

/********** 아이디 / 비밀번호 찾기 **********/
.find-box {
	display:block;
	width:100%;
	word-wrap:break-word;
	word-break:keep-all;
}

	.find-box .input-area {
		padding-top:40px;
		padding-bottom:40px;
		border-bottom:1px solid #ccc;
	}
		.find-box .apply-form--frame select { background-color:#fff; }
		.find-box .form-title {
			display:block;
			width:100%;
			margin-bottom:20px;
			text-align:center;
			font-weight:600;
			font-size:1.15rem;
			color:#000;
			letter-spacing:-.6px;
		}

		.find-complete .complete-title {
			line-height:1.2;
			word-wrap:break-word;
			word-break:keep-all;
		}


/********** responsive - start **********/ 

.form-group--input .block { display:block; width:100%; padding-top:12px; font-weight:600; color:#000; }

/* Mobile */
@media screen and (min-width:1px) and (max-width:639px) {
	.info-text--frame.no-br-top {
		padding-top:30px;
		border-top:2px solid #000;
	}
	
	/********** 회원가입 - 회원가입 폼 **********/
	.apply-form--frame .form-group-flex .form-group-flex--title,
	.apply-form--frame .form-group-flex .form-group--input { width:100%; }
	.apply-form--frame .form-group-flex .form-group--input { margin-top:8px; }
	
	.apply-form--frame .form-group-flex .flex-item,
	.apply-form--frame .form-group-flex .input-type--text-sm, 
	.apply-form--frame .form-group-flex .input-type--select-sm { width:100% !important; }
	
	.apply-form--frame .input-area .mr-4, 
	.apply-form--frame .input-area .ml-5,
	.apply-form--frame .input-area .mr-10 { margin:0px; }
	
	.apply-form--frame .form-group-flex .input-type--btn { width:100%; margin-top:5px; padding:10px; }
	
	/********** 공통 신청 폼 디자인 **********/
	.cmn-form .form-item-list .item-title { font-size:0.91em; }
	
	.cmn-form .form-item-list .item input,
	.cmn-form .form-item-list .item select,
	.cmn-form .form-item-list .item button { height:30px; font-size:0.80em; }
	
	.cmn-form .form-item-list .item button,
	.cmn-form .form-item-list .item select { padding:0px 10px; }
	
	.cmn-form .form-item-list:not(:last-of-type) { margin-bottom:15px; }
	
	.cmn-form .form-item-list.flex .form-item { display:block; width:100%; }
	.cmn-form .form-item-list.flex .form-item:nth-of-type(n+2) { margin-top:12px; }
	
	.cmn-form .email input,
	.cmn-form .email select { width:100%; }
	
	.cmn-form .email { flex-wrap:wrap; }
	.cmn-form .email select { background-color:#fff; }
	.cmn-form .email .item-input1 { width:47.5%; }
	.cmn-form .email .item-input2 { width:47.5%; }
	.cmn-form .email .item-text { width:5%; text-align:center; }
	.cmn-form .email .item-select { width:100%; margin-top:10px; }
	
	/* 회원가입 */
	.apply-form--frame .account-info .account-select { width:100%; margin-bottom:12px; }
	.apply-form--frame .account-info .account-name { width:100%; margin-bottom:12px; } 
	.apply-form--frame .account-info .account-number { width:100%; }
	
	.cmn-form .form-item-list.flex .form-item { width:100%; }
	
	.apply-form--frame .nickname--frame .form-items input,
	.apply-form--frame .nickname--frame .form-items .certi-btn { width:100%; }
	
	.apply-form--frame .nickname--frame .form-items .certi-btn { margin-top:8px; }
	
	.apply-form--frame .adr-search--input input { width:calc(100% - (30% + 10px)); }
	.apply-form--frame .adr-search--input button { width:30%; }
	
	.apply-form--frame .find-password .find-password--answer { margin-top:10px; }
	
	/****************** 회원가입 완료화면 - 회원번호 안내 ******************/
	.member-Number { width:100%; }
	
	/********** 아이디/비밀번호 찾기 **********/
	.find-complete .complete-discription { font-size:0.85rem; }
	
	.find-box .input-area { border-top:2px solid #000; }
}

/* Mobile & Tablet */
@media screen and (min-width:1px) and (max-width:1316px) {
	/* 회원가입 */
	.apply-form--frame {
		padding:0px;
		padding-top:30px;
		padding-bottom:5px;
		border:0px;
	}
				
		.signup.signup-form .form-frame {
			padding:20px;
			padding-top:0px;
			border:1px solid #ccc;
			border-top:0px;
		}
			.signup.signup-form .arrow-btn-box { margin-top:20px; }
			.signup.signup-form .arrow-btn-box .arrow-btn { width:180px; padding:15px; }
			.signup.signup-form .arrow-btn-box .arrow-btn .text, 
			.signup.signup-form .arrow-btn-box .arrow-btn .icon { font-size:0.8rem; }
			
			
}

/* Tablet */
@media screen and (min-width:640px) and (max-width:1316px) {	
	.apply-form--frame .account-info .account-select { width:49%; margin-right:2%; }
	.apply-form--frame .account-info .account-name { width:49%; } 
	.apply-form--frame .account-info .account-number { width:100%; margin-top:15px; }
	
	.apply-form--frame .nickname--frame .input-type--text-sm { width:45%; }	
	.apply-form--frame .adr-search--input .input-type--text-sm { width:25%; }
}

/* Tablet & PC */
@media screen and (min-width:640px) {	
	/********** 공통 신청 폼 디자인 **********/
	.cmn-form .form-item-list .item-title { font-size:1em; }
	 
	.cmn-form .form-item-list .item input,
	.cmn-form .form-item-list .item select,
	.cmn-form .form-item-list .item button { height:45px; font-size:0.85em; }
	
	.cmn-form .form-item-list:not(:last-of-type) { margin-bottom:25px; }	
		
	.cmn-form .form-item-list.flex .form-item { display:block; width:49%; }
	.cmn-form .form-item-list.flex .form-item:nth-of-type(odd) { margin-right:2%; }
	
	.cmn-form .email input,
	.cmn-form .email select { width:100%; }
	
	.cmn-form .email .item-input1 { width:32%; }
	.cmn-form .email .item-input2 { width:32%; }
	.cmn-form .email .item-text { width:5%; text-align:center; }
	.cmn-form .email .item-select { width:30%; margin-left:1%; }
	
	/********** 회원가입 - 회원가입 폼 **********/
	.apply-form--frame .form-group-flex .form-group-flex--title {
		width:200px;
		padding-top:12px;
		text-align:center;
	}
	.apply-form--frame .form-group-flex .form-group--input { width:calc(100% - 200px); }
	
	.apply-form--frame .adr-search--input input { width:calc(100% - (30% + 10px)); }
	.apply-form--frame .adr-search--input button { width:30%; }
	
	.apply-form--frame .nickname--frame .input-type--btn { width:10%; margin-left:2%; }
	.apply-form--frame .adr-search--input .input-type--btn { width:15%; margin-left:2%; }
	
	.apply-form--frame .find-password .find-password--question { width:49%; margin-right:2%; }
	.apply-form--frame .find-password .find-password--answer { width:49%; }
	
	/****************** 회원가입 완료화면 - 회원번호 안내 ******************/
	.member-Number {
		width:350px;
		margin-left:auto;
		margin-right:auto;
	}
	
	/********** 아이디/비밀번호 찾기 **********/
	.find-complete .complete-discription { font-size:1rem; }
	
	.find-box .info-text--frame { padding-top:0px; }
}

/* PC */
@media screen and (min-width:1317px) {
	/* 회원가입 */
	.apply-form--frame .account-info .account-select { width:23%; margin-right:2%; }
	.apply-form--frame .account-info .account-name { width:15%; margin-right:2%; } 
	.apply-form--frame .account-info .account-number { width:58% }
	
	.apply-form--frame .nickname--frame .input-type--text-sm { width:35%; }
	
	.apply-form--frame .adr-search--input .input-type--text-sm { width:20%; }
	
	/********** 아이디/비밀번호 찾기 **********/
	.find-complete .complete-title .block { display:block; width:100%; }
}

/* print */
@media print {
	
}