@charset "utf-8";
@import url(http://fonts.googleapis.com/css?family=Lato:100,300,400,700,900);
@import url( "/css/notosanskr.css" );
@font-face {
    font-family: 'droid_serifregular';
    src: url('/css/droid/DroidSerif-Regular-webfont.eot');
    src: url('/css/droid/DroidSerif-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/css/droid/DroidSerif-Regular-webfont.woff') format('woff'),
         url('/css/droid/DroidSerif-Regular-webfont.ttf') format('truetype'),
         url('/css/droid/DroidSerif-Regular-webfont.svg#droid_serifregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* Reset CSS
 * --------------------------------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,
form,fieldset,input,textarea,p,blockquote,th,td { padding: 0; margin: 0; _opacity: 0; _transition: 0.1s opacity; }
a { text-decoration:none; }
table { border-spacing: 0; }
fieldset,img { border: 0; }
address,caption,cite,code,dfn,em,strong,th,var { font-weight: normal; font-style: normal; }
strong{ font-weight: bold; }
ol,ul { list-style: none; margin:0; padding:0; }
caption,th { text-align: left; }
h1,h2,h3,h4,h5,h6 { font-weight: normal; font-size: 100%; margin:0; padding:0; color:#444; }
q:before,q:after { content:''; }
abbr,acronym { border: 0; }
::-moz-selection { color:#fff; background:#333; }
::selection { color:#fff; background:#333; }


/* Custom CSS
 * --------------------------------------- */
body { font-family: "Noto Sans KR", sans-serif; color: #333; background:#FFF; _color: rgba(0,0,0,0.5); }
html, body, form, #wrap { _height:100%; }  
body > #wrap { _height: 100%; _min-height:100%; } 
#wrap { position: relative; 	width:100%; height:100%;   }
#header  { position:fixed; top:0; width: 100%; height: 38px; z-index: 75; }
#header H1 { position:absolute; left:2%; top:5px; z-index: 71; }
	.hgroup { position:absolute; font-family: "Lato", sans-serif; font-size:0.8em; right:80px; top:-2px; z-index: 9999; }
	.hgroup li { display:inline-block; _color:#9d9d9d; font-size:12px; }
	.hgroup li a { text-decoration:none; color:#777; }
	.hgroup a:hover { color: #39b54a; }
	.hgroup li a, .hgroup li.active a { padding: 9px 5px; display:block; }
	.hgroup li.active a { color: #333; }

#menu { position:absolute; font-family: "Lato", sans-serif; width:153px; height:455px; display:inline-block; left:0; top:50px; z-index: 75; font-weight:bold; background: url(/images/menu/mainBg.png) -9px 0  no-repeat; }
#menu li.active, #menu a:hover { color:#39b54a; }
#menu a:hover { color:#39b54a; }
#menu a { position:relative; height:53px;font-size:0.8em; color:#888; font-weight:bold; top: 50px }
.menu1 a { top:4%; }
.menu2 a { top:5%; }
.menu3 a { top:5%; }
.menu4 a { top:0 !important; }
.menu5 a { top:0 !important; }
.accordion .link a {font-size:14px !important}
#menu li.active a { color: #39b54a; }
#menu .menu1 { position:relative; _top:50px; height:73px; background: url(/images/menu/menu01.png) 0px 0  no-repeat; line-height:3em}
#menu .menu2 { position:relative; _top:50px; height:70px; background: url(/images/menu/menu02.png) 0px 0  no-repeat; line-height:4em }
#menu .menu3 { position:relative; _top:50px; height:87px; background: url(/images/menu/menu03.png) 0px 0  no-repeat; line-height:5em }
#menu .menu4 { position:relative; top:36px; height:78px; background: url(/images/menu/menu04.png) 0px 0  no-repeat;  line-height:4em}
#menu .menu5 { position:relative; top:30px; height:76px; background: url(/images/menu/menu05.png) 0px 0  no-repeat;  line-height:5em}

 

/** =======================
 * Contenedor Principal
 ===========================*/
.accordion {
  width: 100%;
  max-width: 360px;
}

.accordion .link {
  cursor: pointer;
  display: block;
  padding: 0 0 0 35px;
  color: #888;
  font-size: 14px;
  font-weight: 700;
  position: relative;
  -webkit-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}

.accordion li:last-child .link { border-bottom: 0; }

.accordion li i {
  position: absolute;
  top: 50px;
  left: 20px;
  -webkit-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}

.accordion li i.fa-chevron-down {
  right: 12px;
  left: auto;
  font-size: 16px;
}

.accordion li.open .link { color: #39b54a; }
.accordion li.open i { color: #39b54a; }
.accordion li.open i.fa-chevron-down {
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}

/**
 * Submenu
 -----------------------------*/
.submenu { display: none; font-size: 15px; _background: #444359; margin-top:0px; }
.submenu li { _border-bottom: 1px solid #4b4a5e; }
.submenu a { display: block; text-decoration: none; color: #d9d9d9; padding:5px; -webkit-transition: all 0.25s ease; -o-transition: all 0.25s ease; transition: all 0.25s ease;     padding-left: 15px;}



#fullpage {
	position: relative;
	margin:auto 0;
	background-color:#FFF;
}


#mcontainer {
	position:relative;
	max-width:100%;
	height:100%;
	vertical-align: middle;
	_display:inline-block;
	margin: 2em;
	_padding: 2em;
	background:#F1F1F1;
	border:1px solid #F1F1F1;
}
#mcontainer .box H3 {
	text-align:center;
	margin-top: 5%;
	font-size: 2.4em;
	font-weight: 700;
	letter-spacing: -2px;
}
#mcontainer .box p {
	text-align:center
}
.content_inner {
	position:relative;
	width: 100%;
}
.backtitle {
	position:fixed;
	float:left;
	width:47%;
}
.backtitle .titleArea {
	margin: 20% 10% 0;
	border-top: solid 1px #ccc;
}
#demo-1 {
	position: relative; /* can either be relative, absolute or fixed. If position is not set (i.e. static), it would be set to "relative" by script */
	overflow: hidden; /* to bound the empty top space created by inner element's top margin */
	width: 100%;
	min-height: 900px;
	background-color: #999;
}
.demo-inner-content {
	position: relative; /* if position is not set, the script will set it to 'relative'. */
	z-index: 2; /* if z-index is not set, the script will set it to '2'. */
	margin: 180px auto;
	padding: 40px;
	max-width: 600px;
	color: #fff;
	text-align: center;
	font-size: 1.5em;
}
.demo-inner-content h1 {
	font-size: 2.5em;
	margin: 0;
}
/* 등록 양식 */
img, fieldset, button, input { border:0; vertical-align: middle; }
.subcontent {
	position:relative;
	float:right;
	width:50%;
}
.subcontent .wrt_board {
	width:90%;
	margin: 20% auto 0;
	border-top: solid 1px #ccc;
}
.subcontent  table {
	width:100%; 
	margin-top: 30px;
	border-collapse:collapse;
	border-spacing:0; 
	table-layout:fixed;
}
.wrt_board { width:59%; }
.wrt_board + .set_btn_center { margin-top:45px; }
.wrt_board th { font-size:0.85em; padding:0 10px 0 10px; color:#666;  }
.wrt_board td {overflow:hidden; padding:5px 0; }
.wrt_board td .full { width:99.99%; }
.wrt_board td .svp70 { width:69%; float:right;  }
.wrt_board td .svp30 { width:30%;float:left; }
.wrt_board td .half {float:left; width:50%;}
.wrt_board td .half2 {float:left; width:40%;}
.wrt_board td .half.right {float:right; width:49%;}
.wrt_board td > label {display:inline-block;}
.wrt_board td .textbox { 
	display:block; 
	font-size:0.8em;
	background:#FFF; 
	border-radius:6px;
	-webkit-border-radius:6px;
	-moz-border-radius:6px;  
	box-sizing:border-box;
	-o-box-sizing:border-box;
	-ms-box-sizing:border-box;
	-mos-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}
.wrt_board td textarea.textbox, .wrt_board td select.textbox{ border:0 }
.wrt_board td input.textbox, .wrt_board td select.textbox{text-indent:20px; height:35px; line-height:37px;}
.wrt_board td textarea.textbox{ height:100px; padding:10px 10px 10px 20px; overflow-y:auto; background: #fff;}
.wrt_board td .frm_checkbox{display:inline-block;}
.wrt_board td .frm_checkbox + .frm_checkbox{margin-left:60px;}
.wrt_board td .frm_checkbox input:not(.ie){display:none;}
.wrt_board td .frm_checkbox input:not(.ie) + label{display:inline-block; padding-left:23px; line-height:14px; font-size:1.167em; color:#afb6cb; background:url(../../images/bg/bg_radio.gif) left 1px no-repeat;}

.wrt_board td .frm_file{position:relative; display:inline-block; width:99.9%;}
.wrt_board td .frm_file .textbox{display:block; height:40px; text-indent:40px; padding-right:120px; line-height:42px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; box-sizing:border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;-mos-box-sizing:border-box;-webkit-box-sizing:border-box;}
.wrt_board td .frm_file img{position:absolute; top:0; right:0; display:block; cursor:pointer;}
.set_btn_center { margin-top: 45px; text-align: center; }






.kc_fab_overlay {
  z-index: 9999;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  background-color: rgba(255,255,255,0.6); /*dim the background*/
}
.kc_fab_wrapper{
  z-index: 9999;
  width:100%;
  height:240px;
  position:fixed;
  right:0px;
  bottom:0px;
  pointer-events:none;
}
.sub_fab_btns_wrapper { /*서브버튼 위치*/
  right:1.55em;
  bottom:90px;
  position:absolute;
  display:none;
  opacity: 0;
  -webkit-transition: opacity 0.3s ease-in;
       -moz-transition: opacity 0.3s ease-in;
        -ms-transition: opacity 0.3s ease-in;
         -o-transition: opacity 0.3s ease-in;
            transition: opacity 0.3s ease-in;
  pointer-events:all;
}
.sub_fab_btns_wrapper button[data-link-title]:hover:after{
  content: attr(data-link-title);
  opacity: 1;
  transition: all 0.5s;
  background: rgba(0, 0, 0, 0.4);
  padding: 4px 10px;
  border-radius: 3px;
  color: rgba(255, 255, 255, 0.8);
  font-size: 13px;
  pointer-events: none;
  position: absolute;
  right: 110%;
  min-width: 150px;
}
.sub_fab_btns_wrapper.show{
  display:block;
  opacity: 1;
}
.sub_fab_btns_wrapper button {
  width:40px;
  height:40px;
  border-radius:100%;
  background:#F44336;
  margin-bottom:12px;
  margin-right:26px;
  padding:0;
  border:none;
  outline:none;
  color:#FFF;
  font-size: 19px;
  box-shadow: 0 3px 3px rgba(0,0,0,0.16), 0 3px 3px rgba(0,0,0,0.23);
  transition:.3s;  
  pointer-events:all;
}
button.kc_fab_main_btn {

  background-color:#39b54a;
  width:40px;
  height:40px;
  border-radius:100%;
  background:#03A9F4;
  right:1.4em;
  bottom:1.4em;
  position:absolute;
  margin-right:0;
  margin-bottom:0;
  padding:0;
  border:none;
  outline:none;
  color:#FFF;
  font-size:36px;
  box-shadow: 0 2px 2px rgba(0,0,0,0.16), 0 3px 3px rgba(0,0,0,0.23);
  transition:.3s;  
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  pointer-events:all;
}
.kc_fab_main_btn span{
  transition:.5s;  
}
.kc_fab_main_btn:focus {
  transform:scale(1.1);
  transform:rotate(45deg);
  -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

.ink {
  display: block;
  position: absolute;
  background:rgba(255, 255, 255, 0.3);
  border-radius: 100%;
  -webkit-transform:scale(0);
     -moz-transform:scale(0);
       -o-transform:scale(0);
          transform:scale(0);
  pointer-events:all;
}

.animate {
  -webkit-animation:ripple 0.65s linear;
   -moz-animation:ripple 0.65s linear;
    -ms-animation:ripple 0.65s linear;
     -o-animation:ripple 0.65s linear;
        animation:ripple 0.65s linear;
}

@-webkit-keyframes ripple {
    100% {opacity: 0; -webkit-transform: scale(2.5);}
}
@-moz-keyframes ripple {
    100% {opacity: 0; -moz-transform: scale(2.5);}
}
@-o-keyframes ripple {
    100% {opacity: 0; -o-transform: scale(2.5);}
}
@keyframes ripple {
    100% {opacity: 0; transform: scale(2.5);}
}








.container41 h3 {
	font-size: 4em;
	color:#040404;
	font-weight: 900;
}
.container41 h4 {
	font-size: 3em;
	color:#040404;
	letter-spacing:-2px;
	font-weight: 300;
}
.container41 .subtext {
	font-size: 2em;
	color:#040404;
	font-weight: 300;
}
.container41 P {
	font-size: 1em;
	color:#4a4a4a;
	font-weight: 300;
}



.subVisual {
	position:relative;
	max-width:100%;
	_height:900px;
	z-index:70;
	_background:#ddd;
	overflow: hidden;
	background: url(/images/sub/sub1_1bg.png) no-repeat center center;
}
.svBox {
	position:relative;
	width:1000px;
	margin:0 auto;
}





/* AnimatedHeader */
.cb-header {
	position: fixed;
	left: 0;
	visibility: hidden;
}
.header1 {
	margin-top:2.2em;
	height:3em;
	text-align: center;
	width: 100%;
	color: #fff;
}
.header1 .fixmenu {
	position:relative;
	margin:0 2.05em;
	height:3.3em;
	z-index:999;
	background-color: #39b54a;
}
.header1 .fixmenu H2 {
	float:left;
	color:#FFF;
	padding-left:20px;
	line-height:3em;
	font-size:1.2em;
	font-weight:100;
	_letter-spacing:-1px;
}
.header1 .fixright {
	float:right;
	margin-right:3em;
	_width:825px;
}
#smenu2 {
	position:relative;	
	width:100%;
}
#smenu2 LI { display:inline-block; padding: 0 15px;}
#smenu2 LI a {
	line-height:48px;	
	font-size:13px;
	font-weight:300;
	text-align:center;
}
#smenu2 a { color: #FFF; }
#smenu2 li a:hover, #smenu li.actived a, #smenu li a.on {
	color:#fff;
	background-color:#39b54a;
	_border:1px solid #191919;
	z-index:100;
}
.header2 .subTitle {
	position:relative;
	margin:70px auto 0;
	text-align:center;
}
.header2 {
	position:relative;
	_height: 380px;
	text-align: center;
	width: 100%;
	color: #fff;
}
.header2 .subTitle H2 {
	color:#39b54a;
	font-size:2.4em;
	font-weight:100;
	letter-spacing:-1px;
}
.header2 .subTitle p {
	color:#FFF;
	font-size:1em;
	font-weight:100;
	margin-bottom:50px;
}

#smenu {
	position:relative;	
	width:100%;
}
#smenu LI { display:inline; }
#smenu LI a {
	float:left;
	width:14.13%;
	height:46px;
	line-height:45px;	
	font-size:13px;
	font-weight:300;
	text-align:center;
	border:#e6e6e6 1px solid;
	margin-left:-1px;
	background-color:#fff;
}
#smenu a { color: #888; }
#smenu li a:hover, #smenu li.actived a, #smenu li a.on {
	color:#fff;
	background-color:#39b54a;
	_border:1px solid #191919;
	z-index:100;
}



#section0 .mainVisual1 img {
	max-width: 100%;
}
.content-wrapper {
	width:100%;
	margin:0 auto;
	text-align:center;
}
.content-wrapper H4 {
	font-size: 3.8em;
	color: #39b54a;
	font-weight: 700;
	letter-spacing:-1px;	
	_text-shadow: 0px 1px 1px rgba(0,0,0,0.3);
}

/* 토글메뉴 */
.overlay { font-family: "Noto Sans KR", sans-serif; position: fixed; width: 100%; height: 100%; top: 0; left: 0; _background: rgba(250,250,250,0.98); _background: rgba(57,181,74,0.9); background: rgba(70,81,97,0.993); z-index:999999;}
.toggle { position: absolute; right:1.7em; top:5px; z-index:999; background:#FFF; }
.toggle button { border: none; outline: none; display: inline-block; color:#FFF; font-weight: 400; cursor:pointer; background:#FFF; }


/* Overlay closing cross */
.overlay .overlay-close {
	width: 40px;
	height: 40px;
	position: absolute;
	right: 50px;
	top: 50px;
	overflow: hidden;
	border: none;
	background: url(/images/menu/cross.png) no-repeat center center;
	text-indent: 200%;
	color: transparent;
	outline: none;
	z-index: 100;
	cursor:pointer;
}
/* Menu style */
.overlay .bdBox { height:93%; margin:2em; border:1px solid #cbaf88; box-sizing:border-box; }
.overlay .bdBox .copy { left:43%; position: absolute; bottom:10%; font-size:12px; font-style: italic; font-family: "droid_serifregular"; color:#5a6779; }
.overlay .bdBox .logo { left:48%; position: absolute; top:25%; }
.overlay nav {
	position: relative;
	top: 35%;
	height: 10%;
	text-align: center;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}
.overlay ul {
	list-style: none;
	padding: 0;
	margin: 0 auto;
	display: inline-block;
	height: 100%;
	position: relative;
}
.overlay .main_nav li {
	float:left;
	display: block;
	height: 50px;
	padding:20px 20px;
	line-height: 50px;
	_height: calc(100% / 6);
}
.overlay .main_nav li a {
	font-family: "droid_serifregular";
	font-style: italic;
	font-size: 18px;
	display: block;
	color: #cbaf88;
	-webkit-transition: color 0.2s;
	transition: color 0.2s;
}
.overlay ul li a:hover,
.overlay ul li a:focus {
	color: rgb(250, 250, 250);
}
.overlay .sub_nav {
	position: relative;
	text-align: center;
	display: block;
	top: 45%;
	height: 30%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}
.overlay .sub_nav li {
	float:left;
	width:100px;
	padding:0 0 0 5px;
}
.overlay .sub_nav a {
	text-align:left;
	display: block;
	padding:3px;
	font-size: 13px;
	font-weight:300;
	color: #a1a3a9;
	-webkit-transition: color 0.2s;
	transition: color 0.2s;
}
_section {
	position: absolute;
	right:1px;
	top: 6px;
	z-index:999;
	overflow:hidden;
}
/* Effects*/
.overlay-slidedown {
	visibility: hidden;
	-webkit-transform: translateY(-100%);
	transform: translateY(-100%);
	-webkit-transition: -webkit-transform 0.4s ease-in-out, visibility 0s 0.4s;
	transition: transform 0.4s ease-in-out, visibility 0s 0.4s;
}
.overlay-slidedown.open {
	visibility: visible;
	-webkit-transform: translateY(0%);
	transform: translateY(0%);
	-webkit-transition: -webkit-transform 0.4s ease-in-out;
	transition: transform 0.4s ease-in-out;
}
@media screen and (max-height: 30.5em) {
	.overlay nav {
		height: 70%;
		font-size: 34px;
	}
	.overlay ul li {
		min-height: 34px;
	}
}

#fullpage { padding:2em; }
#header  { background:#FFF; }
#section1, #section2, #section3, #section4 { position:relative;	}
.txtArea1 { 
	top:300px;
	left:0;
	position:relative;
	z-index:15;
}
.txtArea1 .txt1 {
	position:absolute;
	top:0;
	left:180px;
	font-size:4em;
	font-weight:900;
	color:#000;
	line-height:100%;
	letter-spacing:-3px;
	text-shadow:1px 1px 1px rgba(0,0,0,0.5) ;
}
.txtArea1 .txt2 {
	position:absolute;
	top:75px;
	left:110px;
	width:590px;
	font-size:4em;
	font-weight:900;
	color:#000;
	line-height:90%;
	letter-spacing:-4px;
	text-shadow:-1px -1px 0 rgba(0,0,0,0.5)  ;
} 
.txtArea1 .txt3 {
	position:absolute;
	width:485px;
	top:150px;
	left:200px;
	font-size:1.4em;
	font-weight:900;
	color:#000;
	line-height:100%;
	letter-spacing:-1.2px;
}
.txtArea1 .txt4 {
	position:absolute;
	width:480px;
	top:180px;
	left:180px;
	text-align:right;
	font-weight:300;
	font-size:0.7em;
	color:#000;
	line-height:150%;
}
.contact_navi {
	position:absolute;
	top:70px;
	width:1200px;
	_height:100%;
}
.contact_navi .section-1 {
	position:absolute;
	top:100px;
	left:200px;
	cursor:pointer;
}
.contact_navi .section-2 {
	position:absolute;
	top:50px;
	left:370px;
	cursor:pointer;
}
.contact_navi .section-3 {
	position:absolute;
	top:110px;
	left:570px;
	cursor:pointer;
}
.contact_navi .section-4 {
	position:absolute;
	top:180px;
	left:840px;
	cursor:pointer;
}
.main0_pf { 
	position:absolute;
	bottom:190px;
	left:50%;
	margin-left:-320px;
}

.main0_pf h6 a { 
	font-size:13px;
	padding-left:5px;
	font-weight:bold;
	color:#333;
}
.main0_pf h6 .btn_more { 
	position:absolute;
	right:0;
	top:5px;
	font-size:11px;
	font-weight:normal;
	padding-left:5px;
	color:#39b54a;
}
#subBtn1 {
	position:absolute;
	display: block;
	text-align: center;
	width: 100%;
	bottom: 15%;
	z-index: 70;
}
#subBtn4 {
	position:fixed;
	display: block;
	text-align: center;
	width: 100%;
	top: 2.4em;
	z-index: 70;
}
#subBtn1 LI {
	width:90px;
	height:90px;
	font-size:13px;
	line-height:90px;
	text-align:center;
	border-radius:50%;
	display:inline-block;
	background: rgba(221,221, 221, 0.8);
	border:1px solid #e0e0e0;
}
#subBtn4 LI {
	cursor: pointer;
	float: left;
	width: 19.6%;
	height: 49px;
	font-size:13px;
	line-height:49px;
	background: rgba(250, 250, 250, 0.8);
	display:inline-block;	
	border:1px solid #e0e0e0;
	border-left: none;
}
#subBtn1 LI:first-child, #subBtn4 LI:first-child { border-left:1px solid #e0e0e0; }
#subBtn1 a, #subBtn4 a { 	color:#000; }

/* 포폴리스트 */
.secWarp2 { position:relative; margin:0 auto; width:1240px; overflow:hidden; display:block;}
.da-thumbs li { float: left; width:25%; margin:10px 0; _background: #f5f5f5; padding: 0px; position: relative; _box-shadow: 0 1px 3px rgba(0,0,0,0.1); _border:1px solid #000; box-sizing:border-box;}
.secWarp2 li img { height:200px; width:300px }
#section2 .secWarp2 LI { _padding:10px; _border:1px solid #000; }
.pf-btn { 	position:absolute; width:1240px; height:70%;left:50%; margin-left:-620px; }
.pf-btn .left-btn { position: absolute; top:45%; left:-30px; }
.pf-btn .right-btn { position: absolute; top:45%; right:-30px;}





/* 포폴리스트 */
.da-thumbs li a, .da-thumbs li a img { display: block; position: relative; }
.da-thumbs li a { overflow: hidden; }
.da-thumbs li a div {
	position: absolute;
	background: #333;
	background: rgba(57,181,74,0.97);
	width: 97%;
	height: 100%;border:5px solid #000;box-sizing:border-box;

}
.da-thumbs li a div span {
	display: block;
	text-align:center;
	margin:20px 0 10px;
	padding:5px 20px;
	text-transform: uppercase;
	font-weight: normal;
	color: rgba(255,255,255,0.9);
	text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
	_border-bottom: 1px solid rgba(255,255,255,0.5);
	box-shadow: 0 1px 0 rgba(0,0,0,0.1), 0 -5px 0 rgba(255,255,255,0.3);
}
.da-thumbs li .btnGroup {
	font-size: 0.825em;
	color:#d4f4d9;
	_text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
	margin: 15px 20px 0px 20px;
}
.da-thumbs li .link {
	font-size: 0.725em;
	color:#064b0f;
	_text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
	margin: 10px 20px 0px 20px;
}

/*   seccond   */
#section2 {
	position:relative;	
	background: url(/images/secWarp2_bg.png) no-repeat;
}


#section2 .swrp2 {
	position:relative;
	float: left;
	margin:10px 0;
	width:50%;
	height:200px;
}
#section2 .txtArea2 {
	position:relative;
	z-index:15;
	margin-right:40px;;
}
.txtArea2 .txt1 {
	position:absolute;
	top:0;
	right:0;
	font-size:5em;
	font-weight:900;
	color:#000;
	line-height:90%;
	letter-spacing:-4px;
	text-shadow:-1px -1px 0 rgba(0,0,0,0.5)  ;
}
.txtArea2 .txt2 {
	position:absolute;
	top:70px;
	right:0;
	font-size:5em;
	font-weight:900;
	color:#000;
	line-height:90%;
	letter-spacing:-4px;
	text-shadow:-1px -1px 0 rgba(0,0,0,0.5)  ;
} 
.txtArea2 .txt3 {
	position:absolute;
	top:145px;
	right:0;
	text-align:right;
	font-weight:300;
	font-size:0.9em;
	color:#000;
	line-height:150%;
}
*[class^="revealator"] {
	_color:#fff;
	_background-color: #2C3E50;
}

/*서브*/
#subContents {
	position:relative;
	width:100%;
	height:100%;
	text-align:center;
	z-index:0;
}
#subContents h3 {
	font-size:2.4em;
	font-weight:700;
	letter-spacing:-1px;
}
.tabmenu {
	width: 100%;
	max-width: 1000px;
	margin: 30px auto 0;
}
.tabmenu ul.tabs, .tabmenu ul.tabs24 {
	height: 30px;
	list-style: none;	
	background: #666;
}
.tabmenu ul.tabs li, .tabmenu ul.tabs24 li  {
	position: relative;
	float: left;
	overflow: hidden;
	height: 30px;
	line-height: 30px;
	text-align: center;
}
.tabmenu ul.tabs li a, .tabmenu ul.tabs24 li a {
	display: block;
	color: #FFF;
	font-size: 1em;
	border-right: 1px solid #fff;
	outline: none;
}
.tabmenu  ul.tabs li.active, ul.tabs li.active a:hover  {
	background: #fd7d0c;
	color: #FFF;
}
.tabmenu  ul.tabs24 li.active, ul.tabs24 li.active a:hover  {
	background: #fd7d0c;
	color: #FFF;
}
.tabwidth50 { width: 50%; }
.tabwidth20 { width: 20%; }

.tabmenu .tab_container, .tabmenu .tab_content24 {
	clear: both;
	float: left; 
	width: 100%;
	height:500px;
}































/*   secondPage   */
#section1 .projects  a {
	font-weight:900;
	font-size:75px;
	letter-spacing:-4px;
	font-family: "Noto Sans KR", sans-serif !important;
}

.secWarp3 {
	position:relative;
	width:1240px; 
	margin:0 auto;
	overflow:hidden;
}
.secWarp3 img {
	max-width:100%;
}
.secWarp3 .s3_1 {
	position:relative;
	float:left;
	margin-left:335px;
}
.secWarp3 .s3_2 {
	position:relative;	
	float:left;
	left:-28px;
	top:175px;
}
.secWarp3 .s3_3 {
	position:relative;	
	float:left;
	left:-20px;
	top:300px;
}
.secWarp3 .s3_4 {
	position:relative;	
	float:left;
	left:0px;
	top:150px;
}
.secWarp3 .s3_5 {
	position:relative;	
	float:left;
	top:320px;
}
.txtArea3 {
	position:relative;	
}
.txtArea3 .txt1 {
	position:absolute;
	width:200px;
	top:120px;
	left:160px;
	font-size:2em;
	font-weight:900;
	color:#39b54a;
	line-height:100%;
	letter-spacing:-1px;
}
.txtArea3 .txt2 {
	position:absolute;
	width:360px;
	top:145px;
	left:0;
	font-size:90px;
	text-align:right;
	color:#000;
	line-height:90%;
	font-weight: 100;
	letter-spacing:-4px;
}
.txtArea3 .txt4 {
	position:absolute;
	width:360px;
	top:225px;
	left:0;
	font-size:90px;
	text-align:right;
	color:#000;
	line-height:90%;
	font-weight: 100;
	letter-spacing:-4px;
}
.txtArea3 .txt3 {
	position:absolute;
	width:380px;
	top:320px;
	left:0px;
	text-align:right;
	font-weight:300;
	font-size:0.9em;
	color:#000;
	line-height:130%;
}






/*   4thpage   */
#section3 {
	_font-family: "Lato", sans-serif;
	background: url(/images/secWarp4_bg.png) no-repeat;
}
#section4 {
	_font-family: "Lato", sans-serif;
	background: url(/images/renew/main_bg.jpg) center top no-repeat ;
}
.secWarp4 {
	width:1000px; 
	margin:0 auto;
	font-size:0.8em;
	text-align: center;
}
.secWarp4 H2 {
	font-weight:700;
}
.btnArea LI {
	width:120px;
	height:40px;
	line-height:40px;
	color:#FFF;
	font-size: 1em;
	display:inline-block;
	background: url(/images/bkbtnBg.png) no-repeat;
}
.btnArea a {
	color:#FFF;
}
.btnArea a:hover {
	color:#39b54a;
}
.snsArea {
	width:120px;
	margin:100px auto 0;
	padding:100px 0 0;
	border-top:1px solid #494951;
}
.snsArea .sns_type1 {
	width: 39px;
	height: 39px;
	display: inline-block;
	background-image: url("/images/icon_sns_type.png");
	vertical-align:top;
	text-align:left !important;
	cursor: pointer;
}
.snsArea .sns_type1.type1 { background-position:0 0 } /* 블로그 */
.snsArea .sns_type1.type2 { background-position:39px 0 } /* 카카오스토리 */
.snsArea .sns_type1.type1:hover { background-position:0 -39px }
.snsArea .sns_type1.type2:hover  { background-position:39px -39px }
.snsArea .sns_type1 EM {
	display:block; 
	text-indent:-3000em; 
	white-space:nowrap; 
	overflow:hidden
}
.latest_list {
	position:relative;	
	width:100%;
	height:230px;
	margin-top:40px;
	text-align:left;
}
.latest_list h5 {
	color:#FFF;
	padding-left:20px;
	height:30px;
	line-height:30px;
	font-size:14px;
	font-weight:700;
	_letter-spacing:-1px;
	border-bottom:1px solid #d0d0d0;
}
.latest_list .ll_noti h5 {
	background:#42659b;
}
.latest_list .ll_qna h5 {
	background:#508dc3;
}
.latest_list .ll_info h5 {
	background:#6ac1dc;
}
.latest_list .ll_noti {
	position:absolute;
	width:25%;
	height:170px;
	top:0;
	left:0;
	background:#FFF;
	border:1px solid #d0d0d0;
}
.latest_list .ll_qna {
	position:absolute;
	width:25%;
	height:170px;
	top:0;
	background:#FFF;
	left:25%;border:1px solid #d0d0d0;
}

.latest_list .ll_info {
	position:absolute;
	width:50%;
	height:170px;
	top:0;
	left:50%;
	background:#FFF;
	border:1px solid #d0d0d0;
}
.latest_list .ll_prj {
	position:absolute;
	width:24%;
	top:0;
	right:0;
}
.latest_list .ll_prj li {
	width:100%;
	height:25px;
	line-height:25px;
	margin-bottom:1px;
	background:#666;
}
.ll_info h6 {
	color:#39b54a;
	padding-left:15px;
	font-size:14px;
	font-weight:700;
	padding-top:10px;
	_letter-spacing:-1px;
}
/* 백업 css
.latest_list h5 {
	float:left;
	color:#FFF;
	width:100px;
	height:100px;
	font-size:14px;
	font-weight:700;
	line-height:100px;
	text-align:center;
	_letter-spacing:-1px;
}
.latest_list .ll_noti h5 {
	_background:#2f538b;
}
.latest_list .ll_qna h5 {
	_background:#473a99;
}
.latest_list .ll_noti {
	position:absolute;
	width:49%;
	height:100px;
	top:0;
	left:0;
	background:#F9F9F9;
	border:1px solid #42659b;
}
.latest_list .ll_qna {
	position:absolute;
	width:49%;
	height:100px;
	top:110px;
	background:#564aa0;
	left:0;border:1px solid #564aa0;
}

.latest_list .ll_info {
	position:absolute;
	width:24.5%;
	height:210px;
	top:0;
	left:50%;
	background:#a79684;
	border:1px solid #a79684;
}
.latest_list .ll_prj {
	position:absolute;
	width:24.4%;
	height:100px;
	top:0;
	right:0;
}
.latest_list .ll_prj li {
	width:100%;
	height:25px;
	line-height:25px;
	margin-bottom:1px;
	background:#666;
}
.ll_info h6 {
	color:#FFF;
	padding-left:15px;
	background:#836d56;
	height:25px;
	line-height:25px;
	font-size:14px;
	font-weight:700;
	_letter-spacing:-1px;
}
.latest_list .ll_site {
	position:absolute;
	width:24.4%;
	height:100px;
	top:110px;
	right:0;
	color:#FFF;
	background:#ef6c42;
}
----------------------------------------
.latest_list .ll_prj {
	position:absolute;
	width:49%;
	height:100px;
	top:0;
	left:50%;border:1px solid #ccc;
}
.latest_list .ll_site {
	position:absolute;
	width:49%;
	height:100px;
	top:110px;
	left:50%;border:1px solid #ccc;
}
*/



/*   연혁   */
#timeline {
		width: 1000px;
		height: 350px;
		overflow: hidden;
		margin: 100px auto;
		position: relative;
		background: url('/images/sub/dot.gif') left 45px repeat-x;
	}
		#dates {
			font-family: "Lato", sans-serif;
			width: 1000px;
			height: 80px;
			overflow: hidden;
		}
			#dates li {
				list-style: none;
				float: left;
				width: 100px;
				height: 50px;
				font-size: 24px;
				text-align: center;
				background: url('/images/sub/biggerdot.png') center bottom no-repeat;
			}
				#dates a {
					line-height: 38px;
					padding-bottom: 10px;
				}
				#dates .selected {
			        font-size: 38px;
				}
		
		#issues {
			width: 1000px;
			height: 350px;
			overflow: hidden;
		}	
			#issues li {
				width: 1000px;
				height: 350px;
				list-style: none;
				float: left;
			}
				#issues li.selected img {
					-webkit-transform: scale(1.1,1.1);
					-moz-transform: scale(1.1,1.1);
				    -o-transform: scale(1.1,1.1);
				    -ms-transform: scale(1.1,1.1);
				    transform: scale(1.1,1.1);
				}
				#issues li img {
					float: left;
					margin: 10px 30px 10px 50px;
					background: transparent;
					-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; /* IE 8 */   
					filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);/* IE 6 & 7 */      
					zoom: 1;
					-webkit-transition: all 2s ease-in-out;
					-moz-transition: all 2s ease-in-out;
					-o-transition: all 2s ease-in-out;
					-ms-transition: all 2s ease-in-out; 
					transition: all 2s ease-in-out;
					-webkit-transform: scale(0.7,0.7);
					-moz-transform: scale(0.7,0.7);
				    -o-transform: scale(0.7,0.7);
				    -ms-transform: scale(0.7,0.7);
				    transform: scale(0.7,0.7);
				}
				#issues li h1 {
					font-family: "Lato", sans-serif;
					color: #39b54a;
					font-size: 48px;
					margin: 20px 0;
					_text-shadow: #000 1px 1px 2px;
				}
				#issues li p {
					font-size: 14px;
					margin-right: 70px;
					font-weight: normal;
					line-height: 22px;
					_text-shadow: #000 1px 1px 2px;
				}
		
		#grad_left,
		#grad_right {
			width: 100px;
			height: 350px;
			position: absolute;
			top: 0;
		}
			#grad_left {
		        left: 0;
		        background: url('../images/grad_left.png') repeat-y;
			}
			#grad_right {
		        right: 0;
		        background: url('../images/grad_right.png') repeat-y;
			}
		
		#next,
		#prev {
			position: absolute;
			top: 0;
			font-size: 70px;
			top: 170px;
			width: 22px;
			height: 38px;
			background-position: 0 0;
			background-repeat: no-repeat;
			text-indent: -9999px;
			overflow: hidden;
		}
			#next:hover,
			#prev:hover {
				background-position: 0 -76px;
			}
			#next {
				right: 0;
				background-image: url('/images/sub/next.png');
			}
			#prev {
				left: 0;
				background-image: url('/images/sub/prev.png');
			}
				#next.disabled,
				#prev.disabled {
					opacity: 0.2;
				}


