@charset "utf-8";

/***************************
  Contents
***************************/

/* Layout */
body { background-color:#fff; }
#wrapper { background:url('');}

/*
--------------------------------------------------------------------
*/


/*
	## 서브상단 이미지 타이틀, 애니메이션
*/
#wrap_subtop {
	position:relative; width:100%; height:400px; background-color:#F8F9F4;
	overflow: hidden;
	/*background-image: url(../img/subtop.jpg);*/
	background-size: cover;
	/*background-attachment: fixed;*/
	background-position:center center;
}
#wrap_subtop .sub-img {
	width: 100%; height: 600px; magin: 0 auto;
	background-size: cover;
	background-image: url(../img/subtop.jpg);
	background-position:center center;
	/*position:absolute; top: -25%; left: 50%; transform: translateX(-50%);*/
	position:absolute; transform: scale(1);
	animation: subtop_img 2s .2s ease-in-out both;
}

#wrap_subtop .sub-text { position:absolute; display:inline-block; top:62%; left:50%; transform:translate(-50%, -50%); }
#wrap_subtop .sub-text span {position:relative; display:block; text-align:center; letter-spacing: -.5px}
#wrap_subtop .sub-text .t1 { font-size:2.3rem; font-weight:600; animation: subtop_t1 1s .5s both; color: #000}
#wrap_subtop .sub-text .t2 { margin-top:15px; font-size:1.2rem; }
#wrap_subtop .sub-text .t2 div { margin-bottom:3px }
#wrap_subtop .sub-text .t2 .t2-1 { position:relative; font-weight: 600; color: #FFFF80; animation: subtop_t2-1 1s .7s ease-in-out both; }
#wrap_subtop .sub-text .t2 .t2-2 { position:relative; animation: subtop_t3-2 1s 1.1s ease-in-out both; font-size: 1rem; font-weight: 400; }
#wrap_subtop .sub-text .t2 .t2-3 { position:relative; animation: subtop_t3-3 1s .9s ease-in-out both; font-size: 1.5rem; font-weight: 600; color:#2E2E2E  }
#wrap_subtop .sub-text .t2 .t2-3 b { color:#800044  }

/*@keyframes subtop_img { from { top: -40%;  } to {  } }*/
@keyframes subtop_img { from { transform: scale(1.3);  } to {  } }
@keyframes subtop_t1 { from { transform: translateY(50px); opacity: 0; } to {  } }
@keyframes subtop_t2-1 { from { transform: translateY(50px); opacity: 0; } to {  } }
@keyframes subtop_t3-2 { from { transform: translateY(50px); opacity: 0; } to {  } }
@keyframes subtop_t3-3 { from { transform: translateY(50px); opacity: 0; } to {  } }





/*
	## 서브내용
*/
#wrap_content {	position:relative; width:1200px; padding:50px 0 100px; margin:0 auto !important; font-family:Noto Sans Korean; }
#wrap_content .content { }
#wrap_content .page-title {
	position:relative; color:#222; text-align:center;
	font-family:Nanum Gothic; letter-spacing: -1px; font-size:40px; font-weight:600; 
}


/*
	## 서브위치표시
*/
#page_path {
	position: absolute; top: 20px; right: 0px; padding: 0 !important;
	font-family:Noto Sans Korean; font-size: 0.875rem; font-weight: 400; letter-spacing: -0.5px; text-align:right;
}
#page_path span, #page_path i { display:inline-block; vertical-align: middle; color:#909090; }
#page_path .fa-chevron-right { color:#D1D1D1; }
#page_path span, #page_path .fa { display:inline-block; vertical-align: middle; }
#page_path .fa-chevron-right { display: inline-block; padding: 0 5px 0px  ; font-size:4px; }

#wrap_content .page-title-bar {
	position:relative; height:3px; margin: 20px 0 50px 0;
	background:linear-gradient(to left, transparent, red, skyblue, green, transparent);
}

#wrap_content .sub-content { position:relative; margin-top:30px }





