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

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

/* base */
html{overflow-y:scroll; overflow-x:hidden;}
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;}
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{font-family:"Nanum Gothic"; font-size:13px; color:#333; font-weight:400;}

/* div위치조절 */
#wrap{width:100%; overflow:hidden; text-align:left; min-width:1200px; position:relative; background:#ffffff}
#top_wrap{position:relative; width:100%; height:140px; background:#ffffff;box-shadow:0 1px 3px rgba(0, 0, 0, .12); }
#middle_wrap{width:100%; overflow:hidden; position:relative;}
#bottom_wrap{width:100%; overflow:hidden; height:150px;}

/* top div위치조절 */
.top_wrap1{ width:100%; height:39px; border-bottom:1px solid #ccc; background:#f1f1f1}
.top_total1{ width:1200px; height:40px; margin:0 auto; overflow:hidden}
#logo01{ float:left; margin-top:8px; font-size:13px; letter-spacing:-0.25px; font-family:"Nanum Gothic"; color:#111111}
#login{float:right; }
#login ul {list-style-type:none;}
#login li {float:right;  text-align:center; list-style-type:none; width:83px; height:38px; line-height:35px }
#login li a{ width:83px; height:38px; }
#login li.home:hover{width:84px; height:39px; background:url(../images/home.png)#ffffff no-repeat center top;}
#login li.login:hover{width:83px; height:39px; background:url(../images/login.png)#ffffff no-repeat center top;font-size:12px; color:#222222;font-family:"Nanum Gothic";}
#login li.favorites:hover{width:102px; height:39px; background:url(../images/favorites.png)#ffffff no-repeat center top;font-size:12px; color:#222222;font-family:"Nanum Gothic";}
#login li.home{width:84px; height:38px; background:url(../images/home.png)#f1f1f1 no-repeat center top;font-size:12px; color:#222222;font-family:"Nanum Gothic";}
#login li.login{width:83px; height:38px; background:url(../images/login.png)#f1f1f1 no-repeat center top;font-size:12px; color:#222222;font-family:"Nanum Gothic";}
#login li.favorites{width:102px; height:38px; background:url(../images/favorites.png)#f1f1f1 no-repeat center top;font-size:12px; color:#222222;font-family:"Nanum Gothic";}



.top_wrap2{ width:100%;}
.top_total2{ width:1200px; height:100px; margin:0 auto;}
#top_logo{ float:left; margin-top:25px; width:205px; height:50px; padding:0;}


/* div위치조절 */
/* Header */
div#commonGnb{float:right; position:relative; color:#333333;font-family:"Nanum Gothic"}
div#commonGnb div.gnbWrap ul.gnbLayer{ display:table; float:right; margin:0 auto}
div#commonGnb div.gnbWrap ul.gnbLayer li{float:left;  position:relative; z-index:999;  zoom:1;}
div#commonGnb div.gnbWrap ul.gnbLayer li.first{border:0;}

div#commonGnb ul.gnbLayer li>a{display:block; margin:50px 25px 33px;text-align:center; font-weight:600; font-size:16px;  color:#111111; font-family:"Nanum Gothic"; font-weight:600}
div#commonGnb ul.gnbLayer li:hover>a{color:#0e77b4; text-decoration:none;font-family:"Nanum Gothic"}

div#commonGnb ul.gnbLayer li dl {position:absolute; left:50%; top:100px; margin-left:-87px; width:175px; display:none;font-size:0;background:#fff;}
div#commonGnb ul.gnbLayer li dd {display:block; padding:0; margin:0;  }
div#commonGnb ul.gnbLayer li:hover dd a {font-family:"Nanum Gothic"; display:block; width:100%; height:40px; padding:0; font-size:13px; line-height:40px; color:#333; font-weight:600; text-align:center; border-bottom:1px solid #ccc }

div#commonGnb ul.gnbLayer li:hover dd a:hover{ background:#0e77b4; font-weight:600;font-family:"Nanum Gothic"; color:#fff;}


/* middle div위치조절 */
#main_middle_wrap1{ margin:0 auto; height:530px; width:100%; background:#e0eaf4; position:relative}
#main_middle_total1{ position:absolute; top:-90px; left:50%; margin-left:-600px; width:1200px; height:560px; overflow:hidden}

#main_qmenu1{margin:0 auto; width:1200px; overflow:hidden;}
#main_qmenu1 li{float:left;}
#main_qmenu1 li a{display:block; width:595px; height:180px;}
#qmenu_button01{position:relative; overflow:hidden; float:left; width:595px; height:180px;}
#qmenu_button01:before{
	content: ""; 
	background:url('../images/qmenu01_title.png') 0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0px; 
	width:595px; 
	height:180px; 
	z-index:1
}
#qmenu_button01:after{
	content: ""; 
	background:url('../images/qmenu01_bg.jpg')0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0; 
	width:595px; 
	height:180px; 
	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)
}
#qmenu_button01:hover:after{
	background:url('../images/qmenu01_bg_hover.jpg')0 0 no-repeat; 
	transform: scale(1.2);
    -webkit-transition:all .5s cubic-bezier(.105,.86,.52,.965 );
    -o-transition:all .5s cubic-bezier(.105,.86,.52,.965);
    transition: all .5s cubic-bezier(.105,.86,.52,.965)
}

