/* Written By MJS */

*{-webkit-text-size-adjust:none}
body,form,div,p,h1,h2,h3,h4,h5,h6,dl,dt,dd,ul,ol,li,fieldset,th,td,input,textarea,button,select{margin:0;padding:0;font-family:'Malgun Gothic','맑은 고딕',dotum,'돋움',sans-serif;font-weight:normal}
body{-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}
li{list-style:none}
a{border:0;padding:0;margin:0;text-decoration:none;color:#333}
ol,ul,dl{list-style:none}
img{float:left;border:0;padding:0;margin:0;}
legend,caption{display:none}
table{border-collapse:collapse;border-spacing:0}
input{vertical-align:middle;padding:0;border:0;margin:0;}
select{padding:0;border:0;margin:0;}

body{min-width:320px;max-width:1000px;height:100%;margin:0 auto;}





/*================================== 상단 ==================================*/
#main-navbar{position:relative;float:left;z-index:10;width:94%;padding:3%;background:#fff;border-bottom:10px solid #f15921;}
#toggle-sidebar{float:left;width:12%;cursor:pointer;}
a.call{float:left;width:12%;}
/* 로고 */
.logo{position:relative;float:left;width:46%;margin:0 14%;}
.logo a{float:left;width:100%;}
.logo a img{float:left;width:100%;}


#main-sidebar{position:fixed;top:0;bottom:0;background:#e5e5e5;}
#main-sidebar .close-sb{height:48px;line-height:48px;background:#333;padding:0 0 0 3%;border-bottom:1px solid #000;font-size:18px;color:#fff;cursor:pointer;}
#main-sidebar ul li > a{display:block;height:18px;line-height:18px;padding:12px 0 12px 5%;border-bottom:1px solid #ccc;font-size:16px;font-weight:600;color:#555;}
#main-sidebar ul li > a:hover{background:#333;border-bottom:1px solid #010101;color:#fff;}
#main-sidebar ul li li > a{display:block;padding:8px 0 8px 5%;background:#f7f7f7;border-bottom:1px solid #dedee0;font-size:13px;color:#555;}
#main-sidebar ul li li > a .class_point1{width:30px;display:inline-block;line-height:18px;font-size:10px;font-weight:600;color:white;background:red;text-align:center;padding:0;margin:0;margin-right:4px;}
#main-sidebar ul li li > a .class_point2{width:30px;display:inline-block;line-height:18px;font-size:10px;font-weight:600;color:white;background:green;text-align:center;padding:0;margin:0;margin-right:4px;}






/*================================== 메인 ==================================*/
/* 메인 슬라이드 */
.promotion{position:relative;float:left;margin:0;padding:0;min-width:320px;max-width:1080px;width:100%;overflow-x:hidden;}
.slidings{margin:0;padding:0;}
#promotionBanner{margin:0;padding:0;}
.wrap{margin:0;padding:0;}
figure{margin:0;padding:0;}
#promotionBannerPagination{margin:0;padding:0;}
.pagination{margin:0;padding:0;}






/*================================== 하단 ==================================*/
#footer{position:relative;float:left;width:100%;background:#fff;border-top:1px solid #aaa;}
.copy{position:relative;float:left;width:100%;padding-top:5%;color:#666;font-size:12px;letter-spacing:-0.01em; display:flex; flex-direction: column; gap:10px;}
.copy p{}


.copy > div{display:flex; align-items: center; gap:20px;}
.copy-img1{width:120px; display:block; margin-bottom:7px;}
.copy span{display:block;}


/* 버튼 style */
#button{position:relative;float:left;width:100%;background:#fff;padding:6% 0 8% 0;text-align:center;color:#fff;}
.btn{margin:1%;padding:2% 4%;font-size:12px;color:#fff;border:none;background:#b2b2b2;
-moz-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
behavior:url(ie-css3.htc);}





/*================================== 서브 ==================================*/
#sub_content{position:relative;float:left;width:100%;height:auto;min-width:320px;}

/* 서브 메뉴 */
.sub_menu{position:relative;float:left;width:94%;padding:0 3%;background:#f6f6f6;}
.sub_menu h3{float:left;width:100%;font-size:20px;line-height:28px;letter-spacing:-1px;font-weight:600;color:#000;margin:4% 0 0 0;}
.sub_menu ul{float:left;width:100%;margin:0 0 15px 0;}
.sub_menu ul li{float:left;padding:0 3%;line-height:100%;border-left:1px solid #ccc;margin-top:3%;}
.sub_menu ul li:first-child{padding-left:0;border-left:none}
.sub_menu ul li a{float:left;line-height:100%;font-size:13px;font-weight:bold;color:#666;}
.sub_menu ul li a.on{font-weight:bold;color:#000;}

.page_content{position:relative;float:left;width:94%;padding:8% 3%;border-top:1px solid #f15921;}





/*=================================== 내용 ===================================*/
.stitle{float:left;width:95%;padding-left:3%;line-height:100%;font-size:18px;font-weight:600;letter-spacing:-1px;border-left:5px solid #f15921;margin:6% 0 3% 0;}
.stitle span{color:#f15921;padding:3px 3px;}


/* 인사말 */
.greeting{float:left;width:100;color:#000;}
.greeting p{float:left;width:100%;line-height:18px;font-size:12px;text-align:justify;color:#000;margin-top:5%;}
.greeting .sign{float:right;width:100%;margin-top:10px;}
.greeting .sign img{float:right;}


/* 건축소개 */
.build{float:left;width:100%;}
.build img{float:right;}
.build p{float:left;width:100%;line-height:18px;font-size:12px;text-align:justify;color:#000;}


/* 연혁 */
.history{position:relative;float:left;width:100%;}
.history .his_box{position:relative;float:left;width:100%;}
.history .his_box{position:relative;float:left;width:100%;}
.history .his_box b{float:left;width:100%;line-height:100%;font-size:28px;font-weight:bold;font-weight:1000;letter-spacing:-2px;color:#aaa;}
.history .his_box ul{float:left;width:100%;width:94%;padding:3%;border-top:1px dashed #e0e0e0;border-bottom:1px dashed #e0e0e0;background:#fff;margin:3% 0 6% 0;}
.history .his_box ul li{float:left;width:100%;line-height:18px;font-size:13px;margin:5px 0;color:#666;}
.history .his_box ul li span{float:left;width:100%;line-height:16px;font-size:13px;letter-spacing:-1px;color:#555;margin-bottom:2%;}


/* 전시목록 */
.photo_list2{position:relative;float:left;width:100%;}
.photo_list2 ul{float:left;width:100%;border-top:1px dashed #ccc;}
.photo_list2 ul li{float:left;width:100%;padding:5% 0;border-bottom:1px dashed #ccc;}
.photo_list2 ul li a{float:left;width:32%;margin-right:4%;}
.photo_list2 ul li a img{float:left;width:100%;}
.photo_list2 .p_w{float:left;width:64%;}
.photo_list2 .p_w p{float:left;width:100%;line-height:18px;font-size:12px;color:#555;margin-bottom:3%;}
.photo_list2 .p_w p b{float:left;width:100%;margin-bottom:2%;color:#000;}
input.photo_btn{float:left;width:100%;height:26px;line-height:26px;font-size:13px;font-weight:600;color:#333;background:#ffdd76;border:none;}

.state1{display:inline-block;line-height:20px;font-size:12px;font-family:'gulim';color:#fff;padding:0 8px;margin:-2px 0 0 3%;background:#f15921;}
.state2{display:inline-block;line-height:20px;font-size:12px;font-family:'gulim';color:#fff;padding:0 8px;margin:-2px 0 0 3%;background:#f7926d;}
.state3{display:inline-block;line-height:20px;font-size:12px;font-family:'gulim';color:#fff;padding:0 8px;margin:-2px 0 0 3%;background:#666;}


/* 사진갤러리 */
.photo_list{position:relative;float:left;width:98%;margin:0 1%;}
.photo_list ul{float:left;width:103%;margin:0 0 0 -1.5%;}
.photo_list ul li{float:left;width:47%;height:200px;margin:1.5%;}
.photo_list ul li a{float:left;width:100%;}
.photo_list ul li a img{float:left;width:100%;}
.photo_list ul li a:hover img{filter:alpha(opacity=30);opacity:0.7;}
.photo_list ul li p{float:left;width:100%;line-height:18px;font-size:13px;color:#000;margin-top:3%;text-align:center;}


/* 상세페이지 */
.detail{position:relative;float:left;width:100%;}
.detail_title{position:relative;float:left;width:92%;padding:3.6%;border:1px solid #ccc;background:#f6f6f6;margin-bottom:5%;}
.detail_title b{float:left;width:100%;line-height:20px;font-size:16px;font-weight:bold;}
.detail_title span{float:left;width:100%;line-height:100%;font-size:12px;margin-top:3%;text-align:right;}
.detail_title ul{float:left;width:100%;}
.detail_title ul li{float:left;width:100%;}
.detail_title ul li{float:left;width:100%;line-height:18px;font-size:13px;color:#555;margin:4px 0;}
.detail_title ul li p{float:left;font-size:13px;font-weight:600;color:#000;margin-right:5px;}

.detail_img{position:relative;float:left;width:100%;}

.detail_ment{float:left;width:100%;line-height:16px;font-size:12px;color:#555;text-align:justify;margin-top:5%;}
.detail_ment b{float:left;width:100%;font-size:16px;text-align:center;color:#000;}

.btn_w{position:relative;float:left;width:100%;text-align:center;margin-top:60px;}
input.btn{display:inline-block;width:40%;height:40px;line-height:100%;font-size:16px;font-weight:600;background:#aaa;text-align:center;color:#fff;border:none;border-radius:0;margin:0 0.5%;}
input:hover.btn{background:#666;}
input.btn2{display:inline-block;width:40%;height:40px;line-height:100%;font-size:16px;font-weight:600;background:#d24545;text-align:center;color:#fff;border:none;border-radius:0;margin:0 0.5%;}
input:hover.btn2{background:#bc2929;}


/* 관람안내 */
.sub_box{position:relative;float:left;width:92%;padding:2% 3.5%;line-height:18px;font-size:12px;border:1px solid #e0e0e0;}
.sub_box dl{float:left;width:100%;}
.sub_box dl dt{float:left;width:100%;line-height:100%;font-size:14px;font-weight:600;color:#000;margin:2% 0;}
.sub_box dl dd{float:left;width:100%;line-height:18px;font-size:12px;color:#555;margin:0 0 2% 0;}
.sub_box dl dd b{float:left;line-height:20px;font-size:12px;font-weight:600;text-align:center;color:#fff;background:#f15921;padding:0 6px;margin:3px 10px 3px 0;}
.cont{border:1px solid #e0e0e0;}
.cont2{float:left;width:728px;font-size:14px;padding:20px;border:1px solid #e0e0e0;border-top:none;}
.cont2 b{float:left;width:78px;font-size:14px;}

ul.tabs{position:relative;float:left;width:100%;height:35px;border-bottom:1px solid #aaa;}
ul.tabs li{position:relative;float:left;width:21%;height:36px;line-height:36px;background:#888;overflow:hidden;margin:0 1px 0 1px;}
ul.tabs li:first-child{margin-left:0;}
ul.tabs li a{float:left;width:98.2%;height:36px;line-height:36px;text-align:center;font-size:14px;letter-spacing:-1px;border:1px solid #aaa;font-weight:600;color:#fff;filter:alpha(opacity=70);opacity:0.7;-moz-opacity:0.7;}
ul.tabs li.active a, ul.tabs li.active a:hover{height:37px;font-size:16px;border-bottom:none;filter:alpha(opacity=100);opacity:1;-moz-opacity:1;}
.tab_container{float:left;width:99.5%;background:#fff;border:1px solid #aaa;border-top:none;margin-bottom:12%;}
.tab_content{float:left;width:100%;}
.cont{border:1px solid #e0e0e0;}


/* 대관신청 */
.sub_ment{position:relative;float:left;width:100%;height:150px;background:url(../img/logo_bg.png) no-repeat 50% 35%;background-size:80%;}
.sub_ment p{float:left;width:94%;padding:0 3%;line-height:20px;font-size:14px;font-weight:600;text-align:center;}
.down_btn{position:absolute;left:0;bottom:0;width:100%;text-align:center;}
.down_btn a{float:left;width:60%;margin:0 20%;}
.down_btn a img{float:left;width:100%;}


/* 공지사항 */
.accordion{width:100%;border-top:1px solid #ccc;}
.accordion li{position:relative;float:left;width:100%;border-top:1px solid #fff;background:#eee;border-bottom:1px solid #ccc;}
.accordion li .ntc_list{display:none;padding:4%;color:#555;background:#fbfbfb;}
.accordion li .ntc_list p{font-size:13px;line-height:16px;}
.accordion li div{display:block;width:92%;padding:4%;font-size:90%;font-weight:600;cursor:pointer;color:#000;}
.accordion li .file{float:left;text-align:center;height:26px;line-height:26px;font-size:14px;background:#eee;color:#898989;padding:0 10px;background:#000;color:#fff;font-weight:600;}

.paging_w{position:relative;float:left;width:100%;height:26px;margin:6% 0;}
.paging{text-align:center;}
.paging ul{display:inline-block;zoom:1;*display:inline;margin:0 10px}
.paging ul li{float:left;margin:0 2px;}
.paging ul li a{float:left;text-align:center;height:22px;line-height:22px;font-size:12px;background:#eee;color:#898989;padding:0 6px;}
.paging ul li a.on{background:#000;color:#fff;font-weight:600;}











/* 이미지크기 제멋대로일때 조정해주는 style */
@media screen and (min-width:0) and (max-width:420px) {
.photo_list2 ul li a img{height:110px;}

.photo_list ul li{height:150px;}
.photo_list ul li a img{height:120px;}
}

@media screen and (min-width:421px) and (max-width:767px) {
.photo_list2 ul li a img{height:140px;}

.photo_list ul li{height:220px;}
.photo_list ul li a img{height:180px;}
}

@media screen and (min-width:768px) and (max-width:1023px) {
.photo_list2 ul li a img{height:180px;}

.photo_list ul li{width:30.33%;height:200px;}
.photo_list ul li a img{height:160px;}
}

@media screen and (min-width:1024px) and (max-width:1920px) {
.photo_list2 ul li a img{height:230px;}

.photo_list ul li{width:30.33%;height:250px;}
.photo_list ul li a img{height:210px;}
}