@charset "utf-8";

/* NanumGothic */
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.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:"NanumGothic","Nanum Gothic"; font-size:13px; color:#333; font-weight:400;}

/* div위치조절 */
#wrap{margin:0 auto; width:100%; overflow:hidden; text-align:left; min-width:1100px; }
#top_wrap{margin:0 auto; width:100%; height:105px;}
#middle_wrap{margin:0 auto; width:100%; overflow:hidden;}
#bottom_wrap{margin:0 auto; width:100%; height:160px; border-top:1px solid #ddd;}

/* top div위치조절 */
#top_total{margin:0 auto; position:relative; width:1100px; height:105px;}

#logo{float:left; width:220px; height:40px; margin:40px 0 0 10px;}

#login{ position:absolute; z-index:10; right:10px; top:10px; width:500px; height:20px;}
#login li{float:right; margin-left:20px;}
#login li a{display:block; height:20px; font-family:"NanumGothic","Nanum Gothic"; font-size:12px; line-height:20px; color:#888; }
#login a:hover{color:#333;}

/* Header */
div#commonGnb{ float:right; position:relative; width:800px; height:50px; margin:45px 0 0 0;}
div#commonGnb div.gnbWrap ul.gnbLayer{ margin:0 auto; width:100%; height:50px; text-align:center;}
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{position:relative;}
div#commonGnb ul.gnbLayer li a{display:block; height:50px; text-align:center; color:#333; font-weight:600; font-size:15px; line-height:50px; font-family:"NanumGothic","Nanum Gothic";}
div#commonGnb ul.gnbLayer li:hover a{ color:#0f9104;}

div#commonGnb ul.gnbLayer li dl {position:absolute; left:50%; top:48px; width:148px; margin-left:-75px; display:none; padding:0; font-size:0; border:1px solid #ddd; filter:alpha(opacity=100); opacity:1; -moz-opacity:1;}
div#commonGnb ul.gnbLayer li dt { margin-top:-15px; height:15px; background:transparent url('../images/gnb_sub_arrow.png') no-repeat 50% 100%;}
div#commonGnb ul.gnbLayer li dd {display:block; border-bottom:1px #ddd solid; padding:0; margin:0; background:#f6f6f6; }
div#commonGnb ul.gnbLayer li dd a {display:block; width:148px !important; height:36px; font-size:12px; line-height:36px; color:#222 !important; font-weight:400; background-image:none;}
div#commonGnb ul.gnbLayer li dd a:hover {background-color:#fff; color:#0f9104 !important; font-weight:400;}
div#commonGnb ul.gnbLayer li:hover dd a {background-image:none;}

div#commonGnb ul.gnbLayer li#tnav01 a{width:135px;}
div#commonGnb ul.gnbLayer li#tnav02 a{width: 190px;}
div#commonGnb ul.gnbLayer li#tnav03 a{width: 160px;}
div#commonGnb ul.gnbLayer li#tnav04 a{width: 100px;}
div#commonGnb ul.gnbLayer li#tnav05 a{width: 160px;}
div#commonGnb ul.gnbLayer li#tnav06 a{width:95px;}
div#commonGnb ul.gnbLayer li#tnav07 a{width:120px;}
div#commonGnb ul.gnbLayer li#tnav08 a{width:80px;}

