@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap');

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video, a{
	margin:0;
	padding:0;
	border:0;
	font-size:100%;
	vertical-align:middle;
}
html {height:100%;}
body{
  font-family:"Noto Sans KR", "Malgun Gothic", "Apple SD Gothic Neo", sans-serif;
  color:#2c3e50;
  min-width:1220px;
  background:#fafbfc;
  line-height:1.6;
}
h1,h2,h3,h4,h5,h6 {font-weight:bold;}
a,a:hover {text-decoration:none; color:#333; transition:all 0.5s;}
ul {list-style-type:none;}
p {
	font-size:16px; 
	line-height:24px;
	font-family:"Noto Sans KR", "Malgun Gothic", "Apple SD Gothic Neo", sans-serif;
	color:#333;
}
h3 {
	font-size:32px; 
	border-bottom:10px solid #e8ecf1; 
	padding-bottom:16px; 
	margin-bottom:50px;
	font-family:"Noto Sans KR", "Malgun Gothic", "Apple SD Gothic Neo", sans-serif;
	font-weight:700;
	color:#1a2332;
	position:relative;
	letter-spacing:-0.5px;
}
h3::after {
	content:'';
	position:absolute;
	bottom:-2px;
	left:0;
	width:80px;
	height:3px;
	background:linear-gradient(90deg, #004695 0%, #3669ae 100%);
	border-radius:2px;
}
h4 {
	background:url(/images/common/h2.gif) left center no-repeat; 
	padding-left:20px; 
	font-size:22px; 
	margin-bottom:15px;
	font-family:"Noto Sans KR", "Malgun Gothic", "Apple SD Gothic Neo", sans-serif;
	font-weight:700;
	color:#333;
}
h5 {
	background:url(/images/common/h3.gif) left top no-repeat; 
	padding-top:6px; 
	font-size:18px; 
	line-height:30px; 
	margin-bottom:15px;
	font-family:"Noto Sans KR", "Malgun Gothic", "Apple SD Gothic Neo", sans-serif;
	font-weight:700;
	color:#333;
}

section {clear:both; overflow:hidden;}

.wrap{
	clear:both; 
	overflow:hidden; 
	margin:0 auto; 
	width:1200px;
	max-width:100%;
	padding:0 20px;
	box-sizing:border-box;
}
/*-- ########################################## header ###################################################### --*/
#top_lang {
	background:linear-gradient(135deg, #102D76 0%, #1a3a6e 100%); 
	padding:6px 0; 
	text-align:right;
	border-bottom:1px solid rgba(0,0,0,0.1);
}
#top_lang a {
	font-weight:500; 
	padding:0 12px;
	color:#fff;
	transition:color 0.2s ease;
}
#top_lang a:hover {color:rgba(255,255,255,0.85);}

/* main menu */
header {
	clear:both; 
	overflow:visible !important;
	background:#fff;
	box-shadow:0 2px 12px rgba(0,0,0,0.04);
	position:relative;
	z-index:1000;
}
header .wrap {
	overflow:visible !important;
}
header #header_logo {clear:both; overflow:hidden;}
header #logo {float:left; padding:0;}
header #header_banner {float:right;}

header #main_nav {
	display:inline-block; 
	float:right;
	position:relative;
}
header #main_nav li {
	float:left;
	position:relative;
}
header #main_nav li a {
	display:block; 
	font-size:17px; 
	font-weight:600; 
	line-height:120px;
	color:#2c3e50;
	transition:all 0.3s ease;
	letter-spacing:-0.3px;
	padding:0 20px;
}
header #main_nav li:hover a {
	color:#004695;
	transform:translateY(-2px);
}

