@charset "utf-8";

/*메인*/
/*네비게이션*/

.wrap{width:100%; max-width:1200px; margin:0 auto;}
.blank{display: block;
}
.mobile_side, #mobile_nav, #mask_mNav {display: none;}

#header {position:relative;}
/*
#header .header_wrap {height:50px; border-bottom: 1px solid #cccccc; position:relative;}*/
#header>.wrap {position:relative; height:79px;}
#header .logo {float:left; margin-top: 10px;}

#header .top_menu {position: absolute; right:0; top:50%; transform: translateY(-50%); line-height:32px;height:30px;}
#header .top_menu > ul,#header .top_menu .sitemap_go {float: left;}
#header .top_menu li {float: left; margin-right:20px;}
#header .top_menu li:last-of-type {margin:0;}
#header .top_menu li a{font-family:LatoR;text-transform: uppercase; display:block; letter-spacing:0.75px}
#header .top_menu li img{margin-left:10px;}
#header .sitemap_go a{font-family:LatoR;display:block;float:right;width:115px;height:32px;line-height:32px;text-align:center;text-transform:uppercase;background:#009640;color:#fff;margin-left:43px;letter-spacing:.1px}
#header .sitemap_go a img {margin-right:11px;}

#header .header_wrap{height:50px;overflow:hidden;width:100%;border-top:1px solid #ccc;border-bottom:1px solid #ccc;position:absolute;background:#fff;z-index:9999}
#header .header_wrap2{width:100%;height:50px;border-bottom:1px solid #ccc}

#header .gnb li.m_menu{float:left;width:19%;box-sizing:border-box;text-transform:uppercase;text-align:center;position:relative;border:3px solid transparent;z-index:999}
#header .gnb li.m_menu.on {}
#header .gnb li.m_menu.last_menu{width: 24%;}
#header .gnb li.m_menu.last_menu>a{border-right: 1px solid #cccccc;}
#header .gnb li.m_menu:last-of-type .s_menu a{border: 0;}
#header .gnb .wrap>ul{overflow: hidden;}
#header .gnb li.m_menu>a{width:100%;display:block;border-left:1px solid #ccc;position:relative;top:-3px;right:3px}
#header .gnb li.m_menu>a span{font-family:LatoSB;letter-spacing:.1px;position:absolute;width:100%;top:50%;left:50%;transform:translate(-50%,-50%)}

#header .gnb .s_menu{width:100%;text-align:left;padding-top:30px;padding-bottom:25px;height:250px}
#header .gnb .s_menu li{margin-bottom:10px;line-height:23px}
#header .gnb .s_menu li a{font-family:LatoR;letter-spacing:.25px;display:block;width:100%;height:100%;font-size:14px;text-transform:none;box-sizing:border-box;padding-left:22px}


/*******************************content********************************/

#content{
    margin-top: 50px;
}

/********mainslide********/

