@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(https://fonts.googleapis.com/earlyaccess/nanummyeongjo.css);
 


/* layout */
body, 
textarea, button, input[type="button"] {
	font-family:'Noto Sans KR',"³ª´®°íµñ", NanumGothic, "Nanum Gothic","µ¸¿ò", Dotum, Arial, sans-serif;
	font-size:16px;
	color:#333; font-weight:300; 
}

/* ===================================
	°øÅëŬ·¡½º
 =================================== */

body { background-color:#242424; }
button{cursor:pointer; padding:0; margin:0px;}
input[type="button"]{cursor:pointer;}
#wrap {overflow:hidden; width:100%; min-width:320px; } /* min-width ȨÆäÀÌÁö ÄÁÅÙÃ÷ °¡·Î°ª¿¡ ¸Â°Ô º¯°æ */
.area{ width:1300px; margin:0px auto; } /* width ȨÆäÀÌÁö ÄÁÅÙÃ÷ °¡·Î°ª¿¡ ¸Â°Ô º¯°æ */
.area-box{ max-width:1760px; margin:0px auto; }
.clearfix{*zoom:1;}
.clearfix:after{clear:both; display:block; content:"";}
.blind{overflow:hidden;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0}
.trans200{-webkit-transition:all 0.2s;-moz-transition:all 0.2s;-o-transition:all 0.2s;-ms-transition:all 0.2s;transition:all 0.2s}
.trans300{-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;transition:all 0.3s}
.trans400{-webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;-ms-transition:all 0.4s;transition:all 0.4s}
.trans500{-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-o-transition:all 0.5s;-ms-transition:all 0.5s;transition:all 0.5s}
.font-nanum{font-family:"³ª´®°íµñ", NanumGothic, "Nanum Gothic","µ¸¿ò", Dotum, Arial, sans-serif;}
.font-nanumbarun{font-family:NanumBarunGothic,"Nanum Barun Gothic","³ª´®°íµñ", NanumGothic, "Nanum Gothic","µ¸¿ò", Dotum, Arial, sans-serif;}
table {/*width:100%;table-layout:fixed;*/ table-layout:auto;}

.material-icons{vertical-align:middle;}

.text-ellipsis {overflow: hidden; white-space: nowrap; -ms-text-overflow: ellipsis;}
.table-layout {	width: 100%; height: 100%; display: table;}
.table-cell-layout {width: 100%; height: 100%; vertical-align: middle; display: table-cell;}
.over-img {	overflow: hidden;}
.over-img img {	transition:0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s;}
a:hover .over-img img {	transform: scale(1.1) rotate(0.002deg); -o-transform: scale(1.1) rotate(0.002deg); -moz-transform: scale(1.1) rotate(0.002deg); -webkit-transform: scale(1.1) rotate(0.002deg);}
.line-clamp2 {	overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.line-clamp3 {	overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}


@media all and (max-width:800px){

	.area {	padding: 0px 15px; width: auto;}
	.area-box {	padding: 0px 15px; width: auto;}

}


/* ============================================================================================================== */



#header {transition:0.3s; left: 0px; top: 0px; width: 100%; height:120px; position: relative; z-index: 9999; background:#ffffff; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s;}
#headerInnerWrap {	transition:background-color 0.3s; left: 0px; top: 0px; width: 100%; height: 100%; position: absolute; z-index: 9999; background-color: rgb(255, 255, 255); -webkit-transition: background-color 0.3s; -moz-transition: background-color 0.3s; -o-transition: background-color 0.3s;}
.over#header #headerInnerWrap {background:#fff;}

#headerInner {margin: 0px auto; transition:padding 0.3s; height: 100%; text-align: center; position: relative; max-width: 1400px; -webkit-transition: padding 0.3s; -moz-transition: padding 0.3s; -o-transition: padding 0.3s;}

#header .logo {padding:7px 0px; display: inline-block; position: relative; z-index: 100;}
#header .logo a {display: block;}
#header .logo img {vertical-align: top; display: block; max-width:100%;}

/* H :: ·Î±×ÀÎ */

.header-login-box {	top: 18px; right: 15px; position: absolute; z-index: 100;}
.header-login-box ul li { float: left; margin:0 3px 0 0}
.header-login-box ul li p {width: 100%; height: 100%; display: table; padding:7px 20px;box-sizing: border-box;}
.header-login-box ul li span {vertical-align: middle; display: table-cell;}
.header-login-box ul li span em {color:#222; letter-spacing: -0.5px; font-size: 13px; margin-top: 0px; display: block;}


.header-login-box ul li.logout-btn { border:1px solid #d9d9d9;position: relative; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}

.header-login-box ul li.login-btn { border:1px solid #ddd; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
.header-login-box ul li.login-btn {background:#fff;}

.header-login-box ul li.join-btn {border:1px solid #2a323f;	background:#2a323f;}
.header-login-box ul li.join-btn  em {	color:#fff;}

.header-login-box ul li a {width: 100%; height: 100%; display: block; position: relative;}
.header-login-box ul li:hover {border-color:#19579d; transition:0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s;}
.header-login-box ul li:hover em {transition:0.3s; color:#19579d; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s;}
.header-login-box ul li.join-btn:hover {transition:0.3s; background-color:#19579d;  -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s;}
.header-login-box ul li.join-btn:hover em {color:#fff;}


/* H :: ¸Þ´º */

.gnb-overlay-bg {background: rgba(0, 0, 0, 0.5); left: 0px; top: 0px; width: 100%; height: 100%; display: none; position: fixed; z-index: 9997;}

#gnb { left: 0px; top:70px;border-top:1px solid #dfe0e2; border-bottom:1px solid #dfe0e2; width: 100%;  text-align: center;  position: absolute; z-index: 99; background:#fff;}
#gnb > ul {	display: inline-block; font-size:0;max-width:1400px;}
#gnb > ul > li {	display: inline-block; position: relative; -ms-word-break: keep-all;}
#gnb > ul > li > a {padding: 0px 38px; transition:0.5s; height: 50px; text-align: center; color:#262e3b; line-height: 50px; letter-spacing: -0.55px; font-size: 17px; font-weight: 500; display: block; position: relative; z-index: 100; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s;}
#gnb > ul > li > a:hover {color:#19579d;}
#gnb > ul > li.on > a {	color:#19579d;}
#gnb > ul > li.active > a {	color:#19579d;}

#gnbBg {background:#fff url(../image/t_menu_bg.gif) no-repeat right bottom;background-size:550px; left: 0px; top:50px; width: 100%; height: 300px; border-top:1px solid #dddddd;border-bottom:1px solid #dddddd; display: none; position: absolute; z-index: 98;}

.total-menu#gnb > ul > li .gnb-2dep {left: 0px; top: 50px; width: 100%; height: 300px; text-align: left; border-right:1px solid #dddddd;display: none; position: absolute; z-index: 99;}
.total-menu#gnb > ul > li:first-child .gnb-2dep {border-left:1px solid #dddddd;}
.total-menu#gnb > ul > li .gnb-2dep::before {transition:0.5s; left: 50%; top: 0px; width: 0px; height: 2px; position: absolute; z-index: 10; content: ""; background:#19579d; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s;}
.total-menu#gnb > ul > li:hover .gnb-2dep::before {	left: 0px; width: 100%;}
.total-menu#gnb > ul > li .gnb-2dep ul {	padding: 13px 0px;}
.total-menu#gnb > ul > li .gnb-2dep ul li {	position: relative;}
.total-menu#gnb > ul > li .gnb-2dep ul li a {	padding: 7px 15px; transition:0.2s; color:#333; line-height: 1.3; letter-spacing: -0.5px; font-size: 14px; font-weight: 400; display: block; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s;}
.total-menu#gnb > ul > li .gnb-2dep ul li a:hover {	color:#19579d;}


#gnb > ul > li .gnb-2dep.open ul li {	transition:0.8s; opacity: 1; -webkit-transition: all 0.8s; -moz-transition: all 0.8s; -o-transition: all 0.8s;}
#gnb > ul > li .gnb-2dep.open ul li:nth-child(1) {	transition-delay: 0.1s; -webkit-transition-delay: 0.1s; -moz-transition-delay: 0.1s; -o-transition-delay: 0.1s;}
#gnb > ul > li .gnb-2dep.open ul li:nth-child(2) {	transition-delay: 0.2s; -webkit-transition-delay: 0.2s; -moz-transition-delay: 0.2s; -o-transition-delay: 0.2s;}
#gnb > ul > li .gnb-2dep.open ul li:nth-child(3) {	transition-delay: 0.3s; -webkit-transition-delay: 0.3s; -moz-transition-delay: 0.3s; -o-transition-delay: 0.3s;}
#gnb > ul > li .gnb-2dep.open ul li:nth-child(4) {	transition-delay: 0.4s; -webkit-transition-delay: 0.4s; -moz-transition-delay: 0.4s; -o-transition-delay: 0.4s;}
#gnb > ul > li .gnb-2dep.open ul li:nth-child(5) {	transition-delay: 0.5s; -webkit-transition-delay: 0.5s; -moz-transition-delay: 0.5s; -o-transition-delay: 0.5s;}
#gnb > ul > li .gnb-2dep.open ul li:nth-child(6) {	transition-delay: 0.6s; -webkit-transition-delay: 0.6s; -moz-transition-delay: 0.6s; -o-transition-delay: 0.6s;}
#gnb > ul > li .gnb-2dep.open ul li:nth-child(7) {	transition-delay: 0.7s; -webkit-transition-delay: 0.7s; -moz-transition-delay: 0.7s; -o-transition-delay: 0.7s;}
#gnb > ul > li .gnb-2dep.open ul li:nth-child(8) {	transition-delay: 0.8s; -webkit-transition-delay: 0.8s; -moz-transition-delay: 0.8s; -o-transition-delay: 0.8s;}


.nav-open-btn {	display: none;}

#gnbM {	display: none;}


@media all and (max-width:1366px){
	
	#headerInner {	padding: 0px 15px;}
	
}

@media all and (max-width:1220px){
	
	#gnb > ul > li > a {padding: 0px 20px; font-size: 17px;}
	
}

@media all and (max-width:900px){
	
	#header {height:60px;}
	#headerInnerWrap {height:60px;}

	#header .logo {	padding: 10px 0px;}
	#header .logo img {	height: 35px;}

	.header-login-box {	display: none;}

	#gnb {display: none;}

	/* ¸ð¹ÙÀÏ */
	#gnbM {	transition:0.3s cubic-bezier(0.47, 0, 0.745, 0.715); top: 0px; width: 100%; height: 100%; right: -102%; display: block; visibility: hidden; position: fixed; z-index: 9999; max-width: 280px; background-color:#fff; -webkit-transition: all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); -oz-transition: all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);}
	.open#gnbM {right: 0px; visibility: visible;}

	.gnb-navigation-wrapper {height: 100%; padding-top:60px; position: relative; -ms-overflow-y: auto; box-sizing: border-box;}
	.header-util-menu-box + .gnb-navigation-wrapper {padding-top: 0px;}

	#navigation > li {border-bottom:1px solid #e7e7e7; background:#fff;}
	#navigation > li:first-child { border-top:1px solid #e7e7e7;}
	#navigation > li > a {padding: 15px; color:#333; font-size: 17px; font-weight: 500; display: block; position: relative;}
	#navigation > li.active > a {color:#19579d;}
	#navigation > li.has-2dep > a {}
	#navigation > li.has-2dep.active > a {}

	#navigation > li .gnb-icon {top: 50%; right: 15px; margin-top: -10px; position: absolute; display:none;}/*¸ð¹ÙÀϸ޴º¾ÆÀÌÄÜ*/
    #navigation > li .gnb-icon i {font-size: 20px; display:none;}/*¸ð¹ÙÀϸ޴º¾ÆÀÌÄÜ*/

	#navigation > li .gnb-2dep {padding: 15px 0px; display: none; background-color:#f2f2f2;}
	#navigation > li .gnb-2dep > li {height: auto !important;}
	#navigation > li .gnb-2dep > li > a {padding: 12px 30px; color:#444; font-size: 14px; display: block; opacity: 0.7;}
	#navigation > li .gnb-2dep > li.on > a {font-weight: 500; opacity: 1;}
	#navigation > li .gnb-2dep > li > .gnb-3dep {margin: 0px 10px; padding: 10px; display: none; background-color: rgb(170, 170, 170);}
	#navigation > li .gnb-2dep > li > .gnb-3dep > li > a {padding: 8px 0px; color: rgb(255, 255, 255); font-size: 13px; display: block;}
	#navigation > li .gnb-2dep > li > .gnb-3dep > li > a::before {margin-right: 5px; display: inline-block; content: "-";}


	/* ¸ð¹ÙÀÏ :: ·Î±×ÀÎ */
	.header-util-menu-box {	height: 60px;}

	.member-menu-box { padding: 15px 0px; height: 100%; text-align: center; margin-right: 60px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
	.member-menu-box li {width: 33.33%; height: 100%; float: left; position: relative;}
	.member-menu-box li::before {left: 0px; top: 0px;width: 1px; height: 100%; position: absolute; content: ""; background-color: rgba(0, 0, 0, 0.1);}
	.member-menu-box li:first-child::before {display: none;}
	.member-menu-box li a {	padding:0px 0px; color:#444; display: block; }
	.member-menu-box li a i {font-size: 30px;}
	.member-menu-box li a .mb-application-icon {padding: 4px; display: inline-block;}
	.member-menu-box li a p {letter-spacing: -0.5px; padding-top: 5px; font-size: 13px; font-weight: 400; display: block;}
	.member-menu-box li a p span {display: block;}
	.member-menu-box li a p em {display: block;}

	.gnb-style-full .member-menu-box {	padding: 0px; left: 0px; height: 80px; right: 0px; bottom: 0px; margin-right: 0px; border-top-color: rgb(221, 221, 221); border-top-width: 1px; border-top-style: solid; position: absolute;}
	.gnb-style-full .member-menu-box li a {	padding: 16px 0px;}


	/* ¸ð¹ÙÀÏ :: ¸Þ´º¹öÆ° */
	.nav-open-btn {	transition:0.3s cubic-bezier(0.47, 0, 0.745, 0.715); top: 15px; width: 24.5px; height: 28px; right: 15px; display: block; position: absolute; z-index: 10000; -webkit-transition: all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); -oz-transition: all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);}
	.nav-open-btn .line {	margin: 5.5px 0px; transition:0.3s ease-in-out; width: 100%; height: 2px; display: block; background-color: #262e3b; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out;}
	.nav-open-btn .line2 {	width: 16.8px; margin-left: 7.7px;}
	.nav-open-btn.active :nth-child(2).line {opacity: 0;}
	.nav-open-btn.active :nth-child(4).line {opacity: 0;}
	.nav-open-btn.active :nth-child(1).line {transform: translateY(7px) rotate(45deg); -o-transform: translateY(7px) rotate(45deg); -webkit-transform: translateY(7px) rotate(45deg);}
	.nav-open-btn.active :nth-child(3).line {transform: translateY(-7px) rotate(-45deg); -o-transform: translateY(-7px) rotate(-45deg); -webkit-transform: translateY(-7px) rotate(-45deg);}
	.fixed-header#header .nav-open-btn .line {background-color:#fff;}

}


@media all and (max-width:480px){

	#header .logo {	float:left;}
	
	#gnbM {max-width:100%;}

	.nav-open-btn .line {width: 20px; height: 2px;}
	.nav-open-btn.active :nth-child(1).line {transform: translateY(7px) rotate(45deg); -o-transform: translateY(7px) rotate(45deg); -webkit-transform: translateY(7px) rotate(45deg);}
	.nav-open-btn.active :nth-child(3).line {transform: translateY(-8px) rotate(-45deg); -o-transform: translateY(-8px) rotate(-45deg); -webkit-transform: translateY(-8px) rotate(-45deg);}
	.nav-open-btn .line2 {width: 16.8px; margin-left: 3.7px;}



}




/* === S :: ÇÏ´Ü === */

#footer {background:#f5f5f5 ;}
#footerInner {position: relative;}
.footer-left-con {	float: left;}
.footer-right-con {	float: right;}

#footerTop { border-top:1px solid #cccccc;  box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}

.to-top-btn {	/*border-radius: 100%;*/ transition:0.6s; width: 46px; height: 46px; text-align: center; right: 15px; bottom: -100px; color:#fff; line-height: 46px; display: block; position: fixed; z-index: 1099; opacity: 0; background-color:#134782; -webkit-transition: all 0.6s; -moz-transition: all 0.6s; -o-transition: all 0.6s;}
.to-top-btn.fixed {	bottom: 15px; opacity: 1;}


.foot-menu {float: left;}
.foot-menu li {	line-height: 60px; padding-left: 40px; float: left; position: relative;}
.foot-menu li::before {	left: 18px; top: 50%; width: 1px; height: 10px; margin-top: -5px; position: absolute; content: ""; background-color: rgb(61, 61, 61);}
.foot-menu li:first-child {	padding-left:  0px;}
.foot-menu li:first-child::before {	display: none;}
.foot-menu li a {color:#000; font-size: 16px; font-weight: 300; opacity: 0.6;}
.foot-menu li a b {	color:#000; font-weight: 500; opacity: 0.9;}


#footerBottom {	padding: 30px 0px;border-top:1px solid #cccccc;}

#footerBottom .footer-left-con {width:100%; padding-left: 0px;  box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
.footer-address p {	color:#000; line-height: 22px; font-size: 14px; font-weight: 300; opacity: 0.8;}
.footer-address p span {display: inline-block ; margin-right:15px;}
.footer-address a {	color: inherit;}
.footer-copyright {	color:#000; font-size: 13px; margin-top: 35px; opacity: 0.5;}


/* °³ÀÎÁ¤º¸Ãë±Þ¹æħ */
.personalcontents {width:95%; margin:0 2.5%;}
.personal_title { margin:0 0 20px 0;}
.txt_sum {margin:0 0 30px 0; font-size:15px; line-height:140%;}
.person_content {margin:0 20px 30px 20px; font-size:15px !important; line-height:140%;}
.person_content p {margin:0 0 20px 0;}


@media all and (max-width:800px){
	.foot-menu li {	line-height: 50px;}
	.foot-menu li a { font-size: 15px;}
	
}