header #main_nav li ul {
	position:absolute !important; 
	top:100% !important;
	left:0 !important;
	z-index:10000 !important; 
	background:#fff !important; 
	box-shadow:0 8px 24px rgba(0,0,0,0.12) !important; 
	border-top:3px solid #004695 !important; 
	border-right:1px solid #e9ecef !important; 
	border-left:1px solid #e9ecef !important;
	border-bottom:1px solid #e9ecef !important;
	border-radius:0 0 12px 12px !important;
	overflow:hidden !important;
	margin-top:0 !important;
	min-width:200px !important;
	opacity:0 !important;
	visibility:hidden !important;
	transform:translateY(-10px) !important;
	transition:all 0.3s ease !important;
	pointer-events:none !important;
	display:block !important;
	width:auto !important;
	height:auto !important;
}
header #main_nav li:hover ul,
header #main_nav li ul:hover {
	opacity:1 !important;
	visibility:visible !important;
	transform:translateY(0) !important;
	pointer-events:auto !important;
	display:block !important;
}
header #main_nav li ul li {
	float:none !important; 
	border-bottom:1px solid #f1f3f5 !important; 
	text-align:left !important;
	display:block !important;
}
header #main_nav li ul li:last-child {
	border-bottom:none !important;
}
header #main_nav li ul li a {
	font-weight:500 !important; 
	font-size:15px !important; 
	color:#495057 !important; 
	padding:14px 24px !important;
	line-height:24px !important; 
	transition:all 0.25s ease !important;
	display:block !important;
}
header #main_nav li ul li a:hover {
	background:linear-gradient(90deg, #f8f9fa 0%, #ffffff 100%) !important;
	color:#004695 !important;
	padding-left:28px !important;
	font-weight:600 !important;
}


/*-- ################# main img######################## --*/
/* 4개 레이어 고정 배경 + opacity 전환 (깜빡임 제거, 이미지 병렬 로딩) */
#main_img {
	clear:both; 
	overflow:hidden; 
	text-align:right; 
	position:relative;
	height:600px;
	background:#2c3e50;
	transform:translateZ(0);
	isolation:isolate;
}
.main_img_bg {
	position:absolute;
	left:0; top:0; right:0; bottom:0;
	background-size:cover;
	background-position:center;
	z-index:0;
}
#main_img::before {
	content:'';
	position:absolute;
	left:0; top:0; right:0; bottom:0;
	background:rgba(0,0,0,0.35);
	z-index:2;
}
.main_img_bg:nth-child(1) { animation:main_banner_1 20s linear infinite; }
.main_img_bg:nth-child(2) { animation:main_banner_2 20s linear infinite; }
.main_img_bg:nth-child(3) { animation:main_banner_3 20s linear infinite; }
.main_img_bg:nth-child(4) { animation:main_banner_4 20s linear infinite; }
@keyframes main_banner_1 {
	0%, 20% { opacity:1; }
	25%, 95% { opacity:0; }
	100% { opacity:1; }
}
@keyframes main_banner_2 {
	0%, 20% { opacity:0; }
	25%, 45% { opacity:1; }
	50%, 100% { opacity:0; }
}
@keyframes main_banner_3 {
	0%, 45% { opacity:0; }
	50%, 70% { opacity:1; }
	75%, 100% { opacity:0; }
}
@keyframes main_banner_4 {
	0%, 70% { opacity:0; }
	75%, 95% { opacity:1; }
	100% { opacity:0; }
}
#main_img .wrap {position:relative; z-index:3;}
#main_img .wrap #main_img_text {
	display:inline-block;
	text-align:center;
	margin-top:120px;
	letter-spacing:0.02em;
	animation:main_img_text_in 1s ease-out forwards;
}
@keyframes main_img_text_in {
	from { opacity:0; transform:translateX(-40px); }
	to { opacity:1; transform:translateX(0); }
}
#main_img h6 {
	color:#fff;
	font-size:70px;
	font-weight:700;
	letter-spacing:-0.02em;
	text-shadow:0 2px 8px rgba(0,0,0,0.65), 0 0 24px rgba(0,0,0,0.4);
	margin-bottom:12px;
	line-height:1.15;
}
#main_img p {
	color:rgba(255,255,255,0.98);
	display:inline-block;
	font-size:18px;
	font-weight:400;
	letter-spacing:0.2em;
	text-transform:uppercase;
	padding:0;
	border:none;
	background:none;
	text-shadow:0 2px 8px rgba(0,0,0,0.6);
}


