@charset "utf-8";
@font-face {
	font-family: 'SUIT';
	font-weight: 100;
	src: url('suit/SUIT-Thin.woff2') format('woff2');
}
@font-face {
	font-family: 'SUIT';
	font-weight: 200;
	src: url('suit/SUIT-ExtraLight.woff2') format('woff2');
}
@font-face {
	font-family: 'SUIT';
	font-weight: 300;
	src: url('suit/SUIT-Light.woff2') format('woff2');
}
@font-face {
	font-family: 'SUIT';
	font-weight: 400;
	src: url('suit/SUIT-Regular.woff2') format('woff2');
}
@font-face {
	font-family: 'SUIT';
	font-weight: 500;
	src: url('suit/SUIT-Medium.woff2') format('woff2');
}
@font-face {
	font-family: 'SUIT';
	font-weight: 600;
	src: url('suit/SUIT-SemiBold.woff2') format('woff2');
}
@font-face {
	font-family: 'SUIT';
	font-weight: 700;
	src: url('suit/SUIT-Bold.woff2') format('woff2');
}
@font-face {
	font-family: 'SUIT';
	font-weight: 800;
	src: url('suit/SUIT-ExtraBold.woff2') format('woff2');
}
@font-face {
	font-family: 'SUIT';
	font-weight: 900;
	src: url('suit/SUIT-Heavy.woff2') format('woff2');
}