#main_slide{width:100%;overflow-x:hidden}
.bx-wrapper{height:468px;border-bottom:1px solid #ccc;box-shadow:0 0 0}
.bx-controls-direction{width:100%;max-width:1200px;position:absolute;top:50%;left:50% !important; transform:translate(-50%,-50%)}
.bxslider .slide1 {height:468px;background:url(../en/img/main/slide1.png) center center no-repeat;background-size:cover}
.bxslider .slide2 {height:468px;background:url(../en/img/main/slide2.png) center center no-repeat;background-size:cover}
.bxslider .slide3 {height:468px;background:url(../en/img/main/slide3.png) center center no-repeat;background-size:cover}

.bxslider img{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:999}
.bx-wrapper{border:0}
.bx-wrapper .bx-pager{width:auto;position:absolute;bottom:40px;left:50%;transform:translateX(-50%);padding:0}


/************quick************/
#quick ul li img,#quick ul li span{position:absolute;top:50%;transform:translateY(-50%)}
#quick{background:url(../en/img/main/quick_bg.png) center center no-repeat;background-size:cover}
#quick ul{overflow:hidden;height:100%}
#quick ul li{float:left;width:25%;height:110px;position:relative}
#quick ul li a{display:block;width:100%;height:100%}
#quick ul li img{left:10px}
#quick ul li span{font-family:'Exo 2';font-size:17px;letter-spacing:-.1px;display:block;max-width:150px;left:40%}


/***********main_content**********/
#main_content{clear:both;padding-top:22px;padding-bottom:40px;overflow:hidden}
#main_content .title_area{overflow:hidden;padding-bottom:20px;border-bottom:2px solid #404040;margin-bottom:18px}
#main_content .title_area h3{font-family:'Exo 2';font-weight:800;letter-spacing:.1px;font-size:20px;float:left}
#main_content .title_area a{float:right;text-indent:-9999px;display:block;width:20px;height:20px;background:url(../en/img/main/plus.png) center center no-repeat}


/************main_content의 첫번째 줄****************/
.f_row{overflow: hidden;margin-bottom: 23px;}

/********national_treasures*******/
#main_content .national_treasures>div, #main_content .local_specialites>div{width: 95%;}
.national_treasures .national_content{overflow:hidden;}
.national_treasures .national_content .img_area{width:45%;max-width:250px;height:150px;box-sizing:border-box;border:1px solid #ccc;background:url(../en/img/main/sample.png) center center no-repeat;float:left}
.national_treasures .national_content .content_area{float:left;height:150px;overflow:hidden;width:56%;padding-left:2%;box-sizing:border-box}
.national_treasures .national_content .content_area b{font-size:15px;font-family:'Exo 2';display:block;margin:20px 0}
.national_treasures .national_content .content_area p{font-family:'Exo 2';font-weight:200;line-height:16px;color:#575757;height:83px;overflow:hidden}


/*******local_specialies*******/
.local_specialites>div{margin-left:5%}
.local_specialites ul{overflow:hidden}
.local_specialites ul li{float:left;width:33.3333%;text-align:center}
.local_specialites ul li a{display:block;width:100%;height:100%}
.local_specialites ul li img{display:block;margin:0 auto 14px}
.local_specialites ul li a span{font-size:15px;font-family:'Exo 2';font-weight:500;letter-spacing:.1px;color:#000}


/**************main_content의 두번째 줄**************/

/*************clean_seongju***************/
.clean_seongju a h3,.clean_seongju a p{font-family:'Exo 2';color:#fff;position:relative;z-index:999;}
.clean_seongju{clear:both}
.clean_seongju>div{width:95%;height:160px;box-sizing:border-box;padding-left:26px;padding-top:30px;background:url(../en/img/main/banner1_bg.png) center center no-repeat;background-size:cover;position:relative}
.clean_seongju .b1_img{position:absolute;right:0;bottom:0}
.clean_seongju a h3{font-weight:600;font-size:20px;letter-spacing:-.1px;margin-bottom:20px}
.clean_seongju a h3 img{vertical-align: middle;margin-left:21px; }
.clean_seongju a p{font-weight:300;width:60%; height:50px; overflow:hidden}



/**********banner*********/
.banner .legend_fable{width:330px;width:55%;height:160px;background:#fad53a;margin-left:5%;position:relative;float:left}
.banner .legend_fable a>img{position:absolute;left:50%;bottom:-8px;transform:translateX(-50%);max-width:100%;}
.banner .legend_fable a p{font-family:'Exo 2';font-weight:800;letter-spacing:-.1px;font-size:18px;text-align:center;margin-top:23px;text-transform:uppercase; position:relative;z-index:999;}
.banner .legend_fable a p img{vertical-align:middle;margin-left:13px}
.banner .organization{width:218px;width:35%;height:160px;float:right; position:relative;}
.banner .organization a{display:block; width:100%; height: 100%;  background:#edece7;}
.banner .organization > a > img {position:absolute; bottom:18px; left:15px;}
.banner .organization > a > p {position:absolute;top:20px;right:15px;text-align:right}
.banner .organization .cont01 {position:relative; background:#edece7;position:relative; height:75px;}
.banner .organization .cont01 img{position:absolute; bottom:18px; left:15px;}
.banner .organization .cont01 p{font-family:'Exo 2';font-weight:300;letter-spacing:.1px;position:absolute;top:20px;right:15px;text-align:right}
.banner .organization .cont02 {position:relative; height:75px; margin-top:10px; }
.banner .organization .cont02 a {background:#dfe9f1;}
.banner .organization .cont02 img{position:absolute;}
@media all and (max-width:1200px) {
	.banner .organization .cont02 img {top:50%;left:50%;transform:translate(-50%,-50%);max-width:100%;}
}
@media all and (max-width:1130px) {
	.banner .organization .cont01 p {font-size:12px;right:5px;}
}
@media all and (max-width:1020px) {
	.banner .organization .cont01 p {display:none;}
	.banner .organization .cont01 img{top:50%;left:50%;transform:translate(-50%,-50%);max-width:100%;}
}
@media all and (max-width:840px) {
	.banner .organization > a > p {font-size:13px;}
}
@media all and (max-width:768px) {
	.banner .organization > a > p {font-size:14px;}
	.banner .organization .cont01 p {display:block; right:15px;font-size:14px;}
	.banner .organization .cont01 img{top:18px; left:15px; transform:none;}
}
@media all and (max-width:614px) {
	.banner .organization .cont01 p {font-size:12px;}
}
@media all and (max-width:556px) {
	.banner .organization .cont01 p {display:none;}
	.banner .organization .cont01 img{top:50%;left:50%;transform:translate(-50%,-50%);max-width:100%;}
}
@media all and (max-width:480px) {
	.banner .organization > a > p {display:none;}
	.banner .organization > a > img{top:50%;left:50%;transform:translate(-50%,-50%);max-width:100%;}
	.banner .organization .cont01 {height:50px;}
	.banner .organization .cont02 {height:50px;}
}

/**************************footer***************************/
#footer ul li address,#footer ul li b,#footer ul li p,#footer ul li small{font-family:'Exo 2';font-weight:400;color:#fff}
#footer{background:url(../en/img/main/footer_bg.png) center center no-repeat;background-size:cover;padding:30px 0}
#footer ul{overflow:hidden}
#footer ul li{float:left;width:33.33333%}
#footer ul li img{display:block;margin-bottom:5px}
#footer ul li small{font-size:12px;display:block;opacity:.4}#footer ul li b{display:block;opacity:.4;text-transform:uppercase;margin-bottom:30px}



/*********PC*********/


@media all and (max-width:1200px) {
    .national_treasures .national_content .content_area{width: 54%;}
}
@media all and (max-width:1080px) {
    #header .gnb .s_menu{padding-top: 10px;height: 270px; }
    #header .gnb .s_menu li a{padding: 0 5px;}
    #quick ul li img{max-width: 80px;}
    #quick ul li span{left: 50%;}
}
@media all and (max-width:1050px) {
    #header .header_wrap{height: 70px;}
    #header .gnb .s_menu{padding-top: 10px;height: 250px;}
}
@media all and (max-width:840px) {
    #header .gnb .s_menu li{line-height: 18px;}
}

/***************태블릿******************/


@media all and (max-width:1023px) {
    #header .logo{margin-left: 2.5%;}
#header .top_menu{display: none;}
#header .header_wrap{display: none;}
#header{border-bottom: 1px solid #cccccc;}
#content{margin-top: 0;}
#main_content{clear:both;padding:22px 10px 40px;overflow:hidden}


#footer {padding: 20px 10px;}

}

@media all and (max-width:768px) {

.bx-wrapper, .bxslider .slide1, .bxslider .slide2, .bxslider .slide3, .bxslider .slide4, .bxslider .slide5{height: 360px;}
.bx-controls-direction{display: none;}
.bxslider img{max-width: 90%;}

#quick ul li img,#quick ul li span{position:static;transform:translate(0);vertical-align:middle}
#quick ul li img{max-width:100%;display:inline}#quick{height:auto;background:#fff}
#quick ul li{width:50%;text-align:center}
#quick ul li:nth-of-type(1),#quick ul li:nth-of-type(3){border-right:1px solid #ccc}
#quick ul li:nth-of-type(3),#quick ul li:nth-of-type(4){background:url(../en/img/main/quick_bg.png) center center no-repeat;background-size:cover}
#quick ul li span{display:inline-block;margin-left:10px;text-align:left}
#quick ul li a div{width:100%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}

#main_content .col-6{width: 100%;box-sizing: border-box;margin-bottom: 30px;}
#main_content .national_treasures > div, #main_content .local_specialites > div{width: 100%;}
.clean_seongju > div{width: 100%;}
.local_specialites > div{margin-left: 0;}
.banner .legend_fable{margin-left: 0;width: 60%;}
.f_row{margin-bottom: 0;}
#main_content{padding-bottom: 0;
}
}


/*************모바일*************/

@media all and (max-width:640px) {
    #quick ul li img{max-width: 64px;}
}

@media all and (max-width:480px) {
.bx-wrapper, .bxslider .slide1, .bxslider .slide2, .bxslider .slide3, .bxslider .slide4, .bxslider .slide5{height: 250px;}

#main_content {padding: 20px 10px;}

#quick ul li{height:90px}
#quick ul li span{font-size:15px;width:50%}
.clean_seongju{margin-bottom:20px!important}
.clean_seongju .b1_img{width:180px}
.local_specialites ul li img{max-width:95%}
.banner .legend_fable a>img{width:209px;max-width:100%}
.banner .legend_fable,.banner .organization{height:106px}

#footer ul{box-sizing: border-box;padding: 0 2.5%;}
#footer ul li{width: 50%;box-sizing:border-box;padding-right:10px;}
#footer ul li:nth-of-type(1){display: none;}
#footer ul li b{margin-bottom: 20px;}
#footer ul li .blank{display:inline;}

}

@media all and (max-width:420px){
    .clean_seongju > div{padding-left: 6px;}
    .clean_seongju a p{width: 50%;}
}

@media all and (max-width:330px){
	#quick ul li{height:140px;}
}

/*테블릿_모바일_네비게이션*/
@media all and (max-width:1023px) {
  #header {height: 80px; z-index: 100; border-bottom: 1px solid #c7c7c7;}
  #header .logo h1 {top:18px; left:20px;}
  #mask_mNav {width: 100%;height: 100%;position: absolute; top:0; left:0; background: rgba(0, 0, 0, 0.6); z-index: 110; position: fixed;}
  .stop_scrolling {height: 100%; overflow: hidden !important; position: fixed;}


.m_close{display: block; margin-bottom: 20px;cursor: pointer; float:left;}
#mobile_nav .top02{clear:both;}
#mobile_nav .sitemap_go a{font-family:LatoR;display:block;float:right;width:115px;height:32px;line-height:32px;text-align:center;text-transform:uppercase;background:#009640;color:#fff;margin-left:43px;letter-spacing:.1px}
#mobile_nav .sitemap_go a img {margin-right:11px;}
  #mobile_nav, #mask_mNav {display: block;}
  #mobile_nav {position: fixed; top:0; right:-300px; z-index: 5000; width: 300px; height: 200%; background: #fff; overflow-y: auto; box-sizing:border-box;background: #009640;}
  #mobile_nav > div {min-height: 200%}
  #mobile_nav .top_wrap {padding: 10px; height: 110px; background: #fff;}
  #mobile_nav .top_wrap ul {overflow: hidden;}
  #mobile_nav .top_wrap ul li {float: left;}
  #mobile_nav .top_wrap ul li a {display: block; border: 1px solid #cbcbcb; margin-right: 10px; height: 38px; line-height: 38px;}
  #mobile_nav .top_wrap ul li.last a {margin-right: 0;}
  #mobile_nav .top_wrap .top01 {margin-bottom: 10px;}
  #mobile_nav .top_wrap .top01 ul li a { width: 101px;}
  #mobile_nav .top_wrap .top01 .staff a {background: url(../en/img/main/top_ico02.jpg) no-repeat 18px center; padding-left: 35px;}
  #mobile_nav .top_wrap .top01 .face a {background: url(../en/img/main/top_ico03.jpg) no-repeat 18px center; padding-left: 35px;}
  #mobile_nav .top_wrap .top01 ul li img {margin: 6px 0 0 11px; cursor: pointer;}
  #mobile_nav .top_wrap .top02 a {width: 81px; text-align: center;}
  #mobile_nav .mnav_wrap {background: #009640; height: 100%;}
  #mobile_nav .mnav_wrap nav > ul > li > a {display: block;width: 113px; text-align: left; line-height: 23px; color:#fff; font-size: 14px; border-bottom: 1px solid #8cc8a6; min-height:50px; word-break: keep-all; padding: 10px 7px;}
  #mobile_nav .mnav_wrap nav > ul > li.on > a, #mobile_nav .mnav_wrap nav > ul > li > a:hover {background: #005e28;}
  #mobile_nav .mnav_wrap .m_depth02 {width: 170px; height: 200%; background: #fff; position: absolute; top:110px; right:0;}
  #mobile_nav .mnav_wrap .m_depth02 > li {overflow: hidden;}
  #mobile_nav .mnav_wrap .m_depth02 > li > a {display: block; min-height:50px; line-height: 23px; padding: 10px 5px; font-size: 14px; border-bottom: 1px solid #e1e1e1;}
  #mobile_nav .mnav_wrap .m_depth02 > li > a.on, #mobile_nav .mnav_wrap .m_depth02 > li > a:hover {background: #333333; color: #fff;}
  /*#mobile_nav .mnav_wrap .m_depth03 {display: none;}*/
  #mobile_nav .mnav_wrap .m_depth03 {background: #e9e9e9;}
  #mobile_nav .mnav_wrap .m_depth03 a {display: block; /*height: 40px;*/ line-height:25px; padding: 0 20px; border-bottom: 1px dashed #cbcbcb; margin: 0 10px;}


}
/*모바일*/
@media all and (max-width:490px) {

}
@media all and (max-width:320px) {

}


/***************mobile_side*************/
@media all and (max-width:1023px) {
#header > .wrap {height:auto;}
#header .mobile_side {display: block; float: right; margin: 30px 30px 0 0;}
.mobile_side ul li {float: left;}
.mobile_side .side_lnb_box {width: 100%; background: #fff; position: absolute; top:79px; left:0; z-index: 50; padding: 0 0 30px; border-top: 1px solid #c7c7c7;}
.mobile_side .sideLnbInner {width: 100%; height: 150px; background: #fff; position: absolute; top:33px; border-top: 1px solid #c7c7c7; z-index: 30;}
.mobile_side .side_lnb_box .searchFrm {width: 70%; max-width: 559px; margin: 30px auto 0;}
.mobile_side .side_lnb_box .searchFrm input {width: 89%; max-width: 504px; height: 54px; border: 2px solid #009640; font-size: 16px; padding: 0 20px;}
.mobile_side .side_lnb_box .searchFrm .search_btn {width: 11%; max-width: 56px; height: 54px; background: #009640 url(../en/img/main/find_01.png) no-repeat center center; border: 0; vertical-align: middle; margin-left: -4px; text-indent: -99999%;}
.mobile_side .side_lnb_box .words {width: 482px; margin: 20px auto 0;}
.mobile_side .side_lnb_box .words p {float: left; font-weight: 600; font-size: 15px; line-height: 10px; }
.mobile_side .side_lnb_box .words ul li {float: left; margin-left: 15px;}
.mobile_side .side_lnb_box .words ul li a {display: block; height: 13px; line-height: 11px; padding-right: 10px; border-right: 1px solid #c7c7c7;}
.mobile_side .side_lnb_box .words ul li:last-child a {border: 0;}
.mobile_side .side_lnb_box .close {display: block; width: 50px; height: 50px; background: #9f9f9f url(../en/img/main/close.png) no-repeat center center; position: absolute; top:0px; right:0; cursor: pointer; white-space: nowrap; overflow: hidden; text-indent: -999999%;}
.mobile_side .search > a {display: block; width: 24px; height: 24px; background: url(../en/img/main/m_find.png) no-repeat center center; text-indent: -9999%; margin-right: 25px;}
.mobile_side .open {width: 25px; height: 19px; background: url(../en/img/main/menu.png) no-repeat center center; text-indent: -9999%; cursor: pointer; margin-top:2px}

}
@media all and (max-width:490px) {
 #header .mobile_side {margin: 30px 10px 0 0;}
  .mobile_side .side_lnb_box .searchFrm {width: 70%;}
  .mobile_side .side_lnb_box .searchFrm input {width: 81%;}
  .mobile_side .side_lnb_box .searchFrm .search_btn {width: 19%;}
  .mobile_side .side_lnb_box .words {width: 344px;}
  .mobile_side .side_lnb_box .words p {font-size: 14px;}
  .mobile_side .side_lnb_box .words ul li {margin-left: 3px;}
  .mobile_side .side_lnb_box .words ul li a {font-size: 12px; padding-right: 5px;}
}
@media all and (max-width:320px) {
  .mobile_side .side_lnb_box .searchFrm input {width: 78%; padding: 0 10px;}
  .mobile_side .side_lnb_box .words {width: 283px;}
  .mobile_side .side_lnb_box .words p {display: none;}
}