.map {
	height:500px;
	overflow: hidden;
-webkit-filter: grayscale(100%);
 filter: gray;
}
.mapinfo {
	position: absolute;
	background:#333;
	width:20%;
}


/* 페이징 */
.group_bottom {
	position:relative
}
.paginate {
	padding:18px 0;
	text-align:center
}
.paginate a,.paginate strong { 
	display:inline-block;
	position:relative;
	padding:4px 8px 4px 7px;
	_border:1px solid #fff;
	color:#000;
	font:bold 13px/normal Verdana;
	text-decoration:none
}
.paginate strong { 
	color:#f23219 !important;
}
.paginate .pre { 
	margin-right:4px;
	padding:6px 6px 5px 16px;
	*padding-bottom:6px;
	background:url(/images/main/sprite_paginate.png) no-repeat 5px 10px!important;
}
.paginate .next {
	margin-left:0;
	padding:6px 16px 5px 6px;
	*padding-bottom:6px;
	background:url(/images/main/sprite_paginate.png) no-repeat 100% 10px!important
}
.paginate .pre_end { 
	margin-right:-4px;
	padding:6px 6px 5px 16px;
	*padding-bottom:6px;
	background:url(/images/main/sprite_paginate.png) no-repeat 2px -52px!important;
}
.paginate .next_end { 
	margin-left:-4px;
	padding:6px 16px 5px 6px;
	*padding-bottom:6px;
	background:url(/images/main/sprite_paginate.png) no-repeat 100% -52px!important;
}
.paginate .pre,.paginate .next,.paginate .pre_end,.paginate .next_end { 
	position:relative;
	*top:2px;
	color:#ccc;
	font-size:12px;
	font-weight:normal;
}
.paginate .pre:hover { 
	_border:1px solid #b3b3b3;
	background:url(/images/main/sprite_paginate.png) no-repeat 5px -20px!important;
}
.paginate .next:hover { 
	_border:1px solid #b3b3b3;
	background:url(/images/main/sprite_paginate.png) no-repeat 100% -20px!important;
}
.paginate .pre_end:hover { 
	_border:1px solid #b3b3b3;
	background:url(/images/main/sprite_paginate.png) no-repeat 2px -82px!important;
}
.paginate .next_end:hover { 
	_border:1px solid #b3b3b3;
	background:url(/images/article/sprite_paginate.png) no-repeat 100% -82px!important;
}
.paginate a.pre,.paginate a.next,.paginate a.pre_end,.paginate a.next_end {
	color:#565656;
}
.paginate a:hover,.paginate strong {
	_border:1px solid #b3b3b3;
	_background-color:#fff;
	color:#f23219;
	text-decoration:none;
}














