@import url(jquery.bxslider.css);
@import url(common2.css);
@import url(https://fonts.googleapis.com/earlyaccess/notosanskr.css);

/*img {width:100%}*/
/* common */
.clearfix:after {content:"";display:block;clear:both;}
.max-wrap {max-width:1020px;margin:0 auto}
.sub_max-wrap {max-width:960px}
.center {margin:0 auto}
.block {display:block}
.none {display:none}

.mleft5 {margin-left:5px}
.mright10 {margin-right:10px}
.mright20 {margin-right:20px}
.mtop5 {margin-top:5px}
.mtop20 {margin-top:20px}
.mtop30 {margin-top:30px}
.mtop50 {margin-top:50px}

.ptop2 {padding-top:2px}
.ptop3 {padding-top:3px}
.ptop5 {padding-top:5px}

.f_yellow {color:#fff200!important}

.u_line {width:50px;height:0;margin-top:5px}
.u_line_45 {width:45px;margin-top:25px}
.u_line_w {border-bottom:1px solid #fff}
.u_line_y {border-bottom:1px solid #fff200}
.u_line_r {border-bottom:1px solid #e5000c}

.list_bg {background-color:#fbfbfb}

.label-normal {display: inline-block;background:transparent;color:#333;border:1px solid #333;font-weight:300}
.label-lg {font-size:14px;padding:10px 20px}
/*.opacity {width:100%;height:100%;background:url(../images/common/opacity40.png) repeat}*/
.opacity {width:100%;height:100%;}

.divi {padding:0 10px}

/* 순성구간안내 */
.area-info {margin-top:20px;padding:80px 0;}
.area-info .area-map img {display:block;width:90%; margin:0 auto}
.area-info .content {margin-top:50px}
.area-info ul.area {margin-top:30px}
.area-info ul.area {margin-top:30px}
.area-info ul.area li {font-size:14px;margin-top:10px}
.area-info ul.area li span {letter-spacing:0px}
.area-info ul.area li img {margin-left:20px;margin-right:10px;vertical-align:middle;padding-bottom:2px}
.area-info ul.area li a {display:inline-block;width:178px;height:43px;font-size:16px;font-weight:600;text-align:center;line-height:43px;border:1px solid #fff;-webkit-border-radius:4px;-moz-border-radius:4px;-o-border-radius:4px;border-radius:4px}
.area-info ul.area li a.baegak {color:#34485e;border-color:#34485e}
.area-info ul.area li a.naksan {color:#2a80ba;border-color:#2a80ba}
.area-info ul.area li a.heungin {color:#27ae60;border-color:#27ae60}
.area-info ul.area li a.namsan {color:#c1392c;border-color:#c1392c}
.area-info ul.area li a.sunglye {color:#f39c12;border-color:#f39c12}
.area-info ul.area li a.inwang {color:#7f8c8d;border-color:#7f8c8d}

.map_list {position:absolute; right:0; bottom:0;}

/* 프로그램 */
.program .container > a > div {float:left;margin-top:50px}
.program .container > a {display:block}
.program .s-left {padding:0 50px 0 0}
.program .s-right {padding:0 0 0 50px}
.program .col-xs-2 img {width:100%}
/*.program .col-xs-10 {padding:0 20px}*/

/* 매거진 */
.zine {margin-top:80px;padding:80px 0;}
.zine img.zine_img {width:200px;height:300px;border:1px solid #ddd;margin:0 auto}
.zine h3 small {color:#999;font-size:18px;letter-spacing:0}
.zine .label {margin-top:25px;padding:.5em .7em;font-size:12px!important;font-weight:600;color:#666;border-color:#999}
.zine table.table {margin-top:25px;border:none}
.zine table.table th {font-size:16px;font-weight:600;padding:15px 5px 15px 0;border:none}
.zine table.table td {font-size:16px;border:none;padding:5px 5px;}
.zine .floatright a {display: block;width:25px;height:25px;margin-top:5px}

/* 가이드 아이콘*/
.guide {margin-top:40px}
.guide .container > div {margin-top:20px;}
.guide .container > div a img {}

/* 게시판 미리보기 */
.board {margin-top:40px;margin-bottom:10px}
.board .nav li a {font-size:16px;font-weight:500}
.board .nav h2 {padding-top:10px;padding-left:10px;font-size:24px!important;}
.board .nav select {width:50%;height:40px;font-size:16px}
.board table.table {margin-top:30px;border:none}
.board table.table td {font-size:14px;border:none}
.board table.table td.tar {min-width:95px;padding-left:5px;padding-right:5px}


/* 푸터  */

p.address {margin-top:20px;line-height:19px;font-size:12px;color:#949494;letter-spacing:-0.5px!important }
.footer select {margin-top:40px;width: 170px; height:30px}
.footer input {margin-top:40px;}

/*위로가기 버튼*/
#gotop {position:fixed;right:30px;bottom:30px;display: none;cursor:pointer;}

 /*  반응형 미디어쿼리  //////////////////////////////////////*/
 
@media screen and (max-width:1200px){
   .zine h3 small {font-size:16px}
 }

 @media screen and (max-width:991px){
 .navbar {margin-bottom:25px}
 a.navbar-brand {padding-right:35px}
 .main_visual ul.main_slide {height:450px}
 .main_title {padding-top:100px}
 .main_title .btn_2 {bottom:230px}
 .main_visual ul.main_slide {height:470px}
 .main-video img.vod_top {top:-50px}
 .main-video .bx-wrapper .bx-prev {left:-50px}
 .main-video .bx-wrapper .bx-next {right:-50px}
 .program .s-left {padding:0 15px}
 .program .s-right {padding:0 15px}
 .program .col-xs-2 img {width:80%}
 .zine img.zine_img {margin-bottom:50px}
 .zine table.table th {padding:8px 5px 8px 0}
 .zine table.table td {padding:8px 5px}
 .guide .container > div a img {width:95%;}
 .footer-2 .ft_sns {margin-top:0}
 .footer-2 .ft_sns img {margin-top:3px}
 .footer-2 select {margin-top:0}
 p.address {margin-top:15px}
 }
 
 
 @media screen and (max-width:820px){
   a.navbar-brand img {margin-top:0px;vertical-align:middle}
   a.navbar-brand {padding-right:20px}
   li.dropdown a {font-size:17px}
   .main-video .bx-wrapper .bx-prev {left:10px;background:url(../images/common/prev_w.png) no-repeat}
   .main-video .bx-wrapper .bx-next {right:10px;background:url(../images/common/next_w.png) no-repeat}
 }


 @media screen and (max-width:767px){
   #myNavbar {margin-top:20px;border-top:1px solid #00577d}
   #main h1 {font-size:32px!important}
   #main h2 {font-size:24px!important}
   
   .main_title {padding-top:70px}
   .main_title .btn_2 {bottom:200px}
   .main_visual ul.main_slide {height:390px}
   .main-video {margin-top:0}
   
   li.dropdown a {font-size:16px}
   
   nav.navbar {margin:20px 0}
   .top-head {display: none;}
   .search_m.top-head {padding-top:10px}
   .search_m form , .lang_sel select {display:block}
   .navbar-nav .open .dropdown-menu .dropdown-header,
   .navbar-nav .open .dropdown-menu>li>a {padding:7px 15px 7px 40px}
   a.navbar-brand {position:absolute;left:50%;top:0;margin-left:-57px;width:105px;text-align: center;padding:0} /* 180918 웹접근성 보완 */
   a.navbar-brand img {margin-top:-4px}
   a.seoul {display:block;float:left;margin:15px}
   a.seoul img {width:33px}
   
   .area-info .area-map img {width:75%}
   .area-info , .zine , .organ {margin-top:10px;padding:30px 0 0 0;}
   .area-info {margin-top:10px;margin-bottom:20px;}
   .nav>li>a {padding:10px 15px}
   .main-video img.vod_top {display: none}
   ul.area-1 {display:none}
   ul.area-2 {display:block}
   
   .area-info ul.area-2 li img {margin-left:0px;margin-right:5px;}
   .program .container > a > div {margin-top:15px}
   .zine table , .zine img.block {display:none}
   
   .guide {margin-top:0}
   .guide .container > div a img {width:75%}
   .board .tab-content table td.tar {display:none}
   .footer-1 {display: none}
   .footer {margin-top:0px;padding:30px 0}
   .footer-2 {display: block;margin-top:30px}
   .footer-2 .sns {float:right}
   .footer-2 .addr a {float:left}
   .footer-2 .address {float:right}
   .footer-2 .addr img {width:115%;margin-left:20px;margin-top:50px}

 }

 @media screen and (max-width:600px){
 #main h1 {font-size:28px!important}
 #main h2 {font-size:22px!important}
 #main h4 , #main h3 {font-size:20px!important}
 .vod-con {padding:0}
 .area-info .content {margin-top:30px}
 .area-info .area-map img {width:100%}
 .program .col-xs-2 img {width:120%}
 .program .col-xs-10 .floatright img {margin-top:-1px}
 #main .board .nav h2 {font-size:24px!important;}
 .zine {margin-top:20px;padding:30px 0 10px;}
 .zine h3 small {font-size:13px}
 
 
 .guide {margin-top:0}
 .guide .container > div a img {width:85%;}

 .board {margin-top:30px}
 .board .nav-1 {display: none}
 .board .nav-2 {display: block}

 .footer-2 .sns {float:left;width:100%}
 .footer-2 .addr a {float:left}
 .footer-2 .address {float:left;margin-left:10px}
 .footer-2 .addr img {width:100%;margin-top:10px;margin-left:0px;margin-right:10px}

 }

 @media screen and (max-width:479px){
   .top-head form a {font-size:12px;padding:0 2px}
   .main_visual ul.main_slide {height:250px}
   .program .col-xs-2 img {width:110%}
   .program .col-xs-10 .floatright img {margin-top:0px}
   /*.program .col-xs-10 .floatright img {margin-top:-6px}*/
   .zine img.zine_img {width:270px}
   .zine h3 small {display:block;line-height:19px}
   .guide .container > div a img {width:100%;}
   .footer-2 .address {margin-left:0}
 }

 @media screen and (max-width:430px){
   #main h1 {font-size:26px!important}
   #main h2 {font-size:18px!important}
   #main h4 , #main h3 {font-size:16px!important}

   .main_title .btn {bottom:80px;margin-left:-90px;width:180px;height:40px;font-size:16px}
   .main_title .btn_2 {bottom:200px}
   .program .col-xs-2 img {width:150%}
   .program .col-xs-10 .floatright img {margin-top:-2px}
   #main .board .nav h2 {font-size:24px!important;}
   
   
   .footer .rel_site.rgt {float:left!important;margin-top:15px}
   .footer select {width:120px}
 }

@media screen and (max-width:370px){
  .footer select {width:70%;margin-top:10px}
}

 @media screen and (max-width:350px){
   .program .col-xs-2 img {width:170%}
   /* .footer select {width:100%;margin-top:10px} */
 }


 @media screen and (min-width:768px){
   #main h1 {font-size:40px;}
   #main h2 {font-size:28px;}
   #main h4 , #main h3 {font-size:20px;}
   .area-info .area-map img {width:65%}
   .area-info .content {margin-top:50px}
   .main-video {margin-top:10px}
   .area-info , .zine , .organ {margin-top:20px;padding:30px 0;}
   .area-info {margin-top:10px}
   .program .container > a > div {margin-top:30px}
   .zine {padding-bottom:30px}
   /* .zine table {margin-bottom:0} */
   .guide {margin-top:0}
   .nav>li>a {padding:10px 15px}
 }


 @media screen and (min-width:992px){
   .container {width:880px}
   #main h1 {font-size:48px;}
   #main h2 {font-size:30px;}
   #main h4 , #main h3 {font-size:24px;}
   .nav>li>a {padding:10px 25px 20px}
 }


 @media screen and (min-width:1200px){
   /*.nav>li>a {padding:10px 30px}*/
   .container {width:1020px;}
   .sub_container {width:960px}
   .area-info .area-map img {width:95%}
   .area-info .content {margin-top:0px}
   .main-video {margin-top:10px}
   .area-info ,.zine , .organ {margin-top:40px;padding:50px 0 10px;}
   .area-info {margin-top:5px}
   .program .container > a > div {margin-top:60px}
 }


 /*/////////// 서브페이지 /////////////////////////////////*/

.page_tit .divi {display: none}

.guide_menu .item {float: left; width: 90px; height: 30px; line-height: 30px; text-align: center; border-top: 1px solid #ccc; border-bottom: 0px solid #ccc; border-right: 1px solid #ccc;}
.guide_menu .item.first {float: left; border: 1px solid #ccc; line-height: 30px; text-align: center;}
.guide_menu .item a,
.guide_menu .item span {width: 90px; height: 30px; display: block;line-height:30px}
.guide_menu .item a.on,
.guide_menu .item span { background-color: #34495e; color: white; }
.guide_menu .item a:HOVER { background-color: #34495e; color: white; }

.public_info .nav select {width:165px;height:35px;font-size:14px}

/*//////// 서브 반응형 미디어쿼리  //////////*/

@media screen and (max-width:1200px){
  .srch_bx input {width:205px;}
}

 @media screen and (max-width:991px){
   .map_area {height:520px}
   .level ul li {padding-right:75px}
   .preparation ul.ready li.copy_6 , .preparation ul.ready li.copy_8 {padding-bottom:40px}

   .srch_bx .sel , .srch_bx .inp {width:100%;margin-top:10px;float:left}

   #grid-content .box {height:350px}
   #grid-content .box .img img {max-height:260px}
   #grid-content.old_gal .box {height:315px}
   #grid-content.old_gal .box .img img {max-height:225px}

   .gally .srch_bx {margin-top:0px}
   .bg_gally .srch_bx {margin-top:0px}
   
   .newsgroup_list li .img img {display:block;margin:0 auto 20px}
   .newsgroup_list .col-md-8 {padding-right:0;padding-left:0}
 }

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

   .public_info .nav-1 li a {padding:6.5px 15px}
   .ccl ul li.ccl_con_last ul li p {padding-top:8px}
   .story100 .img {float:none;margin:15px auto 30px;text-align: center}
   .story100 .img img {width:100%}

   .sitemap ul.ect {padding:0}

   .ds_cnt .nav-1 {display: none}
   .ds_cnt .nav-2 {display: block}
   .ds_cnt .nav-2 select {width:50%;height:30px}
   .ds_cnt > .img {margin-bottom:30px}
   .characteristic {padding-bottom:20px}

 }
 
 @media screen and (max-width:768px){
   #contents {padding:0 20px 0px 20px;}
   .type_p .page_tit span.divi {color:#d35400}

   .page_tit .copy_2 {position:absolute;left:12px;bottom:11px;padding-right:0;/* display:inline-block; */font-size:24px;font-weight:400;letter-spacing:-1px;color:#2980B8;} /* 제목 중앙 정렬_180524 */
   .type_g2 .page_tit .copy_2 {color:#8e44ad}
   .type_p .page_tit .copy_2 {color:#d35400}
   .type_na .page_tit .copy_2 {color:#16a085}
   .type_ref .page_tit .copy_2 {color:#95a5a6}
   .type_ref .page_tit span.divi {color:#95a5a6}
   .type_g2 .page_tit span.divi {color:#8e44ad}

   .sub_tit {margin:0px;}
   .sub_tit .copy_5 {font-size:24px;padding-top:22px}
   .type_s {background:none}
   .type_p {background:none}
   .type_na {background:none}
   
   .type_ref {background:none}
   .type_g2 {background:none}
   .type_sitemap {background:none}
   
   .type_b {background:none}
   .type_n {background:none}
   .type_h {background:none}
   .type_m {background:none}
   .type_u {background:none}
   .type_i {background:none}
   
   
   
   .map_area {height:450px}
   .map_info_tap {margin-top:20px;padding:0 50px}
   .map_info_tap dl {padding:0 35px}
   .map_info_tap dl dt .tit {font-size:24px;line-height: 24px}
   .level {display: none}
   .explain_txt ul li .txt {margin-top:5px}
   .guide_map_area {height:320px}
   .guide .txt_1{margin-top:15px}
   .main_point ul li p.desc {margin-top:10px}
   .vicinage {padding:0;margin-bottom:0;border-bottom:0;}
   .vicinage li:nth-child(2) {margin:0}
   .vicinage dl {margin-top:20px}
   .vicinage .btn_view {position:static;float:right;margin-right: 15px;margin-top:15px}
   .vicinage .btn_view a {width:120px;height:35px;font-size:14px;line-height:37px;}
   
   .public_info .nav-1 {display: none}
   .public_info .nav-2 {display: block}

   .pgr_list li .img img {width:50%;display:block;margin:10px auto 20px}
   .pgr_list .btn_view {margin-top:15px}
   .pgr_list .btn_view a {width:120px;height:35px;font-size:14px;line-height:37px;}
   
   .bbs_view table td.third > div {padding:0;border-bottom:1px solid #e3e3e3}
   .bbs_view table td.third > div.last {border-bottom:none}
   .bbs_write table td {padding-left:0;}

   .bbs table .nr , .bbs table .aut, .bbs table .dat, .bbs table .clk {display: none}
   .bbs table .tit {width:100%}

   #grid-content .box {height:500px}
   #grid-content .box .img img {max-height:410px}
   #grid-content.old_gal .box {height:465px}
   #grid-content.old_gal .box .img img {max-height:375px}

   .bbs_write .file .td_2 a.file_na {float:left;padding:7px 10px 3px 0;}
   .bbs_write .file .btn_type03 {float:left;margin:2px 0 7px;padding:6px 25px;}
   .bbs_write .file .btn_type03_1 {margin:5px 5px 5px 0}
   .bbs_write table tbody .file_i {margin-top:2px}

   .cb_wrt {margin:30px 0 0 0px;}

   .comment ul {margin:0;}

   .f_type1 .q a {font-size:20px}

   .ds_cnt .crt .line img {width:45%}
   .ds_cnt .nav-2 select {width:100%;height:30px}
   
   .tab_type1_1 ul li {width:115px;}
   
   .map_area .map_tip {display:none} /* 20170104  추가 */
 }

 @media screen and (max-width:600px){
   .guide_menu {width:100%;}
   .guide_menu .item {width:50%;height:45px;}
   .guide_menu .item a {width:100%;height:45px;line-height:45px;font-size:15px}
   .sub_tit .sub_top {display: none;}
   
   
   .guide_list select{margin-bottom:10px}
   .guide_map_area {height:263px}
   .level_gallery {display:none}
   .level_gallery_slider {display:block}
   
   #grid-content .box {height:450px}
   #grid-content .box .img img {max-height:360px}
   #grid-content.old_gal .box {height:415px}
   #grid-content.old_gal .box .img img {max-height:325px}

   .ds_cnt img.img_2 {width:50%;}
   
   .tab_type1_1 ul li {width:90px;}

 }

 @media screen and (max-width:479px){
  #contents {padding:0px 15px 0px 15px;}
  .guide_map_area {height:230px}
  .map_area {height:380px}
  .map_info_tap {padding:0 10px}
  .map_info_tap dl {padding:0 15px}
  .map_info_tap dl dt .tit {font-size:18px;line-height: 18px}
  
  .pagetit_wrap {margin-bottom:25px}

  .box_gray {padding:15px 20px;border-width:3px}

  .pgr {padding-top:5px}
  .pgr .tab_list ul {border:0;font-size:12px}
  .pgr .tab_list li {width:24.5%;margin:0;border-right:1px solid #fff}
  .pgr .tab_list li a { border:1px solid #e67e22;background:#e67e22;font-size:12px;letter-spacing:-1.7px}
  .tab_list.m1 .m1 a {border:1px solid #e67e22;background:#fff;color:#e67e22}

  .pgr_list {margin-top:15px}
  .pgr_list li .img img {width:70%;}
  .pgr_list li dl {padding:0 5px}
  .pgr_list li dl dd {font-size:13px;line-height:16px}
  
  .preparation ul.ready li {padding-left:120px}

  .paginate a.m_no {display:none}

  #grid-content .box {height:350px}
  #grid-content .box .img img {max-height:260px}
  #grid-content.old_gal .box {height:315px}
  #grid-content.old_gal .box .img img {max-height:225px}

  .ds_cnt img.img_2, .ds_cnt img.img_3 {width:100%;}
  .ds_cnt .img {margin-bottom:30px}
  .ds_cnt dl.copy_ds {padding-bottom:20px}
  .ds_cnt .f_type1 .a {margin-bottom:20px}

  .bbs_view table .th {padding-left:0}
  .bbs_write , .bbs_view {margin-bottom:0px}
  
  .ccl ul li.ccl_con ul li img {width:80%;padding-right:0}

  .f_type1 .q a {font-size:18px}

  .sitemap dl {margin-bottom:25px}
  .col-xxs-12 {width:100%}

  .ds_cnt .crt .line img {width:60%}

  .cnt_2 {font-size:11px;margin-top:10px}

  .tab_type1_1 ul li {width:60px;font-size:11px}
 }

 @media screen and (max-width:430px){
   .page_tit {width:110px}
   .type_p .page_tit , .type_na .page_tit {width:120px}
   .type_ref .page_tit {width:95px}
   .page_tit .copy_2 {font-size:20px}
   .sub_tit .copy_5 {font-size:20px;padding-top:28px}
 }
 
 @media screen and (max-width:400px){
   .preparation ul.ready li {padding:100px 0 24px 20px}
   .srch_bx input {width:150px;}

   #grid-wrapper .modal .item .floatleft img {width:100px}
   #grid-wrapper .modal .item .floatright img {width:95px}
   
   .ccl ul li.ccl_con ul li img {width:70%;padding-right:0}
 }
 
 @media screen and (max-width:350px){
   .map_info_tap {padding:0}
 }


 @media screen and (min-width:768px){
   .container.sub_container {width:700px}
 }


 @media screen and (min-width:992px){
   .container.sub_container {width:880px}

 }


 @media screen and (min-width:1200px){
   .container.sub_container {width:960px}

 }