@charset "utf-8";

/* 서브 탑 메뉴 */
#header{background:#fff; }
#header #gnb ul.gnb_sub li a{color:#000}
#header #logo{background:url('http://www.shinan.go.kr/images/museum/logo_b2.png') no-repeat 0 0; }
#header .gbn_sch{background:url('http://www.shinan.go.kr/images/museum/gnb_all_b.png') no-repeat 0 0;}
#header .gnb_sitem{background:url('http://www.shinan.go.kr/images/museum/gnb_all_b.png') no-repeat -54px 0;}
#depth li.depth_01 a.depth_01_link{color:#000}


.btn_menu a{background: url('/images/museum/gnb_all_b.png') no-repeat -54px 0;}

#header:hover{background:#fff}

/* 서브비주얼 */
.sub_visual{/* background:url('/images/museum/sub/sub_visual.jpg') no-repeat 0 0;  height:327px; */margin-top:86px; width:100%; text-align:center;  position:relative; background: #20579c;}  
.sub_visual #d_title{color:#fff; font-size: 50px; text-shadow: 0px 5px 10px rgba(0, 0, 0, .2); font-family: 'gmarketsansM'; position:relative}
.sbg{position:absolute; left:0; top:0; width:100%; z-index:0; overflow: hidden;}
.sbg img{max-height:100%;}

/* 서브메뉴 */
#snb{background:#20579c; width:100%; height:56px; line-height:56px; position:relative; z-index: 10; margin:86px auto 0; }
.subNaviUl .home{width:60px; display:inline-block; height:56px; background:url('/images/museum/sub/subNavi_home.png') no-repeat 50% 18px; text-indent:-9999999px; font-size:0;  }
.subNaviUl .home a{width:60px; height:56px; display:block}
.subNaviUl li{}
.subNaviUl > li{width:200px; border-right:1px solid rgba(255, 255, 255, .2)}
/* .subNaviUl > li:last-child{border-right:1px solid rgba(255, 255, 255, .2)} */

.subNavi > a{position:relative; cursor:pointer; width: 100%; display: block;  color:#fff; text-align: left;  padding-left: 25px; }

.subNavi > a:before{content:""; position:absolute; right:16px; top:22px; width:2px; height:12px; background:#fff; display:inline-block; transform: rotate(50deg); transition:all ease-in 0.2s; }
.subNavi > a:after{content:""; position:absolute; right: 24px;  top: 22px; width:2px; height:12px; background:#fff; display:inline-block; transform: rotate(-50deg); transition:all ease-in 0.2s; }

.subNavi > a.active:before{transform: rotate(90deg);}
.subNavi > a.active:after{transform: rotate(-90deg);}
.subNavi > a:focus,
.subNavi > a:hover{color:#fff; }

.subNaviUl > li{position:relative; vertical-align:top; float:left; font-size:17px; color:#fff; height: 60px}

.subNaviUl > li:after{content:""; display:inline-block; position: absolute; right: 0; top: 20px; width:11px; height:21px; background:url('/images/museum/sub/subNavi_line.png') no-repeat 0 0; }
.subNaviUl > li:last-child:after{display:none;}
.subNavi .subNavi_hide{display:none; position:absolute; background:rgba(24, 91, 177, 0.95); padding:15px 20px 20px;  width: 200px; top:56px;}
.subNaviUl ul.subNavi_hide li{line-height:130%; margin-bottom:10px}
.subNavi .subNavi_hide a{color:#fff; font-size:15px; font-weight:400}

#snb2{display:none;}

#contents_box{position:relative; width:100%; padding-top:90px; margin-bottom:80px;}
#content{float:left; width:100%; }
.sub_con_inner{width: 1324px; margin: 0 auto;}

#title_box{position:relative; clear:both; margin-bottom:20px; }
.title{font-size:36px; color:#222; width:100%; text-align:center; margin-bottom: 30px; font-family: 'gmarketsansM';}
#title_box .excel_word{float:right; margin-right:10px; padding:30px 0 10px 0px;}
#title_box .excel_word li{float:left; margin-right:2px;}
.mon_box{float:left; width:25%}
.txt_box{width:74%;  margin-bottom:20px;}
#navigation {position:relative; width:100%; height:39px; margin-bottom: 10px; text-align:center}
.navi_link{text-align: center;  display: inline-block;}
.navi_link p{float:left;  height:39px;  font-size:15px; padding:0 20px 0 11px; background:url("/images/museum/sub/navi_bg.png") 100% 2px no-repeat; }
.navi_link p a{color:#666}
.navi_link p:first-child a{ background:url('/images/museum/sub/home_icon.png') no-repeat 0 1px; padding-left:20px;}
.navi_link p a img{display:none;}
.navi_link p img{position: relative; top: 1px;}
.navi_link p:last-child{background:none}
#navigation p{ margin:0; padding-bottom:0;}

/* 게시판 */
.list_table {/* background:url(/images/board/board_thead.gif) repeat-x; */}
.list_table thead th{border-top: 2px solid #222; border-bottom: 1px solid #ddd; padding: 16px 0 15px;  font-size: 16px;  color: #222;  font-family: 'gmarketsansM';}
.list_table tbody td{padding: 15px 0 14px; font-size: 16px;}
.show_form th{color:#222; font-family: 'gmarketsansM'; }
.show_form th, .show_form td{    font-size: 15px;  padding: 16px 20px;}

/* qr code */
#qrcode { border:1px solid #b3d8e7; float:left; clear:both; width:100%; margin-top:50px; padding:0; height:134px; overflow:hidden; margin-bottom:20px}
#qrcode dt { position:relative; top:16px; left:140px;}
#qrcode .img { position:relative; top:-54px; left:5px; }
#qrcode .img img { width:120px; height:120px; border:3px solid #0099cc; }
#qrcode .txt {  position:relative; top:26px; left:140px;}
#qrcode .txt span { color:#ff7200; font-weight:bold;}

form#satisfaction_survey_form{padding: 0;}
.satisfaction_survey_comment .satisfaction_survey dd{padding: 13px 0 0 55px;}

@media screen and (max-width:1324px){
	.sub_con_inner{width:100%; padding:0 20px}


}

@media screen and (max-width:1324px){
	#header{height:86px;}
}


@media screen and (max-width:900px){
	#contents {width:100%;}
	#contents_box{padding-top:0;}
	#snb2{display:none; position:relative; clear:both; margin-top:0; z-index:10}
	.blackSheet {display:none;position:absolute;width:100%;height:100%; opacity:0.60;;z-index:100}
	.blackSheet.active {display:block;z-index:1009;height:100%;}
	.blackSheetIn {display:none;position:absolute;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.75);z-index:10000}
	.blackSheetIn.active {display:block;  }

	/* Navigation */
	div.topNav {height:40px; background:url('/images/www/main_new/snb2_bg.jpg') left top no-repeat}
	div.topNav ul.firstDepth {position:relative;clear:both;width:100%}
	div.topNav ul.firstDepth li {position:relative; width:95%; color:#afaeb1; height:40px;line-height:40px; font-size:14px; font-weight:bold; 
								background:url('/images/www/sub/snb2_arrow1.png') right center no-repeat}
	div.topNav ul.firstDepth li a {display:block; width:100%; color:#FFF; height:100%; padding-left:20px}
	div.topNav ul.firstDepth li span {display:inline-block; height:34px; margin:3px 0; color:#FFF; text-indent:-9999px; overflow:hidden}
	div.topNav ul.firstDepth li.civic span {color:#FFf}
	div.topNav ul.firstDepth li.civic.active span {color:#FFf}
	div.topNav ul.firstDepth li.civic.activeIn span {color:#FFf}
	ul.secondDepth {position:absolute;top:40px;left:0; width:100%;height:0;overflow:hidden;z-index:10000} 
	ul.secondDepth.active {height:auto;overflow:visible}
	ul.secondDepth.active li {min-height:35px;line-height:35px; font-size:14px; font-weight:bold}
	ul.secondDepth.active li a {display:block;letter-spacing:-0.05em; }
	ul.secondDepth.active li > a {padding:0 20px; }
	ul.secondDepth.active li dl {width:100%;height:30px;overflow:hidden}
	ul.secondDepth.active li.active dl {height:auto;overflow:visible}
	ul.secondDepth.active li dl dt {height:35px;line-height:35px;padding:0 20px; font-size:14px}
	ul.secondDepth.active li dl dt a {background:url('/images/www/sub/snb2_arrow2.png') right center no-repeat}
	ul.secondDepth.active li dl dd {padding:0 25px;height:30px;line-height:30px; }
	ul.secondDepth.active li dl dd a {padding: 0 10px; font-size:0.875em;/*14/16*/font-weight:normal;background:url('/images/www/sub/snb_dot.gif') 0 15px no-repeat}
	ul.secondDepth.blue {background-color:#f7f7f7}
	ul.secondDepth.blue li {border-top:1px solid #d4d4d4;color:#555c63}
	ul.secondDepth.blue li a {color:#555c63}
	ul.secondDepth.blue li dl dt {color:#fff}
	ul.secondDepth.blue li dl dd {color:#282828;background-color:#D5DBE3;border-bottom:1px solid #bdc5d1}
	ul.secondDepth.blue li dl dd a {color:#555c63}
	ul.secondDepth.active li:first-child {border-top:0}
	ul.secondDepth li.secondLast {background-color:#fff}
	ul.secondDepth li.secondLast a {font-size:0.8em;font-weight:normal;padding:3px 8px;;line-height:20px;background-color:#586e91;color:#fff}

	#sub_con{width:100%; padding:20px 15px 0;}

	.mon_box{float:left; width:25%}
	.txt_box{width:65%;}	
	#content_bottom {display:none;}

	#footer{margin-top:40px}
}

@media screen and (max-width:765px){
	#header {height: 66px;}
	#header #logo{background-size: contain;}
	
	/* .sub_visual{height: 236px;  padding-top: 90px;} */
	.sbg{height:236px;}
	.sub_visual #d_title {font-size: 30px;}
	
	#contents_box { padding-top: 40px;}

	.title {font-size: 24px; margin-bottom: 20px;}

	#navigation {display:none}
	#title_box{height:30px;}	
	
	#snb{height: 50px; line-height: 52px;}
	.subNaviUl{position:relative;}
	.subNaviUl .mhide{display:none}
	.subNaviUl > li { width: 45%; box-sizing:border-box;  height:50px;}
	.subNavi .subNavi_hide{ width: 100%;}
	.subNavi > a { padding: 0 20px;  text-overflow: ellipsis; white-space: nowrap; overflow: hidden; word-break: normal; display: inline-block; width: 100%;  float: left; font-size: 15px;}
	.subNavi .subNavi_hide{top:50px}


	.list_table thead th{font-size:14px;}
	.list_table tbody td{font-size:14px;}
	.list_idx,
	.list_member_name,
	.list_visit{display:none;}
}


#module_search_box{border-top: 1px solid #d9d9d9; border-bottom: 1px solid #d9d9d9;  background: #f8f8f8; height: 42px;}
#module_search_box fieldset select#search{font-size:14px; width:120px; height:20px}
#module_search_box fieldset input#keyword{font-size:14px; width:150px; height:20px}

.board_gallery ul li .list{margin-top: 12px;}
.board_gallery ul li .list a{font-size:15px}
.board_gallery ul li span.date{margin-top:0}

@media screen and (max-width:499px){
	.list_reg_date{display:none;}
}

#content .search_result_menu dd ul li span, #content .search_result_board dd ul li span, #content .search_result_content dd ul li span,  #content .search_result_image dd ul li span {text-align:left;font-size:14px}
#content .search_result_menu .menu_view .title, #content .search_result_board .board_view .title, #content .search_result_content .web_view .title {margin-bottom:5px}


/* 소장품 */

@media screen and (max-width:765px){
	.board_gallery ul li{width:calc(100% / 2 - 20px); margin: 0 5px 20px;}
	.board_gallery ul li span.img{width:100% !important;}
}