/* middle div위치조절*/
#middle_total{margin:0 auto; position:relative; width:1080px; overflow:hidden;}
.main{padding-top:25px; border-top:1px solid #ddd;}
/*배너*/
#main_img{float:left; width:540px; height:330px; overflow:hidden; margin:0 15px 0 0px;}
#video{float:left; width:540px; height:330px; overflow:hidden; margin:15px 15px 0 0px;}
/*메인 퀵메뉴 버튼설정*/
#main_qmenu{float:right; width:525px; height:675px; overflow:hidden;}
#qmenu_button01{position:relative; overflow:hidden; float:left; width:255px; height:330px; margin:0 15px 15px 0;}
#qmenu_button02{position:relative; overflow:hidden; float:left; width:255px; height:330px; margin:0 15px 0 0;}
#qmenu_button03{position:relative; overflow:hidden; float:right; width:255px; height:215px; margin:0 0 15px 0;}
#qmenu_button04{position:relative; overflow:hidden; float:right; width:255px; height:215px; margin:0 0 15px 0;}
#qmenu_button05{position:relative; overflow:hidden; float:right; width:255px; height:215px; margin:0 0 0 0;}
#qmenu_button01:before{
	content: ""; 
	background:url(../images/holic/qmenu01_title.png) 0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0; 
	width:255px; 
	height:330px; 
	z-index:1;
}
#qmenu_button01:after{
	content: ""; 
	background:url(../images/holic/qmenu01_bg.png?v=1)0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0; 
	width:255px; 
	height:330px; 
	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/holic/qmenu01_bg_over.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:before{
	content: ""; 
	background:url(../images/holic/qmenu02_title.png) 0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0; 
	width:255px; 
	height:330px; 
	z-index:1
}
#qmenu_button02:after{
	content: ""; 
	background:url(../images/holic/qmenu02_bg.png?v=1)0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0; 
	width:255px; 
	height:330px; 
	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/holic/qmenu02_bg_over.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_button03:before{
	content: ""; 
	background:url(../images/holic/qmenu03_title.png) 0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0; 
	width:255px; 
	height:215px; 
	z-index:1
}
#qmenu_button03:after{
	content: ""; 
	background:url(../images/holic/qmenu03_bg.png?v=1)0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0; 
	width:255px; 
	height:215px; 
	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/holic/qmenu03_bg_over.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:before{
	content: ""; 
	background:url(../images/holic/qmenu04_title.png) 0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0; 
	width:255px; 
	height:215px; 
	z-index:1
}
#qmenu_button04:after{
	content: ""; 
	background:url(../images/holic/qmenu04_bg.png?v=1)0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0; 
	width:255px; 
	height:215px; 
	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/holic/qmenu04_bg_over.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_button05:before{
	content: ""; 
	background:url(../images/holic/qmenu05_title.png) 0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0; 
	width:255px; 
	height:215px; 
	z-index:1
}
#qmenu_button05:after{
	content: ""; 
	background:url(../images/holic/qmenu05_bg.png?v=1)0 0 no-repeat; 
	position:absolute; 
	top:0; 
	left:0; 
	width:255px; 
	height:215px; 
	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/holic/qmenu05_bg_over.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_con_total{float:left; width:1080px; overflow:hidden; padding:40px 0; border-top:1px solid #ddd; margin-top:25px;}
#main_a{float:left; position:relative; width:300px; height:120px; padding-right:30px; border-right:1px solid #ddd; margin-right:30px; margin-left:30px;}
#main_b{float:left; position:relative; width:300px; height:120px; padding-right:30px; border-right:1px solid #ddd; margin-right:30px;}
#main_c{float:left; position:relative; width:300px; height:120px;}
.main_title{width:100%; height:15px; margin-bottom:15px;}
.main_con{width:100%; height:100px;}
.main_more_btn{position:absolute; top:0px; right:30px;}


/* bottom div위치조절 */
#bottom_total{margin:0 auto; width:1080px; height:120px; padding: 0 0 0 0; }
#copy_link{float:left; width:100%; height:20px; margin:25px 10px 0 0;}
#copy_link a{float:left; margin-right:10px; display:block; font-family:"NanumGothic","Nanum Gothic"; font-weight:600; font-size:12px; line-height:20px; color:#777;}
#copy_link a:hover{color:#333;}
#copy_text{float:left; text-align:left; width:800px; height:60px; margin:15px 0 0 0; font-family:"NanumGothic","Nanum Gothic"; font-size:12px; line-height:20px; color:#777;}
#copy_logo{float:right; text-align:left; width:190px; height:40px; margin:15px 0 0 0;}

/* middle div위치조절*/
#sub_img{ margin:0 auto; width:100%; overflow:hidden; background:url('../images/holic/sub.jpg') no-repeat center;}
#sub_txt{ margin:0 auto; width:1100px; height:220px;}
#left_total{float:left; width:220px; overflow:hidden; margin:0 0 0 10px;}
#left_title{float:left; width:220px; height:80px; margin:20px 0; background:url('../images/left_titlebg.jpg') no-repeat; font-family:"NanumGothic","Nanum Gothic"; font-size:24px; line-height:80px; color:#fff; font-weight:600; text-align:center;}
#left_nav{float:left; width:220px; overflow:hidden;}
#left_nav ul li{list-style-type:none; width:220px; overflow:hidden; border-bottom:1px solid #ddd;}
#left_nav ul li a{display:block; width:190px; overflow:hidden; padding:10px 0 10px 30px; font-family:"NanumGothic","Nanum Gothic"; font-size:14px; line-height:25px; color:#555; font-weight:600;}
#left_nav ul li a:hover{color:#0f9104;}
#left_nav ul li.on a{color:#fff; background:url('../images/left_over.jpg') no-repeat;}

#con_total{float:right; width:800px; overflow:hidden; margin:0 10px 0 0;}
#con_title{float:left; width:100%; height:99px; margin:0 0 50px 0; border-bottom:1px solid #ddd;}
#title_a{float:left; width:400px; height:40px; text-align:left; margin:40px 0 0 0; font-family:"NanumGothic","Nanum Gothic"; font-size:30px; line-height:40px; color:#333;}
#title_b{float:right; width:400px; height:30px; text-align:right; margin:50px 0 0 0; font-family:"NanumGothic","Nanum Gothic"; font-size:12px; line-height:30px; font-weight:400; color:#888;}

#con{float:left; width:100%; min-height:400px; overflow:hidden; margin:0 0 80px 0;}

.sitemap{margin:0 auto;}
.sitemap li{float:left; width:200px; height:320px; }
.sitemap li a{margin:0 auto; display:block; width:140px; height:40px; padding-top:100px; border-bottom:1px solid #3c9020; text-align:center; font-family:"NanumGothic","Nanum Gothic"; font-size:15px; line-height:40px; font-weight:600; color:#333;}
.sitemap li a:hover{color:#0f9104;}
.sitemap li ul{display:block; width:100%; margin-top:10px;}
.sitemap li ul li{width:100%; height:30px; background:none;}
.sitemap li ul li a{display:block; width:100%; height:30px; padding:0; border:0; text-align:center; font-family:"NanumGothic","Nanum Gothic"; font-size:13px; line-height:30px; font-weight:400; color:#555;}
.sitemap li#snav01{background:url(../images/sitemap01.jpg?v=1) no-repeat center 15px;}
.sitemap li#snav02{background:url(../images/sitemap02.jpg?v=1) no-repeat center 15px;}
.sitemap li#snav03{background:url(../images/sitemap03.jpg?v=1) no-repeat center 15px;}
.sitemap li#snav04{background:url(../images/sitemap04.jpg?v=1) no-repeat center 15px;}
.sitemap li#snav05{background:url(../images/sitemap05.jpg?v=1) no-repeat center 15px;}
.sitemap li#snav06{background:url(../images/sitemap06.jpg) no-repeat center 15px;}
.sitemap li#snav07{background:url(../images/sitemap07.jpg) no-repeat center 15px;}
.sitemap li#snav08{background:url(../images/sitemap08.jpg) no-repeat center 15px;}