@charset "utf-8";

/*** Layout Style ***/
#wrap{width:1024px; margin:0 auto;}
/** Header **/
#header{position:relative; width:100%;}
#header .nav_top{position:absolute; top:54px; right:0;}
#header .nav_top li{float:left;}
#header .nav_top li a{float:left; padding:4px 5px; background:url(../images/2012/header/bg_nav_top.gif) no-repeat 0 5px;}
#header .nav_top li.first a{background:none;}
#header .logo{margin:0 0 44px; padding:30px 0 0 0;}
#header .logo a{display:block; overflow:hidden; width:520px; height:42px; background:url(../images/2012/header/bg_logo02.gif) no-repeat 0 0; text-indent:-2000em;}
#header .logo a:hover,
#header .logo a:active,
#header .logo a:focus{background-position:0 100%;}
#header .logo img{display:none;}
#header .main_top{display:none;}
#header .nav_top .reservation{padding:0 77px 0 0;}
/* 상단메뉴 */
#gnb{}
.nav_gnb img{vertical-align:top;}
.nav_gnb{position:relative; width:100%; height:25px; margin:0 0 23px 0; border-bottom:1px solid #585858;}
.nav_gnb li{float:left;}
.nav_gnb li.sub01{margin:0 30px 0 0;}
.nav_gnb li.sub02{margin:0 42px;}
.nav_gnb li.sub03{margin:0 42px;}
.nav_gnb li.sub04{margin:0 42px;}
.nav_gnb li.sub05{margin:0 42px;}
.nav_gnb li.sub06{margin:0 42px;}
.nav_gnb li.sub07{margin:0 42px;}
.nav_gnb li.sub08{float:right;}
.nav_gnb li.sub09{float:right;}
.nav_gnb li div{display:none; position:absolute; top:26px; left:0; width:1024px; height:22px;}
.nav_gnb li ul{position:absolute; top:0; left:0; padding:0 9px 0px; background:#585858;}
.nav_gnb li.sub02 ul{left:50px;}
.nav_gnb li.sub03 ul{left:150px;}
.nav_gnb li.sub05 ul{left:430px;}
.nav_gnb li.sub06 ul{left:507px;}
.nav_gnb li.sub07 ul{left:auto; right:0px;}
.nav_gnb li.sub08 ul{left:auto; right:0px;}
.nav_gnb li.sub09 ul{left:auto; right:0px;}
.nav_gnb li ul img{margin:0 0 1px 0;}

/* language  */
.language{position:absolute; top:54px; right:45px; padding:4px 5px; background:url(../images/2012/header/bg_nav_top.gif) no-repeat 0 5px; }
.language .relate{position:relative; width:67px; margin:0;}
.language .relate.r01{z-index:100;}
.language .relate button{position:relative; overflow:visible; width:64px; height:32px; margin:-10px 0 0 0; padding:0 0 0 3px; border:0px; background:#fff; text-align:left; cursor:pointer; font-weight:bold;}
.language .relate button span{display:block; position:absolute; top:50%; right:0; width:10px; height:6px; margin-top:-4px; background:url(../images/2012/header/nav_top_language_arrow.gif) no-repeat 0 0;}
.language .relate>div{position:absolute; top:22px; left:0; overflow:hidden; width:80px; height:0; background:#fff;}
.language .relate.on>div{/*height:194px;*/}
.language .relate .lst{display:none; overflow:auto; width:64px; max-height:192px; border:1px solid #d6d6d6; background:#fff;}
.language .relate.on .lst{display:block !important;}
.language .relate .lst li a{background:none !important; display:block !important; padding:3px 0 3px 8px; text-decoration:none; }
.language .relate .lst li a:hover{display:block; background:#777 !important; color:#fff;}

/** Footer **/
#footer{overflow:hidden; width:100%; padding:20px 0; border-top:1px solid #000;}
#footer .policy{float:left;}
#footer .policy li{display:inline; float:left; margin:0 7px 0 0; padding:0 7px 0 0; background:url(../images/2012/footer/bg_footer.gif) no-repeat 100% 0;}
#footer .address{float:left; margin:0 7px 0 0; padding:0 7px 0 0; background:url(../images/2012/footer/bg_footer.gif) no-repeat 100% 0;}
#footer .tel{float:left; margin:0 7px 0 0;}
#footer .fax{float:left;}
#footer .vistor{float:right;}
#footer .vistor img{vertical-align:top;}

/** 현재위치 **/
.location{padding:20px 0 0 0;}
.location h1{display:none; margin:0 0 10px 2px;}
.location .path{margin:0 0 20px 0; padding:8px 5px 6px; border-top:1px solid #cacaca; border-bottom:1px solid #cacaca; font-weight:bold;}
.location .path em{font-weight:normal; color:#666;}
/** Container **/
#container{position:relative; width:100%; margin-bottom:40px;}
#container:after{content:''; display:block; clear:both;}
/** 왼쪽메뉴 **/
#left{float:left; width:109px; padding:0 12px 40px 0;}
#left:after{content:''; display:inline-block; position:absolute; top:0; left:121px; bottom:0; border-right:1px solid #595757;}
#nav_sm{margin:0 0 0 2px;}
#nav_sm li a{display:block; width:100%; padding:7px 0;}
#nav_sm li img{vertical-align:top;}
#nav_sm li div{display:none;}
#nav_sm li ul{margin:0 0 5px 5px;}
#nav_sm li li a{padding:2px 0; font-size:0.91em;}
#nav_sm li li a:link{color:#666;}
#nav_sm li li a:hover,
#nav_sm li li a:focus{color:#212121;}

/** 컨텐츠 **/
.cont_wrap{float:left; width:640px; padding:5px 10px 40px; color:#666;}
.cont_head{margin:0 0 25px 0;}
/* 3차 메뉴 */
.cont_body .lnb{width:100%; overflow:hidden; margin:0 0 30px 0;}
.cont_body .lnb li{float:left; margin:0 2px 0 0;}
/** side **/
#side{float:right; width:177px; padding:0 0 0px 0; letter-spacing:-1px;}
#side .bx_in{padding:8px; background:url(../images/2012/common/bx_dotted_tl.gif) no-repeat 0 0;}
/* 팝업존 */
.pop_area{position:relative; width:177px; height:230px;}
#popzone {width:177px; height:230px !important; margin:0 0 7px 0;}
#popzone ul{overflow:hidden;}
.pop_area .btn_area{float:right; margin:7px 0 0 0;}
.pop_area .btn_area span{float:left; margin:0 0 0 5px;}
/* 오늘의 미술관 일정 */
#side .schedule_area{margin:0 0 10px 0; background:url(../images/2012/common/bx_dotted_br.gif) no-repeat 100% 100%; text-align:center;}
#side .schedule_area h2{margin:8px 0;}
#side .schedule_area .more{margin:12px 0 5px;}
/*#side .schedule_area .more a{padding:0 8px 0 0; background:url(../images/2012/common/bu_arrow.gif) no-repeat 100% 3px; text-decoration:underline;}*/
/* SNS */
#side .sns_area{margin:0 0 10px 0; background:url(../images/2012/common/bx_dotted_br.gif) no-repeat 100% 100%;}
#side .sns_area ul{overflow:hidden; width:100%; padding:5px 0;}
#side .sns_area li{display:inline; float:left; margin:0 5px 0 7px;}
#side .sns_area li img{vertical-align:top;}
/* 관람안내 */
#side .guide_area{margin:0 0 10px 0; background:url(../images/2012/common/bx_dotted_br.gif) no-repeat 100% 100%; line-height:1.6;}
#side .guide_area h2{margin:10px 0;}
/* 오시는 길 */
#side .map_area{margin:0 0 10px 0; background:url(../images/2012/common/bx_dotted_br.gif) no-repeat 100% 100%; line-height:1.6;}
#side .map_area h2{margin:10px 0;}
/* 단체관람예약 */
#side .reserve_area{margin:0 0 10px 0; background:url(../images/2012/common/bx_dotted_br.gif) no-repeat 100% 100%; line-height:1.6;}
#side .reserve_area h2{margin:10px 0;}
/* 대구미술 네트워크 */
#side .network_area{margin:0 0 10px 0; background:url(../images/2012/common/bx_dotted_br.gif) no-repeat 100% 100%; text-align:center;}
#side .network_area .bx_in{padding:15px 0;}
/* 대구미술 100년의 역사 */
#side .century_area{margin:0 0 0px 0; background:url(../images/2012/common/bx_dotted_br.gif) no-repeat 100% 100%; text-align:center;}
#side .century_area .bx_in{padding:15px 0;}


/*** Layout2018  ***/


/** Header 2018 **/
#header2018{position:relative; width:1024px; margin:0 auto;}
#header2018 .logo{height:110px; text-align:center;}
#header2018 .logo a{display:inline-block;}
#header2018 .lang_area{position:absolute; top:54px; right:45px; padding:4px 5px; background:url(../images/2012/header/bg_nav_top.gif) no-repeat 0 5px; }
#header2018 .lang_area .relate{position:relative; width:67px; margin:0;}
#header2018 .lang_area .relate.r01{z-index:100;}
#header2018 .lang_area .relate button{position:relative; overflow:visible; width:64px; height:32px; margin:-10px 0 0 0; padding:0 0 0 3px; border:0px; background:#fff; text-align:left; cursor:pointer; font-weight:bold;}
#header2018 .lang_area .relate button span{display:block; position:absolute; top:50%; right:0; width:10px; height:6px; margin-top:-4px; background:url(../images/2012/header/nav_top_language_arrow.gif) no-repeat 0 0;}
#header2018 .lang_area .relate>div{position:absolute; top:22px; left:0; overflow:hidden; width:80px; height:0; background:#fff;}
#header2018 .lang_area .relate.on>div{/*height:194px;*/}
#header2018 .lang_area .relate .lst{display:none; overflow:auto; width:64px; max-height:192px; border:1px solid #d6d6d6; background:#fff;}
#header2018 .lang_area .relate.on .lst{display:block !important;}
#header2018 .lang_area .relate .lst li a{background:none !important; display:block !important; padding:3px 0 3px 8px; text-decoration:none; }
#header2018 .lang_area .relate .lst li a:hover{display:block; background:#777 !important; color:#fff;}