/*-- ################# index ######################## --*/
#index_main {display:none;}
section {
	clear:both; 
	overflow:hidden; 
	padding:50px 0;
}
#index_s01 {
	text-align:center;
	background:#fafbfc;
}
#index_s01 .wrap {
	overflow:visible;
}
#index_s01 h6 {
	font-size:36px; 
	margin-bottom:24px;
	color:#1a2332;
	font-weight:700;
	letter-spacing:-1px;
}
#index_s01 p {
	margin-bottom:50px;
	font-size:18px;
	color:#6c757d;
	line-height:1.8;
	max-width:800px;
	margin-left:auto;
	margin-right:auto;
}
#index_s01 article {
	overflow:hidden;
	max-width:1200px;
	margin:0 auto;
}
#index_s01 article a {
	display:block; 
	float:left; 
	width:calc((100% - 120px) / 3);
	margin-right:60px;
	box-sizing:border-box;
	border-radius:16px;
	overflow:hidden;
	box-shadow:0 6px 20px rgba(0,0,0,0.08);
	transition:all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
	background:#fff;
	position:relative;
}
#index_s01 article a::before {
	content:'';
	position:absolute;
	top:0;
	left:0;
	right:0;
	height:5px;
	background:linear-gradient(90deg, #004695 0%, #3669ae 100%);
	z-index:1;
}
#index_s01 article a:hover {
	transform:translateY(-8px);
	box-shadow:0 12px 40px rgba(0,70,149,0.15);
}
#index_s01 article a img {
	display:block; 
	margin-bottom:0;
	width:100%;
	height:240px;
	object-fit:cover;
	transition:transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
#index_s01 article a:hover img {
	transform:scale(1.08);
}
#index_s01 article a p {
	padding:24px 20px;
	margin:0;
	font-weight:600;
	color:#2c3e50;
	font-size:18px;
	transition:color 0.3s ease;
}
#index_s01 article a:hover p {
	color:#004695;
}
#index_s01 article a:last-child {margin-right:0;}

#index_s02 {
	text-align:center; 
	background:linear-gradient(135deg, #1a2332 0%, #273443 100%);
	color:#fff;
	position:relative;
	overflow:visible;
	padding:60px 0 !important;
}
#index_s02::before {
	content:'';
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background:url('data:image/svg+xml,<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg"><defs><pattern id="grid" width="100" height="100" patternUnits="userSpaceOnUse"><path d="M 100 0 L 0 0 0 100" fill="none" stroke="rgba(255,255,255,0.03)" stroke-width="1"/></pattern></defs><rect width="100%" height="100%" fill="url(%23grid)"/></svg>');
	opacity:0.5;
}
#index_s02 h6 {
	font-size:36px; 
	margin-bottom:24px;
	color:#fff;
	font-weight:700;
	letter-spacing:-1px;
	position:relative;
	z-index:1;
}
#index_s02 p {
	margin-bottom:35px;
	color:rgba(255,255,255,0.9);
	font-size:18px;
	line-height:1.8;
	max-width:800px;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	z-index:1;
}
#index_s02 #index_s02_wrap {
	overflow:visible;
	max-width:1200px;
	margin:0 auto;
	position:relative;
	z-index:1;
	padding-top:5px;
}
#index_s02 #index_s02_wrap article {
	display:inline-block; 
	width:380px;
	background:rgba(255,255,255,0.05);
	border-radius:16px;
	padding:30px 25px;
	backdrop-filter:blur(10px);
	border:1px solid rgba(255,255,255,0.1);
	transition:all 0.4s ease;
}
#index_s02 #index_s02_wrap article:hover {
	background:rgba(255,255,255,0.1);
	transform:translateY(-5px);
	box-shadow:0 12px 40px rgba(0,0,0,0.2);
}
#index_s02 #index_s02_wrap article:first-child {margin-right:200px;}
#index_s02 #index_s02_wrap article div:first-child {float:left; width:120px;}
#index_s02 #index_s02_wrap article div:last-child {float:right; width:200px;}
#index_s02 #index_s02_wrap article p {
	font-size:22px; 
	margin:0; 
	padding:16px 0;
	color:#fff;
	font-weight:600;
}
#index_s02 #index_s02_wrap article a {
	display:block; 
	color:#fff; 
	border-radius:50px; 
	border:2px solid rgba(255,255,255,0.8); 
	padding:12px 0;
	transition:all 0.3s ease;
	font-weight:600;
	font-size:16px;
	margin-top:20px;
}
#index_s02 #index_s02_wrap article a:hover {
	background:#fff; 
	color:#1a2332;
	transform:translateY(-3px);
	box-shadow:0 6px 20px rgba(255,255,255,0.3);
	border-color:#fff;
}

