@charset "utf-8";

@media screen and (max-width:640px) {
	/************** 공통 **************/
	body{font-family:'Noto sans KR', "Helvetica Neue", Helvetica, Arial, sans-serif;}
	
	h3 {font-size:18px; font-family:'Noto sans KR', "Helvetica Neue", Helvetica, Arial, sans-serif;}
	h4 {font-size:17px;}
	h5 {font-size:15px; color:#444;}
	table, pre {font-family:'Noto sans KR', "Helvetica Neue", Helvetica, Arial, sans-serif;}
	input, select, textarea {font-family:'Noto sans KR', "Helvetica Neue", Helvetica, Arial, sans-serif;}
	
	
	.comming {width:100% !important; min-height:250px !important; height:auto !important; background-size:100% !important;}


	/************** 해더 **************/
	#header {width:100%; height:auto; box-sizing:border-box; border-bottom:2px solid #515151;}
	#logo {padding:10px 20px; height:auto;}
	#logo a {display:block; line-height:0;}
	#logo img {width:50%;}
	#gnb {display:none;}
	.all {display:none;}
	#searchBox {display:none;}
	
	#lnb {display:none; width:100%; min-height:1000px; position:absolute; right:0; top:0; background-color:rgba(0,0,0,0.8); border-top:none; margin-top:0;}
	#lnb li {position:relative; float:right; height:auto; margin:0; border-bottom:1px solid #b0b0b0; text-align:left; width:70%; background:#fff;}
	#lnb li .fa {display:inline-block; position:absolute; right:13px; top:14px;}
	#lnb li .fa-2x {font-size:1.5em;}
	#lnb li.first {margin:0;}
	#header .sub_1100 li:first-child, #header .sub_1200 li:first-child, #header .sub_1300 li:first-child, #header .sub_1400 li:first-child, #header .sub_1500 li:first-child, #header .sub_1600 li:first-child, #header .sub_1700 li:first-child, #header .sub_1800 li:first-child{ margin:0; display:block; border-top:none;}
	#lnb li a {font-size:15px; padding:13px;}
	#lnb li a:hover { text-decoration:none; color:#0dac7d;  border-bottom:none; display:block;}
	
	#lnb li ul {box-sizing:border-box;}
	#lnb li ul li {border-bottom:none; background-color:#f6f6f6; width:100%;}
	
	#lnb .close {display:inline-block; position:absolute; top:0; left:17%; font-size:55px; height:55px; line-height:100%;}
	#lnb .close a {color:#fff; }
	
	/* snb_lnb */
	#header {width:100%;}
	#header .depth2 {width:100%; position:static; background:none; background-color:#f6f6f6; padding:10px 20px; display:block !important; border-bottom:none;}
	#header .depth2 li {clear:both; height:30px;}
	#header .depth2 li a {color:#4f4f4f; height:22px; padding:4px 5px;}
	#header .depth2 li a:hover {color:#0dac7d;}
	
	/* 전체메뉴 버튼 */
	#m_lnb {display:block; height: 46px; right: 0;  overflow: hidden; position: absolute; top: 0; width: 46px;}  
    #m_lnb a::after {content: ""; display: block;}
	#m_lnb a .ico_side::before {top: 6px;}
	#m_lnb .ico_side::after, #m_lnb .ico_side::before {background-color: #515151; box-shadow: 0.5px 1px 0 #424242 inset; content: ""; height: 2px; left: 0; position: absolute; width: 20px;}
	#m_lnb .ico_side::after {top: 12px;}
	#m_lnb .ico_side::after, #m_lnb .ico_side::before {background-color: #515151; box-shadow: 0.5px 1px 0 #424242 inset; content: ""; height: 2px; left: 0; position: absolute; width: 20px;}
 	#m_lnb .ico_side {background-color: #515151; box-shadow: 0.5px 1px 0 #424242 inset; display: block; height: 2px; left: 14px; position: absolute; top: 18px; width: 20px;}
 	#m_lnb .txt_g {color: transparent; display: block; font-size: 11px; height: 46px; overflow: hidden; width: 46px;}
	
	/* 2depth */
	#basic {display:block; margin-top:32px;}
	
	/************** 서브 레이아웃 **************/
	/* 공통 */
	#sub_page, #wrap_sub_navi #sub_navi {width:100%; box-sizing:border-box;}
	/* 서브비주얼 */
	#sub_visual {display:none;}
	
	/* 콘텐츠 네비 */
	#wrap_sub_navi {position:absolute; left:0; top:59px; border-top:none; height:32px; width:100%; overflow:hidden;}
	#wrap_sub_navi #sub_navi {height:32px; width:109%;}
	#wrap_sub_navi #sub_navi span {height:32px;}
	#wrap_sub_navi #sub_navi span a {padding:8px 10px 5px;	}
	#wrap_sub_navi #sub_navi span.current {padding:8px 10px 5px; height:19px; }
	/* 콘텐츠 영역 */
	#sub_page {border-top:12px solid #eee; border-bottom:12px solid #eee; padding:15px 15px 40px;}
	#sub_visual .title {display:none;}	
	#sub_page h2 {display:none;}
	#page {margin:0; font-size:15px;}

	/************** 푸터 **************/
	#wrap_footer {clear:both; width:100%; min-width:auto; height:auto; border-top:2px solid #000; overflow:hidden;}
	#footer{width:100%; position:relative; padding:20px 0 0 0; margin:0 auto; overflow:hidden; box-sizing:border-box;}
	#foot_menu {display:none;}
	#foot_info {clear:both; width:100%; font-size:13px; text-transform:uppercase; text-align:center;}
	#foot_info address {padding:0 10px 5px;}
	#foot_info address span {display:inline}
	#foot_info p {text-align:center; padding:0 10px;}
	#foot_info p span {display:inline}

	#foot_info p.pdt20 {background-color:#515151; padding:20px; margin-top:20px; color:#fff; text-transform:none;}
	
	#foot_language {display:block; overflow:hidden; margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid #ccc;}
	#foot_language li {float:left; width:25%; text-align:center;}
	.top {display:block; position:fixed; right:20px; bottom:50px;background:#0dac7d; border-radius:100px; z-index:100;}
	.top a {color:#fff; display:block; line-height:0; padding:15px 12px; }
	
	/* sns */
	.sns {position:static; width:94px; margin:20px auto; overflow:hidden;}
	
	/************** 메인 **************/
	/* 슬라이더 */
	#wrap_mainslide {display:none;}
	#m_wrap_mainslide {display:block;}
	#mainslide { height:auto;}
	#mainslide li {width:100%; height:auto;}
	#mainslide .pic {width:100%; height:auto;}
	#mainslide .title_box {bottom:0; height:40px; text-align:center; width:100%; box-sizing:border-box; padding:12px 10px 0; font-size:16px; letter-spacing:-0.5px;}
	.bx-wrapper {width:100%; margin:0;}
	.bx-wrapper img {width:100%;}
	.bx-wrapper .bx-viewport {width:100%;} 
	.bx-controls {width:100%; bottom:5px;}
	.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {position:static; text-align:center; width:100%;}
	.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {display:none;}
	.bx-wrapper .bx-pager .bx-pager-item, .bx-wrapper .bx-controls-auto {width:30px;}
	.bx-wrapper .bx-pager.bx-default-pager a {background-size:100%;}
	.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active {background-size:100%;}
	
	/* 콘텐츠 영역 */
	#wrap_main_contents {display:none;}
	#m_wrap_main_contents {display:block;}
	
	/* 바로가기 아이콘 */
	#m_wrap_main_contents .m_bookmark {width:100%; padding:10px; box-sizing:border-box; overflow:hidden; border-bottom:12px solid #eee;}
	#m_wrap_main_contents .m_bookmark li {float:left; padding:10px; width:25%; text-align:center; box-sizing:border-box; font-weight:600; font-size:13px;}
	#m_wrap_main_contents .m_bookmark li img {width:100%;}
	
	/*주요 소장품*/
	#m_main_collections {width:100%; position:relative; box-sizing:border-box; border-top:1px solid #cccccc; border-bottom:12px solid #eee; overflow:hidden;}
	#m_main_collections h2 {padding:15px 10px; font-size:16px;}
	.collStyle {float:none; width:100%; height:auto;}
	.collStyle li {float:left; width:50%; box-sizing:border-box; padding:0 10px; margin-bottom:15px;}
	.collStyle li .pic {height:120px; overflow:hidden;}
	.collStyle li .pic img {width:100%; min-height:120px;}
	.collStyle li p {border:1px solid #ededed; border-top:none; margin:0; padding:10px;}
	.collStyle li p span {display:block; text-align:center; line-height:140%;}
	.collStyle li p span.size {color:#939393;}
	#m_main_collections .more {font-size:30px;position:absolute; top:15px; right:10px; height:30px; line-height:15px; color:#0dac7d;}
	#m_main_collections .more a {color:#0dac7d;}
	
	/* 공지사항 */
	#m_main_notice {width:100%; position:relative; box-sizing:border-box; border-top:1px solid #cccccc; border-bottom:12px solid #eee; overflow:hidden;}
	#m_main_notice h2 {padding:15px 10px; font-size:16px;}
	#m_main_notice ul {float:none; width:100%; height:auto; padding:0 10px 15px; box-sizing:border-box;}
	#m_main_notice ul li{color:#6d6d6d; padding:19px 0; height:24px; padding: 0 0 0 10px; letter-spacing:-0.5px; background:url(/images/index/notice_bullet.gif) no-repeat scroll 0 center;}
	#m_main_notice ul li a:hover{color:#0dac7d; text-decoration:none; font-weight:600;}
	#m_main_notice ul li .subject {float:left; width:70%;}
	#m_main_notice ul li .date {float:right; text-align:right; width:30%;}
	#m_main_notice .more {font-size:30px;position:absolute; top:15px; right:10px; height:30px; line-height:15px; color:#0dac7d;}
	#m_main_notice .more a {color:#0dac7d;}
	
	/* 교육 */
	#m_main_education {width:100%; position:relative; box-sizing:border-box; padding-bottom:10px; border-top:1px solid #cccccc; border-bottom:12px solid #eee; overflow:hidden;}
	#m_main_education h2 {padding:15px 10px; font-size:16px;}
	#m_main_education .pic {float:left; width:45%; padding:0 10px; box-sizing:border-box;}
	#m_main_education .pic img {width:100%;}
	#m_main_education dl {float:right; width:55%; padding-right:10px; box-sizing:border-box; text-align:justify; letter-spacing:-0.5px;}
	#m_main_education dl dt {font-weight:600; font-size:15px; margin-bottom:5px;}
	#m_main_education dl dd {font-size:13px;}
	#m_main_education dl dd span {display:block;}
	#m_main_education .more {font-size:30px;position:absolute; top:15px; right:10px; height:30px; line-height:15px; color:#0dac7d;}
	#m_main_education .more a {color:#0dac7d;}
	

	/* 관람시간 */
	#m_main_openinghour {width:100%; position:relative; box-sizing:border-box; padding:0 10px 25px; border-top:1px solid #cccccc; border-bottom:12px solid #eee; overflow:hidden;}
	#m_main_openinghour h2 {padding:25px 0 5px; text-align:center; font-size:16px;}
	#m_main_openinghour p {text-align:center; margin:0;}
	#m_main_openinghour .time{ font-size:28px; color:#555; letter-spacing:-0.5px; display:block; padding:0;}
	#m_main_openinghour .time strong{ color:#0dac7d; margin-right:10px; padding:0;}
	#m_main_openinghour .txt{ margin-bottom:25px; line-height:130%;}


	/************** 콘텐츠(임시) **************/
	/* 김창열 > 화가 김창열 
	.ktm, .ktm .textbox {width:100% !important;}
	.ktm img {width:100% !important;}
	.ktm .textbox p {margin:0;}
	.ktm .textbox p.talk {font-size:20px; font-weight:600; margin:15px 0;}
	.mgr48, .mgb50, .mgt65 {margin:0 !important;}
	*/
	
	
	
	/* 김창열 > 삶 
	.ktmlife, .ktmlife .textbox {width:100%;}
	.ktmlife .imgbox {margin:20px 0 10px;}
	.ktmlife .imgbox img {width:100%; margin:0;}
	.ktmlife .textbox p {margin:0;}
	.ktmlife .textbox .point {font-size:20px; background:none; color:#000; font-weight:600; padding:0;}
	.ktmlife .textbox p.mgt30 {margin-top:20px !important;}
	.mgr48, .mgb50, .mgt65 {margin:0 !important;}
	*/
	
	
	/* 김창열 > 작품세계 
	#contenttabmenu04 {height:auto;}
	#contenttabmenu04 ul li {width:100%; border:1px solid #d4d4d4; border-bottom:none; box-sizing:border-box; margin-bottom:10px;}
	.workworld {width:100%;}
	.workworld .textbox {width:100%;}
	.workworld .imgbox {margin:20px 0 10px;}
	.workworld .imgbox img {width:100%; margin:0;}
	.workworld .textbox p {margin:0;}
	.workworld .textbox .point {font-size:20px; background:none; color:#000; font-weight:600; padding:0;}
	.workworld .textbox p.mgt30 {margin-top:20px !important;}
	.mgr48, .mgb50, .mgt65 {margin:0 !important;}
	*/
	
	
	/* 김창열 > 주요전시 
	#annual_report {width:100%;}
	.annual_report_title {height:auto; overflow:hidden;}
	.annual_report_title .con_txt {float:none; padding:20px 0 20px 35px}
	.annual_report_title .con_txt p.txt {margin:0;}
	.annual_report_title .pic {float:none;}
	.annual_report_title .pic img {width:100%;}
	.annual_report_list {margin-top:20px; margin-bottom:0; border:none;}
	.annual_report_list .age {font-size:25px; border:1px solid #e5e5e5; padding:10px; margin-bottom:10px; background-position:right top; width:100%; box-sizing:border-box;}
	.annual_report_list .area {font-size:25px; border:1px solid #ddd; padding:10px; margin-bottom:10px; background-position:right top; width:100%; box-sizing:border-box;}
	.annual_report_list .history {background:none; width:100%; padding:0;}
	.annual_report_list .history li span.year {float:none; display:block; padding-left:10px; background-size:5%;}
	.annual_report_list .history li span.first {background:url("/images/ktm/year_line_bg02.gif") no-repeat left center; background-size:5%;}
	.annual_report_list .history li span.data {float:none; display:block; padding-left:10px;}
	*/
	
	
	/* 미술관소개 > 인사말 
	#greeting {width:100%;}
	#greeting .textbox {width:100%;}
	#greeting .imgbox {width:100%; height:200px; overflow:hidden;}
	#greeting .imgbox img {width:100%; margin-top:-50px;}
	#greeting .textbox h3 {font-family:"맑은 고딕", "돋움", "굴림", sans-serif, "Nanum Gothic"; font-size:25px; margin:0 0 20px;}
	#greeting .textbox h4 {font-size:20px;}
	.mgr50 {margin:0 !important;}
	*/
	
	
	/* 미술관소개 > 연혁 
	#history {width:100%;}
	#history .annual_report_title {height:auto; overflow:hidden;}
	#history .annual_report_title .con_txt {float:none; padding:20px 0;}
	#history .annual_report_title .con_txt p.stitle {text-align:center;}
	#history .annual_report_title .con_txt p.txt {margin:0; text-align:center;}
	#history .annual_report_title .pic {float:none;}
	#history .annual_report_title .pic img {width:100%;}
	#history .annual_report_list {margin-top:20px; margin-bottom:0; border:none;}
	#history .annual_report_list .age {font-size:25px; border:1px solid #e5e5e5; padding:10px; margin-bottom:10px; background: url("/images/ktm/annual_bullet.png") no-repeat left center; background-position:right top; width:100%; box-sizing:border-box;}
	#history .annual_report_list .area {font-size:25px; border:1px solid #ddd; padding:10px; margin-bottom:10px; background-position:right top; width:100%; box-sizing:border-box;}
	#history .annual_report_list .history {background:none; width:100%; padding:0;}
	#history .annual_report_list .history li span.year {float:none; display:block; padding-left:10px; background-size:5%;}
	#history .annual_report_list .history li span.first {background:url("/images/ktm/year_line_bg02.gif") no-repeat left center; background-size:5%;}
	#history .annual_report_list .history li span.data {float:none; display:block; padding-left:10px;}
	*/
	
	
	/* 미술관소개 > 건축 
	#architecture {width:100%;}
	#architecture .pic{ margin-bottom:0px;}
	#architecture .pic img {width:100%;}
	#architecture .title {float:none; width:100%; margin:25px 0;}
	#architecture .title img {width:100%;}
	#architecture .txt {float:none; width:100%;}
	#architecture .floor_plan img {width:100%;}
	#architecture .list {width:100%; height:auto; padding:20px; box-sizing:border-box;}
	#architecture .list ol {float:none; margin:0;}
	*/
	
	
	/* 미술관소개 > MI 
	#mi {width:100%;}
	#mi .logotype {float:none; width:100%;}
	#mi .logotype img {width:100%;}
	.button_gray {float:left; width:49%; box-sizing:border-box; padding:6px 0; text-align:center; margin:10px 0 20px !important; -webkit-appearance:none; -webkit-border-radius:0;}
	.button_white {float:right; width:49%; box-sizing:border-box; padding:6px 0; text-align:center; margin:10px 0 20px !important; -webkit-appearance:none; -webkit-border-radius:0;}
	#mi .basic_logo {height:auto;}
	#mi .basic_logo img {width:100%; margin:0;}
	#mi .tac img{width:100%;}
	#mi .color {height:auto; overflow:hidden; }
	#mi .color li {width:50%; height:auto; box-sizing:border-box; border-right:none; padding:20px 0;}
	#mi .graphic li {width:50%; line-height:0;}
	#mi .graphic li img {width:100%;}

	#mi .graphic li p strong {display:block;}
	.mgr50 {margin:0 !important;}
	*/
	
	
	/* 미술관소개 > 오시는길 
	.location {width:100%;}
	.location .address {padding:0;}
	.location .address .icon {display:none;}
	.location .address ul {float:none; width:100%; padding:0; border:none; margin-top:10px;}
	.location .address ul li {height:auto;}
	.location .address ul li .title {float:none; display:block;}
	.location .address ul li .text {float:none; display:block; margin:0 !important;}
	
	#contenttabmenu03 {height:auto;}
	#contenttabmenu03 ul li {width:100%; border:1px solid #d4d4d4; border-bottom:none; box-sizing:border-box; margin-bottom:10px;}
	.button_art_round {display:none;}
	
	.root_daum_roughmap {width:100% !important;}
	.location .map img {width:100%;}
	
	.location table.tstyle3 {display:none;}
	.car_contactus, .bus_contactus {display:block; margin-top:15px;}
	.car_contactus p, .bus_contactus p {padding-bottom:20px; border-bottom:1px solid #e6e6e6;}
	*/
	
	
	/* 관람안내 > 이용안내 
	#visit {width:100%;}
	#visit li {text-align:justify;}
	.ofh ul.con01 {margin:0 0 0 10px !important;}
	#visit table.tstyle3 {display:none;}
	.m_visit {display:block;}
	.m_visit table.tstyle3 {display:block !important;}
	*/
	
	
	
	/* 관람안내 > 시설안내 
	#facilities {width:100%;}
	#facilities .imgbox {margin-bottom:0;}
	#facilities .imgbox img {display:none;}
	#facilities .imgbox .showroom {width:100%; position:static; height:auto;}
	#facilities .imgbox .showroom li {width:100%; box-sizing:border-box; padding:20px; background:none; border:1px solid #e5e5e5; border-bottom:none;}
	#facilities .imgbox .showroom li.end {padding:20px; border-bottom:1px solid #e5e5e5;}

	#facilities .facility {margin:0;}
	#facilities .facility li {float:none; width:100%; margin:0; text-align:center; padding:20px 15px; box-sizing:border-box; border:1px solid #e5e5e5; border-bottom:none;}
	#facilities .facility li.end {border-bottom:1px solid #e5e5e5;}
	#facilities .facility li img {width:100%;}
	*/
	
	
	
	/* 참여마당 > 관련사이트 
	#site {display:none;}
    #m_site {display:block; width:100%;}
    #m_site ul.con02 {border:1px solid #e6e6e6; padding:15px;}
	*/
	
	
	
}