/************************  default  ************************/
html{ margin:0px; padding:0px; overflow-y: scroll;  } 
body {font-family:'SUIT', "돋움", Dotum, AppleGothic, Sans-serif; font-size:12px; color:#888; line-height:18px; border-collapse:collapse; margin:0px; padding:0px; background:#f5f4f0; width:100%; 
letter-spacing:-0.03px; font-smoothing: antialiased; font-smooth:always; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
-webkit-text-size-adjust:none; zoom:1;}
h1, h2, h3, h4, h5, h6 { margin:0px; padding:0px; font-size:1em;}
img { border:none; margin:0px; padding:0px; vertical-align:top;}
ol, ul {margin:0px; padding:0px; list-style:none;}
div, li, dl, dt, dd, form, iframe, p, a, span, blockquote  {margin:0px; padding:0px; list-style:none; vertical-align:top;}
label {vertical-align: middle;}
table, th, td {margin:0px; padding:0px; font-size:1em; border-collapse:collapse;}
input, textarea {margin:0px; padding:0px; font-family:'SUIT', "돋움", Dotum, "굴림", Gulim, Tahoma, Verdana, AppleGothic, sans-serif; font-size:1em; color:#555555; border:1px solid #ccd2da; background:#fff; vertical-align:middle;}
input {padding-top:2px; height:14px;}
textarea {padding:4px 4px 4px 4px;}
check { vertical-align:top; margin:0; *margin:-7px 0 0 0;  }
select { font-family:dotum;  font-size:12px; color:#777777; height:20px; }

a {cursor:pointer; }
a:link, a:visited, a:hover, a:active {text-decoration: none; color:#7b61b7;}
caption { display:none; }







/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/
img, object, embed, video {
	max-width: 100%;
}
/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
	width:auto;

}

/*
	Dreamweaver Fluid Grid Properties
	----------------------------------
	dw-num-cols-mobile:		5;
	dw-num-cols-tablet:		8;
	dw-num-cols-desktop:	10;
	dw-gutter-percentage:	25;
	
	Inspiration from "Responsive Web Design" by Ethan Marcotte 
	http://www.alistapart.com/articles/responsive-web-design
	
	and Golden Grid System by Joni Korpi
	http://goldengridsystem.com/
*/

/* Mobile Layout: 480px and below. */
#wrap{display:none;}
#wrap2{display:none ;}
#wrap3{display:none;}
.gnb_btn a{font-size:10px; color:#777; font-weight:500;  }
.gnb_btn li:after{content:" | "; font-size:7px; padding:0 10px;  line-height:0;}
.gnb_btn li img{padding-top:5px;}
.gnb_btn li:last-child:after{content:"";}


/* 360px이상 췝뷰 */

@media only screen and (min-width: 0px) {
#wrap{ display:none;}
#wrap3{display:none;}
#wrap2{clear: both;float: left;margin-left: 0;width: 100%;display: block; background-color:#f5f4f0; margin:0 auto; text-align:center;}
#con_wrapper{clear: both; margin-left: 0; width:auto; display: block; text-align:center; margin:0 auto;   background-color:#e1ded6; padding-top:15px; padding-bottom:6px; text-align:center;}
#con_wrapper li{ margin:0 6px 0 6px; }
#con_wrapper li.bottom{ margin-bottom:6px;}
#con_wrapper li.bottom img{width:48%;}
#con_wrapper li.imgages_f img{width:48%;}
#con_wrapper li.footer{margin-top:6px; margin-bottom:23px}
#con_wrapper li.footer img{width:98%;}
.con_right{ margin-right:6px;}


.plus{display:none;}


}



/* 640px이상 췝뷰 */

@media only screen and (min-width: 768px) {
#wrap2{display:none;}
#wrap{display:none;}
.plus{clear: both;float: left;margin-left: 0;width: 100%;display: block; margin:0 auto;}
.script_btn{width:500px; margin:0 auto; font-family:"돋움"; font-size:15px; color:#888; margin-bottom:30px; text-align:center;}
 .script_btn li{ display:inline;}
 .script_btn li.scrip_ri_le{padding-right:10px; padding-left:10px;}


#wrap3{clear: both; margin-left: 0;width: 768px;display: block; background:#f5f4f0; margin:0 auto;}

#Main_wrapper_3{clear: none;margin-left: ;width: 768px;display: block; overflow:hidden; margin:0 auto;}

 .header_3{ clear: none; float: left; margin-left: ; width: 732px; display: block; padding-left:36px; padding-top:17px; padding-bottom:10px;}
 .logo_3{ clear: none; float: left; margin-left:0; width: 115px; display: block;}
 .top_btn_3{ clear: none; float: right; margin-left: 0;  display: block; padding-top:18px;}
 .top_btn_3 li{float:left;}


 .nav_3{clear: none;float: left;margin-left: 0; display: block; width:768px;	height:44px;	margin:0 auto; background-color:#7b61b7;	border:1px solid #7058a7;}
.nav_3 li{float:left;}

#Main_conwrap_2{ clear: none; float: left; margin-left: 0; width:768px; background:#fff; display: block;}
.con_side_2{ clear: none; float: left; margin-left: 0; width:202px; display: block;}
.con_side2{ clear: none; margin-left: 0; width:202px; display: block; float:left;}

.con_mid_2{ clear: none; float: left; margin-left: 0; width:566px; display: block;}
.main_banner_2{ clear: none; float: left; margin-left: 0; width:296px; display: block; background:url(../images/main_2/banner_bg.jpg) no-repeat left top; padding:23px 37px 24px 31px;}

.main_banner_2 li.botom{padding-bottom:31px;}
#footer_3{clear: none;float: left;margin-left: 0; display: block; width:750px; padding:24px 45px 38px 19px;}
#footer_3 li{float:left;}
#footer_3 li.foot_left_3{padding-left:60px;}






}

/* 769px이상 웹뷰 */

@media only screen and (min-width: 1000px) {
#wrap2{display:none;}
#wrap3{display:none;}
.plus{clear: both;float: left;margin-left: 0;width: 100%;display: block; margin:0 auto;}
.script_btn{width:500px; margin:0 auto; font-family:"돋움"; font-size:15px; color:#888; margin-bottom:30px; text-align:center;}
 .script_btn li{ display:inline;}
 .script_btn li.scrip_ri_le{padding-right:10px; padding-left:10px;}


#wrap{clear: both; margin-left: 0;width: 1000px; display: block; background:#f5f4f0; margin:0 auto;}

 #Main_wrapper{ clear: none;  margin-left: 0; width: 1000px; display: block; margin:0 auto; overflow:hidden; margin:0 auto; }
   .header{ clear: none; float: left; margin-left: 0; width:933px; display: block; padding-top:26px;	padding-left:67px; padding-bottom:21px; margin:0 auto;}
.logo{ clear: none; float: left; margin-left: 0; width: 135px; display: block;}
.top_btn{ clear: none; float:right; margin-left: 0;display: block; padding-top:44px;}
.top_btn li{ float:left;}
.nav{ clear: none; float: left; margin-left: 0; display: block; width:910px;	height:43px;	background-color:#7b61b7;	border:1px solid #7058a7;	margin:0 auto;	padding-left:44px;	padding-right:44px;}
.nav li{float:left; width:182px;}

#Main_conwrap{ clear: none; float: left; margin-left: 0; width:1000px; background:#fff; height:404px; display: block;}
.con_side{ clear: none; float: left; margin-left: 0; width:202px; display: block;}
.con_mid{ clear: none; float: left; margin-left: 0; width:394px; display: block;}
.main_banner{ clear: none; float: left; margin-left: 0; width:920px; display: block; background:url(../images/main/banner_bg.jpg) no-repeat left top; padding:40px 40px 51px;}
.main_banner li{float:left; width:296px;}
.main_banner li.ie7_1{float:left; width:248px;}
.main_banner li.right{ padding-right:40px;}
#footer{ clear: none; float: left; margin-left: 0; display: block; padding-top:24px; padding-bottom:38px; width:1039px; margin:0 auto;}
.f_logo{ clear: none; float: left; margin-left: 0; width:121px; height:auto; display: block; padding-left:45px;}
.copy{clear: none; float: left; margin-left: 0; margin-top:4px; width:730px; height:auto; display: block; margin-left:61px;}
}