/*
	## 서브 센터메뉴1
*/
#wrap_centermenu1 {
  --smenu_a_padding: 13px 45px 15px; /* 상단메뉴 높이 */
  --smenu_a_color_on_font: #FFF ; /* 선택된 메뉴 폰트 color */
  --smenu_a_color_on_bg: #3E2F22; /* 선택된 메뉴 BG color */
  --smenu_a_color_on_over: #3E2F22 ;
  --smenu_a_color_over: #F1ECE7 ;


  --topmenu_pos_color: #3726B2; /* 위치바 색 변경 */
  --submenu_hover_bg_color: #3E2F22; /* 오버시 서브메뉴 배경색 */
  --submenu_hover_font_color: #fff; /* 메뉴배경 색상지정 */
  --submenu_hover_sm2_color: #8C0052; /* 메뉴배경 색상지정 */
}
#wrap_centermenu1 { position:relative; text-align:center; background-color:#F8F8F8; border-bottom:1px solid #E9E9E9; overflow:hidden;}
#wrap_centermenu1 .smenu { display:flex; justify-content:center; margin:0; padding:0}
#wrap_centermenu1 .smenu .sm { position:relative; display:inline-block; text-align:center; }
#wrap_centermenu1 .smenu .sm { border-left:1px solid #E9E9E9;}
#wrap_centermenu1 .smenu .sm:last-child { border-right:1px solid #E9E9E9;}
/*#wrap_centermenu1 .smenu .sm:last-child {border-right:1px solid #E9E9E9;}*/
#wrap_centermenu1 .smenu li a {
	font-size:1rem; font-family:'Noto Sans KR', sans-serif; display:inline-block;  padding:var(--smenu_a_padding); color:#464646; vertical-align:middle; text-decoration:none;
	letter-spacing:-.5px; position:relative;
}
#wrap_centermenu1 .smenu li.on { background-color:var(--smenu_a_color_on_bg); font-weight:bold; }
#wrap_centermenu1 .smenu li.on > a { color:var(--smenu_a_color_on_font); border-bottom:0px solid #fff; position:relative;}

#wrap_centermenu1 .smenu li a:hover { background-color:var(--smenu_a_color_over)}
#wrap_centermenu1 .smenu li.on a:hover { background-color:var(--smenu_a_color_on_over) }


/*
	## 서브 센터메뉴2
*/
#wrap_centermenu2 { position:relative; background-color:#fff; z-index:10; }
#wrap_centermenu2 .smenu-align { position:relative; display:block; width:1000px; height:100%; margin:0 auto; top:0px; }
#wrap_centermenu2 .smenu {
	position:absolute; top:0; left:0; width:100%; height:100%; list-style:none; display:block;
	border:1px solid #E9E9E9;  background-color:#fff; 
}
#wrap_centermenu2 .smenu .sm {
	font-size: 1rem; font-family:'Noto Sans KR', sans-serif;
	position:relative; display:inline-block; float:left; margin-left:-1px;
	background-color:#fff;  border-left:1px solid #E9E9E9; border-right:1px solid #E9E9E9; border-bottom:1px solid #E9E9E9;
}
#wrap_centermenu2 .smenu .sm > a { position:relative; padding:12px 15px 17px; width:100%; display:block;}
#wrap_centermenu2 .smenu .sm.home > a { font-size:20px; padding:9px 20px 10px; border:0; color: #141414}
#wrap_centermenu2 .smenu .sm .items { position:relative; width:100%; display:none; }
#wrap_centermenu2 .smenu .sm .items li { position:relative; display:block; border-top:1px solid #E9E9E9;}
#wrap_centermenu2 .smenu li a {
	position:relative; display:block; padding:15px 20px; color:#393939; text-decoration:none;
}
#wrap_centermenu2 .smenu .sm.menu { width:20%; }
#wrap_centermenu2 { height:52px;}
#wrap_centermenu2 .smenu .sm > a { height:50px;}
#wrap_centermenu2 .smenu li.on { background-color:#650138;  }
#wrap_centermenu2 .smenu .sm .on a { color:#fff }

#wrap_centermenu2 .fa-angle-down { float:right; font-size:16px; padding-top: 4px;}


/*
	## 서브 센터메뉴3
*/
#wrap_centermenu3 { text-align:center; background-color:#F8F8F8; height:53px; border-bottom:1px solid #E9E9E9;}
#wrap_centermenu3 .smenu { display:inline-block; overflow:hidden; }
#wrap_centermenu3 .smenu .sm {
	position:relative; display:inline-block; padding:12px 15px; text-align:center; float:left;
	border:0; border-left:1px solid #E9E9E9;
}
#wrap_centermenu3 .smenu .sm:last-child {border-right:1px solid #E9E9E9;}
#wrap_centermenu3 .smenu li a { display:inline-block; padding:5px 0; color:#A4A4A4; vertical-align:middle; text-decoration:none; }
#wrap_centermenu3 .smenu li.on { background-color:#fff; border-bottom:1px solid #fff; }
#wrap_centermenu3 .smenu li.on > a { color:#1F1F23; border-bottom:1px solid #2EBDAD; }

