@CHARSET "UTF-8";
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);

html {height:100%; height:100%;  margin: 0;padding: 0; }
body {height:100%; overflow-y:scroll; margin: 0;padding: 0; font-family:'Noto Sans KR' !important, sans-serif  !important, nanumgothic !important, 나눔고딕  !important,   Dotum  !important, 돋움  !important, Arial  !important, "Trebuchet MS", "Lucida Console", AppleSDGothicNeo, sans-serif; }
input, textarea, select, button {font-family:'Noto Sans KR' !important, sans-serif  !important, nanumgothic !important, 나눔고딕  !important,   Dotum  !important, 돋움  !important, Arial  !important, "Trebuchet MS", "Lucida Console", AppleSDGothicNeo, sans-serif;}
input[type=password] {font-family:'Noto Sans KR' !important, sans-serif  !important, nanumgothic !important, 나눔고딕  !important,   Dotum  !important, 돋움  !important, Arial  !important, "Trebuchet MS", "Lucida Console", AppleSDGothicNeo, sans-serif;}
input,select,textarea {	}
input[type=password],
.chinese {font-family:'Noto Sans KR' !important, sans-serif  !important, nanumgothic !important, 나눔고딕  !important,   Dotum  !important, 돋움  !important, Arial  !important, "Trebuchet MS", "Lucida Console", AppleSDGothicNeo, sans-serif;}


header, header div, header ul, header li, header input, header select, header span, header h1, header h2, header textarea, header button, header img {
-webkit-transition: width .3s, height .3s, left .3s, top .3s, right .3s, bottom .3s;
	-ms-transition: width .3s, height .3s, left .3s, top .3s, right .3s, bottom .3s;
	transition: width .3s, height .3s, left .3s, top .3s, right .3s, bottom .3s;} 

footer, footer div, footer ul, footer li, footer input, footer select, footer span, footer h1, footer h2, footer textarea, footer button, footer img {
-webkit-transition: width .3s, height .3s, left .3s, top .3s, right .3s, bottom .3s;
	-ms-transition: width .3s, height .3s, left .3s, top .3s, right .3s, bottom .3s;
	transition: width .3s, height .3s, left .3s, top .3s, right .3s, bottom .3s;} 

.w_container, .w_container div, .w_container ul, .w_container li, .w_container input, .w_container select, .w_container span, .w_container h1, .w_container h2, .w_container textarea, .w_container button, .w_container img, .w_container p {
-webkit-transition: width .3s, height .3s, left .3s, top .3s, right .3s, bottom .3s;
	-ms-transition: width .3s, height .3s, left .3s, top .3s, right .3s, bottom .3s;
	transition: width .3s, height .3s, left .3s, top .3s, right .3s, bottom .3s;} 


.w_sub_visual, .w_sub_visual div, .w_sub_visual ul, .w_sub_visual li, .w_sub_visual input, .w_sub_visual select, .w_sub_visual span, .w_sub_visual h1, .w_sub_visual h2, .w_sub_visual textarea, .w_sub_visual button, .w_sub_visual img {
-webkit-transition: width .3s, height .3s, left .3s, top .3s, right .3s, bottom .3s;
	-ms-transition: width .3s, height .3s, left .3s, top .3s, right .3s, bottom .3s;
	transition: width .3s, height .3s, left .3s, top .3s, right .3s, bottom .3s;} 



.w_container {position:relative; width:1200px; margin-left:auto; margin-right:auto; }
.ww_container {position:relative; width:1200px; margin-left:auto; margin-right:auto; }


@media (max-width:1480px) {
	.w_container {width:100%; float:left; padding:0 20px 0 20px;}
	.ww_container {width:100%; float:left; padding:0 20px 0 20px;}
}

@media (max-width:1200px) {
	.w_container {width:100%;}
	.ww_container {width:100%;}
}

@media (max-width:980px) {
	.w_container {width:100%;padding:0 10px 0 10px;}
	.ww_container {width:100%;padding:0 10px 0 10px;}
}


@media (max-width:720px) {
	.w_container {width:100%;padding:0 10px 0 10px;}
	.ww_container {width:100%;padding:0 10px 0 10px;}
}


img {max-width:100%; vertical-align:middle;}





