/* 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:#333;
	-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
============================================================*/

/*로고 좌측 정렬시 적용*/
#hd {position:relative; width:100%; height:120px;}
#hd .gnb_area {position:absolute; top:24px; width:100%; height:96px; background:rgba(255, 255, 255, 1); z-index:99; }
#hd .gnb_area:after {display:block;clear:both;content:"";}
#hd .logo {float:left;}
#hd .gnb_area .gnb{float:right; padding:20px 0 ;}


/*로고 가운데 정렬시 적용*/
#hd2 {position:relative; width:100%; height:170px;}
#hd2 .gnb_area {position:absolute; width:100%; top:24px; background:rgba(255, 255, 255, 1);  z-index:99;}
#hd2 .gnb_area:after {display:block;clear:both;content:"";}
#hd2 .logo {text-align:center;}
#hd2 .gnb #web_cate_ul1_box {text-align:center;}




.topbar {position:absolute; top:0; width:100%; height:24px; line-height:24px; background:#f9f9f9; z-index:999;}
.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:#666; 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: #666;}
.topbar ul li:hover span {background:#999;}
.topbar ul li:hover:before {background:#999;}
.topbar ul li span {display:inline-block;margin:0 5px 2px 0;width:4px;height:4px;border-radius:2px;background:#666;}

/*==========================================================
     contaniner 
============================================================*/

#container {margin-top:; }  /*로고 가운데 정렬시 -146px로 수정 */



/*==========================================================
     mvis
============================================================*/

#mvis {position:relative; font-size:0;}
#mvis .mimg {
	width:100%;
	height:912px;
	padding-top:; 
	background-size:cover; 
	background-repeat:no-repeat; 
	background-position:left center;		
}


#mvis .mimg01 {background-image:url('../img/main/main01.jpg')}
#mvis .mimg02 {background-image:url('../img/main/main02.jpg')}
#mvis .mimg03 {background-image:url('../img/main/main03.jpg')}

.mtxt_area {position:absolute; top:36%; left:0%; right: 0%; margin: 0 auto; }	
.mt_area{width:100%; height:100%;}

#mvis .mimg .mtxt {width:100%; z-index:1; text-align: center; }
#mvis .mimg .mtxt img {display: inline-block;}
#mvis .mimg .mtxt h2{margin-top:20px; font-size:30px; color:#fff; }
#mvis .mimg .mtxt span{display:block; margin-top:10px; font-size:20px; color:#fff; }


/*==========================================================
     rgh_bn
============================================================*/

#mvis .rgh_bn {position:absolute; top:0; right:0; width:324px; height:912px; z-index:3; }
#mvis .rgh_bn .rgh_area {position:relative; width:100%; height:304px; }
#mvis .rgh_bn .rgh_area a{display:inline-block; width:100%; height:100%;}

.rgh_bn .rgh_area .con_txt {position:absolute; top:45%; left:15%;  z-index:2;}
.rgh_bn .rgh_area .con_txt span {display:inline-block; font-size:13px; font-family: 'NanumMyeongjo';  color:#fff;}
.rgh_bn .rgh_area .con_txt h2 {font-size:24px; color:#313131; letter-spacing:0.06em;}
.rgh_bn .rgh_area .con_txt p {font-size:12px; color:#fff; font-family: 'NanumMyeongjo';  }
.rgh_bn .rgh_bn03 .con_txt h2 {color:#0431b8; line-height:1.6em; font-weight:bold;}

.rgh_bn .rgh_area .con_more {position:absolute; top:45%; left:10%; width:80px; height:24px; border:1px solid #fff; text-align:center;z-index:2; }
.rgh_bn .rgh_area .con_more p {font-size:12px; line-height:24px; color:#fff;}

.rgh_bn01 .bn_bg {position:absolute; top:0;right:0;bottom:0;left:0; margin:auto; width:50px; height:50px; background: #ff3000; opacity:0 ; transition:0.5s;}
.rgh_bn02 .bn_bg {position:absolute; top:0;right:0;bottom:0;left:0; margin:auto; width:50px; height:50px; background: #ffce08; opacity:0 ; transition:0.5s;}

.rgh_bn .rgh_bn01{background: url('../img/main/ro_bn01.jpg') no-repeat center center;  background-size:cover;}
.rgh_bn .rgh_bn02{background: url('../img/main/ro_bn02.jpg') no-repeat center center;  background-size:cover;}
.rgh_bn .rgh_bn03{background: url('../img/main/ro_bn03.jpg') no-repeat center center;  background-size:cover;}

.rgh_bn .rgh_area .con_info {position:absolute; bottom:10%; right:10%; text-align:right;}
.rgh_bn .rgh_area .con_info h3 {font-size:28px; color:#fff;  font-family: 'GmarketSansLight';}
.rgh_bn .rgh_area .con_info p {margin-top:5px;font-size:12px; color:#fff;  font-family: 'NanumMyeongjo'; }


#mvis .rgh_bn .rgh_area a:hover .bn_bg {width:100%; height:100%; opacity:1;}

/*==========================================================
     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; font-size: 24px;  text-align:center; font-weight:bold;}
#svis #container_title {
	display:table-cell;
	vertical-align:middle;
	padding:0;
    letter-spacing: -0.5px;
    font-size: 30px;
    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 {background:#eaebef;}
#st1 .inner .st1_tit { padding-top:48px;  text-align:center; }
#st1 .inner .st1_tit h2{color:#191c21;}
#st1 .inner .st1_tit p{margin-top:10px; font-size:20px; color:#999;}

#st1 .inner .st1_gal { height:680px; margin-top:48px; padding:0 4%;  text-align:center;}

/*----- section02 -----*/
#st2 {height:48px; background:#b6a79e; }
#st2 .inner:after{display:block; clear:both; content:"";}
#st2 .inner > div {float:left;}

#st2 .inner .bd_tit {width:10%; font-family: 'NanumMyeongjo'; height:20px; margin-top:15px; padding-right: 10px;  border-right:1px solid #fff; color:#fff; text-align:center;}
#st2 .inner .bd_tit h3{ font-size: 20px;}
#st2 .inner .bd_area { width:83%; margin-top:15px; padding-left:20px; color: #fff; }
#st2 .inner .st2_more {width:7%; max-width:68px; height:48px; line-height:48px; font-weight:bold;  background: #9b8e87; text-align:center; }
#st2 .inner .st2_more a {color:#fff;  font-family: 'NanumMyeongjo';}

/*----- section03 -----*/
#st3 {height:168px; background:#fff;  }
#st3 .inner:after{display:block; clear:both; content:"";}
#st3 .inner > div {float:left; width:25%; text-align:center; }

#st3 .inner .st3_bn img {margin:15% 0 5%; }
#st3 .inner .st3_bn .st3_txt {height:57px; margin:0 10%; padding:5px; }
#st3 .inner .st3_bn .st3_txt h3 { font-size:12px; color:#333;}
#st3 .inner .st3_bn .st3_txt p {margin:5px 0; font-size:16px; color:#333;}



/*==========================================================
     Footer Style
============================================================*/

#footer {
	background:#fff;
	border-top:1px solid #fff;
	
}

#footer .foot_con{
	display:table;
	width:100%;
	height:120px;
	padding-left:10px; 

}

#footer .foot_con .ft_info {
	display:table-cell;
	color:#666;
	letter-spacing: 0.03em; 
	font-size: 11px; 
	vertical-align:middle;
}

#footer .sns {
	display:table-cell;
	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;
}