/*   버튼   */
.bk-btn {
	text-align: center;
	width: 80px ;
	padding: 5px;
	font-size: 11px;	
	color: #FFF;
	background: #393939;
	border:1px solid #000;
}
.blue-btn {
	text-align: center;
	padding: 12px 15px;
	font-size: 0.875rem;
	color: #FFF;
	background: #00a5ce;
	border-radius: 5px;
}
.black-btn {
	text-align: center;
	width: 100px ;
	padding: 6px;
	font-size: 11px;	
	color: #FFF;
	background: #333;
	border:1px solid #000;
}
.white-btn {
	text-align: center;
	width: 88px ;
	padding: 6px;
	font-size: 11px;	
	color: #555;
	background: #fbfbfb;
	border:1px solid #d4d4d4;
	border-right:1px solid #bababa;
	border-bottom:1px solid #bababa;
	border-radius: 3px;
}
.flr { float:right }
.fll { float:left }
.tac { text-align:center !important; }
.pdt05 { padding-top:5px; }
.pdt10 { padding-top:10px; }
.pdt15 { padding-top:15px; }
.pdt20 { padding-top:20px; }
.pdt25 { padding-top:25px; }
.pdt30 { padding-top:30px; }
.pdt35 { padding-top:35px; }
.pdt40 { padding-top:40px; }
.pdt45 { padding-top:45px; }
.pdt50 { padding-top:50px; }
.pdt70 { padding-top:70px; }
.pdt100 { padding-top:100px; }
.pdt200 { padding-top:200px; }

