/* TABLE OF CONTENTS

	1. BASIC
	2. EFFECT
	3. BUTTONS
	4. HEADER
	5. SLIDER
	6. SUB
	7. SECTION
	8. FOOTER

*/

/*==========================================================
     Basic Style
============================================================*/

body {
	overflow-x:hidden;
}

a {
	color:#fff;
	-webkit-transition:all 0.2s ease-in-out;
	-moz-transition:all 0.2s ease-in-out;
	-ms-transition:all 0.2s ease-in-out;
	-o-transition:all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

input, textarea {
	outline-width:0;
}

*:hover {
	-webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.st1_con *:hover {
	-webkit-transition: all 0.0s ease-in-out;
    -moz-transition: all 0.0s ease-in-out;
    -ms-transition: all 0.0s ease-in-out;
    -o-transition: all 0.0s ease-in-out;
    transition: all 0.0s ease-in-out;
}

.inner {width:100%;max-width:1080px;margin-left:auto;margin-right:auto;}


/*==========================================================
     Buttons Style
============================================================*/

.button:hover {
	-webkit-transition:all 0.2s ease-in-out;
	-moz-transition:all 0.2s ease-in-out;
	-ms-transition:all 0.2s ease-in-out;
	-o-transition:all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

/*==========================================================
     Header Style
============================================================*/

/*로고 좌측 정렬시 적용*/
#hd2 {position:relative; width:100%; height:120px;}
#hd2 .gnb_area {position:absolute; top:24px; width:100%; height:96px; background:#fff; z-index:99; }
#hd2 .gnb_area:after {display:block;clear:both;content:"";}
#hd2 .logo {float:left;}
#hd2 .gnb_area .gnb{ float:right; padding:20px 0 ;}


/*로고 가운데 정렬시 적용*/
#hd {position:relative; width:100%; height:194px; background:#302721;}
#hd .gnb_area {position:absolute; top:24px; width:100%; height:170px; z-index:99; }
#hd .gnb_area:after {display:block;clear:both;content:"";}
#hd .logo {text-align:center;}
#hd .gnb_area .navi_area {background:#5f4d40;}
#hd .gnb #web_cate_ul1_box {text-align:center;}


.topbar {position:absolute; top:0; width:100%; height:24px; line-height:24px;background:#302721;}
.topbar ul {padding-right:15px;padding-left:15px;text-align:right;}
.topbar ul li {display:inline-block; margin-left:5px;}
.topbar ul li a {color:#ada39c; font-size:12px; font-weight:200; letter-spacing:1px;}
.topbar ul li:before {display:inline-block; content:""; margin: 0 5px 2px 0; width:4px; height:4px; border-radius:50%; background: #919191;}
.topbar ul li:hover span {background:#f18a07;}
.topbar ul li:hover:before {background:#fff;}
.topbar ul li span {display:inline-block;margin:0 5px 2px 0;width:4px;height:4px;border-radius:2px;background:#ffcc00;}



/*==========================================================
     Sub
============================================================*/

#svis {height:220px; background:url(../img/common/svis.jpg) center center; background-size:cover;}
#svis .inner {display:table;width:100%;height:220px;}
#svis .st_con {display:table-cell;vertical-align:middle;}
#svis .st_con h2 {color:#fff; text-align:center; font-weight:300;}
#svis #container_title {
	display:table-cell;
	vertical-align:middle;
	padding:0;
    letter-spacing: -0.5px;
    font-size: 36px;
    color: #fff;
    border-bottom: 0;
	text-align:center !important;
}

#bo_v_title {display:none;}
#bo_v_con {
	line-height:normal;
	text-align:center;
}


/*==========================================================
     Section Style
============================================================*/

/*----- section01 -----*/
#st1 {margin:o auto;background:url(../img/main/main_bg.jpg) center center; background-size:cover;}
#st1 .st1_box {width:100%; max-width:1920px; margin:0 auto; padding:2% 2%; }
#st1 .st1_box:after {display:block; clear:both; content:"";}
#st1 .st1_box .st1_bn {position:relative; float:left; width:23%; margin:1% 1%;}

.st1_bn .bn_area {width:100%; padding-top:100%; text-align:center; 
-ms-transition-duration:0.5s;  
-moz-transition-duration:0.5s;  
-o-transition-duration:0.5s;  
-webkit-transition-duration:0.5s;
transition-duration:0.5s;  

}
.st1_bn .bn_area .con_info {position:absolute; top:0; right:0; bottom:0; left:0; height:100%; width:100%;}

.st1_bn .bn_area .con_info img {display:block; margin:0 auto; width:70%;}
.st1_bn .bn_area .con_info span {

	display:block; width:80%; margin:0 auto; font-size:17px; font-weight:400; letter-spacing:-0.02em; color:#fff;
	overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
	
	}

.st1_bn .stbn_btn {width:45px; height:45px; margin:8% auto; border:1px solid #fff; line-height:38px;}
.st1_bn .stbn_btn:hover {background:#ffba27; border:1px solid #ffba27;}
.st1_bn .stbn_btn p {margin-top:2%;; font-size:20px; font-weight:500; text-align:center; color:#fff;}

.st1_bn .stbn01 {background:url(../img/main/bg/stbn01.jpg) center no-repeat; background-size:cover;}
.st1_bn .stbn02 {background:url(../img/main/bg/stbn02.jpg) center no-repeat; background-size:cover;}
.st1_bn .stbn03 {background:url(../img/main/bg/stbn03.jpg) center no-repeat; background-size:cover;}
.st1_bn .stbn04 {background:url(../img/main/bg/stbn04.jpg) center no-repeat; background-size:cover;}
.st1_bn .stbn05 {background:url(../img/main/bg/stbn05.jpg) center no-repeat; background-size:cover;}
.st1_bn .stbn06 {background:url(../img/main/bg/stbn06.jpg) center no-repeat; background-size:cover;}
.st1_bn .stbn07 {background:url(../img/main/bg/stbn07.jpg) center no-repeat; background-size:cover;}
.st1_bn .stbn08 {background:url(../img/main/bg/stbn08.jpg) center no-repeat; background-size:cover;}

.st1_bn .stbn01:hover {background:url(../img/main/bg/stbn01_ov.jpg) center no-repeat; background-size:cover; border-radius:300px; box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5 );}
.st1_bn .stbn02:hover {background:url(../img/main/bg/stbn02_ov.jpg) center no-repeat; background-size:cover; border-radius:300px; box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5 );}
.st1_bn .stbn03:hover {background:url(../img/main/bg/stbn03_ov.jpg) center no-repeat; background-size:cover; border-radius:300px; box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5 );}
.st1_bn .stbn04:hover {background:url(../img/main/bg/stbn04_ov.jpg) center no-repeat; background-size:cover; border-radius:300px; box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5 );}
.st1_bn .stbn05:hover {background:url(../img/main/bg/stbn05_ov.jpg) center no-repeat; background-size:cover; border-radius:300px; box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5 );}
.st1_bn .stbn06:hover {background:url(../img/main/bg/stbn06_ov.jpg) center no-repeat; background-size:cover; border-radius:300px; box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5 );}
.st1_bn .stbn07:hover {background:url(../img/main/bg/stbn07_ov.jpg) center no-repeat; background-size:cover; border-radius:300px; box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5 );}
.st1_bn .stbn08:hover {background:url(../img/main/bg/stbn08_ov.jpg) center no-repeat; background-size:cover; border-radius:300px; box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5 );}

/*----- stbn01 -----*/


/*==========================================================
     Footer Style
============================================================*/

#footer {
	background:#121212;
	
}

#footer .foot_con{
	display:table;
	width:100%;
	height:120px;
	padding-left:10px; 

}

