@charset "utf-8";

/* 테이블칼라 */

.tbl.cgove{border-top:2px solid #6e63bc; width:100%}
.tbl.cgove th{background:#f0effa; color:#444}
.tbl.cgove tbody tr th:first-child{border-right:1px solid #ddd}
.tbl.cgove thead tr th:first-child{border-right:1px solid #ddd}
.tbl.cgove thead tr th a{cursor:pointer}
.tbl.cgove tbody tr td a{cursor:pointer}
.table_scroll{overflow:inherit;border:none!important}
.table_scroll_pc{overflow-x:scroll;border:none!important}

.black{color:#000}
.bg_gray{background:#f7f7f7!important}
.bg_purple{background:#e1dff9!important}

.td_right td{text-align:right}
.tbl td.td_left{text-align:left!important}




/* 원문검색 */

.gosi_list{width:100%; clear:both}
.gosi_list ul:after{content:"";display:block;clear:both}
.gosi_list li{width:18.8%; margin:10px 1.5% 20px 0; display:block;float:left}
.gosi_list li:nth-child(5){margin:10px 0 20px 0}
.gosi_list li a{width:100%; display:block; padding: 50px 0 35px 0; text-align:center; font-weight:600;border:#dadada 1px solid}
.gosi_list li a img{padding-bottom:25px;}
.gosi_list li a.on, .gosi_list li a:hover {background:#564d95; color:#fff}


/* 위원장인사말 */
.greeting>li{display:block; float:left}
.greeting>li:first-child{width:20%}
.greeting>li:last-child{width:75%; margin-left:3%}

.greeting li:last-child ul{width:100%}
.greeting li:last-child ul li{float:none; width:100%; padding-bottom:10px; clear:both}
.greeting li:last-child ul li span{width:70px; font-weight:600; display:block; float:left}
.greeting li:last-child ul li p{display:block; float:left}


/* 팝업관련 */

#popup_wrap{ width:100%}

.popup_top{height: 50px; width:100%; background:#1c2345  url(/images/common/popup_bg_03.png) repeat;}
.popup_top p.title{display:block; float:left; height:50px; line-height:50px; font-weight:600; padding-left:20px; width:auto; color:#fff; font-size:18px}
.popup_top p.close{display:block; float:right; height:50px; width:50px;}
.popup_top p.close a{display:block; float:right; height:50px; width:50px; text-indent:-9999px; background:url(/images/common/popup_close.png) no-repeat center #000000}
.popup_top p.close a:hover{background:url(/images/common/popup_close.png) no-repeat center #c13121}


.popup_btn{margin:18px 10px 0 20px; font-size:13px}
.popup_btn li{display:inline-block; border:1px solid #d5d5db; background:#f2f4fb;margin:2px 2px 2px 0; width:32%;text-align:center; }
.popup_btn li a{display:block;height:40px; line-height:40px; width:100%; }
.popup_btn li a:hover{color:#FFF; background:#254c8d}

.popup_inner{margin:20px; }
.popup_contents{display:block; height:380px; overflow:auto; border-top:1px solid #e3e7f2; border-bottom:1px solid #e3e7f2; padding:0 10px 20px 0}

.popup_footer{position:fixed; bottom:0; height:60px; text-align:center; width:100%; }
.popup_inner2{margin:20px;}
.popup_contents2{display:block; height:350px; overflow:auto; padding:0 10px 20px 0}

.popup_footer2{position:fixed; bottom:0; height:60px; text-align:center; width:100%; display:block; border-top:1px solid #e3e7f2; }



/* 테이블버튼 */

.btn_table{display:inline-block; color:#fff!important;font-size:13px;line-height:13px;transition:all .3s; padding:8px 15px;background:#254c8d}
.btn_table:hover, .btn_table:focus{text-decoration:none!important}





/* 간격좁은 테이블 */

.tbl_s{width:100%;border-collapse:collapse;border-top:2px solid #2c3e7e;line-height:20px}
.tbl_s th{padding:5px 1px; font-size:13px;border-left:1px solid #d5d5db;text-align:center; background:#f2f4fb;color:#103581;border-bottom:1px solid #d5d5db}
.tbl_s tr th:first-child, .tbl_s td:first-child{border-left:0}

.tbl_s td{border-bottom:1px solid #c8c8c8; text-align:right; padding:5px 2px 5px 0;border-left:1px solid #d5d5db;}
.tbl_s tr td a{color:#444}
.tbl_s tr td a:hover, .tbl_s tr td a:focus{color:#0946b6;text-decoration:underline}

.tbl_s.align_left tr th, .tbl_s.align_left tr td{text-align:left}

/* 간행물 하단 버튼박스 */
.pub_btn_area{margin-top:30px}


/* 고시검색 */

.bs_gosi{margin-top:5px; width:100%}
.bs_gosi span:first-child{width:30%; display:block; float:left}
.bs_gosi span:last-child{width:70%; text-align:right; display:inline-block}
.bs_gosi span:last-child br{display:none}
.bs_gosi select{width:47%;}
.bs_gosi input{width:38%; margin-left:1%}


/* 문화재위원회 조직도 */
.organ02{width:100%; display:table; text-align: center; margin: 40px auto 0 auto; background: url(/images/gove/organ_line01.png) no-repeat center top;}

.organ02 div.depth01{display:block; width:160px; height:50px; line-height:50px; background:#564d95; color:#fff; margin:0 auto 50px auto; font-size:20px; font-weight:500;}

.organ02 ul.depth02{text-align:center; margin:0 auto 80px auto;}
.organ02 ul.depth02 li{display:inline-block; text-align:center; border:#3260a3 2px solid; background:#fff; padding:5px 0; width:110px;  color:#3260a3; font-size:15px; font-weight:500;}
.organ02 ul.depth02 li:first-child{margin:0 60px 0 0}
.organ02 ul.depth02 li:last-child{margin:0 0 0 60px}

.organ02 ul.depth03{display:table; margin:0 auto; clear:both; width:100%}
.organ02 ul.depth03 li{display:inline-block; width:85px;  }
.organ02 ul.depth03 li a{border:#ddd 1px solid; background:#f7f7f7;padding:10px 0; display:block; cursor:pointer; box-sizing:border-box}


/* 무형문화재위원회 조직도 */
.organ03{width:100%; display:table; text-align: center; margin: 40px auto 50px auto; background: url(/images/gove/organ_line02.png) no-repeat center 70px; clear:both}

.organ03 p.depth01{display:block; float:none; width:160px; background:#564d95; color:#fff; margin:0 auto 30px auto; font-size:20px; font-weight:500; line-height:25px; text-align:center; padding:10px}
.organ03 p.depth01 span{font-size:16px; display:block }

.organ03 ul.depth02{width:50%; float:right;  margin:0 auto 60px auto;}
.organ03 ul.depth02 li{display:block; text-align:center; border:#3260a3 2px solid; background:#fff; padding:5px 0; width:110px;  color:#3260a3; font-size:15px; font-weight:500; margin-left:70px}

.organ03 ul.depth03{display:table; margin:0 auto; clear:both; width:594px;}
.organ03 ul.depth03 li{display:block; float:left; margin:0 1.5%;  width:180px; }
/*.organ03 ul.depth03 li a{border:#ddd 1px solid; background:#f7f7f7; padding:10px 0; display:block; cursor:pointer}*/
.organ03 ul.depth03 li a{border:#ddd 1px solid; background:#f7f7f7; padding:10px 0; display:block; cursor:default;}
.organ03 ul.depth03 li:last-child{float:right}


/* 통계정보 */

.statis{margin-bottom:20px; display:table; width:100%}
.statis ul{width:24%; margin:0 0.9% 5px 0; float:left; border:1px solid #e1e4ee}
.statis ul:nth-child(4){ margin-right:0}
.statis li{text-align:center}
.statis li:nth-child(1){background:#f0effa; padding:17px 0}
.statis li:nth-child(2){}
.statis li:nth-child(2) a{color:#fff; background:#564d95; padding:15px 0;font-weight:600; font-size:15px; width:100%; display:block; transition:all .3s;}
.statis li:nth-child(2) a:hover{background:#7266c7}

.statis li:nth-child(2) a img{margin-left:7px; vertical-align:middle}
.statis li:nth-child(3){margin-left:7px; vertical-align:middle; padding-top:14px; line-height:26px; height:130px}
.statis li:nth-child(3) a:hover{text-decoration:underline; color:#4c40a7}

.statis li.bg{background: url(/images/info/open_bg.png) no-repeat center bottom;}




@media screen and (max-width:1160px){

    .bs_gosi input{width:35%; margin-left:1%}

}

@media screen and (max-width:750px){

 .bs_gosi input{width:30%; margin-left:1%}
 
.organ02{background: url(/images/chai/organ_line_dot.png) repeat-y center 40px}
.organ02 ul.depth02{background: url(/images/chai/organ_line_dot.png) no-repeat center; background-size:200px 1px; margin:0 auto 50px auto}
.organ02 ul.depth03{border:1px solid #ddd; padding:10px 10px 5px 10px;box-sizing:border-box;background:#fff}
.organ02 ul.depth03{text-align:center}
.organ02 ul.depth03 li{width:24%; margin-bottom:5px  }
	

}

@media screen and (max-width:740px){
 .bs_gosi input{width:30%; margin-left:1%}
}

@media screen and (max-width:720px){
    .bs_gosi input{width:30%; margin-left:1%}

    .gosi_list li{width:32.3%;margin:10px 1.5% 0 0}
    .gosi_list li:nth-child(3){margin:10px 0 0 0}
    .gosi_list li:nth-child(6){margin:10px 0 0 0}
    .gosi_list li a{display:block;padding:30px 0 25px 0}
    .gosi_list li a img{padding-bottom:15px}
}

@media screen and (max-width:640px){

    .pc_on{display:none}
    .mobile_on{display:block}

    .popup_footer{display:none}
    .popup_contents{ height:auto; border-bottom:none;}

    .popup_contents div.down ul{display:table; height:auto; border:1px solid #e3e7f2; padding:10px; width:90%; margin:5px; float:none }
    .popup_contents div.down li{display:block; text-align:left}
    .popup_contents div.down li:first-child{font-weight:600; padding-bottom:0; float:left; width:auto; display:block}
    .popup_contents div.down li:last-child{font-size:12px; float:right; width:150px; display:block}
    .popup_contents div.down li img{padding:0 3px 0 10px; vertical-align:middle}

    /* 간행물 하단 버튼박스 */
    .pub_btn_area{margin-top:15px}



    .statis ul{width:48%;}
    .statis ul:nth-child(1), .statis ul:nth-child(3){ margin-right:1.8%}
    .statis ul:nth-child(2), .statis ul:nth-child(4){ margin-right:0}

}

@media screen and (max-width:580px){

    /* 무형문화재위원회 조직도 */
    .organ03{background:url(/images/chai/organ_line_dot.png) repeat-y center 40px}

    .organ03 p.depth01{font-size:18px;}
    .organ03 p.depth01 span{font-size:15px;}

    .organ03 ul.depth02{margin:0 auto 30px auto; background: url(/images/chai/organ_line_dot.png) no-repeat left center; background-size:100px 1px}
    .organ03 ul.depth02 li{display:block; text-align:center; border:#3260a3 2px solid; background:#fff; padding:5px 0; width:110px;  color:#3260a3; font-size:15px; font-weight:500; margin-left:20%}

    .organ03 ul.depth03{border:1px solid #ddd; padding:10px; width:90%; background:#fff}
    .organ03 ul.depth03 li{display:inline-block; margin:0 1.5%;width:30% }
    .organ03 ul.depth03 li a {display:table-cell;  width:30%; vertical-align:middle; border:#ddd 1px solid; background:#f7f7f7; padding:10px 0; cursor:pointer; height:60px}

}

@media screen and (max-width:550px){
    .bs_gosi span:first-child{width:70%; display:block; float:none}
    .bs_gosi span:last-child{width:100%; display:block; margin-top:5px; text-align:left}
}

@media screen and (max-width:540px){
    .popup_btn li{width:48%;}
    .table_scroll{overflow-x:scroll; border:none!important}
	.organ02 ul.depth02 li:first-child{margin:0 20px 0 0}
    .organ02 ul.depth02 li:last-child{margin:0 0 0 20px}
}

@media screen and (max-width:500px){
.bs_gosi span:first-child{width:100%}
.bs_gosi select{width:calc(50% - 2px)}

.organ02 ul.depth03 li{width:100%; display:block}
.organ02 ul.depth03 li a{padding:8px 0}	
.organ02 ul.depth03 li a br{display:none}
}

@media screen and (max-width:460px){
    .gosi_list li{width:48.5%;margin:10px 3% 0 0}
    .gosi_list li:nth-child(3){margin:10px 3% 0 0}
    .gosi_list li:nth-child(2),
    .gosi_list li:nth-child(4){margin:10px 0 0 0}
    .gosi_list li:nth-child(5){margin-bottom:0}
    .gosi_list li a{padding:15px 0}
    .gosi_list li a img{width:100px;padding-bottom:10px}
}

@media screen and (max-width:370px){

    .bs_gosi span:first-child{width:100%}
    .bs_gosi span:last-child br{display:block}
    .bs_gosi input{width:65%; margin-bottom:5px}

}

@media screen and (max-width:360px){
    .popup_btn li{margin:0 0 2px 0;}
    .popup_btn li a{height:35px; line-height:35px;}
    .popup_footer2{display:none}



}

#chaStory{position:relative;padding:17px 17px 0;background-color:#f2f4f6}
#chaStory *{box-sizing:border-box}

#chaStory .story-head{padding:30px;background-color:#fff}
#chaStory .story-head p{text-align:justify;line-height:160%;font-size:16px}

#chaStory .story-body{position:relative;margin:37px 70px 0}
#chaStory .story-body .body-all{position:absolute;top:0;right:0;width:96px;height:96px;border-radius:100%;background-color:#03a49e}
#chaStory .story-body .body-all a{display:block;height:100%;padding-top:19px;text-align:center;color:#fff}
#chaStory .story-body .body-all .icon{display:block;width:20px;height:30px;margin:0 auto 5px;background:url(/images/gove/cha_story_icon.png) no-repeat}

#chaStory .story-body .body-map{position:relative;width:496px;height:710px;margin:0 auto;background:url(/images/gove/cha_story_map.png) no-repeat}
#chaStory .story-body .body-map ul li{position:absolute;top:0;left:0;display:table;width:55px;height:55px}
#chaStory .story-body .body-map ul li a{display:table-cell;height:100%;vertical-align:middle;text-align:center;line-height:100%;font-size:15px;border-radius:100%;color:#fff;opacity:0.75}

#chaStory .story-body .body-map .map-incheon{top:98px;left:76px}
#chaStory .story-body .body-map .map-incheon a{background-color:#588ed0}

#chaStory .story-body .body-map .map-seoul{top:91px;left:147px}
#chaStory .story-body .body-map .map-seoul a{background-color:#588ed0}

#chaStory .story-body .body-map .map-gyeonggi{top:153px;left:155px}
#chaStory .story-body .body-map .map-gyeonggi a{background-color:#588ed0}

#chaStory .story-body .body-map .map-gangwon{top:92px;left:282px}
#chaStory .story-body .body-map .map-gangwon a{background-color:#d76bb2}

#chaStory .story-body .body-map .map-chungnam{top:265px;left:102px}
#chaStory .story-body .body-map .map-chungnam a{background-color:#52c18b}

#chaStory .story-body .body-map .map-sejong{top:234px;left:153px}
#chaStory .story-body .body-map .map-sejong a{background-color:#84af4c}

#chaStory .story-body .body-map .map-chungbuk{top:212px;left:213px}
#chaStory .story-body .body-map .map-chungbuk a{background-color:#52c18b}

#chaStory .story-body .body-map .map-daejeon{top:295px;left:173px}
#chaStory .story-body .body-map .map-daejeon a{background-color:#52c18b }

#chaStory .story-body .body-map .map-jeonbuk{top:368px;left:132px}
#chaStory .story-body .body-map .map-jeonbuk a{background-color:#7186e0}

#chaStory .story-body .body-map .map-gyeongbuk{top:278px;left:314px}
#chaStory .story-body .body-map .map-gyeongbuk a{background-color:#a771d5}

#chaStory .story-body .body-map .map-daegu{top:359px;left:294px}
#chaStory .story-body .body-map .map-daegu a{background-color:#a771d5}

#chaStory .story-body .body-map .map-gwangju{top:446px;left:84px}
#chaStory .story-body .body-map .map-gwangju a{background-color:#e69c4d}

#chaStory .story-body .body-map .map-jeonnam{top:507px;left:84px}
#chaStory .story-body .body-map .map-jeonnam a{background-color:#e69c4d}

#chaStory .story-body .body-map .map-gyeongnam{top:431px;left:243px}
#chaStory .story-body .body-map .map-gyeongnam a{background-color:#49a0cd}

#chaStory .story-body .body-map .map-ulsan{top:410px;left:394px}
#chaStory .story-body .body-map .map-ulsan a{background-color:#49a0cd}

#chaStory .story-body .body-map .map-busan{top:481px;left:364px}
#chaStory .story-body .body-map .map-busan a{background-color:#49a0cd}

#chaStory .story-body .body-map .map-jeju{top:639px;left:10px}
#chaStory .story-body .body-map .map-jeju a{background-color:#f17fad}

/*button animate*/
#chaStory .story-body .body-map ul li a{transition:transform .1s ease-in-out, opacity .1s ease-in-out}
#chaStory .story-body .body-map ul li a:hover{transform:scale(1.5, 1.5);opacity:1}

#chaStory .story-animate{position:relative;height:165px;background:url(/images/gove/cha_story_bottom.png) no-repeat}
#chaStory .story-animate .animate-maskman{position:absolute;bottom:0;left:320px;height:136px}
#chaStory .story-animate .animate-maskman div{position:absolute;top:0;left:0;width:121px;height:136px}

#chaStory .story-animate .animate-maskman .head{
    background:url(/images/gove/ani/head.png) no-repeat;
    transform-origin:63px 25px;
    animation:dance-head 2s infinite;
}

#chaStory .story-animate .animate-maskman .arm-left{
    background:url(/images/gove/ani/arm_left.png) no-repeat;
    transform-origin:38px 27px;
    animation:dance-arm-left 2s infinite;
}

#chaStory .story-animate .animate-maskman .arm-right{
    background:url(/images/gove/ani/arm_right.png) no-repeat;
    transform-origin:72px 30px;
    animation:dance-arm-right 2s infinite;
}

#chaStory .story-animate .animate-maskman .reg-left{background:url(/images/gove/ani/reg_left.png) no-repeat}
#chaStory .story-animate .animate-maskman .reg-right{background:url(/images/gove/ani/reg_right.png) no-repeat}

#chaStory .story-animate .animate-maskman .body{background:url(/images/gove/ani/body.png) no-repeat}
#chaStory .story-animate .animate-maskman .cloth{background:url(/images/gove/ani/cloth.png) no-repeat}

@keyframes dance-head {
    0% { transform:rotate(15deg) }
    50% { transform:rotate(-15deg) }
    100% { transform:rotate(15deg) }
}

@keyframes dance-arm-left {
    0% { transform:rotate(0deg) }
    50% { transform:rotate(25deg) }
    100% { transform:rotate(0deg) }
}

@keyframes dance-arm-right {
    0% { transform:rotate(-25deg) }
    50% { transform:rotate(0deg) }
    100% { transform:rotate(-25deg) }
}

#chaStory .story-animate .animate-drumman{
    position:absolute;bottom:0;left:27px;width:90px;height:163px;
    background:url(/images/gove/ani/drumman.png) no-repeat;
    animation:jump-drumman 1.5s infinite;
}

@keyframes jump-drumman {
    0% { top:-20px }
    50% { top:0  }
    100% { top:-20px }
}

#chaStory .story-animate .animate-tree{position:absolute;bottom:0;left:0;width:53px;height:91px;background:url(/images/gove/cha_story_bottom_tree.png) no-repeat}

@media (max-width:767px) {

#chaStory{padding:0;background:transparent}
#chaStory .story-head{padding:10px;background:#f2f4f6}
#chaStory .story-head p{padding:10px;border:1px solid #ddd;background-color:#fff}

#chaStory .story-body{overflow:hidden;margin:30px 0 0}
#chaStory .story-body .body-all{float:left;margin-right:25px;position:static}

#chaStory .story-body .body-map{width:auto;height:auto;overflow:hidden;padding:10px 10px 10px 20px;border-left:1px solid #ddd;background:transparent}
#chaStory .story-body .body-map ul li{position:static;float:left;margin:3px}

#chaStory .story-animate{display:none}

}