#qmenu_button02{position:relative; overflow:hidden; float:left; width:595px; height:180px; margin-left:10px}
#qmenu_button02:before{
	content: ""; 
	background:url('../images/qmenu02_title.png') 0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0px; 
	width:595px; 
	height:180px; 
	z-index:1
}
#qmenu_button02:after{
	content: ""; 
	background:url('../images/qmenu02_bg.jpg')0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0; 
	width:595px; 
	height:180px; 
	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)
}
#qmenu_button02:hover:after{
	background:url('../images/qmenu02_bg_hover.jpg')0 0 no-repeat; 
	transform: scale(1.2);
    -webkit-transition:all .5s cubic-bezier(.105,.86,.52,.965 );
    -o-transition:all .5s cubic-bezier(.105,.86,.52,.965);
    transition: all .5s cubic-bezier(.105,.86,.52,.965)
}



#main_qmenu2{margin:0 auto 0; width:595px; overflow:hidden; height:370px;}
#main_qmenu2 li{float:left;}
#main_qmenu2 li a{display:block; width:293px; height:370px;}
#qmenu_button03{position:relative; overflow:hidden; float:left; width:293px; height:370px; margin-top:10px}
#qmenu_button03:before{
	content: ""; 
	background:url('../images/qmenu03_title.png') 0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0px; 
	width:293px; 
	height:370px; 
	z-index:1
}
#qmenu_button03:after{
	content: ""; 
	background:url('../images/qmenu03_bg.jpg')0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0; 
	width:293px; 
	height:370px; 
	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)
}
#qmenu_button03:hover:after{
	background:url('../images/qmenu03_bg_hover.jpg')0 0 no-repeat; 
	transform: scale(1.2);
    -webkit-transition:all .5s cubic-bezier(.105,.86,.52,.965 );
    -o-transition:all .5s cubic-bezier(.105,.86,.52,.965);
    transition: all .5s cubic-bezier(.105,.86,.52,.965)
}

#qmenu_button04{position:relative; overflow:hidden; float:left; width:292px; height:370px; margin:10px 0 0 10px}
#qmenu_button04:before{
	content: ""; 
	background:url('../images/qmenu04_title.png') 0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0px; 
	width:292px; 
	height:370px; 
	z-index:1
}
#qmenu_button04:after{
	content: ""; 
	background:url('../images/qmenu04_bg.jpg')0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0; 
	width:292px; 
	height:370px; 
	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)
}
#qmenu_button04:hover:after{
	background:url('../images/qmenu04_bg_hover.jpg')0 0 no-repeat; 
	transform: scale(1.2);
    -webkit-transition:all .5s cubic-bezier(.105,.86,.52,.965 );
    -o-transition:all .5s cubic-bezier(.105,.86,.52,.965);
    transition: all .5s cubic-bezier(.105,.86,.52,.965)
}