#index_s03 {
	background:#fff;
}
#index_s03 article {width:580px;}
#index_s03 article:first-child {
	float:left;
	background:#fff;
	padding:40px;
	border-radius:16px;
	box-shadow:0 4px 20px rgba(0,0,0,0.06);
}
#index_s03 article:last-child {float:right;}
#index_s03 #index_s03_ba {
	display:flex;
	gap:20px;
	justify-content:space-between;
}
#index_s03 #index_s03_ba a {
	display:block; 
	text-align:center; 
	color:#fff; 
	width:calc(50% - 10px);
	padding:24px 0;
	border-radius:16px;
	transition:all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
	box-shadow:0 4px 16px rgba(0,0,0,0.12);
	font-weight:600;
	font-size:18px;
	position:relative;
	overflow:hidden;
}
#index_s03 #index_s03_ba a::before {
	content:'';
	position:absolute;
	top:0;
	left:-100%;
	width:100%;
	height:100%;
	background:linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
	transition:left 0.5s ease;
}
#index_s03 #index_s03_ba a:hover::before {
	left:100%;
}
#index_s03 #index_s03_ba a:first-child {
	background:linear-gradient(135deg, #4f6a4a 0%, #5a7a55 100%);
}
#index_s03 #index_s03_ba a:first-child:hover {
	box-shadow:0 8px 24px rgba(79,106,74,0.25);
}
#index_s03 #index_s03_ba a:last-child {
	background:linear-gradient(135deg, #6a5c53 0%, #75665d 100%);
}
#index_s03 #index_s03_ba a:last-child:hover {
	box-shadow:0 8px 24px rgba(106,92,83,0.25);
}
#index_s03 #index_s03_ba a p {
	padding-top:12px; 
	margin:0;
	font-size:16px;
	opacity:0.95;
}

