@charset "utf-8";
/* ======================================== Layout ======================================== */
#subVisual{position:relative;width:1820px;margin:0 auto;text-align:center;overflow:hidden;}
#subVisual > h2{display:block;height:100px;line-height:100px;position:absolute;top:50%;right:0;left:0;margin-top:-50px;color:#fff;font-size:42px;text-align:center;}

#lnb{float:left;width:170px;padding:60px 0;}
#lnb ul.deaph1 > li{margin-bottom:20px;}
#lnb ul.deaph1 > li > a{display:inline-block;font-size:18px;}
#lnb ul.deaph1 > li.active > a{font-weight:bold;border-bottom:1px solid #171717;}
#lnb ul.deaph2{padding-top:10px}
#lnb ul.deaph2 > li > a{display:inline-block;padding-left:15px;margin-bottom:10px;position:relative;font-size:16px;}
#lnb ul.deaph2 > li:last-child > a{margin-bottom:0;}
#lnb ul.deaph2 > li > a:before{display:block;content:'';width:5px;height:1px;position:absolute;top:12px;left:4px;background-color:#171717;}
#lnb ul.deaph2 > li.active > a{font-weight:bold;text-decoration:underline;}

#subSection{float:right;width:960px;min-height:650px;padding-bottom:100px;}
#subSection .subPath{height:60px;}
#subSection .subPath ul{float:right;}
#subSection .subPath ul:after{display:block;content:'';clear:both;}
#subSection .subPath li{position:relative;float:left;padding-right:26px;}
#subSection .subPath li:after{display:block;content:'';position:absolute;right:0;top:0;width:26px;height:60px;background:url(../images/common/icon_path_arrow.png) no-repeat center center;}
#subSection .subPath li:last-child{padding-right:0;}
#subSection .subPath li:last-child:after{display:none;}
#subSection .subPath a{display:block;height:60px;line-height:60px;font-size:13px;}
#subSection .subPath img{display:inline-block;margin-top:-3px;}
#subSection h3{display:block;height:52px;line-height:60%;margin-bottom:40px;border-bottom:1px solid #e4e4e4;font-size:38px;font-weight:bold;word-break:keep-all;}

#container.archive #subSection{float:none;min-height:800px;padding:45px 40px;margin:-100px 0 100px;width:100%;background-color:#fff;box-sizing:border-box;}
#container.archive #subVisual > h2{margin-top:-100px;}
#container.archive #subSection h3{line-height:normal;margin:50px 0 20px;border-bottom:0;text-align:center;font-size:30px;}
#container img{max-width:100% !important;height:auto !important;}

#subContent .h4Content{padding-bottom:50px;line-height:160%;}
#subContent .h4Content h4{line-height:100%;margin-bottom:20px;font-size:26px;font-weight:bold;}
#subContent .h5Content{padding-bottom:30px;line-height:160%;color:#555;}
#subContent .h5Content h5{line-height:100%;margin:20px 0;color:#171717;font-size:19px;}