/*-------------------------------------------------------------------------------------*
 *  Header                                                                             *
 *-------------------------------------------------------------------------------------*/
header .header_wrap{ overflow:visible; z-index:498; width:100%;-webkit-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out; background:#000000; float:left;}
header .w_logo_wrap {float:left; line-height:100px}
header .w_menu {float:right; }
header .w_menu ul li {}
header .w_menu ul li a {color:#fff}
header .m_header_wrap {display:none; overflow:visible; z-index:498; width:100%;   height:70px; background:#000000 }
header .m_header_wrap .wm_logo_wrap {float:left; line-height:70px; padding:0 0 0 10px}
.m_menu {position:absolute; right:0; top:0}
.m_menu img{height:70px}

header .nav-shrink { top:0; left:0px; }
 /* 기본으로 있어야 하는 CSS */
#cssmenu,#cssmenu ul,#cssmenu ul li,#cssmenu ul li a,#cssmenu #menu-button {display: block; z-index:1000000;}
#cssmenu ul ul {position: absolute;left: -9999px;}
#cssmenu li:hover > ul {left: auto; }
#cssmenu ul ul ul {margin-left: 100%;top: 0;} /* 쓰리뎁스가 우측으로 나오게 */
#cssmenu ul ul li {height: 0;-webkit-transition: height .2s ease;-moz-transition: height .2s ease;-ms-transition: height .2s ease;-o-transition: height .2s ease;transition: height .2s ease;} /* 투뎁스 부드럽게 나오는 효과 */
/* ysk 수정해줘야할 스타일시트 */
#cssmenu {}
#cssmenu > ul > li  {display:inline-block; margin:0 0 0 90px; line-height:100px; font-size:18px; font-weight:100 !important; font-family:'Noto Sans KR' , sans-serif !important }
#cssmenu > ul > li a:hover {color:#e3d5be}
#cssmenu ul li:hover > ul {top:100px}
#cssmenu ul li:hover > ul > li {height: 40px;  background:#000000; padding:0 0 0 0; position:relative; left:-35px; color:#ffffff;} /*  투뎁스 메뉴의높이 */
#cssmenu ul li:hover > ul > li:last-child {}
#cssmenu ul ul li a {text-align:center; line-height: 40px; width:140px; font-size:14px;  color:#ffffff; font-weight:700; letter-spacing:-1pt;} /* 뎁스 스타일 */
#cssmenu ul ul li:hover > a,#cssmenu ul ul li a:hover {color: #ffffff; font-weight:700;background:#222222; } /* 뎁스 오버시 폰트컬러 */


.menu_open {position:absolute; right:0; top:0; cursor:pointer;z-index:2} 
.w_quick {position:absolute; right:-100px; top:100px; z-index:9999}
.w_quick img {height:150px}


@media (max-width:1480px) {
	header .w_logo_wrap {}

}

@media (max-width:1200px) {
	header .header_wrap{display:none}
	header .m_header_wrap {display:block; }
	.w_quick {display:none}
}

@media (max-width:980px) {

}

@media(max-width:720px) {
	header .m_header_wrap .wm_logo_wrap img{height:30px}

}




/*-------------------------------------------------------------------------------------*
 *  main                                                                           *
 *-------------------------------------------------------------------------------------*/

.main_visual {width:100%; padding:140px 0 0 0;box-shadow: 0px 0px 20px #000;}
.main_con {padding:50px 0 50px 0; width:100%; float:left;}
.main_con ul li {padding:0 10px 0 10px}
.main_con ul li {margin:0 0 10px 0}
.main_con_img {width:100%; floaT:left; }
.main_con_img img {width:100%}


@media (max-width:1200px) {
	.main_visual {padding:70px 0 0 0}

}

@media (max-width:980px) {
	.main_con ul li {padding:0 5px 0 5px}

}

@media (max-width:720px) {
	.main_visual {padding:50px 0 0 0}
	.main_con {padding:30px 0 30px 0}
}

.main_p_con {}
.main_m_con {display:none}

@media (max-width:720px) {
	.main_p_con {display:none}
	.main_m_con {display:block}
}


/*-------------------------------------------------------------------------------------*
 *  footer                                                                             *
 *-------------------------------------------------------------------------------------*/
footer {width:100%; float:left; background:#000000; padding:40px 10px 40px 10px; position:relative;}
.f_logo {position:absolute; left:0;top:0}
.f_customer {position:absolute; right:0;top:0}
.f_text {text-align:center; font-weight:600; color:#b6b6b6; font-size:12px}


@media (max-width:980px) {
	.f_logo img {height:20px}
	.f_customer img {height:20px}

}



@media (max-width:720px) {
	.f_logo {position:relative; text-align:center; width:100%; }
	.f_customer {position:relative; text-align:center; width:100%;}
	.f_text {padding:10px}


}


/*-------------------------------------------------------------------------------------*
 *  sub                                                                                *
 *-------------------------------------------------------------------------------------*/
.w_sub_visual {width:100%;  padding:100px 0 80px 0; float:left; background:url(../images/sub_visual_bg.jpg) no-repeat center center ;box-shadow: 0px 0px 20px #000;}
.sub_con {padding:50px 0 50px 0; width:100%; float:left;}

.w_line-box {width:100%; padding:40px 0 40px 0; float:left; position:relative; border:solid 1px #000000 }
.w_line_1 {position:absolute; left:0; top:-3px; margin:0; padding:0}
.w_line_2 {position:absolute; left:0; bottom:-2px; margin:0; padding:0}
.w_line_3 {position:absolute; right:0; top:-3px; margin:0; padding:0}
.w_line_4 {position:absolute; right:0; bottom:-2px; margin:0; padding:0}
.w_text {padding:50px 0 0 0; width:100%; floaT:left;}


.w_font_001 {color:#2c2c2c; font-size:18px; font-weight:600;font-family:'Noto Sans KR' , sans-serif !important; text-align:center; padding:15px 0 0 0; width:100%; float:left;}
.w_font_002 {color:#2c2c2c; font-size:14px; font-weight:100;font-family:'Noto Sans KR' , sans-serif !important; padding:15px 20px 20px 20px ; text-align:center;width:100%; float:left;}
.w_font_003 {color:#fff; font-size:60px; font-weight:600;font-family:'Noto Sans KR' , sans-serif !important; padding:0 0 30px 0; width:100%; float:left; letter-spacing:-1px}
.w_font_004 {color:#fff; font-size:20px; font-weight:100;font-family:'Noto Sans KR' , sans-serif !important; width:100%; float:left;}
.w_font_005 {text-align:center; padding:0 0 15px 0; width:100%; float:left;}
.w_font_006 {color:#2c2c2c; font-size:20px ; font-weight:100;font-family:'Noto Sans KR' , sans-serif !important; padding:0 0 20px 0; text-align:center;width:100%; float:left;}
.w_font_007 {color:#2c2c2c; font-size:45px; font-weight:600;font-family:'Noto Sans KR' , sans-serif !important; text-align:center; width:100%; float:left; letter-spacing:-1px}
.w_font_008 {text-align:center; padding:30px 0 0 0; width:100%; float:left;}
.w_font_009 {color:#2c2c2c; font-size:28px; font-weight:600;font-family:'Noto Sans KR' , sans-serif !important; padding:0 0 20px 0 ; width:100%; float:left;letter-spacing:-1px;line-height:1.5}
.w_font_010 {color:#2c2c2c; font-size:18px; font-weight:100;font-family:'Noto Sans KR' , sans-serif !important;  width:100%; float:left; line-height:1.8 }
.w_font_010_ {color:#2c2c2c; font-size:18px; font-weight:300;font-family:'Noto Sans KR' , sans-serif !important;  width:100%; float:left; line-height:1.8 }

@media (max-width:1200px) {
	.w_sub_visual {background-size:auto; background-position:left top}
}



@media (max-width:980px) {
	.w_font_003 {font-size:40px;}
	.w_font_004 {font-size:16px;}
	.w_font_002 {padding:15px 0 20px 0 ;}


}




@media (max-width:720px) {
	.w_sub_visual {padding:80px 0 50px 0;}
	.w_sub_visual {background-size:auto; background-position:left top}
	.w_font_006 {font-size:18px ; }
	.w_font_007 {font-size:30px; }
	.w_font_009 {font-size:22px;}
	.w_font_010 {font-size:16px; }
	.sub_con {padding:30px 0 30px 0}
	.w_text {padding:20px 0 0 0; }

	
}