@charset "utf-8";
/* CSS Document */

/**********************
Publishing : Lee Bit-na
Beginning : 2017-01-01
Final : 
***********************/

/* Reset */
* {margin:0; padding:0}
body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select {margin:0;padding:0; word-break: keep-all}  
body,input,textarea,select,button,table{font-family:'Roboto','NotoSansKR', sans-serif; font-weight: 400; font-size:14px; color:#888; vertical-align: baseline;}  
img,fieldset{border:0}  
i,em,address{font-style:normal}
ul,ol,li{list-style:none; padding:0; margin:0}  
em,address{font-style:normal}
label,button{cursor:pointer}
button{margin:0;padding:0}  
img {vertical-align:top}

html,body{height:100%; width:100%}

a { selector-dummy : expression(this.hideFocus=true);}
a:link {color:#777; text-decoration: none;}
a:visited {color:#777; text-decoration: none;}
a:hover {color:#777; text-decoration: none;}
a:active {color:#777; text-decoration: none;}
a:focus {outline:none;}

button { selector-dummy : expression(this.hideFocus=true);}
button:focus {outline:none;}

select {font-family:'NanumBarun';}
select { -webkit-appearance: listbox; }
input { border-radius:0;}
legend{*width:0}
table{border-collapse:collapse; border-spacing:0}

h1,h2,h3,h4,dt,dd,em{font-weight: normal}
h1 sup, h2 sup, h3 sup, h4 sup, p sup, a sup, dd sup, sup { 
  font-size: 0.4em; 
  position: relative;
  top: 0;
}
.blind{visibility:hidden;overflow:hidden;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0}
.skip-contents, caption, legend {overflow: hidden; position: absolute; height:0; width:0; font-size: 0; text-indent: -9999px;}

select {-webkit-appearance: none; border-radius:0; padding:5px 20px 5px 5px; background: #fff url('../images/common/bbs_select_arrow.gif') no-repeat right center; border:1px solid #ddd;}

/* select 박스 */
.selectbox_title {position:relative; vertical-align:middle; display:block; cursor:pointer; *zoom:1;}
.selectbox_title strong {position:relative; width:100%; display:block; text-align:left; height:40px; color:#666; line-height:40px; border:1px solid #ddd; background:#fff url('../images/common/bbs_select_arrow.gif') no-repeat right center ; font-weight:normal;margin:0; padding: 0 19px 0 10px; box-sizing: border-box}
.selectbox_option{border:1px solid #d3d3d3;background:#fff;overflow:hidden; width:100%}
.selectbox_option li{list-style:none; margin:0}
.iteminfor .cont li .selectbox_option li{list-style:none; margin:0}
.selectbox_option a{color:#888;word-break:break-all;font-size:12px; line-height:16px; text-decoration:none; padding:8px 5px 8px;_padding:6px 5px 5px; display:block;overflow:hidden;}
.selectbox_option a.on,
.selectbox_option a:hover{color:#000;background:#eee;}

.sorting_input select.selectbox_title {width: 278px}

.visual video{
	position: absolute;
	overflow: hidden;
	right: 0;
	bottom: 0;
	top:0;
	right:0;
	min-width: 100%;
	min-height: 100%;
	width: auto;
	height: auto;
	background-size: 100% 100%;
	background-color: black; /* in case the video doesn't fit the whole page*/
		background-image: /* our video */;
		background-position: center center;
		background-size: contain;
	  object-fit: cover; /*cover video background */
	z-index:-1;
}

/*한글*/
@font-face {
	font-family: 'NotoSansKR';
	font-weight: 100;
	src: url(../font/NotoSansKR-Thin.eot);
	src: url(../font/NotoSansKR-Thind41d.eot?#iefix) format('embedded-opentype'),
	url(../font/NotoSansKR-Thin.woff) format('woff'),
	url(../font/NotoSansKR-Thin.ttf) format('truetype');
}
@font-face {
	font-family: 'NotoSansKR';
	font-weight: 300;
	src: url(../font/NotoSansKR-Light.eot);
	src: url(../font/NotoSansKR-Lightd41d.eot?#iefix) format('embedded-opentype'),
	url(../font/NotoSansKR-Light.woff) format('woff'),
	url(../font/NotoSansKR-Light.ttf) format('truetype');
}
@font-face {
	font-family: 'NotoSansKR';
	font-weight: 400;
	src: url(../font/NotoSansKR-Regular.eot);
	src: url(../font/NotoSansKR-Regulard41d.eot?#iefix) format('embedded-opentype'),
	url(../font/NotoSansKR-Regular.woff) format('woff'),
	url(../font/NotoSansKR-Regular.ttf) format('truetype');
}
@font-face {
	font-family: 'NotoSansKR';
	font-weight: 500;
	src: url(../font/NotoSansKR-Medium.eot);
	src: url(../font/NotoSansKR-Mediumd41d.eot?#iefix) format('embedded-opentype'),
	url(../font/NotoSansKR-Medium.woff) format('woff'),
	url(../font/NotoSansKR-Medium.ttf) format('truetype');
}
@font-face {
	font-family: 'NotoSansKR';
	font-weight: 700;
	src: url(../font/NotoSansKR-Bold.eot);
	src: url(../font/NotoSansKR-Boldd41d.eot?#iefix) format('embedded-opentype'),
	url(../font/NotoSansKR-Bold.woff) format('woff'),
	url(../font/NotoSansKR-Bold.ttf) format('truetype');
}
@font-face {
	font-family: 'NotoSansKR';
	font-weight: 900;
	src: url(../font/NotoSansKR-Black.eot);
	src: url(../font/NotoSansKR-Blackd41d.eot?#iefix) format('embedded-opentype'),
	url(../font/NotoSansKR-Black.woff) format('woff'),
	url(../font/NotoSansKR-Black.ttf) format('truetype');
}


/*숫자,영문*/
@font-face {
	font-family: 'Roboto';
	font-weight: 100;
	src: url(../font/Roboto-Thin.eot);
	src: url(http://error.uhost.co.kr/stop/4044_Error_Page.html#iefix) format('embedded-opentype'),
	url(../font/Roboto-Thin.woff) format('woff'),
	url(../font/Roboto-Thin.ttf) format('truetype');
}
@font-face {
	font-family: 'Roboto';
	font-weight: 300;
	src: url(../font/Roboto-Light.eot);
	src: url(http://error.uhost.co.kr/stop/4044_Error_Page.html#iefix) format('embedded-opentype'),
	url(../font/Roboto-Light.woff) format('woff'),
	url(../font/Roboto-Light.ttf) format('truetype');
}
@font-face {
	font-family: 'Roboto';
	font-weight: 400;
	src: url(../font/Roboto-Regular.eot);
	src: url(http://error.uhost.co.kr/stop/4044_Error_Page.html#iefix) format('embedded-opentype'),
	url(../font/Roboto-Regular.woff) format('woff'),
	url(../font/Roboto-Regular.ttf) format('truetype');
}
@font-face {
	font-family: 'Roboto';
	font-weight: 500;
	src: url(../font/Roboto-Medium.eot);
	src: url(http://error.uhost.co.kr/stop/4044_Error_Page.html#iefix) format('embedded-opentype'),
	url(../font/Roboto-Medium.woff) format('woff'),
	url(../font/Roboto-Medium.ttf) format('truetype');
}
@font-face {
	font-family: 'Roboto';
	font-weight: 700;
	src: url(../font/Roboto-Bold.eot);
	src: url(http://error.uhost.co.kr/stop/4044_Error_Page.html#iefix) format('embedded-opentype'),
	url(../font/Roboto-Bold.woff) format('woff'),
	url(../font/Roboto-Bold.ttf) format('truetype');
}


/* layout */
.index_btn_wrap a.btn_sound {display: block; width: 32px; height: 33px; background: url(../images/common/sound_on.png) no-repeat 0 0; position: absolute; top:0; right:100px; border: 0; padding: 0; margin: 0; text-indent: -9999px}
.index_btn_wrap a.btn_sound:hover { border: 0; padding: 0; margin: 0; background-color:transparent}
.index_btn_wrap a.btn_sound.off {background: url(../images/common/sound_off.png) no-repeat 0 0;}

.header {
	position:fixed; left:0; top:0; right:0; z-index:12; height:64px; 
	background:url(../images/common/bbs_line.png) repeat-x bottom; 
	transition: all ease-in .1s;
    -webkit-transition: all ease-in .1s;
    -moz-transition: all ease-in .1s;
    -ms-transition: all ease-in .1s;
    -o-transition: all ease-in .1s;
}
.header h1 {position: absolute; top:15px; left: 50%; margin:0 0 0 -73px}
.header h1 a {display:inline-block; width:147px; height:36px; letter-spacing:-9999px; background:url(http://error.uhost.co.kr/stop/4044_Error_Page.html) no-repeat center top}
.header .lag {float:right; margin: 22px 24px 0 0;}
.header .lag a {display: inline-block; padding:0 8px; height: 20px; line-height: 21px; font-size:11px; background: rgba(255,255,255,.8); color: #09a3a3; border-radius: 50px; font-weight: 600}
.header .lag a:hover {text-decoration: none}
.header .lag .last {margin-left:10px; padding-left:10px;}
.header.on {background-color:#fff}
.header.on .lag .last {border-left: 1px dotted #999; }
.header.on .lag a, .header.wh a, .header.on a, .header.wh .lag a, .header.bk .lag a, .header.enable a, .header.enable .lag a {color: #999}
.header.on .lag a.on, .header.wh .lag a.on, .header.bk .lag a.on  {background:#09a3a3; color: #fff}
.header .lag a.on, .header.wh .lag a.on, .header.on .lag a.on {background:#09a3a3; color: #fff}

.header.on .head_menu>div:after, .header.wh.on .head_menu>div:after, .header.wh .head_menu>div:after, .header.enable .head_menu>div:after {background: #999}
.header.wh {background-color: #fff}
.header_gnb {display:block; float:left}
.header_gnb li {
	display: inline-block;
	float:left; 
	position:relative;
	height: 63px;
	background:url(../images/common/bbs_line.png) repeat-y right; 
	transition: all ease-in .1s;
    -webkit-transition: all ease-in .1s;
    -moz-transition: all ease-in .1s;
    -ms-transition: all ease-in .1s;
    -o-transition: all ease-in .1s;
}
.header.on .header_gnb li:hover, .header.wh.on .header_gnb li:hover, .header.enable .header_gnb li:hover {background-color:#f2faff; text-decoration: none}
.header_gnb .head_menu {
	position: relative;
	display: inline-block;
	font-size:12px; 
	font-family: 'Oxygen', sans-serif; 
	font-weight:700; 
	color: #fff;
	padding:24px 20px 20px;
	letter-spacing:1px;
	transition: all ease-in .1s;
    -webkit-transition: all ease-in .1s;
    -moz-transition: all ease-in .1s;
    -ms-transition: all ease-in .1s;
    -o-transition: all ease-in .1s;
}
.header_gnb .head_menu:hover {text-decoration: none}
.header_gnb .menu .head_menu {padding: 24px 40px 20px}
.header_gnb li a.on {border-bottom:2px solid}

.header .otollo, .header.wh .otollo  {
	width: 110px; 
	height: 63px;
	margin-left: 30px;
	background:url(../images/common/bbs_line.png) repeat-y left;
	float: right; 
}
.header .btn_otollo, .header.wh .btn_otollo {
	display: block;
	width: 110px;
	height: 63px; 
	text-align: center; background:url(http://error.uhost.co.kr/stop/4044_Error_Page.html) no-repeat center center; 
	text-indent: -9999px;
	transition: all ease-in .1s;
    -webkit-transition: all ease-in .1s;
    -moz-transition: all ease-in .1s;
    -ms-transition: all ease-in .1s;
    -o-transition: all ease-in .1s;
}
.header.on .btn_otollo, .header.wh .btn_otollo, .header.bk .btn_otollo, .header.enable .btn_otollo { background:url(http://error.uhost.co.kr/stop/4044_Error_Page.html) no-repeat center center; }
.header.on .btn_otollo:hover, .header .btn_otollo:hover { background:url(http://error.uhost.co.kr/stop/4044_Error_Page.html) no-repeat center center; }

/* menu */
.head_menu>div {
    position: relative;
    width: 19px;
    height: 2px;
    margin-top: 3px;
}
.head_menu>div:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: #fff;
}

.header .btn_menu  {position:fixed; left:0; top:0; display:inline-block; padding: 24px 20px 20px;}
.header .btn_menu>div {
    position: relative;
    width: 19px;
    height: 2px;
    margin-top: 3px;
    background: #fff;
}
.header.on .btn_menu>div {background-color: #ccc}
.header.wh .btn_menu>div {background-color: #ccc}
.header.bk .btn_menu>div {background-color: #ccc}
.menu_wrap {position:fixed; top:0; left:0; right:0; bottom:0; background:url(../images/common/bg_dim.png); opacity: 0;}
.full-frame {z-index: -1; position: relative}

/* snb */
.gnb_zone {position:fixed; top:64px; left:0; right:0; background-color:#fff; z-index:110; border-bottom: 1px solid #e8e8e8;}
.sub_gnb:after {display: block; clear: both; content: ""} 
.sub_gnb {display:block; margin:auto; width: 1140px; padding:50px 0 0}
.sub_gnb.all {}
.sub_gnb.all .gnb_block {width: 16.2%; float: left;}
.sub_gnb.all .gnb_block .box {text-align: left;}
.sub_gnb.all .gnb_block a {position:relative; display: block; padding: 5px 0; text-align: center}
.sub_gnb.all .gnb_block a span {display: inline-block; position: relative}
.sub_gnb.all .gnb_block a span i {display: none; position: absolute; top:-1px; right: -14px}
.sub_gnb.all em a {position:relative; display:block; text-transform: uppercase;  height: 25px; padding:0 0 20px; font-size: 16px; font-weight: 700; margin-bottom:15px; color: #111; }

.sub_gnb li {
	display:block; 	
	transition: all ease-in .1s;
    -webkit-transition: all ease-in .1s;
    -moz-transition: all ease-in .1s;
    -ms-transition: all ease-in .1s;
    -o-transition: all ease-in .1s;
}
.sub_gnb li a {color: #545454; text-decoration:none}
.sub_gnb li p {margin-bottom:10px}
.sub_gnb li p img {
	transition: all ease-in .1s;
    -webkit-transition: all ease-in .1s;
    -moz-transition: all ease-in .1s;
    -ms-transition: all ease-in .1s;
    -o-transition: all ease-in .1s;
}
.sub_gnb li a:hover { color: #09a3a3;}
.popup_open {width:100%}
.popup_open .wrap {position:fixed; width:100%}

.wrap {height:100%; position:relative;}
.container {position:relative; background-color:#fff; overflow: hidden}
/*
.container.gray {background-color: #f5f5f5}
*/
.container:after {display: block; clear: both; content: ""}
.container.bk {background-color:#101010}
.container.people {margin-top:64px}
.container.ceo {background:#d4d3d1}

.part_wrap {width:100%; height:100vh; overflow:hidden; position:relative; background-color: #ced1d5}
.part_wrap .visual{position:absolute; left:0; top:0; width:100%; height:100%; z-index:9; overflow:hidden; background-size: cover}
.main_intro_inner {
	position:absolute;
	top:0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    width: 100%;
    height: 100vh;
    transition: transform 2s ease;
    -webkit-transition: transform 2s ease;
    overflow: hidden;
}
.inner_img {width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    transition: transform 2s ease;
    -webkit-transition: transform 2s ease;
    transform: scale(1);
    -webkittransform: scale(1);
}
.section.active .main_intro_inner {transform: translate3d(0px, 0px, 0px); transition-duration: 0ms;}
.section.active .inner_img {transition: transform 40s ease 0s; transform: rotate(0.001deg) scale(1.2); z-index: -1}

.part_wrap .visual.main01 { background: url('http://error.uhost.co.kr/stop/4044_Error_Page.html') no-repeat center center; background-size: cover}
.part_wrap .visual.main02 { background: url('http://error.uhost.co.kr/stop/4044_Error_Page.html') no-repeat center center; background-size: cover}
.part_wrap .visual.main03 { background: url('http://error.uhost.co.kr/stop/4044_Error_Page.html') no-repeat center center; background-size: cover}


.motion_arrow {position:absolute; text-align:center; width:20px; display:block; bottom:50px; left:50%; margin-left:-10px; z-index:2; padding:0;}
.motion_arrow img {width:20px}
.motion_arrow .link { display:inline-block; padding:10px; color:#fff; font-size:15px; position:relative; z-index:101}
.link_wrap {position: absolute; top:0; bottom: 0; left: 0; width: 100%; z-index: 999}

/* icon menu */
.icon_menu {position: relative; text-align: center; display: block; width: 820px; padding-left: 200px; padding-top: 30px}
.icon_menu:after {display: block; clear: both; content: ""} 
.icon_menu li {display:inline-block; width:25%; float: left; margin: 15px 0; height: 103px}
.icon_menu li.title_area {position: absolute; top:65px; left:20px; width:180px; height: 235px; margin: 0; text-align: left; font-size: 14px; color: #888; line-height: 22px; border-right: 1px solid #ebebeb;}
.icon_menu li.title_area h1 {display: inline-block; position: relative; margin-bottom: 10px; font-size: 18px; color: #111; font-weight: 700; line-height: 1.6em}
.icon_menu li.title_area h1 i {display: none; position: absolute; top:-1px; right: -14px;}
.icon_menu li.title_area h1.depth i {position: absolute; top:20px; right: -14px;}
.icon_menu li .icon {width: 85px; height: 85px; margin: auto}
.icon_menu li .icon.menu01 {width: 130px; background:url(../images/common/icon_menu_13.gif) no-repeat 0 0}
.icon_menu a:hover .icon.menu01 {width: 130px; background:url(../images/common/icon_menu_13.gif) no-repeat 0 -85px}
.icon_menu li .icon.menu02 {background:url(../images/common/icon_menu_02.gif) no-repeat 0 0}
.icon_menu a:hover .icon.menu02 {background:url(../images/common/icon_menu_02.gif) no-repeat 0 -85px}
.icon_menu li .icon.menu03 {background:url(../images/common/icon_menu_03.gif) no-repeat 0 0}
.icon_menu a:hover .icon.menu03 {background:url(../images/common/icon_menu_03.gif) no-repeat 0 -85px}
.icon_menu li .icon.menu04 {background:url(../images/common/icon_menu_04.gif) no-repeat 0 0}
.icon_menu a:hover .icon.menu04 {background:url(../images/common/icon_menu_04.gif) no-repeat 0 -85px}
.icon_menu li .icon.menu05 {background:url(../images/common/icon_menu_05.gif) no-repeat 0 0}
.icon_menu a:hover .icon.menu05 {background:url(../images/common/icon_menu_05.gif) no-repeat 0 -85px}
.icon_menu li .icon.menu06 {background:url(../images/common/icon_menu_06.gif) no-repeat 0 0}
.icon_menu a:hover .icon.menu06 {background:url(../images/common/icon_menu_06.gif) no-repeat 0 -85px}
.icon_menu li .icon.menu07 {background:url(../images/common/icon_menu_07.gif) no-repeat 0 0}
.icon_menu a:hover .icon.menu07 {background:url(../images/common/icon_menu_07.gif) no-repeat 0 -85px}
.icon_menu li .icon.menu08 {background:url(../images/common/icon_menu_08.gif) no-repeat 0 0}
.icon_menu a:hover .icon.menu08 {background:url(../images/common/icon_menu_08.gif) no-repeat 0 -85px}
.icon_menu li .icon.menu09 {background:url(../images/common/icon_menu_09.gif) no-repeat 0 0}
.icon_menu a:hover .icon.menu09 {background:url(../images/common/icon_menu_09.gif) no-repeat 0 -85px}
.icon_menu li .icon.menu10 {background:url(../images/common/icon_menu_10.gif) no-repeat 0 0}
.icon_menu a:hover .icon.menu10 {background:url(../images/common/icon_menu_10.gif) no-repeat 0 -85px}
.icon_menu li .icon.menu11 {background:url(../images/common/icon_menu_11.gif) no-repeat 0 0}
.icon_menu a:hover .icon.menu11 {background:url(../images/common/icon_menu_11.gif) no-repeat 0 -85px}
.icon_menu li .icon.menu12 {background:url(../images/common/icon_menu_12.gif) no-repeat 0 0}
.icon_menu a:hover .icon.menu12 {background:url(../images/common/icon_menu_12.gif) no-repeat 0 -85px}

.icon_menu li .icon.menu13 {width: 130px; background:url(../images/common/icon_menu_vivozon.gif) no-repeat 0 0}
.icon_menu a:hover .icon.menu13 {background:url(../images/common/icon_menu_vivozon.gif) no-repeat 0 -85px}

.icon_menu li .icon.menu14 {width: 110px; background:url(../images/common/icon_menu_14.gif) no-repeat 0 0}
.icon_menu a:hover .icon.menu14 {background:url(../images/common/icon_menu_14.gif) no-repeat 0 -85px}
.icon_menu li .icon.menu15 {background:url(../images/common/icon_menu_15.gif) no-repeat 0 0}
.icon_menu a:hover .icon.menu15 {background:url(../images/common/icon_menu_15.gif) no-repeat 0 -85px}
.gnb_close {position: absolute; display: block; left:50%; bottom:-45px; margin-left: -40px; width:80px;}

.menu_list .lag  {display: block; text-align: center;}
.menu_list .lag a {display: inline-block; padding: 7px 20px; color: #09a3a3; font-weight: 700; font-size: 12px; border-radius: 50px; -moz-border-radius: 50px; -webkit-border-radius: 50px;}
.menu_list .lag a.on {background-color: #09a3a3; color: #fff}

/*index*/
.index_btn_wrap {
	position:absolute;
	bottom:8%;
	width:100%;
	text-align:center;
	left:0;
	z-index: 9999;
}
.index_btn_wrap a {
	display: inline-block; 
	text-align:center;
	font-size: 12px;
	width:150px; margin:0 10px; 
	border:1px solid #fff; 
	padding:13px 0; color:#fff; 
	font-family: 'Oxygen', sans-serif; 
	letter-spacing: 0;
	cusur:pointer;
    transition: all ease-in .2s;
    -webkit-transition: all ease-in .2s;
    -moz-transition: all ease-in .2s;
    -ms-transition: all ease-in .2s;
    -o-transition: all ease-in .2s;
}
.index_btn_wrap a:hover {border:1px solid #ea4184; color: #fff; background-color:#ea4184}
.div_mobile img {width: 100%}

.index_btn_wrap.m_btn a {
	display: inline-block; 
	text-align:center;
	font-size: 12px;
	border:1px solid #ea4184; 
	color: #fff; 
	background-color:#ea4184;
	width:150px; margin:0 10px; 
	padding:13px 0; color:#fff; 
	font-family: 'Oxygen', sans-serif; 
	letter-spacing: 0;
	cusur:pointer;
    transition: all ease-in .2s;
    -webkit-transition: all ease-in .2s;
    -moz-transition: all ease-in .2s;
    -ms-transition: all ease-in .2s;
    -o-transition: all ease-in .2s;
}

/* footer */
.btn_top {display:block; width:60px; height:60px; z-index:100}
.btn_top img {width:60px}
.s_footer {position:relative; color:#afafaf; font-size:14px; background-color:#f5f5f5; clear: both; z-index:11; padding: 50px 0; text-align: center}
.s_footer:after {display: block; clear: both; content: ""}
.s_footer .etc_menu {display:block;}
.s_footer .etc_menu .s_menu {display:block; position:relative; margin-bottom: 30px}
.s_footer .etc_menu .s_menu li {display:inline-block; margin:0 10px;}
.s_footer .etc_menu .s_menu li.first {background: none}
.s_footer .etc_menu .s_menu li:after{clear:both; content:''; display:block;}
.s_footer .etc_menu .s_menu li a {
	font-size:16px; font-weight: 500;
	display:inline-block; 
    transition: all ease-in .2s;
    -webkit-transition: all ease-in .2s;
    -moz-transition: all ease-in .2s;
    -ms-transition: all ease-in .2s;
    -o-transition: all ease-in .2s;
}
.s_footer .etc_menu .s_menu li a.red {color:#111; font-weight: 700}
.s_footer .etc_menu .s_menu li a:hover {color:#09a3a3}
.s_footer #back_top {
	position: absolute;
    top: -75px;
    left: 50%;
    margin: 0 0 0 -30px;
    z-index: 10;
}
.s_footer address {display:block; text-transform: uppercase; padding:15px 0 0; margin: 0; font-size: 12px; letter-spacing: 1px;}
.s_footer .footer_wrap {position: relative; margin:0 50px}
.s_footer .footer_wrap:after {display: block; clear: both; content: ""}
.s_footer .footer_infor {clear: both; line-height: 1.7em; font-size: 12px;}
.s_footer .sns {position: absolute; right:186px; top:30px}
.s_footer .sns li {float: left; margin-left: 10px}
.s_footer .sns li a {display: block; width:25px; height:25px;}
.s_footer .sns li a img {width: 100%}

/*family site*/
.s_footer .family {
	top:40px;position:absolute; right:0; bottom:45px;}

.s_footer .family_title {
	position:absolute; 
	right:0; width:140px; 
	height:auto; 
	background:#191919 url(../images/common/bbs_s_arrow_bk.gif) no-repeat 10px center; 
	border:1px solid #898989; 
	padding:8px 10px; margin:0 0 0 10px; 
	font-size:13px; 
	text-indent: 15px;
	font-family: 'Oxygen', sans-serif;
	color:#fff;
	letter-spacing:1px;
}
.s_footer .family_title.on {
	position:absolute; 
	right:0; width:140px; 
	height:auto; 
	background:#09a3a3 url(http://error.uhost.co.kr/stop/4044_Error_Page.html) no-repeat 140px center; 
	border:1px solid #09a3a3;
	padding:8px 10px; margin:0 0 0 10px; 
	font-size:13px; 
}
.s_footer .family_title.on a:visited{color:#fff; text-decoration:none;}
.s_footer .family_title.on a:link{color:#fff; text-decoration:none;}

.s_footer .family .options{font-size:13px; position:absolute; width:162px; z-index:-1; right:0; background-color:#09a3a3;  top:0px; letter-spacing:1px; overflow:hidden; height:34px;
}
.s_footer .family .options span{display:block; padding:5px 15px; height:30px; line-height:2.5em;}
.s_footer .family .options a{
	display:block;
	transition: all ease-in .1s;
	-webkit-transition: all ease-in .1s;
    -moz-transition: all ease-in .1s;
    -ms-transition: all ease-in .1s;
    -o-transition: all ease-in .1s;
}
.s_footer .family .options a:visited{color:#fff; text-decoration:none;}
.s_footer .family .options a:link{color:#fff; text-decoration:none;}
.s_footer .family .options a:hover{background-color:#ea4184;}


/*family site 끝 */

a.roll .over { display: none;}
.roll:hover { display:inline-block;}

.menu_list .lag  {display: block; text-align: center;}
.menu_list .lag a {display: inline-block; padding: 7px 20px; font-weight: 700; font-size: 12px; border-radius: 50px; -moz-border-radius: 50px; -webkit-border-radius: 50px;}
.menu_list .lag a.on {background-color: #09a3a3; color: #fff}


/**/
.parallax-window { min-height: 770px; background: transparent; }
.parallax-sub { min-height: 430px; background: transparent; }
.parallax-new { min-height: 520px; background: transparent; }
.parallax-otollo { min-height:590px; background: transparent; }
.parallax-hand { height:640px; background: transparent; }

/* 버튼 */
a.btn_trans {
	display: inline-block; 
	border: 1px solid #fff; 
	color: #fff; 
	padding:15px 0; 
	width: 170px;
	border-radius: 50px;
	font-size: 16px;
	font-weight: 700;
	transition: all ease-in .2s;
    -webkit-transition: all ease-in .2s;
    -moz-transition: all ease-in .2s;
    -ms-transition: all ease-in .2s;
    -o-transition: all ease-in .2s;
}
a.btn_trans:hover {background-color: #09a3a3; border-color: #09a3a3; color: #fff}


/* arrow */
a.btn_arrow {
	display: block; 
	width: 30px; 
	height: 50px; 
	position: absolute; 
	top:50%; 
	margin-top: -25px; 
	z-index: 5;
	transition: all ease-in .1s;
    -webkit-transition: all ease-in .1s;
    -moz-transition: all ease-in .1s;
    -ms-transition: all ease-in .1s;
    -o-transition: all ease-in .1s;
    opacity: .7;
}
a.btn_arrow:hover {opacity: 1}
a.btn_arrow.left:hover {margin-left: -5px}
a.btn_arrow.right:hover {margin-right: -5px}

.btn_arrow.left {left: -30px;}
.btn_arrow.right {right: -30px}
.btn_arrow.left.wh {background:url(../images/common/arrow-wh-left.png) no-repeat 0 0}
.btn_arrow.right.wh {background:url(../images/common/arrow-wh-right.png) no-repeat 0 0}
.btn_arrow.left.gray {background:url(../images/common/arrow-gray-left.png) no-repeat 0 0}
.btn_arrow.right.gray {background:url(../images/common/arrow-gray-right.png) no-repeat 0 0}

a.btn_ng_link {display:inline-block; z-index:10; width:200px; height:50px; line-height:50px; font-size:14px; font-family: 'Oxygen', sans-serif; letter-spacing:1px; border:1px solid #fff; text-align:center; color: #fff;
	transition: all ease-in .1s;
    -webkit-transition: all ease-in .1s;
    -moz-transition: all ease-in .1s;
    -ms-transition: all ease-in .1s;
    -o-transition: all ease-in .1s;
}
a.btn_ng_link:hover {border:1px solid #ea4184; color: #fff; background-color:#ea4184}

a.btn_sub_link {
	display:inline-block; 
	z-index:10; 
	width:260px; 
	height:60px; 
	line-height:60px; 
	font-size:20px; 
	text-align: center;
	color: #fff;
	z-index: 1;
	font-weight:700;
	position: relative;
	background-color: #09a3a3; 	
	border-radius: 50px;
	transition: all ease-in .1s;
    -webkit-transition: all ease-in .1s;
    -moz-transition: all ease-in .1s;
    -ms-transition: all ease-in .1s;
    -o-transition: all ease-in .1s;
}
a.btn_sub_link:hover {background-color:#1a88c7}

/*
section.on {
	animation-name: fadeInUp;
	animation-duration: 1s;
	animation-timing-function: cubic-bezier(0.44,0.01,0.64,0.99);
	animation-fill-mode: forwards;
	animation-delay: 0;
}
*/

.tab_mobile {clear:both; padding:0 10px; border:2px solid #09a3a3; background:#fff url(../images/common/bbs_tab_mobile.png) no-repeat right center; background-size:25px;}
.tab_mobile select {border:0; width:100%; background:none; line-height:32px; color: #09a3a3}
.tab_select {clear:both; padding:0 10px; border:1px solid #ccc; background:#fff url(../images/common/bbs_arrow_dwon.png) no-repeat right center; background-size:25px}
.tab_select select {border:0; width:100%; background:none; line-height:40px}

#footer_m .privacy_menu {clear: both; display:block; padding:15px 0; margin:0 20px 15px; text-align:left; color:#111; border-bottom:1px solid #ddd; background:url(../images/common/arrow_down.png) no-repeat right center; background-size:15px;}  
#footer_m .privacy_menu_cont {margin-bottom:15px}
#footer_m .privacy_menu_cont:after {display:block; clear:both; content:""} 
#footer_m .copyright {
	display: block;
    text-transform: uppercase;
    margin: 0;
    font-size: 10px;
    letter-spacing: 1px;
    color: #666;
    padding: 10px 0 50px;
    text-align: center;
    background-size: 140px;
}
#footer_m .copyright em {color:#FCB6C8; margin:0 3px}
#footer_m:after {display:block; clear:both; content:""} 
#footer_m {clear: both; position:relative; background-color:#f5f5f5; padding:20px 0 30px; text-align:center; font-size:12px;z-index: 11}
#footer_m address {font-size:11px; line-height: 1.5em}
#footer_m .footer_m_link {margin:auto 20px; border-bottom:1px solid #ddd;}
#footer_m .footer_m_link:after {display:block; clear:both; content:""}
#footer_m .menu {float:left}
#footer_m .menu li {float:left; margin: 10px 20px 0 0;}
#footer_m .menu a {display:inline-block; padding:10px 0; color:#111}
#footer_m .sns {float:right; margin:10px 20px 0 0}
#footer_m .sns li {float:left; margin-left: 20px}
#footer_m .sns a {display:block; width:25px; height:25px}
#footer_m .sns a img {width: 100%}
#footer a.top_btn {position:absolute; display:block; right:0; top:0; width:40px; height:40px; background:url(http://error.uhost.co.kr/stop/4044_Error_Page.html) no-repeat 0 0;}
#footer_m .footer_privacy {margin-top:15px}
#footer_m .footer_privacy li {display:inline-block; margin:0 5px}
#footer_m .footer_privacy li a {display:block; text-align:center; color: #111; font-size:12px; padding:5px 0}
#footer_m .btn_top {
	position: absolute;
    top: -25px;
    left: 50%;
    margin: 0 0 0 -30px;
    z-index: 10;}


/*pop*/
.popup_wrap {border: 1px solid #ddd}
.pop_state {height: 30px; background-color: #222}
.pop_state .btn {background: none; color: #fff; font-size: 12px; float: left}
.pop_state .close {float: right; background: none; color: #fff; border: 0; margin: 5px 10px 0 0}


#ie-browser {
 overflow: hidden;
 position: fixed;
 bottom: 0;
 left: 0;
 width: 100%;
 padding: 20px 0;
 text-align: center;
 background-color: #09a3a3;
 color: #fff;
 font-size: 16px;
 z-index: 1001;
}

#ie-browser p {
 margin: 0 0 10px;
}

#ie-browser a {
 color: #fff;
 font-weight: bold;
 text-decoration: underline;
}


.backScreen {
    display: none;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: 64px;
    z-index: 9;
    background-color: transparent;
    -webkit-transition: all 0.3s;
    -ms-transition: all 0.3s;
    transition: all 0.3s;
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
}
.header.enable .backScreen {display: block; background:url(../images/common/menu_on_dim.png)}
.header.enable {background-color: #fff}



/* animation */
section.on .fade_in_up{
	animation-name: fadeInUp;
	animation-duration: 1s;
	animation-timing-function: cubic-bezier(0.44,0.01,0.64,0.99);
	animation-fill-mode: forwards;
	animation-delay:0;
}

section.on [class*="fade_in"] {
    opacity: 0;
}

section.on .fade_in_up + .innovation_box {
    animation-delay: 0s;
}
section.on .fade_in_up + .innovation_box + .innovation_box  {
    animation-delay: 0.3s;
}
section.on .fade_in_up + .innovation_box + .innovation_box +.innovation_box  {
    animation-delay: 0.6s;
}
section.on .fade_in_up + .innovation_box + .innovation_box +.innovation_box + .innovation_box  {
    animation-delay: 0.9s;
}
section.on .fade_in_up + .innovation_box + .innovation_box +.innovation_box + .innovation_box + .innovation_box  {
    animation-delay: 1.2s;
}
section.on .fade_in_up + .innovation_box + .innovation_box +.innovation_box + .innovation_box + .innovation_box + .innovation_box  {
    animation-delay: 1.5s;
}


section.on .fade_in_up + .item_obj {
    animation-delay: 0.3s;
}
section.on .fade_in_up + .item_obj + .item_obj{
    animation-delay: 0.6s;
}
section.on .fade_in_up + .item_obj + .item_obj + .item_obj{
    animation-delay: 0.9s;
}

section.on .fade_in_up + .fade_in_up {
    animation-delay: 0.3s;
}
section.on .fade_in_up + .fade_in_up + .fade_in_up{
    animation-delay: 0.6s;
}
section.on .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up {
    animation-delay: 0.9s;
}
section.on .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up{
    animation-delay: 1.2s;
}
section.on .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up {
    animation-delay: 1.5s;
}
section.on .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up{
    animation-delay: 1.8s;
}
section.on .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up{
    animation-delay: 2.1s;
}
section.on .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up{
    animation-delay: 2.4s;
}
section.on .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up{
    animation-delay: 2.7s;
}
section.on .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up{
    animation-delay: 3.0s;
}
section.on .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up{
    animation-delay: 3.3s;
}
section.on .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up{
    animation-delay: 3.6s;
}
section.on .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up + .fade_in_up{
    animation-delay: 3.9s;
}

section.on .company_vision .fade_in_up:nth-child(1){animation-delay: 1.5s}
section.on .company_vision .fade_in_up:nth-child(2){animation-delay: 1.8s}
section.on .company_vision .fade_in_up:nth-child(3){animation-delay: 2.1s}
section.on .company_vision .fade_in_up:nth-child(4){animation-delay: 2.4s !important}

section.on .fade_history {
	animation-name: fadeInUp_history;
	animation-duration: 1s;
	animation-timing-function: cubic-bezier(0.44,0.01,0.64,0.99);
	animation-fill-mode: forwards;
	animation-delay: 0;
}
section [class*="fade_history"] {
    opacity: 0;
}
section.on .fade_history + .fade_history {
    animation-delay: 0.3s;
}
section.on .fade_history + .fade_history + .fade_history{
    animation-delay: 0.3s;
}
section.on .fade_history + .fade_history + .fade_history + .fade_history {
    animation-delay: 0.6s;
}
section.on .fade_history + .fade_history + .fade_history + .fade_history + .fade_history{
    animation-delay: 0.6s;
}
section.on .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history {
    animation-delay: 0.9s;
}
section.on .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history{
    animation-delay: 0.9s;
}
section.on .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history{
    animation-delay: 1.2s;
}
section.on .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history{
    animation-delay: 1.2s;
}
section.on .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .v{
    animation-delay: 1.5s;
}
section.on .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history{
    animation-delay: 1.5s;
}
section.on .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history{
    animation-delay: 1.8s;
}
section.on .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history{
    animation-delay: 1.8s;
}
section.on .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history{
    animation-delay: 2.1s;
}
section.on .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history + .fade_history {
    animation-delay: 2.1s;
} 

@-webkit-keyframes fadeInUp {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, 30px, 0);
		transform: translate3d(0, 30px, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}
@keyframes fadeInUp {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, 30px, 0);
		transform: translate3d(0, 30px, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}

@-webkit-keyframes fadeInUp_history {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, 30px, 0);
		transform: translate3d(0, 30px, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}
@keyframes fadeInUp_history {
	from {
		opacity: 0;
		-webkit-transform: translate3d(0, 30px, 0);
		transform: translate3d(0, 30px, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}


section.on .fade_in_left{
	animation-name: fadeInLeft;
	animation-duration: 1s;
	animation-timing-function: cubic-bezier(0.44,0.01,0.64,0.99);
	animation-fill-mode: forwards;
}
.fade_in_left + .fade_in_left {
    animation-delay: 0.3s;
}
.fade_in_left + .fade_in_left + .fade_in_left{
    animation-delay: 0.6s;
}
.fade_in_left + .fade_in_left + .fade_in_left + .fade_in_left{
    animation-delay: 0.9s;
}

section.on .fade_in_right{
	animation-name: fadeInRight;
	animation-duration: 1s;
	animation-timing-function: cubic-bezier(0.44,0.01,0.64,0.99);
	animation-fill-mode: forwards;
}	
.fade_in_right + .fade_in_right {
    animation-delay: 0.3s;
}
.fade_in_right + .fade_in_right + .fade_in_right{
    animation-delay: 0.6s;
}
.fade_in_right + .fade_in_right + .fade_in_right + .fade_in_right{
    animation-delay: 0.9s;
}

@-webkit-keyframes fadeInRight {
	from {
		opacity: 0;
		-webkit-transform: translate3d(50px, 0, 0);
		transform: translate3d(50px, 0, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}
@keyframes fadeInRight {
	from {
		opacity: 0;
		-webkit-transform: translate3d(50px, 0, 0);
		transform: translate3d(50px, 0, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}
@-webkit-keyframes fadeInLeft {
	from {
		opacity: 0;
		-webkit-transform: translate3d(-50px, 0, 0);
		transform: translate3d(-50px, 0, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}
@keyframes fadeInLeft {
	from {
		opacity: 0;
		-webkit-transform: translate3d(-50px, 0, 0);
		transform: translate3d(-50px, 0, 0);
	}
	to {
		opacity: 1;
		-webkit-transform: none;
		transform: none;
	}
}

