.fixedclear::after{ display: block; content: ''; clear: both;}
.modal-bg{ display: none; width: 100%; height: 100%; background: rgba(0,0,0,0.8); position: fixed; z-index: 9999; left: 0; top: 0; }

.list-table td img, .gall-image img{ width: 100%; height: auto; }
.det-info{ border-top: 2px solid #000 !important; padding: 40px; }
.det-info .det-info-txt { line-height: 1.5; margin-bottom: 20px; }

.all-btn > a{ width: 120px; height: 40px; }
.all-btn a{ display: inline-block; line-height: 38px; text-align: center; margin-top: 10px; border: 1px solid #ddd; box-sizing: border-box; }
.list-btn, .down-btn{ float: right; }
.in-btn a{ margin-bottom: 30px; background-color: #283b82; color: #fff; border:none; }
.ico-s{ width: 22px; height: 22px; display: inline-block; text-indent: -99999px; vertical-align: middle; }
.ico-hwp{ background: url(../images/ico_hwp.png); }
.ico-pdf{ background: url(../images/ico_pdf.png); }
.ico-img{ background: url(../images/ico_img.png); }
.ico-down{ display: inline-block; width: 19px; height: 19px; background: url(../images/ico-down.png) no-repeat; margin-left: 10px; vertical-align: middle; }
.ico-down-btn{ background: url(../images/ico-down-btn.png) no-repeat; }
.ico-log{ width: 14px; height: 14px; display: inline-block; margin-left: 5px; }
.ico-login{ background: url(../images/ico-login.png) no-repeat; }
.ico-logout{ background: url(../images/ico-logout.png) no-repeat; }
.ico-non{ width: 20px; height: 26px; background: url(../images/ico-non.png) no-repeat;  }

.down-btn{ background-color: #283b82; color: #fff; border: 1px solid #283b82 !important; margin-right: 10px; }
.arrow_btn a{ float: left; width: 40px !important; height: 40px; box-sizing: border-box; }
.arrow_btn a img{ margin-top: 8px; }
.prev_btn{ margin-right: 10px; }
.cancel-btn{ background-color: #888 !important;  }
.write-btn-a, .write-btn-b{ float: right; }
.write-btn-a{ margin-left: 7px; }

.list-notice{ background: #283b82 url(../images/notice_bg.png) no-repeat 12px center ; color: #fff; border-radius: 20px; display: inline-block; padding: 3px 14px 3px 30px; }

/*//공통*/




#sub-container .inner { width:1380px; margin:0 auto; }
#sub-container .sub-visual { display:flex; align-items: center; justify-content: center; height:180px; }
#sub-container .sub-visual.bg1 { background-image:url(../images/sub_bg01.jpg)}
#sub-container .sub-visual h2 { font-size:4em; letter-spacing: -0.025em; text-align: center; font-family: 'Makgeolli', 'Noto Sans CJK KR','Malgun Gothic', '맑은 고딕', 'Dotum', '돋움', 'Gulim', '굴림', sans-serif; }

#sub-container .sub-locnav { height:55px; width:100%; background-color:#617889; }
#sub-container .sub-locnav .loc-selecters { border-left:1px solid rgba(255,255,255,0.5); border-right:1px solid rgba(255,255,255,0.5); }
#sub-container .sub-locnav .loc-selecters ul.selecter-list { display:flex}
#sub-container .sub-locnav .loc-selecters ul.selecter-list > li { position:relative; }
#sub-container .sub-locnav .loc-selecters ul.selecter-list > li a.home { display:block; width:55px; height:55px; border-right:1px solid rgba(255,255,255,0.5); font-size:0; text-indent: -9999em; background-image:url(../images/ico_home.png); background-repeat:no-repeat; background-position:center; }
#sub-container .sub-locnav .loc-selecters ul.selecter-list > li a.depth1-select,
#sub-container .sub-locnav .loc-selecters ul.selecter-list > li a.depth2-select { display:flex; justify-content: space-between; height:55px; padding:0 10px; align-items: center; border-right:1px solid rgba(255,255,255,0.5); min-width:225px; max-width:250px; color:#fff; }
#sub-container .sub-locnav .loc-selecters ul.selecter-list > li a.depth1-select::after,
#sub-container .sub-locnav .loc-selecters ul.selecter-list > li a.depth2-select::after { content:""; display:block; width:7px; height:5px; background-image:url(../images/select_arrow.png); background-repeat:no-repeat; }
#sub-container .sub-locnav .loc-selecters ul.selecter-list > li a.depth1-select span,
#sub-container .sub-locnav .loc-selecters ul.selecter-list > li a.depth2-select span { display:block; width:calc(100% - 10px); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; letter-spacing: -0.05em; }
#sub-container .sub-locnav .loc-selecters ul.selecter-list > li a.depth2-select { margin-left:-1px; }
#sub-container .sub-locnav .loc-selecters ul.selecter-list > li .depth1-list,
#sub-container .sub-locnav .loc-selecters ul.selecter-list > li .depth2-list { display:none; position:absolute; z-index: 2; width:100%; left:0; top:55px; background-color:#7793a7; border:1px solid rgba(255,255,255,0.2); box-shadow:0 3px 10px rgba(0,0,0,0.2); box-sizing: border-box; }
#sub-container .sub-locnav .loc-selecters ul.selecter-list > li .depth1-list.on,
#sub-container .sub-locnav .loc-selecters ul.selecter-list > li .depth2-list.on { display:block; }
#sub-container .sub-locnav .loc-selecters ul.selecter-list > li .depth2-list { left:-1px; width:calc(100% + 1px); }
#sub-container .sub-locnav .loc-selecters ul.selecter-list > li .depth1-list ul li a,
#sub-container .sub-locnav .loc-selecters ul.selecter-list > li .depth2-list ul li a { display:flex; padding:0 10px; height:45px; align-items: center; color:#fff; border-bottom:1px solid rgba(255,255,255,0.5); letter-spacing: -0.05em; }
#sub-container .sub-locnav .loc-selecters ul.selecter-list > li .depth1-list ul li:last-child a,
#sub-container .sub-locnav .loc-selecters ul.selecter-list > li .depth2-list ul li:last-child a { border-bottom:0; }

#contents { width:1380px; margin:0 auto; padding:50px 0; }
#contents h3.con-tit { font-size:2em; letter-spacing: -0.025em; font-weight:600; margin-bottom:40px; }
#contents .jeongjo-reapcon { position:relative; display:flex; align-items: center; justify-content: flex-end; width:100%; height:900px; background-color:#f8f8f8; margin-bottom:50px }
#contents .jeongjo-reapcon .bg { position:absolute; left:0; top:0; z-index: 1; width: 778px; height:900px; background-image:url(../images/jeongjo_conbg.png); background-repeat:no-repeat;}
#contents .jeongjo-reapcon .reapcon { width:50%; padding:35px; box-sizing: border-box; }
#contents .jeongjo-reapcon .reapcon .s-tit { font-family:'Makgeolli','Noto Sans CJK KR','Malgun Gothic', '맑은 고딕', 'Dotum', '돋움', 'Gulim', '굴림', sans-serif; font-size:2em; letter-spacing: -0.025em; }
#contents .jeongjo-reapcon .reapcon em.m-tit { display:block; margin-top:25px; font-size:2.5em; letter-spacing: -0.025em; font-weight:600; color:#d03337; }
#contents .jeongjo-reapcon .reapcon em.m-tit span { position:relative; display:block; width:max-content; margin-bottom:10px; }
#contents .jeongjo-reapcon .reapcon em.m-tit span::after { content:""; display:block; width:100%; height:2px; background-color:#d03337; position:absolute; bottom:0; }
#contents .jeongjo-reapcon .reapcon .reapcon-txt { margin-top:50px; }
#contents .jeongjo-reapcon .reapcon .reapcon-txt p { margin-bottom:30px; line-height:2; color:#444444; font-weight:300; letter-spacing: -0.025em; }
#contents .jeongjo-reapcon .reapcon .reapcon-txt p:last-of-type { margin-bottom:0; }

#contents .content-box { margin-bottom:35px; }
#contents .content-box:last-of-type { margin-bottom:0; }
#contents .content-box h4.con-stit { display:flex; align-items: center; font-size:1.55em; font-weight:600; letter-spacing: -0.025em; margin-bottom:20px;}
#contents .content-box h4.con-stit::before { content:""; width:24px; height:24px; background-image:url(../images/tit_bullet.png); background-repeat:no-repeat; margin-right:10px;}
#contents .content-box .content-table table { width:100%; border-top:2px solid #000 }
#contents .content-box .content-table table thead tr th { background-color:#eef3fa; font-weight:600; letter-spacing: -0.025em; padding:15px 0; border-right:1px solid #dddddd; border-bottom:1px solid #dddddd }
#contents .content-box .content-table table thead tr th:last-child { border-right:0; }
#contents .content-box .content-table table tbody tr td { vertical-align: middle; text-align: center; padding:15px 20px; font-weight: 100; color:#444444; letter-spacing: -0.025em; border-right:1px solid #dddddd; border-bottom:1px solid #dddddd }
#contents .content-box .content-table table tbody tr td.tl { text-align: left;}
#contents .content-box .content-table table tbody tr td:last-child { border-right:0; }
#contents .content-box .content-table table tbody tr td.border-r { border-right:1px solid #dddddd; }
#contents .content-box .content-table table tbody tr td ul.bullet li { display:flex; position:relative; margin-bottom:15px; }
#contents .content-box .content-table table tbody tr td ul.bullet li:last-child { margin-bottom:0; }
#contents .content-box .content-table table tbody tr td ul.bullet li::before { content:""; display:block; width:4px; height:4px; background-color:#444444; border-radius:50%; margin-top:7px; margin-right:5px; }

#contents .contents-ready { display:flex; align-items: center; justify-content: center; width:640px; margin:0 auto; border-radius:10px; min-height:400px; background-color:#f9f9f9; border:1px solid #ddd; box-shadow: ;}
#contents .contents-ready em { font-size:2em; font-weight:600; letter-spacing: -0.025em; color:#333;}
#contents .contents-ready em::before { content:""; display:block; width:150px; height:132px; margin:0 auto 35px auto; background-image:url(../images/ready_ico.png); background-repeat:no-repeat; }


/*이용안내 - 오시는길*/
.map-tap{ display: flex; justify-content: space-between; }
.map-tap a{ display: flex; justify-content: center; align-items: center; background-color: #f4f4f4; color: #444; width: 50%; font-size: 25px; padding: 20px 0; }
.map-tap a.active{ background-color: #283b82; color: #fff; }
.map-tap a i{ width: 30px; height: 21px; margin-right: 10px; }
.tab-car i{ background: url(../images/tab-car.png); }
.tab-bus i{ background: url(../images/tab-bus.png); }
.tab-car.active i{ background: url(../images/tab-car-at.png); }
.tab-bus.active i{ background: url(../images/tab-bus-at.png); }

.map-f{ display: none; border-top: 2px solid #000; }
.map-f-img{ float: left; text-align: center; box-sizing: border-box; border: 1px solid #ddd; overflow: hidden; background-color: #f4f4f4; }
.map-f-t { float: right; width: calc( 100% - 502px ); height: 403px; }
.map-f-t table{ text-align: center; font-size: 16px; width: 100%; height: 100%; word-break: keep-all; }
.map-f-t thead, .map-f-t tr{  border-bottom: 1px solid #ddd; line-height: 1.3; }
.map-f-t thead th{ background-color: #eef3fa; padding: 10px 0; }
.map-f-t thead th:last-of-type{ border-right: none; }
.map-f-t th{ font-weight: 600; vertical-align: middle; border-right: 1px solid #ddd; border-bottom: 1px; }
.map-f-t tbody{ color: #444; }
.map-f-t tbody tr td{ vertical-align: middle; }
.map-f-t tbody tr td:first-of-type{ border-right: 1px solid #ddd }

.map-way p { font-size: 20px; font-weight: 600; }

    /* 지도API */
    .con-map { display: flex; position:relative; margin-bottom: 30px;  border:1px solid #ddd; border-top:3px solid #283b82; }
    .con-map .map_info { background-color: #eef3fa; text-align: center; width: 430px; padding-top: 75px; }
    .con-map .map_info .map_wrap h4{ font-size: 30px; font-weight: 600; margin-bottom: 30px; }
    .con-map .map_info .map_wrap p{ line-height: 1.5; font-size: 20px; margin-bottom: 30px; }
    .con-map .map_info .map_wrap p span{display: inline-block; font-weight: 600; background: url(../images/ico_map.png) no-repeat left center; width: 60px; text-align: right; }
    .con-map .map_view { display: inline-block; background-color: #fff; border-radius: 30px; border: 2px solid #ddd; height: 45px; line-height: 45px; width: 180px; text-align: center; }
    .con-map .map_view img{ margin-left: 4px; }
    .wrap_controllers{ display: none; color:#000; }

/* 이용안내 - 관람안내 */
.info{ font-size: 16px; padding: 50px; border: 1px solid #ddd; background: url(../images/info_bg.jpg) no-repeat top center; border-top: 2px solid #000; }
.info-txt{ border-bottom: 1px solid #ddd; padding: 20px 0; width: 640px; }
.info-txt:first-of-type{ padding-top: 0; }
.info-txt:last-of-type{ border-bottom: none; padding-bottom: 0; }
.info-txt h4.con-stit{ float: left; width: 160px; height: 100%; margin-bottom: 0 !important; padding-bottom: 20px; }
.info-txt h4.con-stit::before{ float: left; }
.info-txt p{ color: #444; line-height: 2; }
.info-txt p:nth-of-type(2){ float: left; }
.info-txt p span{ font-weight: 600; color:#000; }
.info .day h4, .info .fee h4{ padding-bottom: 0; }  
.info .time span{ display: inline-block; width: 70px; } 
.info .point h4{ width: 100%; }

/* 이용안내 - 시설안내 */
.info-f-top{ margin-bottom: 60px; }
.info-f-img{ text-align: center; box-sizing: border-box; margin-right: 40px; border: 1px solid #ddd; width: 650px; height: 405px; overflow: hidden; float: left; }
.info-f-t { width: calc( 100% - 690px ); float: right; }
.info-f-t table{ height: 405px; text-align: center; font-size: 20px; width: 100%; border-top: 2px solid #000; }
.info-f-t thead, .info-f-t tr{ height: 25%; border-bottom: 1px solid #ddd; line-height: 1.3; }
.info-f-t tbody{ height: 75%; }
.info-f-t thead th{ background-color: #eef3fa; }
.info-f-t thead th:last-of-type{ border-right: none; }
.info-f-t th{ font-weight: 600; vertical-align: middle; border-right: 1px solid #ddd; border-bottom: 1px; }
.info-f-t td{ vertical-align: middle; }

.info-f-bottom .det-info{ text-align: center; padding: 70px 0; clear: both; }
.info-f-bottom h4{ float: left; }

.info-f-bottom .det-info h5 {color:#000; font-weight:600; font-size:20px; margin-bottom:20px; }
.info-f-bottom .mb30 { margin-bottom:30px;}

.info-f-tap{ float: right; display: flex; align-items: center; position: relative; bottom: 8px; }
.info-f-tap a{ margin-left: 20px; display: inline-block; font-size: 20px; width: 120px; padding: 10px 0; text-align: center; border-radius: 20px; border: 1px solid #ddd;}
.info-f-tap a.active { background-color: #283b82; color: #fff; border: none; }

/* 전시 - 상설전시 */
.eb-tap{ border-bottom:3px solid #1473b5; }
.eb-tap a{ float: left; text-align: center; line-height: 1.3; background-color: #fff; color: #444; width: 16.6666%; padding-top: 18px; font-size: 20px; height: 90px; border-top: 1px solid #ddd; border-right: 1px solid #ddd; box-sizing: border-box; }
.eb-tap a:first-of-type{ border-left: 1px solid #ddd; }
.eb-tap .ed-6-t{ line-height: 48px; }
.eb-tap a.active{ background-color: #1473b5; color: #fff; border-right: 0; border-top: 0; border-left: 0; }

.con-eb { border-bottom: 2px solid #ddd; padding: 40px 0; }
.eb-wrap{ display: none; width: 100%; }
.eb-wrap.active { display:flex;}
.eb-img{ background-color: #000; width: 848px; height: 502px; overflow: hidden; position: relative; }
.eb-img .swiper-slide img{  width: calc( 100% + 1px); }
.eb-img .swiper-button-prev, .eb-img .swiper-button-next{ width: 64px; height: 100px; background-size: 100%; }
.eb-img .swiper-button-prev{ background-image: url(../images/eb-slide-prev.png); }
.eb-img .swiper-button-next{ background-image: url(../images/eb-slide-next.png); }
.eb-img .swiper-pagination-bullet { width: 12px; height: 12px; background: #fff; opacity: .4; }
.eb-img .swiper-pagination-bullet-active { background: #1473b5; opacity: 1; }

.eb-txt{ line-height: 1.5; padding-top: 50px; padding-left: 50px; height: 500px; box-sizing: border-box; position: relative; }
.eb-txt h5{ font-size: 30px; font-weight: 600; }
.eb-txt p{ margin-top: 25px; word-break: keep-all; }
.eb-txt .eb-txt-n{ margin-top: 0; }
.eb-txt a{ background: #f4f4f4 url(../images/arrow_btn.png) no-repeat 230px center; padding: 10px 50px 10px 20px; font-size: 20px; position: absolute; bottom: 0;  }

/* 교육행사 - 교육안내 */
.list-all{ margin-bottom: 10px; }
.list-all span em{ color: #283b82; font-weight: 600; }
.list-top{ display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.list-tap{ padding-bottom: 5px; display: flex; }
.list-tap a{ font-size: 20px; width: 128px; height: 36px; line-height: 33px; display: inline-block; text-align: center; position: relative; }
.list-tap a::after{ content: ""; display: inline-block; width: 2px; height: 24px; background-color: #ddd; position: absolute; bottom: calc( 50% - 12px); right: 0; }
.list-tap a.active{ position: relative; right: 2px; background-color: #283b82; color: #fff; }
.list-tap a.active::after{ width: auto; height: auto; background: none; border-top: 5px solid #283b82; border-bottom: 0; border-left: 7px solid transparent; border-right: 7px solid transparent; position: absolute; bottom: -5px; right: calc( 50% - 7px );  }

.list-search{ position: relative; display: flex; }
.list-search input{ width: 340px; height: 42px; border: 1px solid #ddd; padding-left: 15px; padding-top: 4px; box-sizing: border-box; }
.list-search input::placeholder{ font-size: 16px; color: #999; font-family: 'Noto Sans CJK KR','Malgun Gothic', '맑은 고딕', 'Dotum', '돋움', 'Gulim', '굴림', sans-serif; }
.list-search button{ width: 42px; height: 42px; text-indent: -9999px; cursor: pointer; }
.list-search .search-btn1{ background: url(../images/search_btn1.png) no-repeat center center; border: none; position: absolute;right: 47px; }
.list-search .search-btn2{ border: 1px solid #ddd; background: url(../images/search_btn2.png) no-repeat center center; margin-left: 5px; }

.list-table {width: 100%; border-top: 2px solid #000; border-bottom: 1px solid #ddd; font-weight: 300;}
.list-table li > a {display: inline-block; word-break: break-all; vertical-align: middle; width: 100%; }
.list-table a:hover { text-decoration: underline; }
.list-table th, .list-table td { vertical-align: middle; text-align: center; padding: 10px 10px;  }
.list-table thead th{ padding: 20px 0; }
.list-table thead{ background-color: #f4f4f4; font-weight: 500; }
.list-table tbody p{ line-height: 1.5;  margin: 0 auto;  }
.list-table tbody tr{ border-top: 1px solid #ddd; text-align: center; }
.list-table tbody th p a{ overflow: hidden; display: -webkit-box; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: keep-all; }
.list-table tbody .list-image p{ overflow: hidden; border: 1px solid #ddd; width: 128px; height: 90px;}
.list-table tbody .list-state p:first-of-type{ margin-bottom: 10px; }

.list-table .list-tit{ text-align: left; overflow: hidden; }

.content-list .pagintion{ width: 100%; display: flex; justify-content: center; align-items: center; margin-top: 40px; }
.content-list .pagintion a{ display: inline-block; width: 40px; height: 40px; border: 1px solid #ddd; text-align: center; line-height: 38px; margin-right: 3px; }
.content-list .pagintion a:last-of-type{ margin-right: 0; }
.content-list .pagintion a.back{ margin-right: 8px; background-image:url(../images/page_back.png);}
.content-list .pagintion a.forward{ margin-left: 8px; }
.content-list .pagintion a.page_on{ background-color: #ddd; }

.list-file p a{ display: block; }
.list-file p a:hover{ text-decoration: none; }

	
.pagination_wrap{position:relative;display:table;margin:32px auto}	
.p-pagination.left{margin-left:0;margin-right:auto}	
.p-pagination.right{margin-left:auto;margin-right:0}	
.p-page{display:table;margin:0;text-align:center}	
.p-page__link{display: inline-block; width: 40px; height: 40px; border: 1px solid #ddd; text-align: center; line-height: 38px; margin-right: 3px;}	
.p-page__link.active{ background-color: #ddd; }	
.p-page__link.active:after{display:block;position:absolute;left:50%;bottom:8px;transform:translateX(-5px);width:12px;height:1px; background-color: #ddd; }	
.p-page__link.active:hover{ background-color: #ddd; }	
.p-page__link:hover{background:#f4f4f4}	
.p-page__link:last-of-type{ margin-right: 0; }	
.p-page__link-group{display:inline-block;border-left:solid 1px #dedede;vertical-align:top}	
.p-page__control{display:inline-block;margin:0 3px;border-left:solid 1px #dedede;vertical-align:top}	
.p-page__control png{vertical-align:middle}	
.p-page__control .next-end:before,.p-page__control .next:before,.p-page__control .prev-end:before,.p-page__control .prev:before{display:inline-block;width:16px;height:18px;margin-top:-2px;background-repeat:no-repeat;background-position:center center;background-size:14px 12px;vertical-align:middle}	
.p-page__control .prev-one:before,.p-page__control .prev:before{width:6px;height:12px;background-image:url(../images/page_back.png);background-size:6px 12px}	
.p-page__control .prev-end:before{background-image:url(../images/page_prev.png)} 	
.p-page__control .next-one:before,.p-page__control .next:before{width:6px;height:12px;background-image:url(../images/page_forward.png);background-size:6px 12px}	
.p-page__control .next-end:before{background-image:url(../images/page_next.png)}	
.p-page__control .prev-one{display:none !important ;background:0 0 !important }	
.p-page__control .next-one{display:none !important ;background:0 0 !important }	
@media all and (max-width:765px){	
    .p-pagination{display:block}	
    .p-page{display:block;margin:0}	
    .p-page__link{display:inline-block;border-left:solid 1px #dedede}	
    .p-page__link-group{display:none}	
    .p-page__control{display:inline-block;width:49.5%;margin:0;border:none;text-align:right;height:54px;line-height:50px}	
    .p-page__control:first-child{text-align:left}	
    .p-page__control .next,.p-page__control .next-end,.p-page__control .prev,.p-page__control .prev-end{display:none}	
    .p-page__control .next-one,.p-page__control .prev-one{display:inline-block;width:auto;min-width:95%;background:#fafafa;font-size:inherit;text-indent:0}	
    .p-page__control .prev-one:before{display:inline-block;width:8px;height:18px;margin:0 10px 5px 0;background-image:url(../images/page_back.png);background-repeat:no-repeat;background-position:center center;background-size:6px 12px;vertical-align:middle}	
    .p-page__control .next-one:after{display:inline-block;width:8px;height:18px;margin:0 0 5px 10px;background-image:url(../images/page_forward.png);background-repeat:no-repeat;background-position:center center;background-size:6px 12px;vertical-align:middle}	
}


    /* 교육안내 - 상태 공통 */
    .list-state p{ color: #fff; width: 80px; height: 26px; text-align: center; line-height: 1.5; }
    .list-state .state-1-1{ background-color: #ffa200; }
    .list-state .state-1-2{ background-color: #1473b5; }
    .list-state .state-2-1{ background-color: #1cbbb4; }
    .list-state .state-2-2{ background-color: #ff7171; }
    .list-state .state-end{ background-color: #bbbbbb; }
    .list-date p span{ font-weight: 500; margin-right: 4px; }

    /* 교육안내 250826 */
    .edu{border-top: 2px solid #000;}
    .edu span{font-weight: 600; color: #000;}
    .edu p{color: #444; line-height: 2;}
    .edu p.txt-center{text-align: center;}
    .edu p.pd-t40{padding-top: 40px;}
    .edu > div{padding: 40px 0; border-top: 1px solid #ddd;}
    .edu > div.dis-flex{display: flex; align-items: flex-start;}
    .edu > div.dis-flex .con-stit{max-width: 210px; width: 30%;}
    .edu > div.dis-flex > div{max-width: calc(100% - 210px); width: 70%;}
    .edu > div.edu-people{border: none;}

    .edu .edu-ic ul{display: flex;}
    .edu .edu-ic ul li{margin-right: 30px; padding-bottom: 10px;}
    .edu .edu-ic ul li .ic-box{width: 110px; height: 110px; border-radius: 50%;}
    .edu .edu-ic ul li:first-child .ic-box{background: url(/site/moren/palace/user/images/edu_ic_1.png) center no-repeat #f1f5f2;}
    .edu .edu-ic ul li:nth-child(2) .ic-box{background: url(/site/moren/palace/user/images/edu_ic_2.png) center no-repeat #f9f4eb;}
    .edu .edu-ic ul li:nth-child(3) .ic-box{background: url(/site/moren/palace/user/images/edu_ic_3.png) center no-repeat #fdf1f1;}
    .edu .edu-ic ul li:last-child .ic-box{margin-right: 0; background: url(/site/moren/palace/user/images/edu_ic_4.png) center no-repeat #f1f5f8;}

    .edu table{margin-bottom: 20px; width: 100%; word-break: keep-all;}
    .edu table th{font-weight: 600; font-size: 18px; padding: 20px; border-top: 2px solid #000; border-bottom: 1px solid #ddd; border-right: 1px solid #ddd; background-color: #eef3fa;}
    .edu table th.bdr-none{border-right: none;}
    .edu table td{font-size: 18px; text-align: center; vertical-align: middle; padding: 20px 10px; border-bottom: 1px solid #ddd; border-right: 1px solid #ddd; line-height: 1.5em;}
    .edu table td.bdr-none{border-right: none;}

    @media all and (max-width: 768px){
        .edu > div.dis-flex{flex-wrap: wrap;}
        .edu > div.dis-flex .con-stit{width: 100%; max-width: 100%;}
        .edu > div.dis-flex > div{width: 100%; max-width: 100%;}
        .edu .edu-ic ul{flex-wrap: wrap; justify-content: space-around;}
        .edu p{line-height: 1.5; font-size: 14px;}
        .edu .edu-tb{width: 100%; overflow-x: scroll;}
        .edu table th{font-size: 16px;}
        .edu table td{font-size: 14px; padding: 10px;}
    }

    @media all and (max-width: 600px){
        .edu .edu-ic ul li{width: calc(100% / 2); margin: 0 auto;}
        .edu .edu-ic ul li .ic-box{margin: 0 auto;}
    }
    

/* 교육행사 - 교육안내 - 신청하기 */
.view-box{ display: flex; align-items: center; }
.view-box .view-img{ box-sizing: border-box; margin-right: 40px; border: 1px solid #ddd; width: 448px; height: 374px; overflow: hidden; }
.view-box .view-img img{ width: 100%; height: auto;}
.view-box .view-info{ width: calc( 100% - 488px ); height: 100%; }
.view-box .view-info .view-title{ padding-bottom: 15px; display: flex; align-items: center; border-bottom: 2px solid #000; }
.view-box .view-info .view-title h2{ margin-right: 15px; font-size: 25px; font-weight: 600; }
.view-box .view-info .view-title p{ display: inline-block; }
.view-box .view-info table{ width: 100%; }
.view-box .view-info table tr{ border-bottom: 1px solid #ddd; width: 100%; line-height: 1.5; }
.view-box .view-info table tr th{ padding: 8px 0; background-color: #eef3fa; font-weight: 500; }
.view-box .view-info table tr td{ padding: 8px 0 8px 12px; font-weight: 300; vertical-align: middle; }

.con-view .in-btn a{ float: right; }
.view-details .det-info{ background-color: #f4f4f4;}
.view-details .det-info .det-info-txt b{ font-weight: 600; }
.attach-con li a span{ vertical-align: middle; }
.attach-con li a span:last-of-type{ margin: 0 10px 0 5px; }

/* 교육행사 - 교육자료 -  교육사진*/
.title-tap{ display: flex; justify-content: space-between; margin-bottom: 50px; }
.title-tap a{ position: relative; display: flex; justify-content: center; align-items: center; background-color: #f4f4f4; color: #444; width: calc( 50% - 10px ); font-size: 25px; padding: 20px 0; border-radius: 20px;  }
.title-tap a.active{ background-color: #1473b5; color: #fff; }
.title-tap a.active::after{ content: ""; display: inline-block; width: auto; height: auto; background: none; border-top: 14px solid #1473b5; border-bottom: 0; border-left: 12px solid transparent; border-right: 12px solid transparent; position: absolute; bottom: -14px; right: calc( 50% - 12px );  }
.title-tap a i{ width: 24px; height: 25px; margin-right: 10px; }
.tab-gall i{ background: url(../images/tab-gall.png); }
.tab-data i{ background: url(../images/tab-data.png); }
.tab-gall.active i{ background: url(../images/tab-gall-at.png); }
.tab-data.active i{ background: url(../images/tab-data-at.png); }
/*230629*/
.tab-video1 i{background: url(../images/tab-video1.png);}
.tab-video2 i{background: url(../images/tab-video2.png);}
.tab-video1.active i{background: url(../images/tab-video1_at.png);}
.tab-video2.active i{background: url(../images/tab-video2_at.png);}

.list-container{ clear: both; }
.content-list-b{ width: 100%; }
.content-list-b .list-top{ float:right; }
.content-list-b .list-all{ float: left; margin-bottom: 0; margin-top:15px; }

.list-gallery{ padding: 30px 0; }
.list-gallery ul li{ box-sizing: border-box; width: 280px; float: left; margin-top: 20px; margin-bottom: 20px; }
.list-gallery ul li:not(:nth-child(4n+1)){ margin-left: calc(( 100% - 1128px ) / 3); }
.list-gallery ul li a{ border: 1px solid #ddd; }  
.list-gallery ul li > a:hover{ text-decoration: none; border: 1px solid #000; }
.list-gallery .gall-image{ overflow: hidden; width: 100%; height: 210px; }
.list-gallery .gall-info{ padding: 20px; }
.list-gallery .gall-info p{ font-weight: 500; margin-bottom: 10px; overflow: hidden; display: -webkit-box; text-overflow: ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-break: keep-all; }
.list-gallery .gall-info span{ color: #333; font-weight: 300; overflow: hidden; display: -webkit-box; text-overflow: ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-break: keep-all; }

.modal{ position: fixed; background-color: #fff; z-index: 9999; top: calc( 50% - 362px ); left: calc(50% - 392px); text-align: center; padding: 50px; box-sizing: border-box; }
.modal p{ font-size: 25px; font-weight: 500; margin-bottom: 53px; }
.modal p::after{  content: ""; display: block; width: 104px; height: 3px; background-color: #000; position: absolute; left: calc(50% - 52px); margin-top: 25px; }
.modal > img{ width: 684px; height: auto; }
.close-btn{ cursor: pointer; background: #000 url(../images/close-btn.png) no-repeat center center; width: 37px; height: 37px; border-radius: 37px; text-indent: -9999px; position: absolute; top: -14px; right: -14px; }

/* 교육행사 - 교육자료 -  교육자료 - 상세*/
.detail-page .detail-con{ border: 1px solid #ddd; border-top: 2px solid #000; }
.detail-page .detail-title{ display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
.detail-page .detail-title h2{ font-size: 25px; font-weight: 600; line-height: 1.3;  width: 80%; }
.detail-page .detail-title p{ font-size: 18px; font-weight: 300; margin-left: 20px; width: 130px;}
.detail-page .det-info{ border: 1px solid #ddd; }
.detail-page .det-info .det-info-img{ width: 100%; overflow: hidden; }
.detail-page .attach-box{ border: 1px solid #ddd; padding: 40px; background-color: #f4f4f4; }

/* 교육행사 - 정조대왕능행차 공동재현행사*/
.ev-tap{ border-bottom:3px solid #1473b5; display: flex; }
.ev-tap a{ text-align: center; line-height: 1.3; background-color: #fff; color: #444; width: 100%; padding-top: 12px; font-size: 20px; height: 52px; border-top: 1px solid #ddd; border-right: 1px solid #ddd; box-sizing: border-box; }
.ev-tap a:first-of-type{ border-left: 1px solid #ddd; }
.ev-tap a.active{ background-color: #1473b5; color: #fff; border-right: 0; border-top: 0; border-left: 0; }

.ev-wrap{ border: 1px solid #ddd; }
.ev-img { display:none }
.ev-img.active { display:block; }
.ev-img .swiper { overflow: hidden; }                
.ev-img .swiper-slide{  border: 1px solid #ddd; box-sizing: border-box; }
.ev-img .swiper-slide img { width: 100%; display: block; }

.ev-bottom{ background-color: #f4f4f4; padding: 40px 0; position: relative; }
.ev-swiper2 { height: 570px; width: 890px; margin: 40px auto; }
.ev-swiper { box-sizing: border-box; margin: 0 100px; }
.ev-swiper .swiper-slide { width: 25%; height: auto;  }
.ev-swiper .swiper-button-prev, .ev-swiper .swiper-button-next{ width: 50px; height: 50px; }
.ev-swiper .swiper-button-prev{ background-image: url(../images/ev-slide-prev.png); background-size: 100%; left: 24px; }
.ev-swiper .swiper-button-next{ background-image: url(../images/ev-slide-next.png); background-size: 100%; right: 24px;  }

.ev-2016, .ev-2017, .ev-2018{ display: none; }
                  

/* 시흥행궁아카이브 - 소개 */
.Introduction{ background: url(../images/Introduction_bg.jpg) no-repeat; background-size: contain; }
.Introduction-txt{ box-sizing: border-box; padding: 110px 0 110px 238px; width: 60%; float: right; background: linear-gradient(270deg, #f6f2ea 80%, transparent); }
.Introduction-txt p{ font-size: 25px; line-height: 40px; word-break: keep-all; }
.Introduction-txt p:first-of-type{ margin-bottom: 70px; }
.Introduction-txt p span{ font-size: 60px; font-family: 'Makgeolli', 'Noto Sans CJK KR','Malgun Gothic', '맑은 고딕', 'Dotum', '돋움', 'Gulim', '굴림', sans-serif; }
.Introduction-txt p span b{ color: #d03337; }

/* 시흥행궁아카이브 - 전시 - 자료실 */
.list-check{ display: flex; }
.list-check .check-wrap{ margin-right: 40px;}

.check-wrap{ display: flex; align-items: center; justify-content: center; }
.check-wrap input{ display: none;  }
.check-wrap input + label{ width: 18px; height: 18px; border:1px solid #ddd; display: inline-block; cursor: pointer; box-sizing: border-box; margin-right: 10px; background-color: #fff; }
.check-wrap input:checked + label{ background-color: #283b82; border: none; background-image: url(../images/checkbox_check.png); background-repeat: no-repeat; background-position: center center; }

/* 소식참여 - 보도자료 */
.list-table tbody .list-image-b p{ height: 150px; width: 200px; background-color: #f4f4f4; }
.list-tit-wrap .list-tit-t, .list-tit-wrap .list-tit-c{ overflow: hidden; display: -webkit-box; text-overflow: ellipsis; -webkit-box-orient: vertical; }
.list-tit-wrap .list-tit-t{ font-size: 20px; font-weight: 500;  -webkit-line-clamp: 1; left: 0; }
.list-tit-wrap .list-tit-c, .list-tit-wrap span{ color: #888; line-height: 1.5; }
.list-tit-wrap .list-tit-c{ -webkit-line-clamp: 3; margin: 6px 0 8px;  }

/* 소식참여 - QA */
.QA-btn{ display: flex; }
.QA-btn a{ margin-bottom: 0; margin-top: 0; width: 165px; height: 42px; }
.QA-btn .write-view-btn{ background-color: #f4f4f4; width: 144px; margin-left: 10px; }

.list-right .in-btn{ float: right; }
.list-right .in-btn a{ margin-top: 0; margin-bottom: 0; width: 100px; height: 42px; margin-left: 10px; }
.txt-n{ text-indent: -999999px; }

.detail-title .ico-non{ vertical-align: bottom; margin-left: 10px; }

/* 소식참여 - QA 등록 */
.write-page .det-info{ border-left: 0; border-right: 0; border-bottom: 0; padding: 40px 0; }
.write-page .det-info p{ font-weight: 500; line-height: 1.5; }
.write-page .det-info table{ border-top: 1px solid #ddd; border-right: 1px solid #ddd; width: 100%; }
.write-page .det-info table tr{ border-bottom: 1px solid #ddd; }
.write-page .det-info table tr span{ font-size: 14px; }
.write-page .det-info table tr th{ background-color: #eef3fa; vertical-align: middle; }
.write-page .det-info table tr td{ padding: 20px; }
.write-page .det-info table tr:last-of-type td > span{ color: #888; line-height: 1.5; display: inline-block; }
.write-page .det-info table tr td p{ display: flex; align-items: center; }

.t-im p::before{ content: "*"; display: inline-block; color: #d03337; }
.t-im .check-wrap label{ margin-right: 3px; }

.write-cnt textarea{ resize: none; border: 1px solid #ddd; padding: 10px; box-sizing: border-box; width: 80%;  height: 42px; }
.write-cnt textarea::placeholder{ font-size: 14px; color: #bbb; font-family: 'Noto Sans CJK KR','Malgun Gothic', '맑은 고딕', 'Dotum', '돋움', 'Gulim', '굴림', sans-serif; }
.write-cnt span{ margin-left: 20px; color: #888; font-weight: 400; }
.write-cnt span strong{ font-weight: 600; color: #283b82; }

.write-cnt-c textarea{ height: 168px }
.write-cnt-f{ margin-bottom: 10px; }

.write-page .in-btn{ text-align: center; }
.write-page .in-btn .list-btn{ float: none; }
.write-page .in-btn .cancel-btn{ margin-left: 3px; }

.w-note{ color: #d03337; font-weight: 400; line-height: 1.5; }


/* 전시관소개 - 인사말 */
.intro-box{ border-top: 2px solid #000; font-size: 20px; }
.greeting{ overflow:hidden; padding: 50px; border: 1px solid #ddd; border-top: 0; background-image: url(../images/greeting_bg.jpg); background-repeat: no-repeat; background-position: center bottom; }
.greeting .grt-img { float:left; width: px; text-align:center;}
.greeting .grt-img .greeting-mayor{ margin-top: 30px; font-size: 25px; font-weight: 600; }
.greeting .grt-img .greeting-mayor span { margin-left: 25px; font-size: 32px; }
.greeting .grtWrap { float:right; width: 60%; margin-bottom: 200px; }
.greeting .grtWrap p{ line-height: 1.6; margin-top: 30px; }
.greeting .grtWrap p:first-of-type{ margin-top: 0; }
/* 전시관소개 - 설립목적/연혁 */
.history .aim{ margin: 20px 0; }
.history .aim p{ line-height: 1.5; font-weight: 500; }
.history-box{ border: 1px solid #ddd; padding: 70px; }
.history-con{ background: url(../images/history_bg.png) no-repeat; position: relative; background-size: 100%; }
.history-con::before{ content: ''; display:block; width: 2px; height: 100%; background-color: #0e76bc; position: absolute; left: 20px; top: 10px; }
.history-txt{ position: relative; margin-bottom: 50px; }
.history-txt::before{content: ''; display:block; background: url(../images/history_b_a.png) 0 0 no-repeat;width: 26px;height: 26px;position: absolute;top: 4px;left: 120px;}
.history-txt h5{ font-size: 32px; font-weight: 700; color: #283b82; margin-bottom: 30px; position: relative; padding-left:150px; }
.history-txt h5::after{ content: ''; display:block; width: 100px; height: 1px; background-color: #888; position: absolute; left: 20px; top: 50%; z-index: -1; }
.history-txt p{ color: #444; font-size: 16px; line-height: 1.5; word-break: keep-all; }
.history-txt p span{ margin-right: 15px; font-weight: 600; }
.history-left .history-txt{ text-align: left; float: left; text-shadow: 0 0 10px #fff; }
.history-left .history-txt p{ margin-left: 170px; }
.history-left .history-txt h5{  padding-left: 170px; }
/*
.history-right .history-txt{ float: right; }
.history-right .history-txt::before{ left: -13px; }
.history-right .history-txt p{ margin-left: 50px;  }
.history-right .history-txt h5{ padding-left: 160px; }
.history-right .history-txt h5::after{ left: 0; }*/

/* 전시관소개 - 전시관 로고 */
.logo-con{ display: flex; justify-content: space-between; }
.logo-con > div{ border: 1px solid #ddd; border-top: 3px solid #0e76bc; text-align: center; position: relative; padding: 92px 50px 50px; width: calc( 50% - 25px ); box-sizing: border-box; }
.logo-con > div h5{ color: #fff; background-color: #0e76bc; display: inline-block; position: absolute; font-size: 25px; left: calc( 50% - 100px ); top: 0; height: 42px; line-height: 40px; width: 200px; }
.logo-middle{ margin: 80px 0; display: block; }
.logo-middle > div{ width: 100%; }
.s-signature-m{ display: none; }

/* 통합예약 - 단체관람 */
.info_group {background: url(/site/moren/palace/user/images/info_group_bg.png) no-repeat top center;}

/* 통합예약 - 전시해설 예약 */
.info_explain {background: url(/site/moren/palace/user/images/info_explain_bg.png) no-repeat top center;}
.info-txt .dis-flex{display: flex; align-items: center;}
.reserve-btn a{margin-left: 10px; display: flex; align-items: center; justify-content: space-between; color: #fff; width: 104px; height: 30px; padding: 0 15px; box-sizing: border-box; border-radius: 15px; background-color: #0073b1;}
.reserve-btn img{max-width: 100%;}

@media all and (max-width:1380px){

    .det-info, .detail-page .attach-box { font-size: 14px; padding: 20px; }
    /*//공통*/

    #sub-container .inner { width:100%; padding:0 15px; box-sizing: border-box; }
    #sub-container .sub-locnav .inner { padding:0; }
    #contents { width:100%; padding:45px 15px; box-sizing: border-box;}
    #contents h3.con-tit { margin-bottom:25px }
    #contents .jeongjo-reapcon { height:auto; overflow: hidden; justify-content: flex-start;}
    #contents .jeongjo-reapcon .bg { opacity: 0.1; z-index: 0; width:500px; height:578px; bottom:0; background-size:cover; top:auto; }
    #contents .jeongjo-reapcon .reapcon { width:100%; padding:50px;}
    #contents .jeongjo-reapcon .reapcon .reapcon-txt p br { display:none; word-break: keep-all;}

    /*이용안내 - 오시는길*/
    .map-tap a { font-size: 18px; padding: 15px 10px; }
    .con-map .map_info { padding: 75px 20px; width: 34%; }
    .con-map .map_info .map_wrap h4 { font-size: 28px; }
    .con-map .map_info .map_wrap p { font-size: 16px; }
    .con-map .map_info .map_wrap p span { width: 54px; }

    .root_daum_roughmap{ width: 66% !important; }

    .map-way p { font-size: 16px; line-height: 1.5; word-break: keep-all; }

    .map-f-img { display: flex; justify-content: center; }
    
    .map-f-t table { font-size: 14px; }


    /* 이용안내 - 시설안내 */
    .info-f-top{ margin-bottom: 40px; }
    .info-f-img{  margin-right: 20px; width: calc( 50% - 10px ); height: 405px; display: flex; justify-content: center; }
    .info-f-t { width: calc( 50% - 10px ); }
    .info-f-t table{ font-size: 16px; }

    /* 전시 - 상설전시 */
    .eb-tap a { font-size: 16px; height: 70px; padding-top: 12px; }

    .eb-wrap.active { display:inline-block;}
    .eb-img{  float: left; width: calc( 100% - 452px ); height: 430px; }
    .eb-img .swiper{ height: 100%; }
    .eb-img .swiper-slide{ display: flex; align-items: center; }
    .eb-txt { float: right; width: 452px; padding: 40px 30px 0; height: auto; }
    .eb-txt h5 { font-size: 20px; }
    .eb-txt p br{ display: none; }
    .eb-txt p { margin-top: 10px; }
    .eb-txt a{ position: static; display: inline-block; margin-top: 20px; font-size: 16px; background-position-x: 180px; padding: 5px 40px 5px 15px; }


    /* 교육행사 - 교육안내 */
    .content-list .pagintion { margin-top: 30px; }

    /* 교육행사 - 교육안내 - 신청하기 */
    .view-box .view-img { margin-right: 20px; }
    .view-box .view-info { width: calc( 100% - 466px ); }
    .view-box .view-info table tr { font-size: 14px; line-height: 1.7; }
    .view-box .view-info table colgroup col:first-of-type, .view-box .view-info table colgroup col:nth-of-type(3){ width: 15% !important; }
    .view-box .view-info table colgroup col:last-of-type{ width: calc( 50% - 15% ) !important; }

    .con-view .in-btn a { margin-bottom: 10px; }
    
    /* 교육행사 - 교육자료 -  교육사진*/
    .list-gallery ul li{ width: 23%; }
    .list-gallery ul li:not(:nth-child(4n+1)){ margin-left: calc(( 100% - (23% * 4) ) / 3); }
    .list-gallery .gall-image{ height: auto; }

    /* 시흥행궁아카이브 - 소개 */
    .Introduction-txt{ text-align: center; padding: 80px 0 80px 56px; width: 60%; background: linear-gradient(270deg, #f6f2ea 80%, transparent); }
    .Introduction-txt p{ font-size: 20px; line-height: 32px; }
    .Introduction-txt p:first-of-type{ margin-bottom: 50px; }


    /* 시흥행궁아카이브 - 자료실 */
    .list-top-b .list-check { display: inline-block; width: 57%;}
    .list-top-b .list-check .check-wrap { float: left; margin-right: 0; width: 33.333%;  margin-bottom: 5px; line-height: 1.5; justify-content: center; }
    .list-top-b .list-search{ float: right; }

	/* 전시관소개 - 인사말 */
    .greeting p .b-0 { display: none; }
    .greeting .grt-img { width:35%; }
    .greeting .grt-img img { width:100%; }
  

    /* 전시관소개 - 설립목적/연혁 */
    .history-box{ padding: 70px 30px; }
    .history-left .history-txt p { margin-right: 20px; }
    .history-right .history-txt p { margin-left: 20px; }

    /* 전시관소개 - 전시관 로고 */
    .logo-top > div, .logo-bottom > div { width: calc( 50% - 15px ); }
    .logo-con > div{ padding: 80px 30px 50px; }
    .logo-con > div h5 { font-size: 18px; height: 30px; line-height: 28px; width: 170px; left: calc( 50% - 85px ); }
    .logo-top img{ height: 20vw; }
    .logo-middle{ margin: 6vw 0; }
    .logo-middle img{ width: 100%; }
    .logo-bottom img{ width: 100%; }
    


}
    
@media all and (max-width:960px){
    #sub-container .sub-visual { height:150px;}
    #sub-container .sub-visual h2 { font-size:3em; }
    #sub-container .sub-locnav { height:45px; }
    #sub-container .sub-locnav .loc-selecters ul.selecter-list > li a.home { width:45px; height:45px; }
    #sub-container .sub-locnav .loc-selecters ul.selecter-list > li:nth-child(2) {  width:calc(100% - 56px / 2); }
    #sub-container .sub-locnav .loc-selecters ul.selecter-list > li:nth-child(3) {  width:calc(100% - 56px / 2); }
    #sub-container .sub-locnav .loc-selecters ul.selecter-list > li a.depth1-select, 
    #sub-container .sub-locnav .loc-selecters ul.selecter-list > li a.depth2-select { max-width:100%; min-width:100%; box-sizing: border-box; height:45px; font-size:0.9em; }
    #sub-container .sub-locnav .loc-selecters ul.selecter-list > li a.depth2-select { margin:0; }
    #sub-container .sub-locnav .loc-selecters ul.selecter-list > li .depth1-list,
    #sub-container .sub-locnav .loc-selecters ul.selecter-list > li .depth2-list { top:44px; font-size:0.85em; }

    /* 이용안내 - 오시는길 */
    .con-map { display: block; }
    .con-map .map_info { width: 100%; box-sizing: border-box; padding: 20px; position: relative; border-top: 1px solid #ddd; }
    .con-map .map_info .map_wrap h4{ margin-bottom: 10px; font-size: 22px; }
    .con-map .map_info .map_wrap p{ margin-bottom: 0; }
    .con-map .map_info .map_wrap p span{ margin-right: 10px; }
    .con-map .map_info .map_wrap p br{ display: none; }
    .con-map .map_view { height: 35px; line-height: 35px; width: 156px; position: absolute; top: -60px; left: calc( 50% - 78px ); z-index: 1; }

    .root_daum_roughmap_landing { width: 100% !important; }

    .map-f-img { width: 100%; }
    .map-f-t { width: 100%; height: auto; }

    /* 이용안내 - 관람안내 */
    .info{ padding: 30px; }

    /* 이용안내 - 시설안내 */
    .info-f-img, .info-f-t{ float: none; width: 100%; }
    .info-f-img{ background-color: #f4f4f4; height: 310px; }
    .info-f-t table, .info-f-t thead, .info-f-t tbody{ height: auto; }
    .info-f-t tr{ height: 50px; } 

    .info-f-bottom .det-info{ padding: 50px; }
    .info-f-bottom .det-info img{ width: 100%; }
    .info-f-tap a { margin-left: 6px; font-size: 16px; width: 100px; padding: 10px 0; }
    .info-f-tap a:first-of-type{ margin-left: 0; }

    /* 전시 - 상설전시 */
    .eb-tap { display: inline-block; width: 100%; border-left: 1px solid #ddd; box-sizing: border-box; }
    .eb-tap a{ float: left; width: 33.3333%;  }
    .eb-tap a:first-of-type{ border-left: none; }
    .eb-tap a.active { position: relative; z-index: 2; }
    .eb-img{ float: none; width: 100%; height: auto; }
    .eb-img .swiper-slide{ justify-content: center; }
    .eb-txt { width: 100%; padding: 30px 0 0 20px; }
    .eb-txt p br{ display: block; }

    /* 교육행사 - 교육안내 */
    .list-tap a{ font-size: 16px; width: 78px }
    .list-table { font-size: 14px; }
    .list-table th, .list-table td { padding: 10px 6px; }
    .content-list-a .list-table col:first-of-type, .content-list-a .list-table thead th:first-of-type, .content-list-a .list-table tbody .list-image{ display: none; }
    .list-table .col-2{ width: auto; }
    .list-table .col-3{ width: 25%; }
    .list-table .col-4{ width: 25%; }
    .list-table .col-5{ width: 12%; }
    .list-table .col-6{ width: 10%; }
    .list-table .col-7{ width: 10%; }
    .list-table .col-8{ width: 12%; }

    .list-state p { height: 23px; width: 62px; font-size: 14px; line-height: 1.5; }

    /* 교육행사 - 교육안내 - 신청하기 */
    .view-box { display: block; }
    .view-box .view-img { margin: 0 auto 30px; }
    .view-box .view-info { width: 100%; }

    /* 교육행사 - 교육자료 -  교육사진*/
    .list-gallery ul li{ width: 32%; }
    .list-gallery ul li:not(:nth-child(4n+1)){ margin-left: 0; }
    .list-gallery ul li:not(:nth-child(3n+1)){ margin-left: calc(( 100% - (32% * 3) ) / 2); }

    .modal{ width: 90%; left: 5%; top: 25% }
    .modal > img{ width: 100% }

    /* 교육행사 - 정조대왕능행차 공동재현행사*/
    .ev-tap a { font-size: 16px; height: 45px; }
    .ev-swiper2 { width: 90%; height: auto; }
    .ev-swiper { margin: 0 70px; }
    .ev-swiper .swiper-button-prev { left: 10px; }
    .ev-swiper .swiper-button-next { right: 10px; }

    /* 시흥행궁아카이브 - 소개 */
    .Introduction{ background-size: 100%; background-position: center; padding: 50px; }
    .Introduction-txt{ padding: 40px 0; float: none; width: 100%; background: rgba( 246, 242, 234, .8 ); }
    .Introduction-txt p{ font-size: 18px; line-height: 28px; }
    .Introduction-txt p:first-of-type{ margin-bottom: 30px; }
    .Introduction-txt p span { font-size: 50px; }

    /* 시흥행궁아카이브 - 자료실 */
    .list-top-b .list-check { width: 100%; }
    .list-top-b .list-search{ width: 100%; margin-top: 0; margin-bottom: 10px; }
    .list-top-b .list-search input{ width: 100%; }

    /* 소식참여 - QA */
    .list-top-b{ display: block; }
    .list-button-wrap{ float: left; margin-bottom: 10px; }
    .list-right .list-search, .list-right .list-search input{ width:100%; }

	    /* 전시관소개 - 설립목적/연혁 */
    .history-txt p{ font-size: 14px; }
    
    .greeting .grtWrap p { margin-top: 20px; text-shadow: 0 0 20px #fff; font-size:15px }
    .greeting .grt-img .greeting-mayor { margin-top: 20px; font-size: 15px;}
    .greeting .grt-img .greeting-mayor span{ margin-left: 10px; font-size: 18px; }

}

@media all and (max-width:768px){
    #contents h3.con-tit { font-size:1.5em;}
    #contents .jeongjo-reapcon .reapcon { padding:35px 25px;}
    #contents .jeongjo-reapcon .reapcon .s-tit { font-size:1.5em; text-align: center; }
    #contents .jeongjo-reapcon .reapcon em.m-tit { font-size:2em; }
    #contents .jeongjo-reapcon .reapcon em.m-tit span { margin:0 auto 10px auto;}
    #contents .jeongjo-reapcon .bg { width:300px; height:347px; }

    #contents .content-box h4.con-stit { font-size:1.2em; }
    #contents .content-box h4.con-stit::before { width:20px; height:20px; background-size:cover; margin-right:5px;}
    #contents .content-box .content-table { overflow-x:scroll; }
    #contents .content-box .content-table table { font-size:0.85em; width:860px }
    #contents .content-box .content-table table tbody tr td { padding:10px 15px;}

    #contents .contents-ready  { width:100%; }
    #contents .contents-ready em { font-size:1.5em;}
    #contents .contents-ready em::before { width:120px; height:106px; background-size:cover; }

    /*이용안내 - 오시는길*/
    .map-f-img { height: 300px; }
    .map-f-t { width: 100%; }
    .map-f-t tbody tr td { padding: 5px; }

    /* 이용안내 - 관람안내 */
    .info{ background: none; font-size: 14px; }
    .info-txt{ width: 100%; }
    .info-txt h4.con-stit { float: none; }
    .info-txt h4.con-stit { padding-bottom: 10px; }
    .info .day h4, .info .fee h4 { padding-bottom: 10px; }
    .info-txt p { line-height: 1.5; }

    /* 전시 - 상설전시 */
    .eb-img .swiper-button-prev, .eb-img .swiper-button-next { background-size: contain; height: 65px; }

    /* 교육행사 - 교육안내 */
    .list-search input { width: 226px;}
    .list-tap { padding-bottom: 0; }
    .list-tap a { border: 1px solid #ddd; margin-right: 2px; height: 42px; line-height: 38px; box-sizing: border-box; }
    .list-tap a:last-of-type { margin-right: 0; }
    .list-tap a::after { display: none; }
    .list-tap a.active { border: none; right: 0; }
    .list-search .search-btn2 { margin-left: 2px; }

    /* 교육행사 - 교육자료 -  교육사진*/
    .title-tap{ margin-bottom: 20px; }
    .title-tap a { font-size: 20px; width: 50%; border-radius: 0; padding: 15px 0; }
    .title-tap a.active::after { display: none; }
    .list-gallery .gall-info { padding: 20px 10px; }
    .list-gallery { padding: 10px 0; }

    .detail-page .detail-title{ display: block; }
    .detail-page .detail-title h2{ font-size: 20px; }
    .detail-page .detail-title p{ margin-top: 10px; margin-left: 0; }
    .detail-page .det-info img{ width: 100%; }
    
    /* 소식참여 - 보도자료 */
    .list-tit-wrap .list-tit-t { font-size: 18px;-webkit-line-clamp: 2; line-height: 1.2; }
    .list-tit-wrap .list-tit-c { -webkit-line-clamp: 2; }

    /* 소식참여 - QA 등록 */
    .write-page .det-info { padding: 20px 0; }
    .write-cnt textarea { width: 70%; }
    .write-page .det-info table tr td .write-cnt-f, .write-page .det-info table tr td .write-cnt-f span{ display: block; }


    /* 전시관소개 - 인사말 */
    .intro-box{ font-size: 16px; }
            .greeting{ padding:30px; background-size: 730px; }
    
    /* 전시관소개 - 전시관 로고 */
    .logo-con > div { padding: 60px 20px 30px; }
    .logo-top > div, .logo-bottom > div { width: calc( 50% - 5px ); }
    .logo-top img { width: 100%; height: auto; }

    /* 통합예약 - 단체관람 */
    .info_group {background: none;}

    /* 통합예약 - 전시해설 예약 */
    .info_explain {background: none;} 
}


@media all and (max-width:640px){
    
    #sub-container .sub-visual { height:120px }
    #sub-container .sub-visual h2 { font-size:2.5em}

    #sub-container .sub-locnav .loc-selecters ul.selecter-list > li a.depth1-select
    #sub-container .sub-locnav .loc-selecters ul.selecter-list > li a.depth2-select { font-size:0.85em; }
    
    #contents { padding:35px 15px; }
    #contents .jeongjo-reapcon .reapcon { padding:35px 15px; }
    #contents .jeongjo-reapcon .reapcon .s-tit { font-size:1.3em; word-break: keep-all; line-height:1.4; }
    #contents .jeongjo-reapcon .reapcon em.m-tit { font-size:1.6em; margin-top:15px; }
    #contents .jeongjo-reapcon .reapcon .reapcon-txt { margin-top:30px; }
    #contents .jeongjo-reapcon .reapcon .reapcon-txt p { font-size:0.9em; }

    /*이용안내 - 오시는길*/
    .map-tap a i{ display: none; }
    .con-map .map_info { padding: 10px 0; }
    .con-map .map_info .map_wrap{ display: block; }
    .con-map .map_info .map_wrap p{ margin-top: 10px; font-size: 14px; }
    .con-map .map_info .map_wrap p span{ width: 50px; }
    .con-map .map_info .map_wrap p br{ display: block; }

	    /*이용안내 - 시설안내*/
    .info-f-bottom .det-info { padding: 20px;   }
    .info-f-bottom .det-info img { width: 100%; }
    .info-f-bottom .det-info h5 { font-size:15px; margin-bottom:10px;}

    /* 교육행사 - 교육안내 */
    .list-top { display: block; }
    .list-tap { margin-bottom: 10px; }
    .list-tap a { width: 25%; }
    .list-search input { width: 100%; }

    .list-table col{ width: 100% !important; }
    .list-table thead{ display: none; }
    .list-table tbody th, .list-table tbody td{ display: block; text-align: left; padding: 5px 0; position: relative; }
    .list-table tbody th p, .list-table tbody td p{ display: inline-block;  width: calc( 100% - 80px); position: relative; left: 80px; }
    .list-table tbody td .list-notice{ width: auto; }
    .list-table tbody .list-state p{ margin-bottom: 0 !important; display: inline-block; left: 0; width: 62px; }
    .list-table tbody th::before, .list-table tbody td::before{ position: absolute; display: inline-block; line-height: 1.5; width: 70px; font-weight: 500; background-color: #ddd; text-align: center; margin-right: 10px; }
    .list-table tbody .list-tit-edu::before{ content: "교육명"; }
    .list-table tbody .list-state::before{ display: none; }
    .list-table tbody .list-date::before{ content: "기간"; }
    .list-table tbody .list-day::before{ content: "요일"; }
    .list-table tbody .list-taget::before{ content: "대상"; }
    .list-table tbody .list-person::before{ content: "모집인원"; }
    .list-table tbody .list-way::before{ content: "신청방법"; }
    .list-table tbody .list-answer::before{ content: "답변여부"; }
    .list-table tbody .list-non::before{ content: "비공개"; }

    .content-list .pagintion { margin-top: 20px; }
    .content-list .pagintion a{ margin-right: 0; font-size: 14px; }
    .content-list .pagintion a.forward { margin-left: 0; }
    .content-list .pagintion a.back { margin-right: 0; }

    .modal{ padding: 20px; }
    .modal p{ padding: 20px; font-size: 20px; }

    /* 교육행사 - 교육안내 - 신청하기 */
    .view-box .view-img { width: 100%; height: auto; }
    .view-box .view-info table colgroup col:first-of-type, .view-box .view-info table colgroup col:nth-of-type(2), .view-box .view-info table colgroup col:nth-of-type(3), .view-box .view-info table colgroup col:last-of-type{ width: 100% !important; }
    .view-box .view-info table tr{ border: none; }
    .view-box .view-info table tr th, .view-box .view-info table tr td { width: 100%; display: block; text-align: left; padding: 8px 0 8px 15px; box-sizing: border-box; background: none; line-height: 1.3; }
    .view-box .view-info table tr td { border-bottom: 1px solid #ddd; padding-top: 0; }
    .con-view .in-btn a { float: none; width: 100%; margin-bottom: 30px; }

    /* 교육행사 - 교육자료 -  교육사진*/
    .content-list-b .list-all, .content-list-b .list-top{ float: none; }
    .content-list-b .list-all{ margin-bottom: 10px; }

    .list-gallery ul li{ width: 49%; }
    .list-gallery ul li:not(:nth-child(3n+1)){ margin-left: 0; }
    .list-gallery ul li:not(:nth-child(2n+1)){ margin-left: calc(( 100% - (49% * 2) )); }

    /* 교육행사 - 교육자료 -  교육사진*/
    .list-table tbody .list-num::before{ content: "NO"; }
    .list-table tbody .list-tit::before{ content: "제목"; }
    .list-table tbody .list-file::before{ content: "첨부파일"; }
    .list-table tbody .list-date::before{ content: "등록일"; }

    .all-btn a { margin-right: 0; font-size: 14px; }

    /* 교육행사 - 정조대왕능행차 공동재현행사*/
    .ev-img{ overflow: hidden; } 
    .ev-bottom { padding: 20px 0; }
    .ev-swiper2 { margin: 20px auto; }
    .ev-swiper .swiper-button-prev, .ev-swiper .swiper-button-next { display: none; }
    .ev-swiper { margin: 0 20px; overflow: inherit !important; }

    /* 시흥행궁아카이브 - 소개 */
    .Introduction{ background-size: cover; padding: 30px; }
    .Introduction-txt{ padding: 40px 0; }
    .Introduction-txt p{ font-size: 16px; line-height: 25px; }
    .Introduction-txt p span { font-size: 40px; }

    /*소식참여 - 공지사항*/
    .list-tap-2 a{ width: 33.3333% }

    /* 소식참여 - 보도자료 */
    .list-table tbody .list-tit-b::before{ display: none; }
    .list-table tbody .list-tit-b p{ left: 0; margin-right: 0; width: 100%; }
    .list-table tbody .list-image-b{ display: none; }
    .list-tit-wrap .list-tit-c { margin: 5px 0 3px; }

    .ico-non { margin-left: 80px; }
    .txt-n{display: none !important;}

    /* 소식참여 - QA */
    .ico-logout { vertical-align: middle; }

    /* 소식참여 - QA 등록 */
    .write-page .det-info table tr td p { display: block; }
    .write-cnt textarea { width: 100%; }
    .write-cnt span{ margin-left: 0; }
    .write-cnt span br{ display: none; }
    .write-page .in-btn .list-btn { margin-bottom: 0; margin-top: 0; }

    /* 전시관소개 - 설립목적/연혁 */
    .history-box{ border: none; padding: 0; }
    .history-con{ background: none; }
    .history-con::before, .history-txt::before, .history-txt h5::after{ display: none; }
    .history-txt { border-bottom: 1px solid #ddd; margin-bottom: 0; padding: 20px 0; box-sizing: border-box; }
    .history-left .history-txt, .history-right .history-txt{ float: none; width: 100%; text-align: left; }
    .history-txt h5{ margin-bottom: 10px; }
    .history-left .history-txt h5, .history-right .history-txt h5 { padding-right: 0; padding-left: 0; }
    .history-left .history-txt p, .history-right .history-txt p{ margin-left: 0; margin-right: 0; }

    /* 전시관소개 - 전시관 로고 */
    .s-signature{ display: none; }
    .s-signature-m{ display: block; }
    .s-signature-m img{ width: 80%; }
    .s-signature-m img:nth-of-type(2){ margin: 30px 0; }
    
    .greeting .grt-img { display:block; width:100%; margin-bottom:20px;}
    .greeting .grt-img img { width:50%;}    
    .greeting .grtWrap { width:100%; margin-bottom: 100px; }
    

}

@media all and (max-width:480px){

    /*이용안내 - 오시는길*/
    .map-tap{ justify-content: left; }
    .map-tap a{ font-size: 14px; }
    .map-tap .tab-car, .map-tap .tab-bus{ width: auto; }

    /*이용안내 - 시설안내*/
    .info-f-bottom h4, .info-f-tap { float: none; }
    .info-f-t table { font-size: 14px; }
    .info-f-tap a:first-of-type{ margin-left: 0; }
    .info-f-tap a{ width: calc( 33.3333% - 3px ); }

    /* 전시 - 상설전시 */
    .eb-tap a{ width: 50%; font-size: 15px; height: 62px; }
    .eb-tap .ed-6-t { line-height: 40px; }
    .con-eb { padding: 20px 0; }
    .eb-txt { padding: 20px 20px 0; }
    .eb-txt p br{ display: none; }
    .eb-img .swiper-button-prev, .eb-img .swiper-button-next { height: 50px; }

    .eb-img .swiper-button-next{ right: 0; }
    .eb-img .swiper-button-prev{ left: 0; }


    /* 교육행사 - 교육자료 -  교육사진*/
    .list-gallery ul li{ width: 100%; margin-left: 0 !important; margin: 10px; }

    .all-btn > a { width: 96px; }

    .list-button-wrap { width: 100%; margin-bottom: 0; }
    .list-button-wrap .QA-btn a{  margin-left: 0; width: 130px; width: 50%; }
    .list-right .in-btn, .list-right .in-btn a{ width: 100%; margin-left: 0; margin-bottom: 10px; }

    /* 교육행사 - 정조대왕능행차 공동재현행사*/
    .ev-swiper2 { margin: 0; width: 100%; }
    .ev-swiper2 .swiper-slide{ border: 0; width: 100% !important; }


    /* 시흥행궁아카이브 - 소개 */
    .Introduction{ padding: 20px; }
    .Introduction-txt{ padding: 20px; }
    .Introduction-txt p:first-of-type { margin-bottom: 20px; }
    .Introduction-txt p br { display: none; }
    .Introduction-txt p span { font-size: 32px; }

    /* 시흥행궁아카이브 - 자료실 */
    .list-top-b .list-check .check-wrap { width: 50%; }

    /* 소식참여 - QA 등록 */
    .write-page .det-info table tr { display: grid; border-left: 1px solid #ddd;  }
    .write-page .det-info table tr th { padding: 10px 0; min-height: 40px; box-sizing: border-box; }
    .write-page .det-info table tr td { padding: 10px; }

    /* 전시관소개 - 인사말 */
    .intro-box{ font-size: 16px; }

    /* 전시관소개 - 전시관 로고 */
    .logo-con { display: block; }
    .logo-con > div { margin-bottom: 20px; }
    .logo-top > div, .logo-bottom > div { width: 100%; }
    .logo-middle { margin: 0 0 20px; }
    .logo-bottom .s-lang-2{ margin-bottom: 0; }
    .s-signature-m img{ width: 100%; }
}

.p-icon__alt,.p-upload__label.alt{background-image:url('/common/images/program/p-icon.png');background-position:-159px -100px;width:14px;height:13px}
.p-icon__answer{background-image:url('/common/images/program/p-icon.png');background-position:-64px -158px;width:22px;height:22px}
.p-icon__arrow-circle,.p-progress--ellipse .p-progress__item:not(:first-child):after{background-image:url('/common/images/program/p-icon.png');background-position:-90px -45px;width:24px;height:24px}
.p-form__required--icon,.p-icon__asterisk{background-image:url('/common/images/program/p-icon.png');background-position:-118px -190px;width:12px;height:8px}
.p-icon__blog{background-image:url('/common/images/program/p-icon.png');background-position:0 0;width:35px;height:35px}
.p-icon__calendar{background-image:url('/common/images/program/p-icon.png');background-position:-188px -128px;width:16px;height:18px}
.p-icon__checked-dark{background-image:url('/common/images/program/p-icon.png');background-position:-76px -190px;width:12px;height:10px}
.p-form-checkbox__input[disabled][checked]+.p-form-checkbox__label:after,.p-form-checkbox__input[readonly][checked]+.p-form-checkbox__label:after,.p-icon__checked-gray{background-image:url('/common/images/program/p-icon.png');background-position:-54px -190px;width:12px;height:10px}
.p-category__link.active:before,.p-form-checkbox__input:checked+.p-form-checkbox__label:after,.p-icon__checked-white,.p-nav--group .p-nav__link.active:before{background-image:url('/common/images/program/p-icon.png');background-position:-32px -190px;width:12px;height:10px}
.p-icon__css{background-image:url('/common/images/program/p-icon.png');background-position:0 -158px;width:22px;height:22px}
.p-icon__deleted-bg{background-image:url('/common/images/program/p-icon.png');background-position:0 -90px;width:43px;height:24px}
.p-icon__deleted{background-image:url('/common/images/program/p-icon.png');background-position:-53px -90px;width:43px;height:24px}
.p-icon__doc, .p-icon__docx {background-image:url('/common/images/program/p-icon.png');background-position:-220px -32px;width:22px;height:22px}
.p-accordion__button.active:after,.p-accordion__button:after,.p-icon__down,.p-poll-result__link:after{background-image:url('/common/images/program/p-icon.png');background-position:-192px -158px;width:15px;height:8px}
.p-external-link:after,.p-icon__external-link{background-image:url('/common/images/program/p-icon.png');background-position:-162px -124px;width:12px;height:12px}
.p-icon__facebook{background-image:url('/common/images/program/p-icon.png');background-position:0 -45px;width:35px;height:35px}
.p-icon__file,.p-upload__label.file{background-image:url('/common/images/program/p-icon.png');background-position:-135px -100px;width:14px;height:14px}
.p-icon__folder{background-image:url('/common/images/program/p-icon.png');background-position:-188px -32px;width:22px;height:22px}
.p-icon__gif{background-image:url('/common/images/program/p-icon.png');background-position:-188px -64px;width:22px;height:22px}
.p-icon__hot-bg{background-image:url('/common/images/program/p-icon.png');background-position:-135px 0;width:43px;height:24px}
.p-icon__hot{background-image:url('/common/images/program/p-icon.png');background-position:-135px -34px;width:43px;height:24px}
.p-icon__html{background-image:url('/common/images/program/p-icon.png');background-position:-32px -158px;width:22px;height:22px}
.p-icon__hwp{background-image:url('/common/images/program/p-icon.png');background-position:-34px -124px;width:22px;height:22px}
.p-icon__insta{background-image:url('/common/images/program/p-icon.png');background-position:-45px -45px;width:35px;height:35px}
.p-icon__jpg{background-image:url('/common/images/program/p-icon.png');background-position:-128px -158px;width:22px;height:22px}
.p-icon__js{background-image:url('/common/images/program/p-icon.png');background-position:-160px -158px;width:22px;height:22px}
.p-icon__kakostory{background-image:url('/common/images/program/p-icon.png');background-position:-90px 0;width:35px;height:35px}
.p-icon__new{background-image:url('/common/images/program/p-icon.png');background-position:0 -124px;width:24px;height:24px}
.p-icon__noimg{background-image:url('/common/images/program/p-icon.png');background-position:-220px -64px;width:22px;height:22px}
.p-icon__pdf{background-image:url('/common/images/program/p-icon.png');background-position:-220px -96px;width:22px;height:22px}
.p-icon__png{background-image:url('/common/images/program/p-icon.png');background-position:-220px -128px;width:22px;height:22px}
.p-icon__ppt, .p-icon__pptx{background-image:url('/common/images/program/p-icon.png');background-position:0 -190px;width:22px;height:22px}
.p-icon__question-hover{background-image:url('/common/images/program/p-icon.png');background-position:-188px 0;width:22px;height:22px}
.p-icon__question{background-image:url('/common/images/program/p-icon.png');background-position:-98px -124px;width:22px;height:22px}
.p-icon__reply{background-image:url('/common/images/program/p-icon.png');background-position:-135px -68px;width:34px;height:22px}
.p-icon__secret{background-image:url('/common/images/program/p-icon.png');background-position:-106px -90px;width:12px;height:17px}
.p-icon__select-arrow{background-image:url('/common/images/program/p-icon.png');background-position:-140px -190px;width:11px;height:8px}
.p-icon__swf{background-image:url('/common/images/program/p-icon.png');background-position:-188px -96px;width:22px;height:22px}
.p-icon__times-circle,.p-upload__clear{background-image:url('/common/images/program/p-icon.png');background-position:-220px -160px;width:18px;height:18px}
.p-icon__times{background-image:url('/common/images/program/p-icon.png');background-position:-98px -190px;width:10px;height:10px}
.p-icon__twitter{background-image:url('/common/images/program/p-icon.png');background-position:-45px 0;width:35px;height:35px}
.p-icon__txt{background-image:url('/common/images/program/p-icon.png');background-position:-66px -124px;width:22px;height:22px}
.p-icon__xls, .p-icon__xlsx{background-image:url('/common/images/program/p-icon.png');background-position:-220px 0;width:22px;height:22px}
.p-icon__xml{background-image:url('/common/images/program/p-icon.png');background-position:-130px -124px;width:22px;height:22px}
.p-icon__zip{background-image:url('/common/images/program/p-icon.png');background-position:-96px -158px;width:22px;height:22px}
@media (-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi){
    .p-icon__alt,.p-upload__label.alt{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__answer{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__arrow-circle,.p-progress--ellipse .p-progress__item:not(:first-child):after{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-form__required--icon,.p-icon__asterisk{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__blog{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__calendar{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__checked-dark{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-form-checkbox__input[disabled][checked]+.p-form-checkbox__label:after,.p-form-checkbox__input[readonly][checked]+.p-form-checkbox__label:after,.p-icon__checked-gray{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-category__link.active:before,.p-form-checkbox__input:checked+.p-form-checkbox__label:after,.p-icon__checked-white,.p-nav--group .p-nav__link.active:before{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__css{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__deleted-bg{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__deleted{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__doc{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-accordion__button.active:after,.p-accordion__button:after,.p-icon__down,.p-poll-result__link:after{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-external-link:after,.p-icon__external-link{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__facebook{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__file,.p-upload__label.file{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__folder{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__gif{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__hot-bg{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__hot{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__html{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__hwp{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__insta{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__jpg{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__js{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__kakostory{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__new{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__noimg{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__pdf{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__png{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__ppt{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__question-hover{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__question{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__reply{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__secret{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__select-arrow{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__swf{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__times-circle,.p-upload__clear{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__times{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__twitter{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__txt{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__xls{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__xml{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
    .p-icon__zip{background-image:url(/common/images/program/p-icon@2x.png);background-size:242px 212px}
}

.p-icon{position:relative;display:inline-block;margin-right:2px;vertical-align:middle;font-size:0;line-height:0;background-repeat:no-repeat}
.p-icon.top{vertical-align:top}
.p-icon__rss{
    display: none; /* 미사용으로 인한 가림 */
    width:16px;height:18px;margin-top:-4px;background-image:url(/common/images/program/p-icon-view.svg#rss);background-size:18px 18px}
.p-icon__info-circle{width:20px;height:20px;margin-top:-4px;background-image:url(/common/images/program/p-icon-view.svg#info-circle);background-size:20px 20px}
.p-icon__info-circle-solid{width:20px;height:20px;margin-top:-4px;background-image:url(/common/images/program/p-icon-view.svg#info-circle-solid);background-size:20px 20px}
.p-icon__calendar-alt{width:16px;height:18px;margin:-5px auto 0;background-image:url(/common/images/program/p-icon-view.svg#calendar-alt);background-size:18px 18px}
.p-icon__eye{width:18px;height:16px;margin-top:-2px;background-image:url(/common/images/program/p-icon-view.svg#eye);background-size:18px 18px}
.p-icon__arrow-circle-down{width:20px;height:20px;margin-top:2px;background-image:url(/common/images/program/p-icon-view.svg#arrow-circle-down);background-size:20px 20px}
.p-icon__search{width:14px;height:14px;margin-top:-4px;background-image:url(/common/images/program/p-icon-view.svg#search);background-size:14px 14px}
.p-icon__expand-arrows{width:16px;height:18px;margin-left:3px;background-image:url(/common/images/program/p-icon-view.svg#expand-arrows);background-size:18px 18px}


.p-upload__clear{display:none;position:absolute;right:8px;top:9px;font-size:0;line-height:0;color:transparent}
.p-upload__clear.active{display:block}