#index_div {display:none;}
/*-- ################# foot ######################## --*/
footer {background:#ededed;}
footer .wrap {background:url(/images/common/foot_logo.gif) left center no-repeat; text-align:right; padding:30px 0;}
footer p {font-size:14px; line-height:19px; color:#666666;}
footer p a {color:#808080 !important;}


/*-- ################# sub ######################## --*/
.sub_img {
	clear:both; 
	text-align:center; 
	margin-bottom:60px; 
	height:220px;
	position:relative;
	overflow:hidden;
}
.sub_img::before {
	content:'';
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	z-index:1;
}
.sub_img h6 {
	font-size:52px; 
	color:#fff; 
	text-shadow:0 2px 8px rgba(0,0,0,0.3); 
	padding:50px 0 12px 0;
	position:relative;
	z-index:2;
	font-weight:700;
	letter-spacing:-1px;
}
.sub_img p {
	font-size:20px; 
	color:#fff;
	position:relative;
	z-index:2;
	text-shadow:0 1px 4px rgba(0,0,0,0.2);
	font-weight:400;
}
.sub_img01 {background:url(/images/common/sub_img01.jpg) center; background-size:cover;}
.sub_img02 {background:url(/images/common/sub_img02.jpg) center; background-size:cover;}
.sub_img03 {background:url(/images/common/sub_img03.jpg) center; background-size:cover;}
.sub_img04 {background:url(/images/common/sub_img04.jpg) center; background-size:cover;}


aside {
	float:left; 
	width:240px; 
	margin-bottom:50px;
	margin-right:40px;
}
aside #sub_tit {
	text-align:center; 
	font-size:22px; 
	padding:0 0 28px 0;
	color:#1a2332;
	font-weight:700;
	letter-spacing:-0.5px;
}
aside ul {
	border-top:4px solid #004695; 
	border-left:1px solid #e9ecef; 
	border-right:1px solid #e9ecef;
	border-radius:0 0 12px 12px;
	overflow:hidden;
	box-shadow:0 4px 16px rgba(0,0,0,0.06);
	background:#fff;
}
aside ul li a {
	display:block; 
	border-bottom:1px solid #f1f3f5; 
	padding:16px 24px;
	transition:all 0.25s ease;
	color:#495057;
	font-weight:500;
	position:relative;
}
aside ul li a::before {
	content:'';
	position:absolute;
	left:0;
	top:0;
	width:0;
	height:100%;
	background:linear-gradient(90deg, #004695 0%, #3669ae 100%);
	transition:width 0.25s ease;
	z-index:0;
}
aside ul li a:hover {
	background:linear-gradient(90deg, #f8f9fa 0%, #ffffff 100%);
	padding-left:32px;
	color:#004695;
	font-weight:600;
}
aside ul li a:hover::before {
	width:4px;
}
aside ul li:last-child a {border-bottom:none;}


/*-- ################# main_content ######################## --*/
main {
	float:right; 
	width:880px; 
	margin-bottom:70px;
	background:#fff;
	padding:40px;
	border-radius:12px;
	box-shadow:0 2px 12px rgba(0,0,0,0.04);
	box-sizing:border-box;
}
hr {display:block; border:none; height:20px;}

#info_p01_text {background:url(/images/info/p01_a01.jpg) right center no-repeat; padding:63px 280px 63px 0;}
#info_p01_text p {line-height:30px;}
.soon {text-align:center;}
.soon h6 {font-size:24px; padding-top:10px;}
.name_sign {font-family: 'Nanum Myeongjo', serif; font-weight:bold; font-size:18px;}
#info_p02_text {
	background:url(/images/info/p02_a01.jpg) right center no-repeat; 
	padding-right:300px;
	font-family:"Noto Sans KR", "Malgun Gothic", "Apple SD Gothic Neo", sans-serif;
	font-size:16px;
	line-height:30px;
	color:#333;
	text-align:justify;
}
#info_p02_text p {
	font-size:16px;
	line-height:30px;
	margin-bottom:20px;
	font-family:"Noto Sans KR", "Malgun Gothic", "Apple SD Gothic Neo", sans-serif;
	color:#333;
}
#info_p02_text br {
	display:block;
	margin-bottom:10px;
}
#info_p04_wrap01 {overflow:visible; text-align:center; padding-top:4px;}
#info_p04_wrap01 article {
	float:left; 
	border-radius:12px; 
	border:2px solid #e5e5e5; 
	width:30%; 
	margin-right:5%; 
	padding:25px 15px; 
	height:220px;
	box-shadow:0 2px 8px rgba(0,0,0,0.05);
	transition:all 0.3s ease;
	background:#fff;
}
#info_p04_wrap01 article:hover {
	border-color:#004695;
	box-shadow:0 4px 16px rgba(0,70,149,0.15);
}
#info_p04_wrap01 article img {width:120px; height:120px; object-fit:contain;}
#info_p04_wrap01 article p {margin:0;}
#info_p04_wrap01 article:last-child {margin:0;}
#info_p04_wrap02 {text-align:center;}
#info_p04_wrap02 p {
	border-radius:10px; 
	border:2px solid #e5e5e5; 
	display:inline-block; 
	margin:0 40px; 
	padding:15px 0; 
	width:300px;
	box-shadow:0 2px 8px rgba(0,0,0,0.05);
	transition:all 0.3s ease;
	background:#fff;
}
#info_p04_wrap02 p:hover {
	border-color:#588d20;
	box-shadow:0 4px 12px rgba(88,141,32,0.15);
	transform:translateY(-2px);
}
#info_p04_wrap02 p span {font-size:22px; color:#588d20;}