#footer .foot_con .ft_info {
	text-align:center;
	color:#ccc;;
	display:table-cell;
	vertical-align:middle;
}

#footer .sns {
	display:none;
	vertical-align:middle;
	color:#fff;
	text-align:right;
}

#footer .sns ul li {
	display:inline-block;
	margin:0 15px;
}

#footer .sns ul li:hover {
	opacity:0.8;
	-webkit-transition:all 0.2s ease-in-out;
	-moz-transition:all 0.2s ease-in-out;
	-ms-transition:all 0.2s ease-in-out;
	-o-transition:all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}






/*----- return to top button -----*/
#return-to-top {
	position:fixed;
	bottom:3em;
	right:3em;
	background:#fff;
	width:60px;
	height:60px;
	display:block;
	text-align:center;
	text-decoration:none;
	line-height:60px;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	border: 1px solid #ececec;
	border-radius: 50%;
	box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.07);
	display:none;
	transition: 0.2s ease-out;
    -webkit-transition: 0.2s ease-out;
    -moz-transition: 0.2s ease-out;
	-ms-transition: 0.2s ease-out;
	-o-transition: 0.2s ease-out;
	z-index:999999;
}

#return-to-top i {
	color:#777;
	margin:0;
	position:relative;
	font-size:22px;
}

#return-to-top:hover {
	transform: translate3d(0, -5px, 0);
	-webkit-transform: translate3d(0, -5px, 0);
	-moz-transition: translate3d(0, -5px, 0);
	-ms-transition: translate3d(0, -5px, 0);
	-o-transition: translate3d(0, -5px, 0);
	box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
}

#return-to-top:hover i {
	color: #777;
}