.pdb05 { padding-bottom:5px; }
.pdb10 { padding-bottom:10px; }
.pdb15 { padding-bottom:15px; }
.pdb20 { padding-bottom:20px; }
.pdb25 { padding-bottom:25px; }
.pdb30 { padding-bottom:30px; }
.pdb35 { padding-bottom:35px; }
.pdb40 { padding-bottom:40px; }
.pdb45 { padding-bottom:45px; }
.pdb50 { padding-bottom:50px; }
.pdb70 { padding-bottom:70px; }
.pdb100 { padding-bottom:100px; }
.pdb200 { padding-bottom:200px; }


.pdl05 { padding-left:5px; }
.pdl10 { padding-left:10px; }
.pdl15 { padding-left:15px; }
.pdl20 { padding-left:20px; }
.pdl25 { padding-left:25px; }
.pdl30 { padding-left:30px; }
.pdl35 { padding-left:35px; }
.pdl40 { padding-left:40px; }
.pdl45 { padding-left:45px; }
.pdl50 { padding-left:50px; }

.mrl05 { margin-left:5px; }
.mrl10 { margin-left:10px; }
.mrl15 { margin-left:15px; }
.mrl20 { margin-left:20px; }
.mrl25 { margin-left:25px; }
.mrl30 { margin-left:30px; }
.mrl35 { margin-left:35px; }
.mrl40 { margin-left:40px; }
.mrl45 { margin-left:45px; }
.mrl50 { margin-left:50px; }