/*modal*/
.modalWrap{display:none;position:fixed;top:50%;left:50%;width:600px;height:600px;margin-top:-300px;margin-left:-300px;background-color:#fff;border:2px solid #181818;overflow:hidden;z-index:999;}
.modalWrap.active{display:block;}
.modalWrap .modalContent{padding:25px;}
.modalWrap .modalContent .modalSubject{height:50px;line-height:50px;border-bottom:2px solid #181818;font-size:24px;font-weight:bold;}
.modalWrap .modalContent .modalText{height:460px;padding:20px 0;overflow-x:hidden;overflow-y:auto;line-height:180%;}
.modalWrap.active .modalClose{display:block;width:40px;height:40px;position:absolute;top:25px;right:25px;background:url(../images/common/icon_btn_close.png) no-repeat center center;text-indent:-9999px;z-index:1000;}

/*소개>APAP*/
ul.ulColRow{margin:0 -20px;}
ul.ulColRow:after{display:block;content:'';clear:both;}
ul.ulColRow > li{float:left;padding:20px;box-sizing:border-box;}
ul.ulColRow.col2 > li{width:50%;}
ul.ulColRow.col3 > li{width:33.3333%;}
ul.ulColRow.col4 > li{width:25%;}
ul.ulColRow.col5 > li{width:20%;}
ul.ulColRow span{display:block;padding:5px 0;color:#555;}

div.bordergray{padding:30px;border:1px solid #ececec;}
div.bgGray{padding:25px 40px;background-color:#f3f3f3;}

h4 span.font_normal{display:inline-block;position:relative;padding-right:30px;font-weight:normal;}
h4 span.font_normal:after{display:block;position:absolute;content:'';right:14px;top:3px;width:1px;height:22px;background:#171717;}
.APAP_infoBox{margin-bottom:15px;}
.APAP_infoBox:last-child{margin-bottom:0px;}
.APAP_infoBox:after{display:block;content:'';cleaR:both;}
.APAP_infoBox img{margin-bottom:5px;}
.APAP_infoBox p.right{font-size:13px;line-height:135%;text-align:right;color:#787878;}
.APAP_infoBox > div.left{float:left;width:445px;box-sizing:border-box;}
.APAP_infoBox > div.right{float:right;width:483px;box-sizing:border-box;}

.history{border-top:2px solid #181818;}
.history > li{position:relative;padding:18px 0 12px 255px;border-bottom:1px solid #ddd;box-sizing:border-box;}
.history > li > b.title{position:absolute;top:18px;left:18px;font-size:18px;font-weight:bold;color:#171717;}
.history > li > ul li{margin-bottom:3px;font-size:16px;color:#171717;}
.history > li > ul li:last-child{margin-bottom:0px;}

/*소개>이전APAP*/
div.historyAPAP .itemImg{position:relative;height:400px;padding:40px 30px;margin-bottom:70px;margin-right:40px;background-color:#e6e6e6;box-sizing:border-box;}
div.historyAPAP .itemImg .img{position:absolute;top:40px;right:-40px;display:block;overflow:hidden;}
div.historyAPAP .itemImg .img img{display:block;width:668px;height:400px;}
div.historyAPAP ul.imgInfo{position:relative;width:220px;height:340px;}
div.historyAPAP ul.imgInfo li.cate1{font-size:22px;}
div.historyAPAP ul.imgInfo li.cate2{padding:30px 0 20px;line-height:110%;font-weight:bold;font-size:40px;word-break:keep-all;}
div.historyAPAP ul.imgInfo li.cate3{font-size:26px;letter-spacing:-1px;}
div.historyAPAP ul.imgInfo li.cate4{position:absolute;bottom:0;font-size:14px;}

div.historyAPAP .itemInfo{position:relative;margin:40px 0;}
div.historyAPAP .itemInfo > .img{margin:30px 0;}

/* 작품보기*/
.workView{}
.workView .workMap{padding:30px 0 50px;}
#daumRoughmapContainer1534138165627{width:100%;}
.workView .workList{padding:30px;border-top:2px solid #181818;}
.workView .workList ul li{position:relative;padding-left:50px;padding-bottom:12px;}
.workView .workList ul li em{display:block;width:30px;text-align:right;position:absolute;left:0;top:0;}
.workView .workList ul li a.subject{display:block;line-height:100%;font-size:20px;font-weight:bold;}
.workView .workList ul li a.writer{display:block;font-size:15px;}
.artistWorks{display:none;}

/* 오시는길 */
.directionsMap{height:500px;margin-top:30px;border:1px solid #e4e4e4;overflow:hidden;}
.directionsMap iframe{width:100%;height:500px;border:0 none;}
.directions{padding-bottom:20px;border-bottom:1px solid #e4e4e4;}
.directions li{position:relative;min-height:100px;padding-left:130px;margin-bottom:30px;}
.directions li.bus{background:url(../images/sub/img_sub4-1.png) no-repeat 0 0;}
.directions li.car{background:url(../images/sub/img_sub4-2.png) no-repeat 0 0;}
.directions li.taxi{background:url(../images/sub/img_sub4-3.png) no-repeat 0 0;}
.directions li.park{background:url(../images/sub/img_sub4-4.png) no-repeat 0 0;}
.directions li b{display:block;margin-bottom:15px;font-size:20px;}

/* 아카이브 */
.tabBar.archive{margin-bottom:30px;border-top:2px solid #181818;}
.tabBar.archive > li > a{height:60px;line-height:60px;padding-left:30%;border:1px solid #d1d1d1;background-color:#f1f1f1;background-repeat:no-repeat;background-position:15% center;font-size:19px;font-weight:bold;}
.tabBar.archive > li.active > a{border:1px solid #181818;background-color:#181818;color:#fff;}
.tabBar.archive > li > a.icon_tab1{background-image:url(../images/sub/icon_tab1.png);}
.tabBar.archive > li > a.icon_tab2{background-image:url(../images/sub/icon_tab2.png);}
.tabBar.archive > li > a.icon_tab3{background-image:url(../images/sub/icon_tab3.png);}
.tabBar.archive > li > a.icon_tab4{background-image:url(../images/sub/icon_tab4.png);}
.tabBar.archive > li > a.icon_tab5{background-image:url(../images/sub/icon_tab5.png);}
.tabBar.archive > li > a.icon_tab6{background-image:url(../images/sub/icon_tab6.png);}
.tabBar.archive > li.active > a.icon_tab1{background-image:url(../images/sub/icon_on_tab1.png);}
.tabBar.archive > li.active > a.icon_tab2{background-image:url(../images/sub/icon_on_tab2.png);}
.tabBar.archive > li.active > a.icon_tab3{background-image:url(../images/sub/icon_on_tab3.png);}
.tabBar.archive > li.active > a.icon_tab4{background-image:url(../images/sub/icon_on_tab4.png);}
.tabBar.archive > li.active > a.icon_tab5{background-image:url(../images/sub/icon_on_tab5.png);}
.tabBar.archive > li.active > a.icon_tab6{background-image:url(../images/sub/icon_on_tab6.png);}

.tabBar.archive2{margin-bottom:30px;}
.tabBar.archive2 > li > a{display:block;padding:20px;border:1px solid #d1d1d1;text-align:center;}
.tabBar.archive2 > li.active > a{border:1px solid #181818;}
.tabBar.archive2 > li > a > b{display:block;height:40px;line-height:40px;font-size:22px;}
.tabBar.archive2 > li > a > span{display:block;height:20px;line-height:20px;font-size:16px;color:#666;}

.division{padding:0 25px;border:1px solid #d1d1d1;}
.division.theme dl{padding:20px 0 10px;border-bottom:1px solid #e8e8e8;}
.division.theme dl:last-child{border-bottom:0;}
.division.theme dt{font-size:18px;color:#171717;font-weight:bold;}
.division.theme dd{padding:15px;}
.division.theme dd ul:after{display:block;content:'';clear:both;}
.division.theme dd ul li{float:left;width:33.3333%;box-sizing:border-box;}
.division.theme dd a{display:inline-block;padding:2px 6px 4px;font-size:17px;}
.division.theme dd a > b{color:#171717;font-weight:bold;}
.division.theme dd a > span{color:#666;}
.division.theme dd a.active{background-color:#181818;}
.division.theme dd a.active > b,
.division.theme dd a.active > span{color:#fff;}
.division.time{padding:25px;}
.division.time ul:after{display:block;content:'';clear:both;}
.division.time ul li{float:left;width:33.3333%;box-sizing:border-box;}
.division.time ul.col4 li{width:25%;}
.division.time a{display:inline-block;padding:2px 6px 4px;font-size:17px;}
.division.time a > b{color:#171717;font-weight:bold;}
.division.time a > span{color:#666;}
.division.time a.active{background-color:#181818;}
.division.time a.active > b,
.division.time a.active > span{color:#fff;}

.division.Author .consonant{padding:20px;border-bottom:1px solid #e8e8e8;text-align:center;}
.division.Author .consonant a{display:inline-block;width:38px;height:38px;line-height:38px;margin:3px 1px;border:1px solid #d1d1d1;color:#000;text-align:center;font-weight:bold;}
.division.Author .consonant a.active{border:1px solid #181818;background-color:#181818;color:#fff;}
.division.Author .consonantList{padding:30px;}
.division.Author .consonantList ol:after{display:block;content:'';clear:both;}
.division.Author .consonantList ol li{float:left;width:33.3333%;box-sizing:border-box;}
.division.Author .consonantList a{display:inline-block;padding:2px 6px 4px;font-size:17px;}
.division.Author .consonantList a > b{display:inline-block;color:#171717;font-weight:bold;}
.division.Author .consonantList a > span{display:inline-block;margin-left:10px;color:#666;}
div.thumbList.archive > ul > li{padding:10px 15px;}
div.thumbList.archive > ul > li > a{display:table;width:100%;height:150px;background-color:#f5f5f5;}
div.thumbList.archive > ul > li > a > b{display:table-cell;vertical-align:middle;width:100%;height:100px;padding:5px 20px;font-size:20px;}
div.thumbList.archive > ul > li > a > span{display:table-row;height:auto;line-height:normal;}

.division.keyword{position:relative;padding:30px 0;text-align:center;}
.division.keyword input[type=text]{display:inline-block;width:700px;height:50px;line-height:50px;padding:0 10px;border:1px solid #181818;}
.division.keyword input[type=submit]{display:inline-block;width:120px;height:50px;line-height:50px;background-color:#181818;color:#fff;border:0;text-align:center;}
.division.keyword input[type=button]{display:inline-block;width:120px;height:50px;line-height:50px;background-color:#181818;color:#fff;border:0;text-align:center;}

div.view.archive .info{margin-bottom:45px;font-weight:bold;text-align:center;border-bottom:2px solid #181818;}
div.view.archive .info .subject{display:block;font-size:42px;word-break:keep-all;}
div.view.archive .info .write{display:block;padding:10px 0 30px;font-size:18px;}
div.view.archive .relatedLayout{position:relative;}
div.view.archive .relatedInfo{position:absolute;top:0;right:0;width:300px;}
div.view.archive .relatedInfo > ul{padding:0 0 40px;border-bottom:1px solid #d1d1d1;}
div.view.archive .relatedInfo > ul > li{position:relative;padding:3px 0 3px 140px;color:#666;}
div.view.archive .relatedInfo > ul > li b{display:block;width:120px;padding:3px 0;position:absolute;top:0;left:0;}
div.view.archive .relatedInfo > div > b{display:block;}
div.view.archive .relatedInfo > div > p{padding:10px 0 40px;border-bottom:1px solid #d1d1d1;font-size:15px;color:#666;}

div.view.archive .relatedBook{position:relative;}
div.view.archive .relatedBook > .bookSubject{padding:5px 0;font-size:19px;font-weight:bold;}
div.view.archive .relatedBook > .BookNum{padding:5px 0;font-size:19px;}
div.view.archive .relatedBook > .img{display:block;width:210px;position:absolute;top:0;left:0;}
div.view.archive .relatedBook > .img img{display:block;width:100%;border:1px solid #d2d2d2;}
div.view.archive .relatedBook > ul{padding:20px 0 40px;margin-top:20px;border-top:1px solid #d1d1d1;}
div.view.archive .relatedBook > ul > li{position:relative;padding:3px 0 3px 120px;font-size:17px;}
div.view.archive .relatedBook > ul > li b{display:block;padding:3px;width:100px;position:absolute;top:0;left:0;}

div.view.archive .content{line-height:180%;margin-bottom:45px;}
div.view.archive .relatedGallery{margin-bottom:45px;}
div.view.archive .relatedGallery ul{margin:-10px;}
div.view.archive .relatedGallery ul li{float:left;width:33.3333%;padding:10px;cursor:pointer;box-sizing:border-box;}
div.view.archive .relatedGallery ul li img{display:block;width:100%;height:168px;}
div.view.archive .relatedGallery ul li:first-child{float:none;width:100%;}
div.view.archive .relatedGallery ul li:first-child img{height:375px;}
div.view.archive .relatedGallery ul li:first-child img.height_auto{width:100%;height:auto;}
div.view.archive .relatedWork{padding:10px 35px;background-color:#f5f5f5;}
div.view.archive .relatedWork dl{padding:10px 0;border-bottom:1px solid #dcdcdc;}
div.view.archive .relatedWork dl:last-child{border:0;}
div.view.archive .relatedWork dt{padding:10px 0;font-size:18px;font-weight:bold;}
div.view.archive .relatedWork dd{padding-bottom:5px;}
div.view.archive .relatedWork dd ul li{position:relative;margin:5px 0;}
div.view.archive .relatedWork dd ul li .img{display:block;width:30px;height:30px;border-radius:15px;margin-right:15px;position:absolute;top:0;left:0;overflow:hidden;}
div.view.archive .relatedWork dd ul li .img img{display:block;width:100%;height:30px;}
div.view.archive .relatedWork dd ul li a{display:block;height:30px;line-height:30px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:15px;}
div.view.archive .relatedWork dd ul li .img + a{padding-left:40px;}

.modalArchiveWrap{display:none;position:fixed;top:50%;left:50%;border:10px solid #fff;z-index:999;}
.modalArchiveWrap .bx-viewport{max-width:1200px;max-height:800px;}
.modalArchiveWrap ul{height:100%;}
.modalArchiveWrap li{height:100%;text-align:center;background:#center;}
.modalArchiveWrap li img{display:block;max-width:100%;max-height:100%;}
.modalArchiveWrap.active{display:block;}
.modalArchiveWrap .bx-controls-direction{display:none;}
.modalArchiveWrap .bx-controls-direction a{display:block;position:absolute;top:0;bottom:0;text-indent:-9999px;}
.modalArchiveWrap .bx-controls-direction a.bx-prev{left:-30px;right:60%;background:url(../images/common/btn_sliderPrev_archive.png) no-repeat left center;}
.modalArchiveWrap .bx-controls-direction a.bx-next{left:60%;right:-30px;background:url(../images/common/btn_sliderNext_archive.png) no-repeat right center;}
.modalArchiveWrap .modalClose{display:block;width:56px;height:56px;position:absolute;top:-10px;right:-10px;background:url(../images/common/icon_btn_close_archive.png) no-repeat center center;}



/* ======================================== Responsive ======================================== */
@media all and (max-width:1820px){
	#subVisual{width:100%;}
	#subVisual img{max-width:100%;}
}

@media all and (max-width:1180px){
	#lnb{display:none;}
	#subSection{float:none;width:100%;padding:20px;box-sizing:border-box;}
	#subVisual > h2{font-size:30px;}
	#subSection .subPath{display:none;}
	#subSection h3{margin:20px 0;font-size:30px;}

	.APAP_infoBox img{width:100%;max-width:100%;}
}

/*Mobile*/
@media all and (max-width:960px){
	#subVisual{}
	#subVisual img{width:auto;min-height:100px;}

	#container.archive #subVisual > h2{margin-top:-50px;}
	#container.archive #subSection{padding:20px;margin:0;}

	.modalWrap{width:90%;height:auto;top:80px;bottom:20px;margin-top:0;margin-left:-45%;overflow-y:auto;}

	ul.ulColRow span{height:50px;}
	.workView .workMap{width:100%;overflow:hidden;}

	.tabBar.col5 > li,
	.tabBar.col6 > li{width:33.3333%;}

	div.thumbList > ul.col4 > li{width:50%;}

	div.historyAPAP .itemImg{height:auto;padding:20px;margin-right:0;margin-bottom:20px;}
	div.historyAPAP .itemImg .img{position:static;}
	div.historyAPAP .itemImg .img img{width:100%;height:auto;}
	div.historyAPAP ul.imgInfo{width:auto;height:auto;margin-top:20px;}
	div.historyAPAP ul.imgInfo li{padding:10px 0 !important;}	
	div.historyAPAP ul.imgInfo li.cate4{position:static;}

	.APAP_infoBox > div.right,
	.APAP_infoBox > div.left{width:100%;}
	.APAP_infoBox > div.left{margin-bottom:15px;}


	.division{padding:0 10px;}
	.division.Author .consonant{padding:20px 0;}
	.division.Author .consonantList{padding:10px;}
	.division.theme dd ul li{width:100%;}
	.division.keyword input[type=text]{width:50%;}
	.division.theme dl{padding:10px 0 0;}
	.division.theme dd{padding:10px 5px;}
	.division.theme dd a{font-size:16px;}

	div.view.archive .info,
	div.view.archive .content{margin-bottom:20px;}
	div.view.archive .info .subject{font-size:30px;}
	div.view.archive .relatedLayout{padding-right:0;}
	div.view.archive .relatedGallery{margin-bottom:20px;}
	div.view.archive .relatedGallery ul{margin:-5px;}
	div.view.archive .relatedGallery ul li{padding:5px;}
	div.view.archive .relatedInfo{position:static;width:100%;margin-top:20px;}
	div.view.archive .relatedInfo > ul{padding:0 10px 20px;}
	div.view.archive .relatedInfo > div > p{padding:10px 0 20px;}

	.tabBar.archive > li > a{height:40px;line-height:40px;}
	.tabBar.archive2 > li > a{padding:5px;}
	.tabBar.archive2 > li > a > b{height:30px;line-height:30px;}
}

/*Phone*/
@media all and (max-width:639px){
	#container.archive #subSection h3{height:auto;margin:20px 0;}

	ul.ulColRow > li{text-align:center;}
	ul.ulColRow.col2 > li,
	ul.ulColRow.col3 > li{width:100%;}	
	div.bordergray{padding:10px;}

	div.historyAPAP .itemInfo .areaLeft{width:30%;}
	div.historyAPAP .itemInfo .areaRight{width:70%;}
	
	h4 span.font_normal{display:block;margin-bottom:15px;line-height:125%;}
	h4 span.font_normal:after{width:20px;height:1px;top:auto;left:0px;bottom:-9px;}
	.APAP_infoBox{margin-bottom:5px;}
	.APAP_infoBox > div.left{font-size:15px;}
	
	.history > li{padding:35px 10px 5px;}
	.history > li > b.title{top:10px;left:10px;font-size:16px;}
	.history > li > ul li{line-height:125%;font-size:15px;}

	.directions li{padding-left:0px;}
	.directions li.bus,
	.directions li.car,
	.directions li.taxi,
	.directions li.park{background-size:auto 50px;}
	.directions li b{height:50px;line-height:50px;margin-left:60px;}

	.tabBar.col3 > li, 
	.tabBar.col4 > li, 
	.tabBar.col5 > li,
	.tabBar.col6 > li{width:50%;}
	.tabBar.archive > li > a,
	.tabBar.archive2 > li > a > b{font-size:16px;}	

	div.thumbList > ul.col2 > li,
	div.thumbList > ul.col3 > li,
	div.thumbList > ul.col4 > li{width:100%;}

	div.historyAPAP ul.imgInfo li.cate2{font-size:26px;}
	div.historyAPAP ul.imgInfo li.cate3{font-size:20px;}
	div.historyAPAP .itemInfo > .img{margin:20px 0;}
	div.historyAPAP .itemInfo > .img img{max-height:60px;}

	
	.division.Author .consonantList ol li{width:100%;}
	.division.keyword{padding:10px 0;}
	div.view.archive .relatedWork{padding:0 10px;}
	div.view.archive .relatedGallery ul li:first-child img{height:auto;}
	div.view.archive .relatedGallery ul li img{height:65px;}
	div.view.archive .relatedBook{padding-left:0;}
	div.view.archive .relatedBook > .img{position:static;width:auto;margin-top:10px;}
	div.view.archive .relatedBook > .img img{width:auto;margin:0 auto;}

}

/*Tablet*/
@media all and (min-width:640px) and (max-width:960px){
}