@charset "utf-8"; 
/*나눔고딕*/
@import url(./fonts/NanumGothic/NanumGothic.css);

/*본고딕*/
@import url(./fonts/NotoSans/NotoSansKR.css);

/* base */
html{overflow-y:scroll; overflow-x:hidden;}
body,html{font-family:'NS Korean',sans-serif; font-weight:400;  }
body, div, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, p, form, fieldset, input{margin:0;padding:0;}
h1, h2, h3, h4, h5, h6{font-weight:normal;font-size:100%;}
a{text-decoration:none; font-family:'NS Korean',sans-serif; font-weight:400; }
ul, ol, li{list-style:none;}
img{border:none; vertical-align:middle;}
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary{display:block;}
table, td, tr{  color:#333; font-size:15px }

/* div위치조절 */
#wrap{width:100%; overflow:hidden; text-align:left; min-width:1200px; position:relative; background:#ffffff}
#middle_wrap{width:100%; overflow:hidden; position:relative;}
#bottom_wrap{width:100%; overflow:hidden; height:150px}

/* **************************************** *
 * HEADER
 * **************************************** */
#header {z-index:10000; width:100%; min-width:1200px; height:80px; position:fixed; top:0; left:0; z-index:1000; -webkit-transition:height 400ms; transition:height 400ms; background:rgba(255,255,255,1); }
.header_wrap {height:100%; margin:0 auto;}
.header_inner { margin:0 auto; width:100%; height:100%; position:relative; }

/* LOGO */
#logo2 {width:190px; height:35px; position:absolute; left:140px; top:20px; -webkit-transition:top400ms; transition:top 400ms; }
#logo2 a.logo {float:left; display:block; width:190px; height:35px; position:relative;}
#logo2 a.logo svg, #logo2 a.logo img {display:block; width:100%; height:100%; }
#logo2 .logo_w{ position:absolute; left:0; top:0; opacity:0;}

/* MENU */
.menu_container {display:block; position:absolute; top:0px; right:140px; z-index:1000; -webkit-transition:top 400ms; transition:top 400ms; }
#menu {display:block; width:100%; }
#menu li {position:relative; }
#menu a {display:block; -webkit-transition:all 0.3s; transition:all 0.3s;}
#menu ul.sub-menu {display:none; width:203px; height:auto; position:absolute; z-index:1000;}

/* 1depth */
#menu > li {float:left; }
#menu > li > a {width:auto; margin:30px 30px 0; font-size:16px; letter-spacing:-0.05em; font-weight:600; color:#333; text-align:center;}
#menu > li:hover > a, #menu > li.current_page_ancestor > a, #menu > li.current_page_item > a {color:#1d5bcc; }

/* minimize */
.minimize#header {height:80px; background:rgba(0,0,0,1);z-index:10000;}
.minimize .menu_container {top:0px; }
.minimize  #menu > li > a { color:#fff;}
.minimize  #logo2 .logo_w{opacity:1;}
.minimize  #logo2 .logo_b{opacity:0;}

/* mobile */

#gallery_wrap{ width:100%;  position:relative}
#gallery_total{ width:1200px; margin:0 auto}
.gallery_txt{ margin:90px auto 40px; text-align:center; font-size:45px; letter-spacing:-0.04em; font-weight:800; color:#222222}


.content_wrap{ width:100%; position:relative; margin:0 auto; height:320px; background:url(../images/content_bg.png) no-repeat center top}
.content_total{ width:1200px; margin:0 auto; overflow:hidden; height:320px;}
.notice{ width:365px; margin:50px 80px 0 0 ; overflow:hidden; float:left}
.notice_title{ width:365px; height:25px; position:relative; font-size:25px; color:#000; letter-spacing:-0.05em; font-weight:800}
.notice_title span{font-size:15px;  color:#111111;margin-left:10px; letter-spacing:0; font-weight:400; letter-spacing:-0.02em;}
.notice_title a.more2{ position:absolute; right:0; font-size:30px; color:#000000}
.notice_con{ width:365px; overflow:hidden; margin-top:25px;}

.customer{ width:329px; height:170px; margin-top:100px; overflow:hidden; border-right:1px solid #53627d; float:left}
.customer_title{ width:329px; height:25px; font-size:25px; color:#ffffff; letter-spacing:-0.05em; font-weight:800}
.customer_title span{font-size:15px;  color:#cccccc; margin-left:10px;font-weight:400; letter-spacing:0.02em;}
.customer_con{ width:329px; height:290px; overflow:hidden; margin-top:30px;}

#quick{ width:425px; height:170px; margin-top:100px; overflow:hidden; border-left:1px solid #000; float:left;}
#quick ul{ overflow:hidden; width:345px; margin-left:20px;}
#quick li{float:left; width:172px; height:165px;  background:url('../images/quick_menu.png');}
#quick li a{display:block; width:172px; height:165px; text-indent:-5000px;}
#quick li#q01{background-position:0 0;}
#quick li#q02{background-position:-173px 0;}

#quick li#q01:hover{background-position:0 -165px;}
#quick li#q02:hover{background-position:-173px -165px;}




/*sub코딩*/
#middle_wrap{margin:0 auto;  width:100%; overflow:hidden;}
#sub_middle_wrap {margin:80px auto 0;   width:100%; height:320px; overflow:hidden ; position:relative}
.subbg{background:url('../images/subbg.jpg') no-repeat center; position:relative; width:100%; height:320px;}

#sub_middle_total { width:1200px; height:100%; overflow:hidden; z-index:10000; margin:0 auto;}

.sub_txt1{ width:375px;  margin:70px auto 0; color:#fff;text-align:center; font-size:50px; font-weight:600; letter-spacing:0 }

.sub_txt2{ font-size:25px; font-weight:500;  color:#fff; text-align:center; border-bottom:1px solid #ccc; width:375px; height:45px; margin:0 auto; line-height:30px; letter-spacing:-0.05em;  }

.sub_txt3{ font-size:12px; color:#ccc; text-align:center; letter-spacing:0.3em; line-height:40px; font-weight:350 }


#con_total{width:1200px; overflow:hidden; margin:0 auto}
#con_title{width:1200px;margin:60px auto 0; position:relative; height:110px; }
#title_a{width:1200px; text-align:center; font-size:38px; font-weight:800; color:#333; margin-bottom:10px; letter-spacing:-0.05em}
#title_b{text-align:center; color:#111111; margin: 0 auto 25px; width:73px; height:3px; letter-spacing:-0.05em}
#title_c{width:1200px; text-align:center; font-size:16px; font-weight:300; color:#444444; letter-spacing:-0.05em; font-weight:350 }


#con{width:1200px;overflow:hidden; margin:50px auto 100px }

/*이미지슬라이드 css소스*/
.clear{overflow: hidden; width: 1200px; margin:0 auto;}
.dn {display: none;}



.wrap_box{position:relative;  width:100%; overflow:hidden; height:890px; margin:80px auto 0;}
.main_slide_txt{ z-index:9999; position: absolute; top:280px; left:50%; margin-left:-360px; color:#fff;}
.main_slide_txt1{ font-size:18px; text-align:center; letter-spacing:0.3em; font-weight:300; margin-bottom:20px;}
.main_slide_txt2{ font-size:110px; text-align:center; font-weight:800; letter-spacing:0; margin-bottom:10px;}
.main_slide_txt3{font-size:33px; text-align:center; font-weight:600; letter-spacing:-0.05em; border-bottom:1px solid #fff; width:375px; height:50px; margin:0 auto; line-height:20px;}
.main_slide_txt4{font-size:18px; text-align:center; font-weight:300; letter-spacing:-0.05em; line-height:50px}


.wrap_box .visual{ position: absolute; left:50%; top:0; margin-top: 0px; width:1920px; margin-left:-960px;
height:890px;}
.wrap_box .box {position:relative; width:100%; height:100%;; margin:0 auto }
.wrap_box .visual .pht{position:absolute; top:0; left:0; width:100%; height:100%;}
.wrap_box .visual .control{float:left; position:absolute; bottom:40px; left:50%; margin-left:-110px; width:220px;}
.wrap_box .visual .control .fl{float:left; margin-right:10px; cursor: pointer;}
.wrap_box .visual .control .fl:nth-child(10){margin-right:0px;}

#main_ment_wrap{position: absolute;   left:0px; top:0; width:100%; height:120px;}
#main_ment_total{margin:225px auto 0; background:url('../images/main_ment.png') no-repeat center; width:660px; height:120px}


/* 탭네비 */
#tab_nav{ width:1200px; overflow:hidden; margin:0 auto 65px}
#tab_nav ul{ overflow:hidden; display:table; margin:0 auto}
#tab_nav ul li{float:left; overflow:hidden; }
#tab_nav ul li a{display:block; height:50px; width:145px;  font-size:16px; line-height:45px; color:#555;background:#f1f1f1; text-align:center; margin-right:5px; border:1px solid #eee; letter-spacing:-0.05em; font-weight:600}
#tab_nav ul li a.last{margin-right:0}
#tab_nav ul li.on a{background:#fff;  border:1px solid #111; color:#111}








.main_middle_wrap2{ width:100%; height:305px; margin:0 auto; overflow:hidden}
.main_middle_total2{ width:1200px; height:305px; margin:0 auto; overflow:hidden}

.main_qmenu1{margin:0 auto; width:100%; overflow:hidden; height:305px;}
.main_qmenu1 li{float:left; width:50%; height:305px; overflow:hidden; position:relative}


.main_qmenu1 li a{display:block; width:100%; height:305px;}
.main_qmenu1 li #qmenu_button001{position:relative; overflow:hidden; float:right; width:100%; height:305px;}
.main_qmenu1 li #qmenu_button001:before{
	content: ""; 
	background:url('../images/qmenu01_title.png') no-repeat 0 0 ; 
	position:absolute; 
	top:0; 
	right:0; 
	width:600px; 
	height:305px; 
	z-index:1; 
}

.main_qmenu1 li #qmenu_button001:after{
	content: ""; 
	background:url('../images/qmenu01_bg.jpg') no-repeat right center; 
	position:absolute; 
	top:0; 
	right:0; 
	width:960px; 
	height:305px; 
	transform: scale(1);
    -webkit-transition: transition: all .5s cubic-bezier(.105,.86,.52,.965);
    -o-transition:transition: all .5s cubic-bezier(.105,.86,.52,.965);
    transition: all .5s cubic-bezier(.105,.86,.52,.965)
}
.main_qmenu1 li #qmenu_button001:hover:after{
	transform: scale(1.1);
}
.main_qmenu1 li #qmenu_button002{position:relative; overflow:hidden; float:right; width:100%; height:305px;}
.main_qmenu1 li #qmenu_button002:before{
	content: ""; 
	background:url('../images/qmenu02_title.png') no-repeat 0 0 ; 
	position:absolute; 
	top:0; 
	left:0px; 
	width:960px; 
	height:305px; 
	z-index:1;
	margin-right:-300px;
}
.main_qmenu1 li #qmenu_button002:after{
	content: ""; 
	background:url('../images/qmenu02_bg.jpg')0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0; 
	width:960px; 
	height:305px; 
	transform: scale(1);
    -webkit-transition: transition: all .5s cubic-bezier(.105,.86,.52,.965);
    -o-transition:transition: all .5s cubic-bezier(.105,.86,.52,.965);
    transition: all .5s cubic-bezier(.105,.86,.52,.965)
}
.main_qmenu1 li #qmenu_button002:hover:after{
	transform: scale(1.1);
}


/* bottom div위치조절 */
#bottom_wrap{ width:100%; height:50px; margin:0 auto; background:#000; position:relative; }

.ftt1{overflow:hidden; font-size:12px; letter-spacing:-0.01em; color:#fff; line-height:50px; position:absolute; left:30px; font-weight:350}

.ftt2{font-size:12px; letter-spacing:0.01em; color:#fff; line-height:50px; left:50%;position:absolute; margin-left:-380px;font-weight:350}

.ftt3{ overflow:hidden; line-height:50px; right:0;position:absolute; margin-right:30px;}
.ftt3 a{ float:left; overflow:hidden; font-size:13px; letter-spacing:-0.05em; font-weight:500; color:#fff; margin-left:10px; }
.ftt3 a:hover{ float:left; overflow:hidden; font-size:13px; color:#dfa018; }