.mrt05 { margin-top:5px; }
.mrt10 { margin-top:10px; }
.mrt15 { margin-top:15px; }
.mrt20 { margin-top:20px; }
.mrt25 { margin-top:25px; }
.mrt30 { margin-top:30px; }
.mrt35 { margin-top:35px; }
.mrt40 { margin-top:40px; }
.mrt45 { margin-top:45px; }
.mrt50 { margin-top:50px; }

.mrb05 { margin-bottom:5px; }
.mrb10 { margin-bottom:10px; }
.mrb15 { margin-bottom:15px; }
.mrb20 { margin-bottom:20px; }
.mrb25 { margin-bottom:25px; }
.mrb30 { margin-bottom:30px; }
.mrb35 { margin-bottom:35px; }
.mrb40 { margin-bottom:40px; }
.mrb45 { margin-bottom:45px; }
.mrb50 { margin-bottom:50px; }

.wp70 { width:69%;   }
.wp30 { width:30%; }
#footer {
	position:fixed;
	font-family: "Lato", sans-serif;
	font-size:0.7em;
	color:#9e9e9e;
	width: 100%;
	bottom:0px;
	height: 50px;
	background:#FFF;
	z-index: 75;
}
#footer .flr>img {
  width: 130px;
  margin-right: 20px;
}