#main_qmenu3{margin:0 auto 0; width:595px; overflow:hidden; height:370px;}
#main_qmenu3 li{float:left;}
#main_qmenu3 li a{display:block; width:595px; height:180px;}
#qmenu_button05{position:relative; overflow:hidden; float:left; width:595px; height:180px; margin:10px 0 0 10px}
#qmenu_button05:before{
	content: ""; 
	background:url('../images/qmenu05_title.png') 0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0px; 
	width:595px; 
	height:370px; 
	z-index:1
}
#qmenu_button05:after{
	content: ""; 
	background:url('../images/qmenu05_bg.jpg')0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0; 
	width:595px; 
	height:370px; 
	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)
}
#qmenu_button05:hover:after{
	background:url('../images/qmenu05_bg_hover.jpg')0 0 no-repeat; 
	transform: scale(1.2);
    -webkit-transition:all .5s cubic-bezier(.105,.86,.52,.965 );
    -o-transition:all .5s cubic-bezier(.105,.86,.52,.965);
    transition: all .5s cubic-bezier(.105,.86,.52,.965)
}

#qmenu_button06{position:relative; overflow:hidden; float:left; width:595px; height:180px; margin:10px 0 0 10px}
#qmenu_button06:before{
	content: ""; 
	background:url('../images/qmenu06_title.png') 0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0px; 
	width:595px; 
	height:180px; 
	z-index:1
}
#qmenu_button06:after{
	content: ""; 
	background:url('../images/qmenu06_bg.jpg')0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0; 
	width:595px; 
	height:180px; 
	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)
}
#qmenu_button06:hover:after{
	background:url('../images/qmenu06_bg_hover.jpg')0 0 no-repeat; 
	transform: scale(1.2);
    -webkit-transition:all .5s cubic-bezier(.105,.86,.52,.965 );
    -o-transition:all .5s cubic-bezier(.105,.86,.52,.965);
    transition: all .5s cubic-bezier(.105,.86,.52,.965)
}



