@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cute+Font&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url('/css/nanumsquare.css');

/* **************************************** *
 * RESET FILES
 * **************************************** */
*{margin:0; padding:0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing:border-box;}
*:focus {outline: none !important;}
:focus {outline: none !important;}
html, body {-webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -ms-text-size-adjust: 100%; line-height:1; word-break: keep-all;	word-wrap: break-word;}
html, body, div, span, form, input, select, button, textarea, legend, fieldset, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, blockquote, address, p, th, td, caption {margin:0;padding:0}
ol, ul, li {list-style:none;}
em, dt, dd, address, i {font-style:normal;}
h1, h2, h3, h4, h5, h6{font-family: inherit;font-weight: 500;color: inherit;margin: 0;}
img, fieldset{border:none; vertical-align:top;}
hr {display:none;}
legend, .skip, .blind, .skip_nav {width:0;height:0;visibility:hidden;font-size:0;line-height:0;position:absolute;top:0;left:-9999em;overflow:hidden;}
table caption {display:none}
table {border-collapse:collapse;border-spacing:0;}
header, footer, section, article, aside, nav, hgroup, details, menu, figure, figcaption {display:block;}
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {display: block;}
a{text-decoration:none; color:#221815;}
a:link, a:visited {text-decoration:none;}
a:hover, a:focus, a:active{text-decoration:none;}



.clearfix { display:block; }
.clearfix:after { display:block; clear:both; content:"."; visibility:hidden; height:0; }



/* 링크점선없애기*/
a,img,input,textarea {selector-dummy: expression(this.hideFocus=true); border:0;}
img{border=0}


body, p, tr, td, div, table, form {
	font-family:"돋움", "Verdana", "돋움체", "Tahoma", "Arial";
	color:#858585;
	font-size:12px;
	line-height:17px;
	scrollbar-face-color:#e1e2e5;
	scrollbar-shadow-color:#d0d4e0;
	scrollbar-highlight-color:#FFFFFF;
	scrollbar-3dlight-color:#ffffff;
	scrollbar-darkshadow-color:#E8FFFF;
	scrollbar-track-color:#ffffff;
	scrollbar-arrow-color:#a0a1a2;
	margin:0px;
 }


/* CSS Document */
A:link {font-family:"돋움", "돋움체", "Tahoma", "Verdana", "Arial"; color:#7d7d7d; font-size:12px; text-decoration:none;}
A:visited {font-family:"돋움", "돋움체", "Tahoma", "Verdana", "Arial"; color:#7d7d7d; font-size:12px; text-decoration:none;}
A:active {font-family:"돋움", "돋움체", "Tahoma", "Verdana", "Arial"; color:#7d7d7d; font-size:12px; text-decoration:none;}
A:hover {font-family:"돋움", "돋움체", "Tahoma", "Verdana", "Arial"; color:#a67c52; font-size:12px; text-decoration:none;}



.notice {font-family:"돋움체", "Verdana", "Tahoma", "Arial"; color:#7d7d7d; font-size:12px; text-decoration:none; line-height:17px; letter-spacing:-1px;}
.notice A:link {font-family:"돋움체", "Verdana", "Tahoma", "Arial"; color:#7d7d7d; font-size:12px; text-decoration:none; line-height:17px; letter-spacing:-1px;}
.notice A:visited {font-family:"돋움체", "Verdana", "Tahoma", "Arial"; color:#7d7d7d; font-size:12px; text-decoration:none; line-height:17px; letter-spacing:-1px;}
.notice A:active {font-family:"돋움체", "Verdana", "Tahoma", "Arial"; color:#7d7d7d; font-size:12px; text-decoration:none; line-height:17px; letter-spacing:-1px;}
.notice A:hover {font-family:"돋움체", "Verdana", "Tahoma", "Arial"; color:#a67c52; font-size:12px; text-decoration:none; line-height:17px; letter-spacing:-1px; font-weight:bold;}


.n_num {font-family:"돋움체", "Verdana", "Tahoma", "Arial"; color:#acacac; font-size:11px; text-decoration:none; line-height:17px; letter-spacing:-1px;}
.n_num A:link {font-family:"돋움체", "Verdana", "Tahoma", "Arial"; color:#acacac; font-size:11px; text-decoration:none; line-height:17px; letter-spacing:-1px;}
.n_num A:visited {font-family:"돋움체", "Verdana", "Tahoma", "Arial"; color:#acacac; font-size:11px; text-decoration:none; line-height:17px; letter-spacing:-1px;}
.n_num A:active {font-family:"돋움체", "Verdana", "Tahoma", "Arial"; color:#acacac; font-size:11px; text-decoration:none; line-height:17px; letter-spacing:-1px;}
.n_num A:hover {font-family:"돋움체", "Verdana", "Tahoma", "Arial"; color:#acacac; font-size:11px; text-decoration:none; line-height:17px; letter-spacing:-1px;}

.content {padding:25px 0px 0px 0px;}

.text_bule {color:#55be0f; font-weight:bold; }

.png24 {
   tmp:expression(setPng24(this));
}


  .txt1{
 font-family:"돋움", "Verdana", "돋움체", "Tahoma", "Arial";
 font-size:12px; 
 color:#ffffff;
 font-weight:bold;
 }

  .txt2{
 font-family:"돋움", "Verdana", "돋움체", "Tahoma", "Arial";
 font-size:11px; 
 color:#858585;
 letter-spacing:-1px;
 }

  .txt3{
 font-family:"돋움", "Verdana", "돋움체", "Tahoma", "Arial";
 font-size:11px; 
 color:#858585;
 letter-spacing:-2px;
 }

 .search1 { COLOR: #858585 ; FONT-FAMILY: "돋움" ; FONT-SIZE: 11PX ; PADDING-LEFT:2 ;BACKGROUND-COLOR:F1FAFA;
		BORDER:1  
		font-family: "돋움";
		BORDER-TOP-COLOR:#AAC9C8;BORDER-RIGHT-COLOR: #AAC9C8;BORDER-BOTTOM-COLOR: #AAC9C8;BORDER-LEFT-COLOR:#AAC9C8}

.input{
BORDER-RIGHT: #cccccc 1px solid; BORDER-TOP: #cccccc 1px solid; FONT-SIZE: 9pt; BORDER-LEFT: #cccccc  1px solid; 
COLOR: #666666; LINE-HEIGHT: 16px; BORDER-BOTTOM: #cccccc  1px solid; FONT-FAMILY: "돋움"; BACKGROUND-COLOR: #ffffff}

.select {  font-size:9pt; color:#000000; background-color:#FFFFFF; border-width:1; border-color:#696969; border-style:solid; height:0px;}
.textarea {  font-size:9pt; color:#000000; background-color:#FFFFFF; border-width:1; border-color:#696969; border-style:solid;}
.button { border:solid 1 #959595;font-family:돋움,돋움체,Tahoma,Verdana,Arial;font-size:9pt;color:white;background-color:#959595; height:0px; cursor:hand;}
.button2 { border:solid 1 #ffffff;font-family:돋움,돋움체,Tahoma,Verdana,Arial;font-size:9pt;color:black;background-color:#ffffff; height:0px; cursor:hand;}
.button3 { border:solid 1 #000000;font-family:돋움,돋움체,Tahoma,Verdana,Arial;font-size:9pt;color:white;background-color:#000000; height:0px; cursor:hand;}


.dot_line{
	background:url(/img/com/dot_line.gif) repeat-x;
}

.root_text{
	font: 11px "돋움", "돋움체";
	color: #999999;
}




.idpw_input {
	height: 18px;
	width: 151px;
	border: 1px solid #cecece;
	font: 12px "돋움", "돋움체";
	color: #818181;
}

.idpw_input2 {
	height: 18px;
	width: 68px;
	border: 1px solid #cecece;
	font: 12px "돋움", "돋움체";
	color: #818181;
}





.join_input {
	height: 18px;
	width: 93px;
	border: 1px solid #cecece;
	font: 12px "돋움", "돋움체";
	color: #818181;
}

.join_input2 {
	height: 18px;
	border: 1px solid #cecece;
	font: 12px "돋움", "돋움체";
	color: #818181;
}


.join_bbox {
	height: 180px;
	width: 590px;
	border: 1px solid #ffffff;
	font: 12px "돋움", "돋움체";
	color: #696969;
}


.join_bbox2 {
	height: 420px;
	width: 620px;
	border: 1px solid #ffffff;
	font: 12px "돋움", "돋움체";
	color: #696969;
}

.join_intro {
	height: 60px;
	width: 490px;
	border: 1px solid #cecece;
	font: 12px "돋움", "돋움체";
	color: #818181;
}

.board_box {
	height: 85px;
	width:95%;
	border: 1px solid #cecece;
	font: 12px "돋움", "돋움체";
	color: #818181;
}


/* **************************************** *
 * 메인
 * **************************************** */
/* 인트로 */
.intro{position:relative;}
.intro .butterfly{position:absolute; left:270px; bottom:100px;}
.intro .lang{position:absolute; left:45%; bottom:80px;}
.intro .lang a{display:inline-block; text-align:center; font-size:15px; font-weight:500; color:#fff; background: url("/img/intro/lang_bg.gif") no-repeat 0 center; background-size:cover; width:122px; height:40px; line-height:40px; margin:0 8px;  transition: all ease 0.5s; }
.intro .lang a:hover{background: url("/img/intro/lang_bg_ov.gif") no-repeat 0 center; background-size:cover;}

.bounce {
 	animation: bounce .5s linear 0s infinite alternate;
 	-webkit-animation: bounce .5s linear 0s infinite alternate;
 }


@-webkit-keyframes bounce {
	0% {bottom: 1010px;}
	100% {bottom: 120px;}
}

@keyframes bounce {
	0% {bottom: 110px;}
	100% {bottom: 120px;}
}

/* 메인 */
#wrap{position:relative; width:980px; height:484px; }
#wrap .gnb{position:absolute; right:25px; top:8px; overflow:hidden;}
#wrap .gnb ul{float:left;}
#wrap .gnb ul li{display:inline-block; margin:0 5px; position:relative; font-weight:600;height:26px; line-height:26px;font-size:11px;}
#wrap .gnb ul li:before{content : ""; display : block; position : absolute; left : -8px; top:50%; margin-top:-6px;  width :1px; height : 12px; background : #ddd;}
#wrap .gnb ul li:first-child:before{background:none;}
#wrap .gnb ul li a{font-size:12px; color:#8E8E8E;}
#wrap .gnb ul li:nth-of-type(2) a{color:#7EB900;}
#wrap #header{height:117px; position:relative;}
#wrap #header h1{position:absolute; left:0; top:20px; }

/*사이트맵*/
#wrap #header #menuAll{ position:fixed; left:55%; top:-447px; width:458px; height:380px; padding:20px 0;  z-index:100; transition:top 0.45s; background: url("/img/main/sitemap_bg.png") no-repeat 0 0;}
#wrap #header.open #menuAll{transition:top 0.45s; top:40px;}
#wrap #header #menuAll ul{overflow:hidden;font-size:14px; }
#wrap #header #menuAll ul li{width:33.333%; float:left; position:relative; }
#wrap #header #menuAll ul li div a{font-size:16px; color:#fff;  text-align:center; font-weight:bold; display:block;}
#wrap #header #menuAll ul li ul{padding-left:20px; margin-top:20px;}
#wrap #header #menuAll ul li ul li{float:none; width:100%; margin-top:10px; position:relative; padding-left:12px;}
#wrap #header #menuAll ul li ul li:before{ content : ""; display : block; position : absolute; left :0; top:50%; margin-top:-2px; width : 4px; height : 4px; background : #666; border-radius:50%; }
#wrap #header #menuAll .close{position:absolute; right:15px; bottom:15px;}
#wrap #header #menuAll .close a{cursor:pointer;}

/* 탑메뉴 */
#wrap #header #nav {position:relative; float:right; padding:0px; margin-top:40px;}

/* 1차메뉴 */
#wrap #header #nav > ul > li {display:inline-block;}
#wrap #header #nav > ul > li > div > a{display:block; width:124px; height: 37px; line-height:29px; text-align:center; font-size:18px; font-weight:800; color:#6B6B6B;}
#wrap #header #nav > ul > li.on > div > a{ background: url("/img/main/tm_bg2.png") no-repeat center center; color:#fff;}

#wrap #header #nav > ul > li:nth-of-type(2) > div > a{width:156px;} 
#wrap #header #nav > ul > li:nth-of-type(2).on > div > a{ background: url("/img/main/tm_bg.png") no-repeat center center; }
#wrap #header #nav > ul > li > div > a:link, 
#wrap #header #nav > ul > li > div > a:visited,
#wrap #header #nav > ul > li > div > a:active,
#wrap #header #nav > ul > li > div > a:hover{font-family: 'NanumSquare',  'Dotum', '돋움', 'sans-serif';}


/* 2차메뉴 */
#wrap #header #nav ul li ul { display:none; position:absolute; float:left; top:32px; left:10px; z-index:100; width:100%;}
#wrap #header #nav ul li ul li { float:left; margin:0 5px; height:28px; line-height:28px;}
#wrap #header #nav ul li ul li a{color:#727272; padding:0 5px 7px; font-size:13px; font-weight:bold;}
#wrap #header #nav ul li ul li a:hover{color:#7EC8EA; position:relative; background: url("/img/main/tsm_bg.png") no-repeat right bottom; }


/* 비주얼 */
#wrap #visual{width:100%; height:367px; padding-top:62px;}
#wrap #visual .vtxt{text-align:center; font-size:32px; color:#575757; font-weight:bold; line-height:1; font-family: 'Cute Font',  'Dotum', '돋움', 'sans-serif';}
#wrap #visual .vtxt em,
#wrap #visual .vtxt span{font-size:38px; text-emphasis-style: dot;  text-emphasis-position: over left; -webkit-text-emphasis-style: dot; -webkit-text-emphasis-position: over;}
#wrap #visual .vtxt em:nth-of-type(1){color:#40A4D3;}
#wrap #visual .vtxt em:nth-of-type(2){color:#7EB900;}
#wrap #visual .vtxt span:nth-of-type(1){color:#EEBE00;}
#wrap #visual .vtxt span:nth-of-type(2){color:#E286AD;}
#wrap #visual #imgList{overflow:hidden;}
#wrap #visual #imgList li{width:260px; float:left;  margin-left:-20px; -webkit-transition: all ease 0.5s; -moz-transition: all ease 0.5s; transition: all ease 0.5s;}
#wrap #visual #imgList li:first-child{margin-left:0;}
#wrap #visual #imgList li a{display:block; width:100%; height:260px; -webkit-transition: all ease 0.5s; -moz-transition: all ease 0.5s; transition: all ease 0.5s;}
#wrap #visual .v01 a{background: url("/img/main/vis01.png") no-repeat 0 0;}
#wrap #visual .v02 a{background: url("/img/main/vis02.png") no-repeat 0 0;}
#wrap #visual .v03 a{background: url("/img/main/vis03.png") no-repeat 0 0;}
#wrap #visual .v04 a{background: url("/img/main/vis04.png") no-repeat 0 0;}
#wrap #visual .v01.active a{background: url("/img/main/vis01_ov.png") no-repeat 0 0;}
#wrap #visual .v02.active a{background: url("/img/main/vis02_ov.png") no-repeat 0 0;}
#wrap #visual .v03.active a{background: url("/img/main/vis03_ov.png") no-repeat 0 0;}
#wrap #visual .v04.active a{background: url("/img/main/vis04_ov.png") no-repeat 0 0;}

/* **************************************** *
 * 서브
 * **************************************** */
#wrap.subTop{position:relative; width:980px; height:287px; }
#wrap.subTop #header{height:105px;}

/* 서브비주얼 */
#wrap #sub_visual{width:100%; height:182px; padding-top:62px; background: url("/img/com/sub_visual01.png") no-repeat 0 0; }
#wrap #sub_visual .vtxt{ padding-left:280px;font-size:25px; color:#888; font-weight:bold; line-height:1; font-family: 'Cute Font',  'Dotum', '돋움', 'sans-serif';}
#wrap #sub_visual .vtxt em,
#wrap #sub_visual .vtxt span{font-size:28px; text-emphasis-style: dot;  text-emphasis-position: over left; -webkit-text-emphasis-style: dot; -webkit-text-emphasis-position: over;}
#wrap #sub_visual .vtxt em:nth-of-type(1){color:#40A4D3;}
#wrap #sub_visual .vtxt em:nth-of-type(2){color:#7EB900;}
#wrap #sub_visual .vtxt span:nth-of-type(1){color:#EEBE00;}
#wrap #sub_visual .vtxt span:nth-of-type(2){color:#E286AD;}

.left_menu{width:200px; margin:0 auto; padding-left:20px; margin-bottom:200px;}
.left_menu h2{text-align:center;}
.left_menu ul li{text-align:left;}
.left_menu ul li a{display:block; color:#515151; position:relative; font-size:15px; font-weight:500; background: url("/img/com/line1.png") no-repeat center bottom; height:54px; line-height:24px; padding-left:20px; font-family: 'Noto Sans KR',  'Dotum', '돋움', 'sans-serif';}
.left_menu ul li a:hover,
.left_menu ul li.on a{color:#48A2CD;}
.left_menu ul li.on a:after{ content : ""; display : block; position : absolute; right : 20px; top:50%; margin-top:-8px; width : 17px; height : 16px;  background: url("/img/com/arr1.png") no-repeat left top;}

.left_menu ul.lm02 li a{ background: url("/img/com/line2.png") no-repeat center bottom;}
.left_menu ul.lm02 li a:hover,
.left_menu ul.lm02 li.on a{color:#7DB800;}
.left_menu ul.lm02 li.on a:after{background: url("/img/com/arr2.png") no-repeat left top;}

.left_menu ul.lm03 li a{ background: url("/img/com/line3.png") no-repeat center bottom;}
.left_menu ul.lm03 li a:hover,
.left_menu ul.lm03 li.on a{color:#D2AF23;}
.left_menu ul.lm03 li.on a:after{background: url("/img/com/arr3.png") no-repeat left top;}

.left_menu ul.lm04 li a{ background: url("/img/com/line4.png") no-repeat center bottom;}
.left_menu ul.lm04 li a:hover,
.left_menu ul.lm04 li.on a{color:#DB81A7;}
.left_menu ul.lm04 li.on a:after{background: url("/img/com/arr4.png") no-repeat left top;}