/* 1240 이상 PC*/
@media all and (min-width:1240px) {
/*   First   */
#section0 .mainVisual1 { position:relative; width:1240px; margin:.0 auto; }
#footer .credits { margin:0 2%; line-height: 38px; }
}

/* 960~1240 이상 PC*/
@media all and (min-width:961px) and (max-width:1240px) {
/*   First   */
#section0 .mainVisual1, #section1 .secWarp3 { position:relative; width:100%; margin:.0 auto; }
#footer .credits { margin:0 2%; line-height: 38px; }
.main0_pf { display:none; }
.secWarp3 .s3_2, .secWarp3 .s3_3, .secWarp3 .s3_4, .secWarp3 .s3_5, .ll_info { display:none; }
}

/* 768 이상 PC*/
@media all and (min-width:769px) and ( max-width:960px)   {
/*   First   */
#section0 .mainVisual1, #section1 .secWarp3, .secWarp4 { position:relative; width:100%; margin:.0 auto; }
#footer .credits { margin:0 2%; line-height: 38px; }
.contact_navi, .main0_pf, .subBtn1 { display:none; }
.secWarp3 .s3_2, .secWarp3 .s3_3, .secWarp3 .s3_4, .secWarp3 .s3_5, .ll_info { display:none; }

/* 포폴리스트 */
.secWarp2 { position:relative; margin:0 auto; width:100%; overflow:hidden; display:block;}
.da-thumbs li { float: left; width:33%; margin:10px 0; _background: #f5f5f5; padding: 0px; position: relative; _box-shadow: 0 1px 3px rgba(0,0,0,0.1); _border:1px solid #000; box-sizing:border-box;}
.secWarp2 li img { height:200px; width:100%; }
#section2 .secWarp2 LI { padding:10px; _border:1px solid #000; }
.pf-btn { 	position:absolute; width:100%; height:70%;left:50%; margin-left:-620px; }
.pf-btn .left-btn { position: absolute; top:45%; left:-30px; }
.pf-btn .right-btn { position: absolute; top:45%; right:-30px;}
}

/* 모바일 */
@media all and ( max-width:768px ) {
#section0 .mainVisual1, #section1 .secWarp3, .secWarp4 { position:relative; width:100%; margin:.0 auto;}
.hgroup { display:none; }
#menu { display:none; }

#footer { _display:none; }
#footer .credits { display:none; }
.contact_navi, .txtArea1, .main0_pf, .subBtn1 { display:none; }
.main0-img img { _display:none; }
.secWarp3 .s3_2, .secWarp3 .s3_3, .secWarp3 .s3_4, .secWarp3 .s3_5, .ll_info { display:none; }

/* 포폴리스트 */
.secWarp2 { position:relative; margin:0 auto; width:100%; overflow:hidden; display:block;}
.da-thumbs li { float: left; width:33%; margin:10px 0; _background: #f5f5f5; padding: 0px; position: relative; _box-shadow: 0 1px 3px rgba(0,0,0,0.1); _border:1px solid #000; box-sizing:border-box;}
.secWarp2 li img { height:200px; width:100%; }
#section2 .secWarp2 LI { padding:10px; _border:1px solid #000; }
.pf-btn { 	position:absolute; width:100%; height:70%;left:50%; margin-left:-620px; }
.pf-btn .left-btn { position: absolute; top:45%; left:-30px; }
.pf-btn .right-btn { position: absolute; top:45%; right:-30px;}
}
.timeline{width:100% !important;clear:both;padding-top:12px;padding-left:160px}
.timeline ul {margin:0 auto;padding:0;}
.timeline ul li {display:inline;float:left;}
.timeline .year {
    font-size: 18px;
    line-height: 25px;
    font-family: "droid_serifregular";
    color: rgba(255,255,255,0.5);
    font-style: italic;
	width:80px;
	height:80px;
	line-height:80px;
	text-align:center;
	border-radius:50%;
	display:inline-block;
	background:#222;
}
.timeline .year2 {
    font-size: 18px;
    line-height: 25px;
    font-family: "droid_serifregular";
    color: rgba(255,255,255,0.5);
    font-style: italic;
	width:80px;
	height:80px;
	line-height:80px;
	text-align:center;
	border-radius:50%;
	display:inline-block;
	background:#313131;
}
.timeline .history-title {
padding:25px 20px 0 30px;
text-align:center;
    font-size: 18px;
	font-weight:100;	
    color: rgba(255,255,255,0.5);
width:280px;
}
.timeline .history {
padding-top:27px;
text-align:left;
    font-size: 14px;
	font-weight:100;	
    font-style: italic;
    color: rgba(255,255,255,0.2);
}

/*20221014 추가*/
@keyframes ping-pong {
	0% {top: 30%}
	50% {top: 32%}
	100% {top: 30%}
}
@keyframes ping-pong2 {
	0% {top: 11%}
	50% {top: 13%}
	100% {top: 11%}
}
@keyframes ping-pong3 {
	0% {top: 50%}
	50% {top: 52%}
	100% {top: 50%}
}
@keyframes circle {
	0% {
    transform: rotate(0);}
	100% {
    transform: rotate(360deg);}
}
.agency_fix {
  width: 160px;
  height: 160px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 50%;
  right: 60px;
  z-index: 999;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(4px);
  animation: ping-pong3 5s ease-in-out infinite;
}
.agency_fix>img {
  display: block;
  width: 70%;
}
.square2{    width: 160px;
    height: 160px;
    position:fixed;
    top:11%;
    right: 60px;
    z-index: 999;}
.square2 {
    animation: ping-pong2 5s ease-in-out infinite;
}
.square2>a>img:nth-child(1) {
    animation: circle 25s linear infinite;
}
.square2>a>img:nth-child(2) {
    animation: circle 10s linear infinite;
    animation-direction: reverse;
}
.square2>a>img {
    position: absolute;
    width: 100%;
    height: 100%;
    transition: 0.5s;
}
.square {
    width: 160px;
    height: 160px;
    position:fixed;
 	top: 30%;
    right: 60px;
    z-index: 999;
}
.square>img {
    position: absolute;
    width: 100%;
    height: 100%;
    transition: 0.5s;
}
.square {
    animation: ping-pong 4s ease-in-out infinite;
}
.square>img:nth-child(1) {
    animation: circle 8s linear infinite;
}
.square>img:nth-child(2) {
    animation: circle 20s linear infinite;
    animation-direction: reverse;
}
.square_text {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
}
.square_text p {
    font-size: 18px;
    color: #fff;
    _font-family: 'Pretendard-Medium', sans-serif;
    margin-top: 8px;
}
.square_text p span {
    display: block;
    font-size: 21px;
    margin-top: 3px;
    font-weight: bold;
}
/*20221014 추가*/

/*20221019 온라인 상담 추가*/
.fix_address{margin-top: 30px; margin-bottom: 10px}
.fix_email{margin-top: 10px; margin-bottom: 20px}
.fix_txt a{    font-weight: 600;
    text-decoration: underline;
    text-underline-position: under;}
.fix_txt{position: fixed !important;
    right: 5%;
    left: initial !important;
    top: 45% !important; z-index: 999;}
.fix_t{font-size: 20px !important; font-weight: 800; }
.fix_txt p{text-align: left !important; font-size: 14px}
.n_online_wrap button.kc_fab_main_btn {
	line-height: 40px;}
#wrap button.kc_fab_main_btn {
	line-height: 40px;}
.n_online_wrap .backtitle{display: none}
.n_online_wrap #mcontainer{border: 0; background:transparent }
.n_online_wrap .w1>h1{    font-weight: 700 !important;
    letter-spacing: -0.03em;
    font-size: 55px !important;
    line-height: 87px;
    color: #101010;
    margin-bottom: 180px;    white-space: nowrap; }
.n_online_wrap .w1{position: initial;}
.n_online_wrap .subcontent {
    position: relative;
    float: initial;
    width: 100%;
}
.n_online_wrap .subcontent .wrt_board {
    width: 50%;
    margin: 180px 0 0 17%;
    border-top: 0;
}
.form_tit{    font-weight: 700 !important;
    letter-spacing: -0.03em;
    font-size: 35px !important;
    color: #101010; margin-bottom: 50px}
.n_online_wrap .wrt_board td input.textbox, .n_online_wrap .wrt_board td select.textbox {
    text-indent: 20px;
    height: 35px;
    line-height: 37px;
    font-size: 16px;
    padding: 30px 0;
    border-radius: 25px;
    border: 1px solid #ddd;
}
.n_online_wrap .wrt_board th {
    font-size: 1.3em;
    padding: 0 10px 0 10px;
    color: #101010;
    font-weight: 500;padding-bottom: 9px;
}
.n_online_wrap .wrt_board td .full {
  
    margin-bottom: 5px;
}
.n_tit{font-size: 1.3em;
    padding: 20px 10px 0 10px !important;
    color: #101010;
    font-weight: 500;
    padding-bottom: 9px !important; }
.n_textbox{    font-size: 16px !important;
    padding: 20px !important;
    border-radius: 25px !important;
    border: 1px solid #ddd !important;
    height: 300px !important;}
.n_online_wrap input::placeholder{color: #b4b4b4}
.n_online_wrap textarea::placeholder{color: #b4b4b4}
.n_online_wrap .wrt_board td .frm_file .textbox {
    border-radius: 25px;
    border: 1px solid #ddd;
    padding: 21px 0;
    display: block;
	height: auto;    line-height: inherit;}
.n_online_wrap .wrt_board td .frm_file img {
    position: absolute;
    top: 14px;
	right: 15px;}
.n_online_wrap .icon7{color: #b4b4b4; font-size: 16px !important}
.n_online_wrap .blue-btn {
    text-align: center;
    padding: 12px 15px;
    font-size: 1.3em;
    color: #FFF;
    background: #00a5ce;
    border-radius: 25px;
    padding: 20px 70px;
    font-weight: 600;}
.red{color: red}
.requi{    text-align: right !important;}
/*20221019 온라인 상담 추가*/