#main_middle_wrap2{ width:100%; height:330px; overflow:hidden; background:url(../images/company.jpg) no-repeat center top}
#main_middle_total2{ width:1200px; height:330px; overflow:hidden; margin:0 auto}
.main_middle_total2_txt{ width:600px; height:330px; float:left; background:rgba(0,0,0,.85); padding:60px 50px}
.gallery{ width:1200px; height:370px; margin:0 auto; overflow:hidden }
.gallery_title{ width:1200px; height:30px; margin:60px auto 20px; text-align:center}
.gallery_txt{ text-align:center; font-size:15px; font-family:"Nanum Gothic"; letter-spacing:-0.5px; color:#111111; margin-bottom:30px; }

.main_content_wrap{ width:100%; height:349px; border-top:1px solid #ccc; overflow:hidden; background:#f1f1f1}
.main_content_total{height:229px; border-bottom:1px solid #ccc; width:1198px; border-left:1px solid #ccc; border-right:1px solid #ccc; overflow:hidden; margin:60px auto; background:url(../images/content.png) #ffffff no-repeat top center}

.notice{ width:398px; border-right:1px solid #ccc; height:225px; margin-top:5px; float:left}
.notice_title{ width:398px; height:50px; position:relative}
.notice_title img{ margin:27px 0 0 25px}
.notice_title a{ position:absolute; top:5px; right:30px}

.customer{ width:400px; height:225px; float:left;margin-top:5px;}
.customer img{ margin:27px 0 0 25px;}


.qa{ width:398px; border-left:1px solid #ccc; height:225px; float:left;margin-top:5px; padding:27px 0 0 25px; background:url(../images/qr.png) no-repeat top center}

/* bottom div위치조절 */
/*copyright*/
#bottom_wrap{width:100%; height:150px; }
#bottom_wrap1{width:100%; height:39px; background:#fff; border-bottom:1px solid #ccc; border-top:1px solid #ccc}
#bottom_wrap2{width:100%; height:109px;background:#fff;  }

#bottom_total1{ width:1200px; margin:0 auto; overflow:hidden;}
.ftt1{ margin-top:10px}
.ftt1 a{font-family:"Nanum Gothic"; font-size:13px; color:#111111; letter-spacing:-0.25px }
#bottom_total1 a:hover{ font-weight:600; }
#bottom_total2{ width:1200px; margin:0 auto; overflow:hidden}
.bottom_logobox{ float:left; margin-top:35px; with:140px; height:35px}
.copybox{ float:left; font-family:"Nanum Gothic"; font-size:12px; color:#111; line-height:22px; letter-spacing:-0.25px; margin:35px 0 0 45px;}

/* sub_body div위치조절 */
#sub_img{ margin:0 auto; width:100%; height:330px; overflow:hidden; background:url(../images/subbg.jpg) no-repeat center top}
#sub_txt{ margin: 80px auto 0; width:605px; height:160px; text-align:center}
#middle_total{margin:0 auto; width:1200px;}

#left_total{float:left; width:220px; overflow:hidden; margin:30px 0 50px 0;}
#left_title{float:left; width:100%; height:100px; margin-bottom:1px; background:url('../images/left_titlebg.jpg') no-repeat;}
.left_txt1{width:100%;  margin:5px 0 0 0 ; text-align:center; font-family:"Nanum Gothic"; font-size:22px; color:#fff; font-weight:600; letter-spacing:-0.5px}
.left_txt2{width:100%;  margin:30px 0 0 0 ; text-align:center; font-family:"Nanum Gothic"; font-size:12px; color:#fff; font-weight:228; letter-spacing:-0.25px}
#left_nav{float:left; width:220px; overflow:hidden; margin-bottom:40px; border-left:1px solid #ccc;border-right:1px solid #ccc;}
#left_nav ul li{list-style-type:none; width:100%; overflow:hidden;}
#left_nav ul li a{display:block; width:220px; overflow:hidden; padding:15px 0 15px 20px; font-family:"Nanum Gothic"; font-size:15px; color:#333333; font-weight:600; border-bottom:1px solid #ccc; background:#ffffff; height:45px; }
#left_nav ul li a:hover{color:#003e8a;text-decoration:none; background:url(../images/left_hover.png) no-repeat top;}
#left_nav ul li.on a{color:#003e8a; font-family:"Nanum Gothic"; background:url(../images/left_hover.png) no-repeat top;}


#con_total{float:right; width:930px; overflow:hidden; margin:35px 0 100px 0}
#con_title{width:930px; height:100px; margin:0 0 50px 0; border-bottom:1px solid #ddd; position:relative}
#title_a{float:left; width:930px; text-align:left; margin:30px 0 0 0; font-family:"Nanum Gothic"; font-size:25px; color:#222222;font-weight:600; letter-spacing:-0.5px}
#title_aa{ overflow:hidden; width:930px; height:50px; text-align:left;}
#title_b{ float:left; font-size:14px; color:#111111; letter-spacing:-0.5px; font-family:"Nanum Gothic"; margin-top:10px}
#title_c{ float:right; font-size:13px; color:#111111; letter-spacing:-0.5px; font-family:"Nanum Gothic"; margin-top:5px; line-height:10px}
#con{width:930px; overflow:hidden; margin:0 0 100px 0;}

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

.wrap_box{position:relative;  width:100%; overflow:hidden; height:750px; margin:0 auto ;}
.wrap_box .visual{ position: absolute; left:50%; top:0; margin-top: 0px; width:2200px; margin-left:-1100px;
height:750px;}
.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 .prev {position: absolute; top:100px; left:50%; margin-left:-700px; cursor: pointer; z-index:12}
.wrap_box .visual .next {position: absolute; top:100px; right:50%; margin-right:-700px; cursor: pointer;}
.wrap_box .visual .control{float:left; position:absolute; bottom:120px; left:50%; margin-left:-33px; width:66px;}
.wrap_box .visual .control .fl{float:left; margin-right:10px; cursor: pointer;}
.wrap_box .visual .control .fl:nth-child(3){margin-right:0px;}

#main_ment_wrap{position: absolute;   left:0px; top:0; width:100%; height:215px;
;font-family:"Nanum Gothic" }
#main_ment_total{margin:225px auto 0;
background:url('../images/main_ment.png') no-repeat center; width:605px; height:215px}