/* Midia Queries CSS (max-width : 640px) */
body { background:#fff; -webkit-text-size-adjust:none; min-width:550px; overflow-x:hidden}
#wrap { }
#header { width:100%; min-width:520px; height:55px; padding:33px 0 0 0; margin:0 auto; background:none; position:relative; overflow:visible; z-index:55;}

#header .headerTop { margin:0;}
#header h1 {position: absolute; top:33px; left:0; width: 100%; float:none; text-align:center; display: block;}
#header h1 a {display: block; position: relative; width:141px; height:0; padding-top:22px; margin: 0 auto; background:url('../img/h1.png') 0 0 no-repeat;}
#header h1 a img{display: none; width:100%; height: 100%; position:absolute; top:0;}
#header p.headerMotion { display:none}
/* �곷떒 �� 蹂닿린 踰꾪듉 */
#header .hMore { display:block; position:absolute; right:33px; top:31px; width:23px; height:23px; overflow:visible; background:url('../img/btn_mores.gif') no-repeat 50% 50%; text-indent:-5000px; overflow:hidden}
/*#header .mMore { display:block; position:absolute; left:31px; top:33px; width:29px; height:17px; background:url('../img/btn_list.gif') no-repeat 50% 50%; text-indent:-500px; cursor:pointer; overflow:hidden}*/
#header .mMore { display:block; position:absolute; left:31px; top:33px; width:89px; height:77px; margin-left:-30px; margin-top:-30px; background:url('../img/btn_list.gif') no-repeat 50% 50%; text-indent:-500px; cursor:pointer; overflow:hidden}
#header .menuBack { display:block; position:absolute; left:29px; top:29px; width:26px; height:30px; background:url('../img/btn_backM.gif') no-repeat 50% 50%; text-indent:-500px; cursor:pointer; overflow:hidden}

/* share location mail */
/*#header #sidemenu { width:328px; height:auto; position:absolute; right:11px; top:60px; z-index:500;}*/
#header #sidemenu { width:328px; height:auto; position:absolute; right:11px; top:-460px; z-index:500;}
#header #sidemenu a{ margin:0 0 8px 0; display:block; width:328px; text-indent:-5000px; overflow:hidden}
.hShare { height:116px; background:url('../img/bg_share.png') no-repeat 50% 50%; }
.hShare2 { height:104px; background:url('../img/bg_twitter.png') no-repeat 50% 50%; }
.hLocation { height:104px; background:url('../img/bg_location.png') no-repeat 50% 50%; }
.hMail { height:104px; background:url('../img/bg_mail.png') no-repeat 50% 50%; }

/* sub menu */
#header .wrapMainMenu.subMainMenu { display:block}
#header .headerLogo{ display:none;}

#boxMenu { width:244px; height:244px; border-top:1px solid #ebebeb; border-bottom:1px solid #ebebeb; margin:-1px; position:absolute; left:0; top:0; background:#fff; z-index:44 }
#boxMenu li { font-size:14px; padding:20px 0 0 29px;}
#boxMenu li.current a { text-decoration:underline;}


/* sub aside menu */
#portfolioAside { height:86px; background:#fff url('../img/bg_2depthHeader.gif') repeat-x 0 0;} /*  display:none */
#portfolioAside h1 {display:none}

#portfolioAside .navShare span, #portfolioAside .btnPN { display:none}
#portfolioAside .navShare li span.b { display:block}
.navShare{ background:#fff url('../img/bg_2depthHeader.gif') repeat-x 0 0;}
.navShare li a { width:86px; height:86px; }
#portfolioAside .navList { width:auto; height:86px;}
#portfolioAside .btnBack { background:url('../img/btn_backM.gif') no-repeat 34px 50%; left:0;  width:375px; height:86px; line-height:86px; border-right:0; font-size:24px; }

/*
#portfolioAside .btnBack:hover .b { width:375px; height:88px;}
#portfolioAside .btnPN:hover .b, #portfolioAside .navPrev:hover .b { width:0; height:0;}
#portfolioAside .navShare li a:hover .b { display:block; width:86px; height:86px;}
*/

/* index main menu */
#header .sideDiscription {  left:50px; top:84px; height:150px; display:block; text-align:left; color:#fff; }
#header .sideDiscription h2 { display:block; position: relative; color:#fff; margin-bottom:0px; width:383px; padding-top:84px; height:0; box-sizing: border-box; overflow:hidden; background:url('../img/title_content.png') 0 0 no-repeat;}/* width:383px; */
#header .sideDiscription h2 img{ display:none;}/* width:383px; */
#header .sideDiscription:after {display: block; content:''; width:307px; margin-left: 4px; padding-top:28px; height:0; background:url('../img/top_title_w.png') 0 0 no-repeat;}
#header .sideDiscription .dis1 {display:none; margin-left: 4px;}

#header .wrapMainMenu { display:block; width:552px; height:0; position:absolute; left:0; top:0; background:url('../img/bg_mainmenu.jpg') repeat-y 0 0; z-index:400; overflow:hidden;}
#header #mainmenu { left:0; top:0; padding-top:281px; background:url('../img/blackLine2.png') repeat-x 0 280px; width:100%; z-index:300;}
#header #mainmenu a {opacity: 1; display:block; padding-left:50px; height:95px; font-size:40px; line-height:95px; background:url('../img/main_icon.png') no-repeat 517px 50%; color:#fff; border-top:1px solid #4e4e4e; border-bottom:1px solid #000;}
#header #mainmenu a img {display: block; width: 43%; margin-top: 21px;}
#header #mainmenu a.current { background-color:#2a2a2a; border-top:1px solid #4e4e4e; border-bottom:1px solid #000;}
#header #mainmenu a.current.mainM { color:#fff; opacity: 1;}
.df_menuList { display:none; width:304px; position:absolute; z-index:300; left:248px; top:0;  background:url('../img/bg_df_menuList.png') repeat-y right 0;}
#header #mainmenu ul li.current { background-color:transparent}
#header #mainmenu ul li.current a { background-color:#2a2a2a;}

#header #mainmenu .df_menuList a { background:url('../img/main_icon.png') no-repeat 227px 50%; color:#bdbdbd; font-size:28px; width:240px; padding-left:20px; margin-left:44px; border:0; height:95px; line-height:95px; border-top:1px solid #4e4e4e; border-bottom:1px solid #000;}
#header #mainmenu .df_menuList li.first { margin-top:280px; background:url('../img/blackLine2.gif') no-repeat right -1px;}
#header #mainmenu .df_menuList li.first.current { background:url('../img/blackLine2.gif') no-repeat right -1px;}

.pf_menuList { display:none; width:304px; position:absolute; z-index:300; left:248px; top:0;  background:url('../img/bg_df_menuList.png') repeat-y right 0;}
#header #mainmenu .pf_menuList a { background:url('../img/main_icon.png') no-repeat 227px 50%; color:#bdbdbd; font-size:28px;  width:240px; padding-left:20px; margin-left:44px; border:0; height:95px; line-height:95px; border-top:1px solid #4e4e4e; border-bottom:1px solid #000;}
#header #mainmenu .pf_menuList li.first { margin-top:280px; background:url('../img/blackLine2.gif') no-repeat right -1px;}
#header #mainmenu .pf_menuList li.first.current { background:url('../img/blackLine2.gif') no-repeat right -1px;}

#header span.headerMotion { display:none}

#header #mainmenu #idMenu { display:block;}

#footer { width:430px; margin:0 auto;}/*  border-left:1px solid #ebebeb; border-right:0;  background:url('../img/bg_line.gif') repeat-y 489px 0} */
#footer.sub_footer { width:490px; margin:0 auto; border-left:0; border-right:0;}

#footer .footerlogo { }
#address, address  {padding:0 0 50px 0;}
.footerShare { }

.boxWrap { background:url('../img/bg_line.gif') repeat-y 489px 0}

#contentWrap { border-bottom:0; width:100%; min-width:520px;}
#content { width:493px; max-width:100%; border:0; border-left:0; margin:0 auto !important; overflow:hidden}
#content.main { width:100%; max-width:493px;}
#content.sub { background:none; width:490px; border-left:0; border-right:0;}
#content.portfolioWrap {width:640px;}
.portfolio { width:640px;  border-left:0; border-bottom:1px solid #ebebeb;}
#textCon, .textCon { width:540px; max-width:540px;}
#halfWrap, .halfWrap { width:550px; max-width:550px;}
#halfWrap #textCon, #halfWrap .textCon{ width:255px; max-width:255px;}

#content.sub {border-bottom:0; width:100%;}
#subNav {width:100%; height:88px;  border:0; border-bottom:1px solid #ebebeb; background:#fff url('../img/bg_2depthHeader.gif') repeat-x 0 0; float:none; padding-top:0;}
#subNav  ul li { width:100%; display:none; text-align:center; font-size:30px; line-height:88px; padding:0;}
#subNav  ul li.current { display:block; }
#subNav  li.current a { text-decoration:none;}

#subcon { width:100%; margin:0; padding:0;}
.subBottom { width:100%;  background:url('../img/bg_main.gif') repeat 0 0; border-top:1px solid #ebebeb;}
.subBottom ul { width:490px; margin:0 auto; border-left:1px solid #ebebeb; border-right:1px solid #ebebeb; border-top:0;}


/* df 
.subMain {  width:100%; padding:0;  padding-bottom:80px; overflow:hidden}
.subMain h1 { display:none}
.subMain #halfWrap {min-width:auto;}
.subMain #halfWrap #textCon { max-width:100%; width:100%; clear:both; margin:0 auto; overflow:hidden; }
.subMain #halfWrap #textCon.floatl { float:none}
.subMain #halfWrap #textCon.floatr { float:none}
*/
.dm_width { width:100%;}
.awards_img li { float:left; margin-right:60px !important; margin-bottom:20px;}
.awards_img li.list5 { float:right; margin-right:0;}
.awards_img li.last { float:left; margin-right:0;}
#textCon.df #halfWrap #textCon, #textCon.df .halfWrap .textCon { max-width:100%; width:100%; }

/* df cocomayo */
.df_coco .textCon.floatl, .df_coco .textCon.floatr{ width:100% !important; float:none; max-width:100% !important;}
.df_coco .textCon.floatl h2 .width100p, .df_coco .textCon.floatr  h2 .width100p { width:auto;}

/* portfolio */
.portfolio2depth { display:block; width:100%; height:88px; background:url('../img/bg_2depthHeader.gif') repeat-x 0 0; position:relative; text-align:center} 
.portfolio2depth h3 { font-size:30px; line-height:88px; font-weight:normal}
.portfolio2depth a { display:block; width:126px; height:26px; line-height:26px; position:absolute; right:33px; top:31px; padding-right:40px; background:url('../img/icon_search2.png') no-repeat right 50%; font-size:14px}
#portfolio-filter{ display:block; width:100%; height:auto; right:0; top:88px; background:url('../img/bg_mainmenu.jpg') repeat-y 0 0; z-index:44; overflow:hidden; border-top:0;}
#portfolio-filter div.fillerWrap { background:none; height:auto;}
#portfolio-filter .fillter-area, #portfolio-filter div.fillerWrap { float:none; width:100%; padding:0;}
#portfolio-filter .btn_open.close { display:none}
#portfolio-filter .fillter-area { height:0; position:relative;}
#portfolio-filter .layer_open { display:block; position:absolute; right:0; top:0; width:88px; height:87px; cursor:pointer; text-indent:-5000px; overflow:hidden; background:url('../img/btn_close_color.gif') no-repeat 50% 50%;}
#portfolio-filter .search_input { margin-bottom:0; }
#portfolio-filter .search_input dt { background:#fff url('../img/bg_2depthHeader2.gif') repeat-x 0 0; height:88px; text-align:center; line-height:88px; font-size:22px; padding-left:0; margin-bottom:0;}
/*
#portfolio-filter .search_input dd { width:100%; height:88px; background:url('../img/bg_search640.gif') no-repeat 0 0; border-bottom:1px solid #ebebeb}
#portfolio-filter .search_input dd input { width:550px; border-bottom:0; background:none; margin:28px 0 0 60px; line-height:35px; height:35px;}
*/
#portfolio-filter .search_input dd{ position:absolute; bottom:15px; left:0;}
#portfolio-filter .btn_search { width:95%; height:70px; margin:0 auto; line-height:70px; font-size:22px; background:#000 url('../img/btn_search.png') no-repeat 4% 50%;}
#portfolio-filter h3 { padding-left:5%; margin-bottom:0; height:50px; line-height:50px; background:#f3f3f3; border-bottom:1px solid #ebebeb; font-size:16px}
#portfolio-filter div.fillerWrap span { height:85px; line-height:85px; margin-top:0; font-size:30px; padding:0 5%; position:relative; }
#portfolio-filter div.fillerWrap.list span { height:85px; line-height:85px; font-size:30px; border-bottom:1px solid #ebebeb; padding:0 5%;}
#portfolio-filter div.fillerWrap span input { position:absolute; right:4%; top:25px;  width:32px; height:32px;}
/*
#boxMenu.for640 { display:block}
.wrapBoxmenu { display:none}
#boxMenu { display:none; width:100%; height:88px; left:1px; top:88px; overflow:hidden; }
#boxMenu ul { width:100%; height:88px;  border:0; background:url('../img/bg_2depthHeader.gif') repeat-x 0 0;}
#boxMenu ul li { width:100%; display:none; text-align:center; font-size:30px; line-height:88px; padding:0;}
#boxMenu ul li.current { display:block; }
#boxMenu ul li.current a { text-decoration:none; background:none; font-size:30px; line-height:88px; padding-left:0;}
#boxMenu li.current.displayNone1024 { display:block}
*/


/* portfolio 
#contentWrap.mainWrap.has3depth { padding-top:88px; background:url('../img/bg_main.gif') repeat 0 88px;}
#boxMenu { width:100%; height:88px; left:1px; top:88px; overflow:hidden; }
#boxMenu ul { width:100%; height:88px;  border:0; background:url('../img/bg_2depthHeader.gif') repeat-x 0 0;}
#boxMenu ul li { width:100%; display:none; text-align:center; font-size:30px; line-height:88px; padding:0;}
#boxMenu ul li.current { display:block; }
#boxMenu ul li.current a { text-decoration:none; background:none; font-size:30px; line-height:88px; padding-left:0;}
#boxMenu li.current.displayNone1024 { display:block}
*/

/* portfolio type2 */
.fullText h2 { color:#fff; padding:75px 0 0 0; width:540px; max-width:540px; margin:0 auto !important;}
#halfWrap.fullText #textCon.floatl, #halfWrap.fullText .textCon.floatl { margin-left:0; float:none; width:540px; max-width:540px; margin:0 auto}
#halfWrap.fullText #textCon.floatr, #halfWrap.fullText .textCon.floatr { margin-right:0; float:none; width:540px; max-width:540px; margin:0 auto}
.fullText#halfWrap #textCon, .fullText#halfWrap .textCon { width:540px; max-width:540px; margin:0 auto}
.fullText#halfWrap #textCon.floatNone, .fullText#halfWrap .textCon.floatNone { width:540px; max-width:540px; margin:0 auto }
.videoCon iframe { min-height:330px;}
#halfWrap.type2 #textCon, #halfWrap.type2 .textCon { width:100%; max-width:100%; float:none}
#halfWrap.type2 #textCon.floatr, #halfWrap.type2 .textCon.floatr { padding-top:30px;}

/* half type */
.halfNormal .textCon.floatl { width:100%; max-width:100%; }
.halfNormal .textCon.floatr { width:100%; max-width:100%;}

/* sub_context */
.sub_context .subMain { padding:0 0 0 0}

/* metaphor */
#fixed-area { position:absolute; left:50px; top:40px; z-index:10;}
.text-area.noneImg { top:35%; }
.metaphor-btn { bottom:30%;}

/* lab */
.lab_coco .alarm_text { top:-78px !important;}
.alramC { top:48px !important;}
.imotion { top:-115px !important;}