#service_p01_text01 {background:url(/images/service/p01_a01.jpg) right center no-repeat; padding-right:340px;}


/*-- ######################################### --*/
.center {text-align:center;}
.text_right {text-align:right;}
.box01 {
	border-radius:10px; 
	background:#f8f9fa; 
	padding:25px;
	border:1px solid #e5e5e5;
	box-shadow:0 2px 8px rgba(0,0,0,0.03);
}
.ul_list {margin-left:20px; list-style-type:disc;}
.ul_list li {padding-bottom:5PX;}
.ul_list ul {list-style-type:circle; margin-left:20px;}
.ol_list {margin-left:20px;}
.ol_list li {padding-bottom:5PX;}

a.btn1 {
	display:inline-block; 
	text-align:center; 
	background:#333333; 
	color:#fff; 
	border-radius:8px; 
	width:150px; 
	padding:10px 0;
	transition:all 0.3s ease;
	font-weight:500;
	box-shadow:0 2px 8px rgba(0,0,0,0.1);
}
a.btn1:hover {
	background:#3669ae; 
	color:#fff;
	transform:translateY(-2px);
	box-shadow:0 4px 12px rgba(54,105,174,0.3);
}

.table01 {border-top:1px solid #666666; border-top:3px solid #0055a5; width:100%;}
.table01 tr th {background:#f0f0f0; text-align:left; border-bottom:1px solid #d9d9d9; padding:8px 1%; font-weight:bold;}
.table01 tr td {background:#FFFFFF; padding:6px 1%; border-bottom:1px solid #d9d9d9;}
.table02 {border-top:3px solid #0055a5; text-align:center; width:100%;}
.table02 thead tr {background:#ededed;}
.table02 tr th {text-align:center; border:1px solid #d9d9d9; padding:8px 1%; font-weight:bold;}
.table02 tr td {background:#FFFFFF; padding:6px 1%; border:1px solid #d9d9d9;}
@media all and (min-width:1000px) {
	.table01 {font-size:14px;}
	.table02 {font-size:14px;}
}

/* 반응형 기본 개선 */
@media all and (max-width:1220px) {
	body {min-width:100%;}
	.wrap {width:100%; padding:0 20px;}
	header #main_nav li a {padding:0 30px; font-size:16px;}
}

@media all and (max-width:768px) {
	section {padding:40px 0;}
	h3 {font-size:24px; margin-bottom:30px;}
	h4 {font-size:20px;}
	h5 {font-size:16px;}
	p {font-size:14px; line-height:22px;}
	.wrap {padding:0 15px;}
	header #main_nav li a {padding:0 15px; font-size:14px; line-height:80px;}
	#main_img {height:400px;}
	#main_img h6 {font-size:40px;}
	#main_img p {font-size:14px; letter-spacing:0.15em;}
	aside {
		width:100%; 
		float:none; 
		margin-bottom:30px;
		margin-right:0;
	}
	aside ul {
		border-radius:12px;
	}
	main {
		width:100%; 
		float:none;
		padding:30px 20px;
	}
	#info_p02_text {padding-right:0; background:none;}
	#index_s01 article a {
		width:100%;
		margin-right:0;
		margin-bottom:20px;
	}
	#index_s01 article a:last-child {margin-bottom:0;}
	#index_s02 #index_s02_wrap article {
		width:100%;
		margin-right:0;
		margin-bottom:30px;
	}
	#index_s02 #index_s02_wrap article:first-child {margin-right:0;}
	#index_s03 #index_s03_ba {
		flex-direction:column;
		gap:15px;
	}
	#index_s03 #index_s03_ba a {
		width:100%;
		margin-bottom:0;
	}
	#info_p04_wrap01 article {
		width:100%;
		margin-right:0;
		margin-bottom:20px;
		height:auto;
	}
}
