@charset "UTF-8";

/********** 공통 **********/
html.none-scroll {
    overflow: hidden;
}
.layout-container { display:block; width:100%; }

.cont-box {
	display:block;
	width:100%;
}

.border-box-design {
	border:1px solid #ccc;
	border:1px solid var(--color-gray-light);
	background-color:#fff;
	background-color:var(--color-white);
	border-radius:10px;
}

.color-red { color:#f00; }
.color-emerald { color:#21bdbd; }
.color-deepblue { color:#3262af; }
.color-yellow { color:#ff0; }
.color-white { color:#fff; color:var(--color-white); }
.color-black { color:#000; color:var(--color-black); }
.color-blue { color:#0095d9; }

/*.container-organization { display:none !important; }*/

.btn-bg-color {
	width:100px;
	margin-left:10px;
	background-color:#07496e !important;
	border:0px;
	border-radius:5px;
	color:#fff !important;
	color:var(--color-white) !important;
	font-weight:600;
	font-size:0.85rem;
	transition:0.3s all ease-in-out;
}

.btn-bg-color:hover,
.btn-bg-color:focus {
	background-color:#638cdf !important;
}

/********** 인쇄버튼 **********/
.print-btn {
	display:flex;
	justify-content:center;
	align-items:center;
	width:40px;
	height:40px;
	margin-top:20px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:45px;
	background-color:#464646;
	border-radius:20px;
	color:#fff;
	color:var(--color-white);
}
	.print-btn i { display:block; }

/********** 타이틀 **********/
.common-title {
	display:block;
	width:100%;
	margin-top:45px;
	margin-bottom:20px;
	font-size:1.2rem;
	font-weight:600;
	line-height:1.4;
	color:#000;
	color:var(--color-black);
}
.common-title.no-margin { margin-top:0px; }

/********** 공통 리스트 텍스트 **********/
.common-text--frame {
	display:block;
	width:100%;
}
	.common-text--frame .list-txt {
		display:block;
		width:100%;
		padding-left:12px;
		background:url('../../img/home/common/img-dot.jpg') no-repeat left 9px;
		word-wrap:break-word;
		word-break:keep-all;
		overflow-wrap:anywhere;
		font-size:0.91rem;
		font-weight:600;
		line-height:1.5;
	}
	.common-text--frame .list-txt:not(:last-of-type) { margin-bottom:9px; }

		.common-text--frame .list-txt .s-txt {
			display:block;
			width:100%;
			margin-top:5px;
			font-size:0.91rem;
			color:#173461;
		}

/********** 서브 레이아웃 **********/
.sub-container--frame {
	display:flex;
	justify-content:flex-start;
	flex-wrap:wrap;
	position:relative;
}

.sub-container--navi { display:block; }

.sub-container { display:block; }

/********** 타이틀 디자인 **********/
.title-frame {
	display:block;
	width:100%;
	text-align:center;
}
	.title-frame .sub-common-title {
		display:inline-flex;
		justify-content:center;
		flex-direction:column;
		width:auto;
		background-image:url('../../img/home/page/sub/image_sub_title_bg.png');
		background-repeat:no-repeat;
		background-position:center top;
		padding-top:45px;
		font-weight:600;
		font-family:'GmarketSansBold', sans-serif;
		font-size:3rem;
		color:#000;
		color:var(--color-black);
		letter-spacing:-.6px;
	}
	
	.title-frame .sub-common-title::after {
		content:'';
		width:38px;
		height:2px;
		margin:45px auto;
		background-color:#000;
		background-color:var(--color-black);
		background-color:var(--color-black);		
	}

/********** 에러 페이지 디자인 **********/
.error-page {
	display:block;
	width:100%;
	padding-top:100px;
	padding-bottom:100px;
	word-wrap:break-word;
	word-break:keep-all;
	overflow-wrap:anywhere;
}
	.error-page .error-page-frame {
		display:block;
		width:100%;
	}
		.error-page .error-header {
			display:block;
			width:100%;
		}
			.error-page .error-header .block {
				display:block;
				width:100%;
				text-align:center;
			}
			
		.error-page .error-header .error-title {
			font-family:'SEBANG_Gothic_Bold', sans-serif;
			color:#000;
			color:var(--color-black);
		}
			.error-page .error-header .error-title * { font-family:'SEBANG_Gothic_Bold', sans-serif; }
			
		.error-page .error-header .error-sub-title {
			margin-top:20px;
			letter-spacing:-.9px;
		}
		
		.error-page .error-content {
			display:block;
			width:100%;
			margin-top:50px;
			text-align:center;
		}
			.error-page .error-content .block {
				display:block;
				width:100%;
				color:#000;
				color:var(--color-black);
				line-height:1.4;
			}

/********** blank page **********/
.blank-page {
	display:block;
	width:100%;
	padding:50px 0;
	word-break:keep-all;
	word-wrap:break-word;
	overflow-wrap:anywhere;
}
	.blank-page .image-box {
		display:block;
		width:100%;
		text-align:center;
	}
		.blank-page .image-box img {
			vertical-align:top;
			max-width:100%;
		}
	.blank-page .blank-page-title {
		display:block;
		font-family:'SEBANG_Gothic_Regular', sans-serif;
		font-weight:300;
		text-align:center;
		color:#000;
		color:var(--color-black);
		margin-top:20px;
	}
		.blank-page .blank-page-title .color1 {
			font-family:'SEBANG_Gothic_Regular', sans-serif;
			color:#8f328a;
		}
		
	.blank-page .blank-page-description {
		display:block;
		width:100%;
		font-weight:600;
		font-size:1rem;
		color:#000;
		color:var(--color-black);
		margin-top:20px;
	}
	
		.blank-page .blank-page-description .block {
			display:block;
			width:100%;
			line-height:1.4;
			text-align:center;
			letter-spacing:-.6px;
		}

.ffl-wrapper {
	display:block;
	width:100%;
	position:relative;
	padding-top:1rem;
	margin-bottom:15px;
}
	.ffl-wrapper .ffl-label {
		max-width:100%;
		transition:0.2s all ease-in-out;
		transition-delay:0s;
		position:absolute;
		top:1.4rem;
		white-space:nowrap;
		text-overflow:ellipsis;
		overflow:hidden;
		pointer-events:none;
		font-weight:600;
		color:rgba(0,0,0,.6);
		font-size:0.91em;
	}
		.ffl-wrapper.ffl-floated .ffl-label {
			top:0px;
			font-size:0.7em;
			color:#c0b151;
		}
		.ffl-wrapper input {
			display:block;
			width:100%;
			height:30px;
			padding:0;
			background-color:transparent;
			border:0px;
			border-bottom:1px solid rgba(0, 0, 0, 0.2);
			transition:border-bottom 100ms ease;
			outline:0;
		}
		.ffl-wrapper input:focus-visible {
			outline:none;
			border-bottom-color:#13489e;                                /* IE11 폴백 */
			border-bottom-color:var(--color-primary);
			box-shadow:0 1px 0 0 #13489e;                               /* IE11 폴백 — 밑줄 강조 */
			box-shadow:0 1px 0 0 var(--color-primary);
		}
		.ffl-wrapper.ffl-floated input {
			border-bottom-color:#13489e;                                /* IE11 폴백 */
			border-bottom-color:var(--color-primary);
		}

/********** 모바일 서브메뉴 & breadcrumb **********/
.mob-sub-nav .mob-sub-nav-item .mob-sub-nav--select-text:not(.active) { display:none; }

/********** 완료 페이지 디자인 **********/
.complete {
	display:block;
	width:100%;
	padding:100px 50px;
	word-wrap:break-word;
	word-break:keep-all;
	overflow-wrap:anywhere;
}
	.complete .image-box {
		display:block;
		width:100%;
		text-align:center;
	}
		.complete .image-box img {
			vertical-align:top;
			max-width:100%;
		}
		
	.complete .complete-title {
		display:block;
		width:100%;
		text-align:center;
		font-family:'SEBANG_Gothic_Bold', sans-serif;
		font-weight:600;
		letter-spacing:-2.0px;
		color:#000;
		color:var(--color-black);
		padding-top:40px;
	}
		.complete .complete-title * { font-family:'SEBANG_Gothic_Bold', sans-serif; }
		
	.complete .complete-discription {
		display:block;
		width:100%;
		padding-top:25px;
		text-align:center;
		font-size:1rem;
		font-weight:600;
		color:rgba(0,0,0,.7);
		letter-spacing:-.6px;
	}
		.complete .complete-discription .block {
			display:block;
			width:100%;
			line-height:1.4;
		}


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

/* Mobile */
@media screen and (min-width:1px) and (max-width:639px) {
	.btn-bg-color {
		width:100%;
		margin-left:0px;
		margin-top:10px;
		padding:10px;
	}
	
	.title-frame .sub-common-title { font-size:2.4rem; }
	
	/********** 에러 페이지 디자인 **********/
	.error-page .error-header .error-title { font-size:2rem; font-weight:600; }
	.error-page .error-header .error-sub-title { font-size:1.2rem;font-weight:600; }
	.error-page .error-content .block { font-size:0.8rem; font-weight:400; }
	
	/********** blank page **********/
	.blank-page .blank-page-title { font-size:2rem; }
		.blank-page .blank-page-description .block { font-size:0.85rem; }
	.blank-page .image-box { margin-top:10px; }
	
	/********** 완료 페이지 디자인 **********/
	.complete .complete-title { font-size:1.8rem; }
	.complete .complete-discription { font-size:0.85rem; } 
}

/* Mobile & Tablet */
@media screen and (min-width:1px) and (max-width:1316px) {
	/********** 모바일 서브메뉴 & breadcrumb **********/
	.mob-sub-nav { display:none; }
	
	/********** 서브 레이아웃 **********/
	.sub-container--frame { width:100%; }
	
	.sub-container {
		width:100%;
		padding:50px 25px;
	}
	
	/********** 타이틀 디자인 **********/
	.title-frame .sub-common-title::after {
		margin-top:30px;
		margin-bottom:30px;
	}
}

/* Tablet */
@media screen and (min-width:640px) and (max-width:1316px) {
	/********** 모바일 서브메뉴 & breadcrumb **********/	
	.mob-sub-nav .mob-sub-nav-item.home .mob-sub-nav--link {
		display:block;
		width:100%;
		height:100%;
		background:url('/res/img/home/sub/image_sub_navi_homeIcon.png') no-repeat center center;
	}
	
	.mob-sub-nav .mob-sub-nav-item {
		width:auto;
		flex:1;
	}
	
	/********** 에러 페이지 디자인 **********/
	.error-page .error-header .error-title { font-size:3.5rem; font-weight:800; }
	.error-page .error-header .error-sub-title { font-size:1.3rem;font-weight:800; }
	.error-page .error-content .block { font-size:0.85rem; font-weight:500; }
	
	/********** blank page **********/
	.blank-page .blank-page-title { font-size:2.5rem; }
	
	/********** 완료 페이지 디자인 **********/
	.complete .complete-title { font-size:2rem; }
}

/* Tablet & PC */
@media screen and (min-width:640px) {
	/********** 폼 공통 **********/
	.form-frame .form-flex--group .form-group { width:49%; margin-bottom:0px; }
	.form-frame .form-flex--group .form-group:nth-of-type(odd) { margin-right:2%; }
	.form-frame .form-flex--group .form-group:nth-of-type(n+3) { margin-top:15px; }
}

/* PC */
@media screen and (min-width:1317px) {
	/********** 서브 레이아웃 **********/
	.layout-container { position:relative; }
	
	.sub-container--frame {
		position:relative;
		width:100%;
		margin-left:auto;
		margin-right:auto;
		padding-bottom:90px;
	} 
	
	.sub-container { width:100%; }
	
	/********** 타이틀 디자인 **********/
	.title-frame { padding-top:50px; }
			
	/********** 에러 페이지 디자인 **********/
	.error-page .error-header .error-title { font-size:5rem; font-weight:800; }
	.error-page .error-header .error-sub-title { font-size:1.6rem;font-weight:800; }
	.error-page .error-content .block { font-size:0.91rem; font-weight:500; }
	
	/********** blank page **********/
	.blank-page .blank-page-title { font-size:3rem; }
		
	/********** 완료 페이지 디자인 **********/
	.complete .complete-title { font-size:2.5rem; }
	
	/********** 모바일 서브메뉴 & breadcrumb **********/
	.sub-container--navi {		
		position:sticky;
		top:159px;
		left:0;
		z-indeX:500;
		background-color:#fff;
		background-color:var(--color-white);
	}
	.mob-sub-nav {
		display:block;
		width:100%;
		background-color:#fff;
		background-color:var(--color-white);
		border-bottom:1px solid #ccc;
		border-bottom:1px solid var(--color-gray-light);
	}
		.mob-sub-nav .mob-sub-nav--frame {
			display:block;
			width:100%;
			margin-left:auto;
			margin-right:auto;
		}
			.mob-sub-nav .mob-sub-nav--list-frame {
				display:flex;
				justify-content:flex-start;
				width:100%;
			}
				.mob-sub-nav .mob-sub-nav-item {
					display:block;
					background-image:url('../../img/home/page/sub/image_sub_navi_line.png');
					background-position:right center;
					background-repeat:no-repeat;
				}
				
				.mob-sub-nav .mob-sub-nav-item.home {
					width:70px;
					background-image:url('../../img/home/page/sub/image_sub_navi_line.png'), url('../../img/home/page/sub/image_sub_navi_line.png');
					background-position:left center, right center;
					background-repeat:no-repeat, no-repeat;
				}
				
				.mob-sub-nav .mob-sub-nav-item.main-category,
				.mob-sub-nav .mob-sub-nav-item.sub-category { min-width:350px; }
					
					.mob-sub-nav .mob-sub-nav-item .mob-sub-nav--link {
						display:block;
						width:100%;
						height:100%;
						padding:20px;
					}
					
					.mob-sub-nav .mob-sub-nav-item.home .mob-sub-nav--link {
						background-image:url('../../img/home/page/sub/image_sub_navi_home_icon.png');
						background-repeat:no-repeat;
						background-position:center center;
					}
						.mob-sub-nav .mob-sub-nav-item .mob-sub-nav--select {
							display:block;
							width:100%;
							position:relative;
						}
							.mob-sub-nav .mob-sub-nav-item .mob-sub-nav--select.is-Open .mob-sub-nav--select-text:after { transform:translateY(-50%) rotate(180deg); }
	
							.mob-sub-nav .mob-sub-nav-item .mob-sub-nav--select-text {
								display:block;
								width:100%;
								padding:20px;
								font-family: 'GmarketSansMedium', sans-serif;
								font-size:1.15rem;
								font-weight:300;
								letter-spacing:-.6px;
								color:#000;
								color:var(--color-black);
							}
							.mob-sub-nav .mob-sub-nav-item .mob-sub-nav--select-text:after {
								content: "";
								width:12px;
								height:7px;
								background-image:url('../../img/home/page/sub/image_sub_navi_arrow_mobile.png');
								background-repeat:no-repeat;
								background-position:center center;
								position:absolute;
								top:50%;
								right:22px;
								transform:translateY(-50%);
							}
							
							.mob-sub-nav .mob-sub-nav-item .mob-sub-nav--select.is-Open .mob-sub-nav--select-text {
								color:#13489e;
								color:var(--color-primary);
							}
							
							.mob-sub-nav .mob-sub-nav-item .mob-sub-nav--select-list {
								display:block;
								background-color:#fff;
								background-color:var(--color-white);
								border:1px solid #ccc;
								border:1px solid var(--color-gray-light);
								border-top:0px;
								position:absolute;
								left:0;
								right:0;
								top:58.56px;
								z-index:200;
							}
	
								.mob-sub-nav .mob-sub-nav-item .select-list--item { display:block; width:100%; }
								.mob-sub-nav .mob-sub-nav-item .select-list--item:not(:last-of-type) {
									border-bottom:1px solid #ccc;
									border-bottom:1px solid var(--color-gray-light);
								}
								
									.mob-sub-nav .mob-sub-nav-item .select-list--link {
										display:block;
										width:100%;
										padding:14px 22px;
										font-size:0.91rem;
										font-weight:600;
									}
									.mob-sub-nav .mob-sub-nav-item .select-list--link.activeSubNav {
										background-color:#13489e;
										background-color:var(--color-primary);
										background-colro:var(--color-primary);
										color:#fff;
										color:var(--color-white);
									}
									
									.mob-sub-nav .mob-sub-nav-item .select-list--link:hover,
									.mob-sub-nav .mob-sub-nav-item .select-list--link:focus {
										background-color:#b33d58;
										background-color:var(--color-secondary-alt);
										background-colro:var(--color-secondary-alt);
										color:#fff;
										color:var(--color-white);
										text-decoration:none;
									}
									
		
}

@media screen and (min-width:1317px) and (max-width:1516px) {
	/********** 서브 레이아웃 **********/
	.mob-sub-nav .mob-sub-nav--frame { max-width:1300px; }
	.sub-container--frame { max-width:1300px; } 
}


@media screen and (min-width:1517px) {
	/********** 서브 레이아웃 **********/
	.mob-sub-nav .mob-sub-nav--frame { max-width:1500px; }
	.sub-container--frame { max-width:1500px; } 
}


/* print */
@media print {
	.no-print { display:none !important; }
	
	/********** 공통 **********/
	html, body {
		width:210mm;
		height:297mm;
		page-break-after:avoid;
		page-break-before:avoid;
	}
		.layout-container {
			display:block;
			width:100%;
		}
			.sub-container {
				display:block;
				width:100%;
				zoom:68%;
				page-break-before:always;
				-webkit-print-color-adjust: exact;
				print-color-adjust: exact;
			}
				.border-box-design {
					background-color:#fefefe;
					border:1px solid #ccc;
					border:1px solid var(--color-gray-light);
					background-color:#fff;
					background-color:var(--color-white);
					border-radius:10px;
				}
		
			.print-btn { display:none; }
	
	/********** 타이틀 디자인 **********/
	.title-frame {
		display:block;
		width:100%;
		text-align:center;
	}
		.title-frame .sub-common-title {
			display:inline-flex;
			justify-content:center;
			flex-direction:column;
			width:auto;
			background-image:url('../../img/home/page/sub/image_sub_title_bg.png');
			background-repeat:no-repeat;
			background-position:center top;
			padding-top:45px;
			font-weight:600;
			font-family:'GmarketSansBold', sans-serif;
			font-size:3rem;
			color:#000;
			color:var(--color-black);
			letter-spacing:-.6px;
		}
		
		.title-frame .sub-common-title::after {
			content:'';
			width:38px;
			height:2px;
			margin:45px auto;
			background-color:#000;
			background-color:var(--color-black);
			background-color:var(--color-black);		
		}
	
	/********** 에러 페이지 디자인 **********/
	.error-page .error-header .error-title { font-size:5rem; font-weight:800; }
	.error-page .error-header .error-sub-title { font-size:1.6rem;font-weight:800; }
	.error-page .error-content .block { font-size:0.91rem; font-weight:500; }
	
	/********** 인쇄버튼 **********/
	.print-btn {
		display:flex;
		justify-content:center;
		align-items:center;
		width:40px;
		height:40px;
		margin-top:20px;
		margin-left:auto;
		margin-right:auto;
		margin-bottom:45px;
		background-color:#464646;
		border-radius:20px;
		color:#fff;
		color:var(--color-white);
	}
		.print-btn i { display:block; }
		
	/********** 완료 페이지 디자인 **********/
	.complete {
	display:block;
	width:100%;
	padding:100px 50px;
	word-wrap:break-word;
	word-break:keep-all;
	overflow-wrap:anywhere;
}
	.complete .image-box {
		display:block;
		width:100%;
		text-align:center;
	}
		.complete .image-box img {
			vertical-align:top;
			max-width:100%;
		}
		
	.complete .complete-title {
		display:block;
		width:100%;
		text-align:center;
		font-family:'SEBANG_Gothic_Bold', sans-serif;
		font-weight:600;
		font-size:2.5rem;
		letter-spacing:-2.0px;
		color:#000;
		color:var(--color-black);
		padding-top:40px;
	}
		.complete .complete-title * { font-family:'SEBANG_Gothic_Bold', sans-serif; }
		
	.complete .complete-discription {
		display:block;
		width:100%;
		padding-top:25px;
		text-align:center;
		font-size:1rem;
		font-weight:600;
		color:rgba(0,0,0,.7);
		letter-spacing:-.6px;
	}
		.complete .complete-discription .block {
			display:block;
			width:100%;
			line-height:1.4;
		}
}