@charset "utf-8";
/*공통*/
.comm-tit{letter-spacing:-1.5px;font-size:22px;font-weight:500;margin-bottom:11px;position:relative;padding-left:26px;color:#333;}
.comm-tit::before{content:"";background:url('/resources/images/common/tit_bullet.gif') no-repeat;width:18px;height:18px;position:absolute;top:7px;left:0;}
.comm-subtit{font-size:17px;font-weight:500;letter-spacing:-0.8px;margin:15px 0 10px 0;color:#333;}
.comm-tit span.date_num{font-weight:400; font-size:18px; margin-left:10px; letter-spacing:-0.3px; color:#666;}
.txt-p{position:relative;padding-left:12px;line-height:1.6;padding-bottom:10px;color:#666;}
.txt-p:before{content:"";width:3px;height:3px;border-radius:8px;background:#aaa; position:absolute;top:9px;left:2px;}
.box-p{background:#f5f5f5;padding:20px 25px;margin:20px 0 30px 0;word-break: keep-all;line-height: 1.5;}
.comm-list{margin:12px 0 30px 0;}
.comm-list li{position:relative;padding-left:12px;margin:5px 0;line-height:1.5;color:#666;}
.comm-list li:before{content:"";width:3px;height:3px;border-radius:8px;background:#aaa; position:absolute;top:8px;left:2px;}
.comm-list li span{text-decoration:underline;}
.txt-box{padding:10px 0 30px 0;}
*:focus { outline:none; }


/* 기본 table */
.tbl_default{width:100%; box-sizing:border-box; border-top:2px solid #000;}
.tbl_default th{border-bottom:1px solid #000; color:#000; font-weight:500; text-align:center; padding:14px 0;}
.tbl_default td{font-size:14px;font-weight:400; text-align:center; padding:15px 0; border-bottom:1px solid #ddd;}
.tbl_default td.left{text-align:left; padding-left:10px;}
.tbl_default td a{color:#666;}
.tbl_default td a:hover{color:#c81b41; text-decoration:underline; font-weight:500;}

/*관장인사말*/
.greeting{background:url('/resources/images/contents/greeting_pc.png') no-repeat center top/100%;position:relative;width:100%;min-height:700px;margin:100px 0;}
.greeting > div{position:absolute;right:0;top: 113px;width: 660px;padding: 60px 0 0 60px;}
.greeting > div > h2{font-size:30px;color:#000;font-weight:300;line-height:1.3;}
.greeting > div > h2 > span{font-weight:600;}
.greeting > div > p{color:#666;font-size:15px;margin-top:20px;line-height:1.8;word-break:keep-all;}
.greeting > div > p.sig{margin-top:80px;text-align:right;}

/* 뮤지엄연혁 */
.year-con{position:relative; padding:40px 0;border-bottom:1px dashed #eaeaea;}
.year-con .year{position:absolute; top:30px; left:50px; width:250px;}
.year-con .year span{display:inline-block; padding-right:25px; color:#ccc; font-size:35px;font-weight:400;}
.year-con .list{padding-left:175px;}
.year-con .list dl{overflow:hidden; padding-left:90px; padding-bottom:22px; line-height:20px;}
.year-con .list dl dt{float:left; width:120px; font-size:16px; letter-spacing:0; font-weight:500; padding-top:5px;}
.year-con .list dl dd{float:left;letter-spacing:-0.5px; font-size:15px;font-weight:400; padding-top:5px; padding-left:13px; word-break:keep-all;position:relative;}
.year-con .list dl dd:before{content:"";position:absolute;background:#aaa;width:4px;height:4px;top:13px;left:0;}

/*관람안내*/
.visit-info .txt-box .program{width:100%;display: inline-block;}
.visit-info .txt-box .program div{overflow:hidden;padding:18px 40px;width: 46%;float: left;margin:20px 0;box-sizing:border-box;border:0;}
.visit-info .txt-box .program div:nth-child(1){background:url('/resources/images/contents/info_img01.png') no-repeat center 35px}
.visit-info .txt-box .program div:nth-child(2){background:url('/resources/images/contents/info_img02.png') no-repeat center 35px;float:right;}
.visit-info .txt-box .program div:hover{box-shadow:2px 2px 14px 2px #f2f2f2; transition:all 0.5s ease;}
.visit-info .txt-box .program div h3{font-size:20px;text-align:center;margin:15px 0 20px 0;padding-top:110px;font-weight:600;}
.visit-info .txt-box .program div a{border:1px solid #222;background:#333;color:#fff;padding:15px 16px;font-size:15px;text-align:center;margin:25px auto;display:block;}
.visit-info .txt-box .program div a:hover{background:#111;color:#fff; transition:all 0.5s ease;}
.visit-info table.tbl_default tbody tr td{word-break:keep-all;}
.visit-info table.tbl_default tbody tr td:nth-child(1){font-weight:500;border-right:1px solid #ddd;}

/*오시는길*/
.map .map-box{margin:50px 0 20px 0;}
.map .map-box {margin-bottom:10px;}
.map .map-box h3{margin-top:20px;}
.map .map-box div{background:#f5f5f5;padding:12px 20px;margin-bottom:30px;}
.map .map-box div p{margin:8px 0;position:relative;padding-left:18px;}
.map .map-box div p:before{content:"";position:absolute;background:#888;width:8px;height:1px;top:8px;left:0;}
.map table tr th{font-size:15px;}
.map table tr th:nth-child(1){border-right:1px solid #ddd;}
.map table tr td:nth-child(1){border-right:1px solid #ddd;}
.map table tr td:nth-child(2){text-align:left;padding:0 20px;}

/*서포터즈*/
.support {min-height:700px;background:url('/resources/images/contents/support.jpg') no-repeat bottom center;}
.support .comm-subtit{position:relative;padding-left:20px;}
.support .comm-subtit:after{content:"";position:absolute;width:12px;height:1px;background:#555;left:0;top:12px;}
.support .comm-list{padding-left:22px;}

/*건물안내*/
.build .floor-wrap{background:#f5f5f5;padding:20px;box-sizing:border-box;}
.build .floor_tab ul{width:100%;font-size:0;}
.build .floor_tab ul li{width:50%; display:inline-block;margin-top:-1px;margin-left:-1px;}
.build .floor_tab ul li a{display:block; text-align:center; font-size:16px; border:1px solid #d1d1d1; box-sizing:border-box; height:55px; line-height:55px;}
.build .floor_tab ul li:hover{background:#eee; transition:all 0.5s ease;}
.build .floor_tab ul li.active{background:#fff; color:#333; border-bottom:0;}
.build .floor{border:1px solid #ddd;margin-top:15px;width:100%;background:#fff;height:400px;}
.build .floor img{text-align:center;display:block;margin:50px auto;}

.build .ex-info{width:47%;display:inline-block;padding:20px;box-sizing:border-box;font-size:15px;font-weight:300;vertical-align:top;background:#f5f5f5;margin-left:2%;}
.build .ex-info h3{font-size:20px;font-weight:500;padding:6px 0;margin-bottom:10px;letter-spacing:-1px;position:relative;color:#333;}
.build .ex-info h3:before{content:"";position:absolute;width:32px;height:2px;background:#333;top:0;left:0;}
.build .ex-info div{padding:30px 20px;position:relative;border:1px solid #ddd;background:#fff;min-height:309px;}
.build .ex-info div p{line-height:1.5;font-weight:400;color:#555;}
.build .ex-info span.bk{display:inline-block;transform:rotate(-90deg);color:#d3d3d3;vertical-align: top;position: absolute;float:right;right: -135px;bottom: 55px;font-size: 15px;font-weight: 400;letter-spacing: 4px;}
.build .ex-info span.bk:after{content: '';transform:rotate(-90deg);width:1px;height:70px;background-color: #d3d3d3;position:absolute;top:-21px;right:-45px;}

/*시설안내*/
.tab_list02{width:100%;margin:30px auto;}
.tab_list02 ul{width:100%;font-size:0;}
.tab_list02 ul li{width:calc(100%/7); display:inline-block;margin-top:-1px;}
.tab_list02 ul li a{display:block; text-align:center; font-size:16px; background:#fafafa; border:1px solid #ddd; box-sizing:border-box; height:55px; line-height:55px;border-right:0;}
.tab_list02 ul li:last-child a{border-right:1px solid #ddd;}
.tab_list02 ul li a:hover{background:#eee; transition:all 0.5s ease}
.tab_list02 ul li a.active{background:#fff; color:#333; border-bottom:0;}
.slide-wrap{position: relative;height: 400px;width:50%;background:#fff;display:inline-block;}
.swiper-container {width: 100%;margin-left: auto;margin-right: auto;}
.swiper-slide {background-size: cover;background-position: center;}
.gallery-top {height: 75%;width: 100%;margin-bottom:10px;}
.gallery-thumbs { height: 25%;box-sizing: border-box;padding: 10px 0;background:#fff;}
.gallery-thumbs .swiper-slide {height: 100%;opacity: 0.5;box-sizing:border-box;}
.gallery-thumbs .swiper-slide-thumb-active {opacity: 1;border:3px solid #c81b41;}
.swiper-wrapper{display: -webkit-box;display: -ms-flexbox;display:-webkit-flex;}
.gallery-thumbs .swiper-wrapper div{position:relative;}
.gallery-thumbs .swiper-wrapper div:hover{background-size:150%;}
.swiper-button-next, .swiper-button-prev{position:relative;width:51px !important;height:68px !important;top:40% !important;margin-top:0 !important;}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{opacity:1 !important;}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev{right:0 !important;}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next{left:0 !important;}
.swiper-button-next:after, .swiper-button-prev:after{font-family:none !important;font-size:0 !important;}
.swiper-button-prev:after{content:"prev";position:absolute;background:url('/resources/images/common/btn-prev.png') no-repeat;width:51px;height:68px;top:0;left:0;}
.swiper-button-next:after{content:"next";position:absolute;background:url('/resources/images/common/btn-next.png') no-repeat;width:51px;height:68px;top:0;right:0;}
.swiper-notification{color:#fff;background:rgba(0,0,0,.5);display:inline;width:auto;;border-radius:20px;padding:5px 14px;bottom:10px;left:50%;transform:translateX(-50%)}
.exhibit .ex-info{width:47%;display:inline-block;padding:20px;box-sizing:border-box;font-size:15px;font-weight:300;vertical-align:top;background:#f5f5f5;margin-left:2%;}
.exhibit .ex-info h3{font-size:20px;font-weight:500;padding:6px 0;margin-bottom:10px;letter-spacing:-1px;position:relative;color:#333;}
.exhibit .ex-info h3:before{content:"";position:absolute;width:32px;height:2px;background:#333;top:0;left:0;}
.exhibit .ex-info div{padding:30px 20px;position:relative;border:1px solid #ddd;background:#fff;min-height:309px;}
.exhibit .ex-info div p{line-height:1.5;font-weight:400;color:#555;}
.exhibit .ex-info span.bk{display:inline-block;transform:rotate(-90deg);color:#d3d3d3;vertical-align: top;position: absolute;float:right;right: -135px;bottom: 55px;font-size: 15px;font-weight: 400;letter-spacing: 4px;}
.exhibit .ex-info span.bk:after{content: '';transform:rotate(-90deg);width:1px;height:70px;background-color: #d3d3d3;position:absolute;top:-21px;right:-45px;}


/*조직도*/
.org .org-chart{width:100%;font-size:17px;margin-top:20px;font-weight:400;color:#222;border:1px solid #eee;padding:60px 0;background:#fafafa;}
.org .org-chart ul{clear:both;overflow:hidden;}
.org .org-chart .depth1{width:100%;margin:0 auto;text-align:center;position:relative;}
.org .org-chart .depth1:before{content:"";position:absolute;width:1px;height:188px;background:#d1d1d1;top:58px;left:50%;z-index:9999;}
.org .org-chart .depth1:after{content:"";position:absolute;width:478px;height:1px;background:#d1d1d1;bottom:-35px;left:312px;z-index:9999;}
.org .org-chart .depth1 p{width:220px;padding:15px 0;background:#c81b41;color:#fff;font-size:20px;margin:0 auto;}
.org .org-chart .depth2{width:700px;padding-top:63px;margin:0 auto;}
.org .org-chart .depth2 li{width:220px;padding:15px 0;background:#eaeaea;border:1px solid #d1d1d1;margin:0 auto;text-align:center;position:relative;}
.org .org-chart .depth2 li:before{content:"";position:absolute;width:1px;height:30px;background:#d1d1d1;bottom:53px;left:50%;z-index:9999;}
.org .org-chart .depth3{width:900px;padding-top:100px;margin:0 auto;}
.org .org-chart .depth3 li{width:200px;padding:15px 0;background:#444;color:#fff;margin:0 auto;text-align:center;display:inline-block;margin:0 10px;position:relative;}
.org .org-chart .depth3 li:before{content:"";position:absolute;width:1px;height:30px;background:#d1d1d1;bottom:53px;left:50%;z-index:9999;}
.org .org-chart .depth3 li:after{content:"";position:absolute;width:224px;height:1px;background:#d1d1d1;top:-31px;left:50%;z-index:9999;}
.org .org-chart .depth3 li:last-child:after{content:none;}
.org .org-chart .f_left{float:left;}
.org .org-chart .f_right{float:right;}
.org table.tbl_default{margin:60px auto 10px;font-size:15px;}

/*네트워크*/
.network .tab_list02 ul li{width:50%; display:inline-block;margin-top:-1px;}
.network .comm-tit{margin-top:50px;}
.network .net-box{width:100%;border:1px solid #ddd;display:table;margin-bottom:30px;}
.network .net-box h3{font-size:19px;font-weight:500;width:18%;display:table-cell;vertical-align:top;background:#f5f5f5;color:#333;padding:40px 20px 20px 20px;position:relative;word-break:keep-all;}
.network .net-box h3:before{content:"";position:absolute;width:30px;height:2px;background:#333;top:30px;left:20px;}
.network .net-box .net-list{width:80%;display:table-cell;padding:20px 0 20px 4%}
.network .net-box .net-list li{float:left;width:25%;position:relative;margin:2px 0;}
.network .net-box .net-list li a{padding:6px 0;color:#555;display:block;box-sizing:border-box;}
.network .net-box .net-list li a:hover{text-decoration:underline;color:#333;}
.network .net-box .net-list li:before{content:"";position:absolute;width:3px;height:3px;top:13px;left:-7px;border-radius:10px;background:#ccc;}

/*회원탈퇴*/
.del_account{text-align:center;}
.del_account img{margin-top:40px;}
.del_account p:nth-child(2){font-size:22px; font-weight:500; color:#000;margin-top:40px;}
.del_account p:nth-child(3){font-size:16px;}


/*faq*/
.faq_info{border:1px solid #ddd;margin-bottom:25px;padding:36px 24px 36px 180px;box-sizing:border-box;background:url('/resources/images/contents/bg_faq.png') no-repeat 50px center;}
.faq_info p{font-size:15px;line-height:1.6;}
.faq_info p span{font-weight:500;color:#111;}

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

    /*공통*/
    .comm-tit{margin-bottom:11px;padding-left:26px;font-size:20px;}
    .comm-tit::before{content:"";background:url('/resources/images/common/tit_bullet.gif') no-repeat;top:5px;left:0;}
    .comm-subtit{margin:10px 0 5px 0;font-size:16px;}
    .txt-p{margin-bottom:10px;line-height:1.6;padding-bottom:10px;}
    .box-p{padding:15px 15px;margin:10px 0 20px 0;text-align:center;}
    .comm-list{margin:8px 0;}
    .comm-list li{padding-left:8px;margin:6px 0;line-height:1.4;word-break:keep-all;}
    .comm-list li:before{content:"";position:absolute;top:8px;left:0;}
    .txt-box{padding:10px 0 30px 0;}

    /* 기본 table */
    .tbl_default th{font-size:14px;}
    .tbl_default td{font-size:14px;padding:15px 3px;}

    /*관장인사말*/
    .greeting{width:100%;background:url('/resources/images/contents/greeting_mb.png') no-repeat center top/100%;margin-top:20px;min-height:800px;}
    .greeting > div{width:100%;box-sizing:border-box;left:0;top:200px;padding:5px 0;}
    .greeting > div > h2{font-size:23px;line-height:1.4;margin-top:15px;word-break:keep-all}
    .greeting > div > p{font-size:14px;margin-top:20px;line-height:1.6;}
    .greeting > div > p.sig{margin-top:40px;text-align:right;}
    .greeting > div > p.sig img{width:250px;}

    /* 뮤지엄연혁 */
    .year-con{padding: 40px 0;border:0;}
    .year-con .year{width:100%;left:0;top: 0;}
    .year-con .year span{font-size:20px;padding-right:0;position:relative;font-weight:400;}
    .year-con .year span:before{content:"";position:absolute;bottom: -6px;left:0;width: 65%;height: 1px;background:#ccc;}
    .year-con .list{padding-left:0;padding-top: 10px;}
    .year-con .list dl{overflow:hidden; padding:0; line-height:20px;}
    .year-con .list dl dt{float:left;width: 70px;padding-top:5px;font-weight:600;}
    .year-con .list dl dd{float:left;width:calc(100% - 78px);padding: 3px 0 0 8px;position:relative;font-size:14px;}
    .year-con .list dl dd:before{top:12px; left:0; width:3px;height:3px;}

    /*관람안내*/
    .visit-info .txt-box .program div{padding:0px 18px;width:98%;box-sizing:border-box;border:1px solid #ddd; margin:0 auto 20px auto;background-position:center 25px !important;float:initial;}
    .visit-info .txt-box .program div:nth-child(2){float:initial;}
    .visit-info .txt-box .program div h3{width:100%;float:none;margin:15px 0;font-size:18px;font-weight:500;}
    .visit-info .txt-box .program div a{padding:14px 16px;font-size:15px;margin:10px 0 30px 0;}

    /*오시는길*/
    .map .wrap_map{height:200px !important;}
    .map .map-box{margin:30px 0;}
    .map .map-box h3{margin-top:0;}
    .map .map-box div{padding:12px;margin-bottom:25px;}
    .map .map-box div p{font-size:14px;padding-left:18px;}
    .map .map-box div p:before{width:8px;height:1px;top:8px;left:0;}
    .map table tr th{font-size:14px;}
    .map table tr td:nth-child(2){text-align:left;padding:8px 12px;}

    /*서포터즈*/
    .support {min-height:950px;background:url('/resources/images/contents/support_mobile.jpg') no-repeat bottom center/contain;}
    .support .sup-box{border:1px solid #ddd;padding:15px;margin-bottom:10px;}
    .support .comm-subtit{padding:6px 0 4px 0;}
    .support .comm-subtit:after{top:0;width:16px;}
    .support .comm-list{padding-left:0;}

    /*건물안내*/
    .build .info{font-size:14px;padding:15px;line-height:1.5;}
    .build .floor-wrap{background:#f5f5f5;padding:10px;box-sizing:border-box;}
    .build .floor_tab ul li a{font-size:15px;}
    .build .floor{margin-top:10px;width:100%;background:#fff;height:inherit;padding:5px;box-sizing:border-box;}
    .build .floor img{margin:50px auto;width:100%;}
    .build .ex-info{width:100%;margin:0;padding:10px;}
    .build .ex-info h3{margin-bottom:3px;font-size:19px;padding-top:6px;}
    .build .ex-info div{margin:0;min-height:110px;font-size:14px;}
    .build .ex-info span.bk{display:none;}


    /*시설안내*/
    .tab_list02{width:100%;margin:0 auto;}
    .tab_list02 ul li{width:50%;}
    .tab_list02 ul li a{font-size:15px;}
    .tab_list02 ul li:nth-child(2n) a{border-right:1px solid #ddd;}
    .tab_list02 ul li a.active{border-bottom:1px solid #ddd;}
    .exhibit .txt-box{padding:10px 0 10px 0;}
    .exhibit .comm-tit{margin-top:20px;}
    .slide-wrap{height:250px;width:100%;}
    .swiper-container{height:240px;}
    .gallery-thumbs{height:0;}
    .exhibit .ex-info{width:100%;margin:0;padding:10px;}
    .exhibit .ex-info h3{margin-bottom:3px;font-size:19px;padding-top:6px;}
    .exhibit .ex-info div{margin:0;min-height:110px;font-size:14px;}
    .exhibit .ex-info span.bk{display:none;}

    /*조직도*/
    .org .org-chart{width:100%;font-size:15px;margin-top:20px;border:1px solid #eee;padding:20px 0;}
    .org .org-chart ul{clear:both;overflow:hidden;}
    .org .org-chart .depth1{}
    .org .org-chart .depth1 p{width:90%;font-size:16px;}
    .org .org-chart .depth2, .org .org-chart .depth3{width:100%;padding-top:13px;}
    .org .org-chart .depth2 li, .org .org-chart .depth3 li{padding:15px 0;width:90%;margin:5px auto 0 auto;display:block;}
    .org .org-chart .depth1:before, .org .org-chart .depth1:after, .org .org-chart .depth2 li:before, .org .org-chart .depth3 li:before, .org .org-chart .depth3 li:after{content:none;}
    .org .org-chart .f_left{float:inherit;}
    .org .org-chart .f_right{float:inherit;}
    .org table.tbl_default{width:100%;margin:30px auto;font-size:15px;}

    /*네트워크*/
    .network .comm-tit{margin-top:20px;}
    .network .net-box{width:100%;border:1px solid #ddd;display:table;margin-bottom:20px;}
    .network .net-box h3{font-size:16px;width:100%;display:block;padding:15px 20px 15px 28px;box-sizing:border-box;}
    .network .net-box h3:before{content:"";position:absolute;width:10px;height:2px;background:#555;top:25px;left:12px;}
    .network .net-box .net-list{width:100%;display:inline-block;padding:5px;box-sizing:border-box;}
    .network .net-box .net-list li{float:inherit;width:100%;margin:0;border-bottom:1px dashed #eee;box-sizing:border-box;}
    .network .net-box .net-list li a{padding:12px 6px 12px 15px;}
    .network .net-box .net-list li:before{top:20px;left:6px;}
    .network .net-box .net-list li:last-child{border:0;}
    .network .net-box .net-list li a{display:block;}

    /*회원탈퇴*/
    .del_account img{margin-top:30px;width:40%;}
    .del_account p:nth-child(2){margin-top:30px;}

    /*faq*/
    .faq_info{margin-bottom:20px;padding:80px 20px 20px !important;background-size:auto 48px;background-position:center 18px;}
    .faq_info p{font-size:14px;line-height:1.4;word-break:keep-all;}

}