@charset "utf-8";

@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);


/* common */
*			{ box-sizing: border-box; -moz-box-sizing: border-box;}
html		{ font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;}
body		{ font-family: "Nanum Gothic", Helvetica, sans-serif; font-size: 15px; color: #666; background: #fff;}
html, body	{ margin: 0; padding: 0; height: 100%;}         
	  

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section		{ display: block;}

audio,
canvas,
video		{ display: inline-block; *display: inline; *zoom: 1;}

audio:not([controls]) { display: none;}


a:focus		{ outline: thin dotted #333; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px;}
a:hover,
a:active	{ outline: 0;}


img { width: auto\9; height: auto; /*max-width: 100%; */vertical-align: middle; border: 0; -ms-interpolation-mode: bicubic;}

#map_canvas img,
.google-maps img { max-width: none;}

button,
input,
select,
textarea	{ margin: 0; font-size: 100%; vertical-align: middle;}


a		{ color: #FF0070; text-decoration: none; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;}
a:hover,
a:focus { color: #3eb5d6; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;}

ul,
ol		{ padding: 0; margin: 0;}
ul ul,
ul ol,
ol ol,
ol ul	{ margin-bottom: 0;}
li		{ line-height: 23px; list-style:none}

dl { margin-bottom: 20px;}
dt,
dd { line-height: 20px;}
dt { font-weight: bold;}
dd { margin-left: 10px;}

address { display: block; margin-bottom: 20px; font-style: normal; line-height: 20px;}

label,
input,
button,
select,
textarea { font-size: 14px; font-weight: normal; line-height: 20px; border:1px solid #d9d9d9}

input.input	{ height:40px; padding:2px 4px}



/* DEMO PAGE CSS */ 
#fixedNavBar		{ position: fixed; width: 100%; min-width:1024px; height:98px; padding: 0; top: 0; z-index: 8888; background: #4d525a;}
#fixedNavBar h1		{ position:absolute; top:35px; left:50%; margin:0 0 0 -500px;}
#fixedNavBar > ul	{ list-style: none; text-decoration: none;}
#demoUl				{ height: auto; width: 1000px; margin: auto; padding:35px 0 25px 368px;}
.demoBtn			{ float: left; margin-left: 32px; text-align: center; color: #fff; font-size:18px; font-weight:bold; line-height:38px;}
.demoBtn:hover		{ color: #3eb5d6; }

#demoTop			{ background:#fff; position:fixed; box-shadow: 0 1px 2px rgba(0,0,0,0.5); text-align:center; height: 40px; width: 40px; line-height: 30px; color: #333; border-radius:80px; left: 95.5%; top: 91%; display: block; z-index: 99999; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out;}
#fadeBlack	{ position: fixed; width: 100%; background: #000; height: 100%; min-height: 100%; left: 0px; top: 0px; z-index: 99999;}

#fullSectionWrap		{ position:absolute; top:98px; right:0; bottom:0; left: 0; min-width:1024px; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out;}
.fullSection			{ overflow: hidden; /*height: 100%;*/ padding-top: 65px; margin-top: 0; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out;}
.fullSection h2			{ margin:0; font-size:36px; text-align:center;}
.fullSection h2 span	{ display:block; margin-top:10px; font-size:16px;}

.textContent				{ width: 1000px; margin: 50px auto; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out;}

/* �Ǹ޴� */
.textContent .tabBtn		{ margin-bottom:37px;}
.textContent .tabBtn:after	{ content:""; clear:both; display:block;}
.textContent .tabBtn li		{ float:left; width:190px; height:50px; margin-right:2px; text-align:center;}
.textContent .tabBtn li a.tabover,
.textContent .tabBtn li a:hover{ background:#488bce}
.textContent .tabBtn li a	{ display:block; line-height:50px; color:#fff; font-size:16px; font-weight:bold; background:#666;}


.flatVisual					{ position:relative; overflow: hidden; width:100%; margin:0; padding:0; zoom:1}
.flatVisual:after			{ content:""; clear:both; display:block}




/* ȸ��Ұ� */
.flatIntro			{ background: #ececec;}
.flatIntro h2		{ color:#4d525a;}
.flatIntro h2 span	{ color:#666;}
.conIntro:after		{ content:""; clear:both; display:block;}
.conIntro .imgCeo	{ float:left; margin-right:40px; width:325px;     text-align: center;}
.conIntro#greeting p			{ float:left; width:635px; margin:0; line-height:20px; word-break:keep-all}
.conIntro#greeting p strong	{ display:block; margin:25px 0 15px 0; font-size:22px;}
.conIntro dl		{ float:left; width:45%; margin:0 5% 20px 0}
.conIntro dt		{ float:left; width:15%; line-height:26px;}
.conIntro dd		{ position:relative; float:left; width:85%; margin:0; padding-left:30px; border-left:1px solid #d9d9d9; line-height:26px;}
.conIntro dd:before	{ content:""; clear:both; display:block; position:absolute; top:11px; left:-3px; width:5px; height:5px;  border-radius:3px; background:#488bce}
.conIntro .imgHistory	{ margin-bottom:10px;}

.globalK,
.globalC,
.globalV	{ position:relative; float:left; width:248px; height:382px; padding:25px; border:1px solid #d9d9d9; background:#fff}
.globalK h3,
.globalC h3,
.globalV h3	{ position:absolute; top:0; left:0; width:100%; height:43px; margin:0; color:#e3e3e3; line-height:43px; text-align:center; background:#9ea4ae}
.globalK div,
.globalC div,
.globalV div	{ padding-top:43px; text-align:center; }
.globalK div p,
.globalC div p,
.globalV div p	{ margin:15px 0 0 0; line-height:22px; }
.globalK div p span,
.globalC div p span,
.globalV div p span	{ display:block; margin-bottom:10px; font-size:16px; font-weight:bold; color:#488bce}

.globalC	{ width:464px; margin:0 20px; }
.globalC div	{ float:left; width:196px;}
.globalC div:nth-of-type(1)	{ margin-right:20px;}

/* ����ǰ�� */
.flatProduct			{ background: url('../img/bgProduct.jpg') no-repeat scroll 50% 0;}
.flatProduct h2			{ color:#244768;}
.flatProduct h2 span	{ color:#61778c;}
.prdText				{ height:66px; margin:-25px 0 12px 0; padding:12px 37px; border-radius:30px; color:#e3e3e3; line-height:20px; text-align:center; background:url('../img/bgPrd.gif') repeat-x 0 0}
.prdImg					{ margin:0 0 40px 0; padding:0 25px;}
.prdImg img{width:315px;}
.prdImg:after			{ content:""; clear:both; display:block;}
.prdImg li				{ float:right; text-align:center}
.prdImg li:first-child	{ float:left;}
.prdImg li span			{ display:block; font-weight:bold}
.flatProduct .tabBtn		{ margin-bottom:15px}
.conProduct:after		{ content:""; clear:both; display:block;}
.conProduct dl			{ float:left; width:167px; height:318px; margin:0 0 0 -1px; border:1px solid #d9d9d9}
.conProduct dt			{ color:#e3e3e3; font-size:14px; line-height:43px; text-align:center; background:#9ea4ae}
.conProduct dd			{ margin:0; }
.conProduct dl.rfid		{ width:170px; margin:0;}
.conProduct a:hover dt	{ background:#3eb5d6 url('../img/imgMore.gif') no-repeat right 0}



/* ���¾�ü */
.flatPartner			{ background: url('../img/bgPartner.jpg') no-repeat scroll 50% 0;}
.flatPartner h2			{ color:#4d525a;}
.flatPartner h2 span	{ color:#666;}
.flatPartner ul:after	{ content:""; clear:both; display:block;}
.flatPartner li			{ float:left; border-left:1px solid #d9d9d9; border-bottom:1px solid #d9d9d9;}
.flatPartner li:nth-child(6n+1)	{ border-left:0; margin-left:-1px;}



/* ���꼳����Ȳ */
.flatFacility			{ background: url('../img/bgFacility.jpg') no-repeat scroll 50% 0;}
.flatFacility h2		{ color:#695407;}
.flatFacility h2 span	{ color:#988b5f;}
.flatFacility .textContent	{ margin:30px auto}
.imgFacility			{ margin:0 0 30px 0;}
.imgFacility:after		{ content:""; clear:both; display:block;}
.imgFacility li			{ float:left; margin-left:20px;}
.imgFacility li:first-child	{ margin-left:0;}
.flatFacility .tabBtn		{ margin-bottom:0}
.flatFacility .tabBtn li a.tabover,
.flatFacility .tabBtn li a:hover	{ background:#ff9000}
.conFacility table	{ width:100%; border-top:1px solid #d9d9d9; border-left:1px solid #d9d9d9; text-align:center}
.conFacility table caption	{ margin:30px 0 5px 0; font-size:18px; font-weight:bold; text-align:left}
.conFacility table th	{ height:43px; line-height:43px; border-right:1px solid #d9d9d9; color:#e3e3e3; background:#a8a391}
.conFacility table td	{ padding:13px 0; line-height:24px; vertical-align:top; border-right:1px solid #d9d9d9; border-bottom:1px solid #d9d9d9; background:#fff}
.conFacility dl			{ margin:20px 0 0 0; padding:0}
.conFacility dl:after	{ content:""; clear:both; display:block}
.conFacility dt			{ float:left; margin-right:37px; color:#695407; font-size:18px;}
.conFacility dd			{ float:left; color:#847e69; font-size:13px; line-height:20px;}



/* �����ϱ� */
.flatInquiry			{ background: url('../img/bgInquiry.jpg') no-repeat scroll 50% 0;}
.flatInquiry h2			{ color:#4d525a;}
.flatInquiry h2 span	{ color:#666;}
.flatInquiry table		{ width:100%; margin:0 0 30px 0;}
.flatInquiry th			{ font-size:16px;}
.flatInquiry td textarea,
.flatInquiry td input	{ width:100%;}
.btnInquiry				{ text-align:center;}
.btnInquiry button		{ width:210px; height:60px; border-radius:3px; color:#fff; font-size:24px; font-weight:bold; line-height:60px; background:#222; cursor:pointer;}
.flatInquiry #map_view	{ width:100%; height:500px}



/* �����ڷ� */
.newsList		{ width:100%; height:auto; border-bottom:1px solid #d9d9d9; overflow:hidden;}
.newsList li	{ width:100%; height:auto; overflow:hidden; padding:40px 0; border-top:1px solid #d9d9d9}
.newsList li:first-child	{ border-top:3px solid #4d525a}
.newsList li .fl			{ float:left; width:260px; height:375px;}
.newsList li .fl img		{ width:100%; height:100%; background:#ececec}
.newsList li .fr			{ position:relative; float:right; width:690px; height:375px;}
.newsList li .fr .txt01		{ margin:10px 0 20px; font-size:21px; color:#333}
.newsList li .fr .txt02		{ margin:0; line-height:1.5em}
.newsList li .fr .txt03		{ position:absolute; bottom:0; left:0; margin:0; line-height:1.5em}




/* footer */
.footerBar { height:50px; margin:3px 0 20px 0; background:#4d525a}
.footerBar ul { width:1000px; margin:0 auto; padding:9px 0;}
.footerBar li { float:right;}
.footerBar li.address { float:left; line-height:33px; color:#c3c7ce; font-size:12px; font-weight:bold;}
.footerBar li a	{ float:left; margin-right:10px;}

.copyright { width:1000px; margin:0 auto 20px;}
.copyright p { display:inline-block; vertical-align:top;}
.copyright p img { margin-right:45px;}
.copyright p span { position:relative; font-size:12px; color:#888; line-height:20px; margin-left:10px; padding-left:12px;}
.copyright p span:after	{ content:""; clear:both; display:block; width:1px; height:10px; position:absolute; top:3px; left:0; background:#999}
.copyright p span:nth-child(5n+1):after { display:none}



/** modal window styles **/
#lean_overlay {
    position: fixed;
    z-index:100;
    top: 0px;
    left: 0px;
    height:100%;
    width:100%;
    background: #000;
    display: none;
}

#popupModal,
#popupModal01, #popupModal02, #popupModal03
 { 
  position:relative; 
  overflow:hidden;
  width:740px;
  margin-top:100px;           /*�˾�â ���Ʒ� ��������*/
  padding:110px 20px 50px 20px;
  background: #fff;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.5);
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.5);
}
#popupModal h3, 
#popupModal01 h3, #popupModal02 h3, #popupModal03 h3
{ position:absolute; top:0; left:0; width:100%; height:60px; margin:0; line-height:60px; box-sizing:border-box; color:#fff; font-size:30px; text-align:center; background:url('../img/bgModalH3.gif') no-repeat scroll 50% 0}

#popupModal p,	
#popupModal01 p, #popupModal02 p, #popupModal03 p		
{ margin:0; line-height:18px;}

#popupModal p strong,
#popupModal01 p strong, #popupModal02 p strong, #popupModal03 p strong	
{ display:block; color:#7f97ad; font-size:18px; line-height:22px}

#popupModal ul,			
#popupModal01 ul, #popupModal02 ul, #popupModal03 ul
{ padding:30px 5px 10px 25px }

#popupModal ul:after,	
#popupModal01 ul:after, #popupModal02 ul:after, #popupModal03 ul:after
{ content:""; clear:both; display:block}

#popupModal li,	
#popupModal01 li, #popupModal02 li, #popupModal03 li			
{ float:left; margin:0 20px 20px 0}

.modal_close	
{ position:absolute; top:12px; right:11px; cursor:pointer}



.modal_box{height:600px;  width:700px;  overflow:auto;}

.mt20{margin-top:20px;}