@charset "utf-8";

/*
================================================================================
메인콘텐츠
================================================================================
*/
.mvisual{position:relative;}
.mcon_top{position:absolute;left:0;bottom:0;}
.mcon_top dl{float:left;padding:20px;width:240px;height:105px;background: rgba(8,166,213,0.8) url('/new_img/child/main/con_ic01.png') no-repeat 30px 60px}
.mcon_top dl dt{margin-bottom:10px;font-size:18px;color:#fff;font-weight:bold}
.mcon_top dl dd{padding-left:75px}
.mcon_top dl dd li{padding-left:8px;color:#fff;font-weight:bold;background:url('/new_img/child/main/dot.png') no-repeat 0 10px}
.mcon_top dl dd li a{color:#fff;font-weight:bold}
.mcon_top .mbtn_oragn{float:left;width:150px;text-align:center;background:rgba(7,112,161,0.8) url('/new_img/child/main/con_ic02.png') no-repeat center 30px}
.mcon_top .mbtn_oragn a{display:block;padding-top:95px;height:50px;font-size:17px;color:#fff;font-weight:bold}

.mcon_bottom{padding:30px 35px;background:#fff;border:1px solid #d4d4d4}
.mcon_bottom:after{display:block;clear:both;content:''}
.mquick_link{float:left;width:450px}
.mquick_link ul{padding-bottom:10px;height:100%;overflow:hidden;border-bottom:1px solid #dcdcdc}
.mquick_link ul li{float:left;width:25%;text-align:center;line-height:16px;background:url('/new_img/child/main/ic_quick.png') no-repeat center 0}
.mquick_link ul li a{display:block;padding-top:100px;color:#333;text-decoration:none}
.mquick_link ul li.ic03 a{padding-top:95px}
.mquick_link ul li.ic02{background-position:center -150px}
.mquick_link ul li.ic03{background-position:center -300px}
.mquick_link ul li.ic04{background-position:center -450px}

.mnotice{position:relative;float:right;width:425px}
.mnotice dt{margin-bottom:15px}
.mnotice dd li{position:relative;margin-bottom:5px;padding-left:10px;font-size:13px;background:url('/new_img/common/dot.png') no-repeat 0 10px}
.mnotice dd li a{color:#333}
.mnotice dd li .data{position:absolute;top:0;right:0;color:#666}
.mnotice dd.btn_more{position:absolute;top:0;right:0}

/*
================================================================================
서브콘텐츠
================================================================================
*/

/* 금정의 상징물 */
.s1_1_con{position:relative;margin-bottom:20px;padding:10px 0 0 245px;min-height:150px}
.s1_1_con h2{margin-top:0}
.s1_1_con .lt_img{position:absolute;top:0;left:0}

/* 금정의 연혁 */
ol.histroy_con{position:relative}
ol.histroy_con > li{position:relative;padding:35px 0 0 170px;min-height:138px}
ol.histroy_con > li .tit{display:block;position:absolute;top:0;left:0;padding-top:35px;width:138px;height:110px;font-weight:bold;text-align:center;line-height:18px; }
ol.histroy_con > li .tit  span{display:inline-block;margin-bottom:5px;padding-bottom:10px;font-size:26px;color:#bebebe;border-bottom:1px solid #c6c6c6}
ol.histroy_con > li ul li{margin-bottom:5px;padding-bottom:5px;border-bottom:1px dotted #c4c4c4}
ol.histroy_con > li.bg01 .tit{background:url('/new_img/child/sub/s1_2_bg01.gif') no-repeat }
ol.histroy_con > li.bg02 .tit{background:url('/new_img/child/sub/s1_2_bg02.gif') no-repeat }
ol.histroy_con > li.bg03 .tit{padding-top:40px;background:url('/new_img/child/sub/s1_2_bg03.gif') no-repeat }
ol.histroy_con > li.bg04 .tit{padding-top:40px;background:url('/new_img/child/sub/s1_2_bg04.gif') no-repeat }
ol.histroy_con > li.bg05{padding-top:15px}
ol.histroy_con > li.bg05 .tit{padding-top:40px;background:url('/new_img/child/sub/s1_2_bg05.gif') no-repeat }

/* 위치와 면적 */
.s1_3_ic{background:url('/new_img/child/sub/s1_3_ic.gif') no-repeat 50px center}

.day_con{height:100%;overflow:hidden}
.day_con li{float:left;margin:0 10px 30px 10px;padding-top:155px;width:160px;text-align:center;background:url('/new_img/child/sub/s1_5_ic.gif') no-repeat 10px 0}
.day_con li.ic01{background-position:10px 0 }
.day_con li.ic02{background-position:-160px 0 }
.day_con li.ic03{background-position:-330px 0 }
.day_con li.ic04{background-position:-500px 0 }
.day_con li.ic05{background-position:10px  -200px }
.day_con li.ic06{background-position:-160px -200px }
.day_con li.ic07{background-position:-330px -200px }
.day_con li.ic08{background-position:-500px -200px }
.day_con li.ic09{background-position:10px -400px }
.day_con li.ic10{background-position:-160px -400px }
.day_con li.ic11{background-position:-330px -400px }
.day_con li.ic12{background-position:-500px -400px }
.day_con li.ic13{background-position:10px -600px }
.day_con li.ic14{background-position:-160px -600px }
.day_con li.ic15{background-position:-330px -600px }
.day_con li.ic16{background-position:-500px -600px }
.day_con li.ic17{background-position:10px -800px }
.day_con li.ic18{background-position:-160px -800px }
.day_con li.ic19{background-position:-330px -800px }
.day_con li.ic20{background-position:-500px -800px}

.map_box{border:1px solid #c0c0c0}

/* 행정조직도 20210630이전
.organization_con{position:relative;padding: 304px 0 0 48px;width: 730px; height:1080px;background: url(/new_img/geumjeong/sub/s4_3_4_bg1_2020.gif) no-repeat; box-sizing:border-box;}
.organization_con a{text-decoration:none}
.organization_con li{word-break:break-all}
.organization_con .organi_list1{position:relative;width: 632px;height:509px;text-align:center;}
.organization_con .organi_list1 li .or_t0{position:absolute;top:36px;left: 234px;display:block;padding-top:13px;width:107px;height:33px;font-size:18px;color:#fff;font-weight:bold;}
.organization_con .organi_list1 li .or_t1{position:absolute;top:92px;left: 234px;display:block;padding-top:13px;width:107px;height:33px;font-size:18px;color:#fff;font-weight:bold;}
.organization_con .organi_list1 li .or_t2{position:absolute;top:150px;left: 234px;display:block;padding-top:13px;width:107px;height:33px;font-size:18px;color:#0d55c7;font-weight:bold;}
.organization_con .organ1{position:absolute;top:230px;left:0;margin:0;}
.organization_con .organ1 li{position:relative;float:left;margin-left: 16px;width:93px;line-height:16px;}
.organization_con .organ1 li:first-child{margin-left:0;margin-top:15px;}
.organization_con .organ1 li > a{display:block;padding-top:10px;height:27px;color:#fff;font-weight:bold;}
.organization_con .organ1 li > span{display:block;padding-top:10px;height:27px;color:#fff;font-weight:bold;}
.organization_con .organ1 li.or_a{margin-top:40px;width:36px;}
.organization_con .organ1 li.or_a a{position:relative;display:block;padding:23px 11px 0 10px;width:14px;height:177px;color:#555;font-weight:normal;}
.organization_con .organ1 li li{clear:left;margin:0;padding:0;width:93px;height:auto;color:#555}
.organization_con .organ1 li li > a{padding:5px 0;width:93px;height:auto;color:#555;font-weight:normal}
.organization_con .organi_list1 li .or_t3{position:absolute;top:38px;right:0;display:block;padding: 45px 6px 0 6px;width:36px;height:135px;font-size:18px;color:#fff;font-weight:bold; box-sizing:border-box;}
.organization_con .organi_list1 li .or_t4{position:absolute;top:270px;right:0;display:block;padding: 20px 8px 0 8px;width:22px;height:180px;color:#fff;font-weight:bold;line-height:20px;}
.organization_con li a:hover .over,.organization_con li a:focus .over{display:block}
.organization_con li a .over{display:none;position:absolute;top:0px;left:0;width:100%;height:100%;background:url("/new_img/geumjeong/sub/over_bg.png") repeat center center;border-radius:0}
.organization_con .organi_list1 li a.health .over{height:37px}

.organization_con .organ1 li .btn_home{position:absolute;left:1px;bottom:8px}
.organization_con .organ1 li .btn_home a{padding:5px;width:auto;height:auto}
.organization_con .organi_list2 li .btn_home{position:absolute;left:-1px;top:89px;width:auto;}
.organization_con .organi_list2 li .btn_home a{padding:5px;width:auto;height:auto} */


/* 행정조직도 */
.organization_con{position:relative;padding: 304px 0 0 18px;width: 730px;height:1080px;background: url(https://www.geumjeong.go.kr//upload_data/board_data/BBS_0000370/171967346936553.png) no-repeat;box-sizing:border-box;}
.organization_con a{text-decoration:none}
.organization_con li{word-break:break-all}
.organization_con .organi_list1{position:relative;width: 696px;height:509px;text-align:center;}
.organization_con .organi_list1 li .or_t0{position:absolute;top:36px;left: 298px;display:block;padding-top:13px;width:107px;height:33px;font-size:18px;color:#fff;font-weight:bold;}
.organization_con .organi_list1 li .or_t1{position:absolute;top:92px;left: 297px;display:block;padding-top:13px;width:107px;height:33px;font-size:18px;color:#fff;font-weight:bold;}
.organization_con .organi_list1 li .or_t2{position:absolute;top:150px;left: 297px;display:block;padding-top:13px;width:107px;height:33px;font-size:18px;color:#0d55c7;font-weight:bold;}
.organization_con .organ1{position:absolute;top:230px;left: 0;margin:0;}
.organization_con .organ1 li{position:relative;float:left;margin-left: 10px;width: 93px;line-height:16px;}
.organization_con .organ1 li:first-child{margin-left:0;margin-top:15px;}
.organization_con .organ1 li > a{display:block;padding-top:10px;height:27px;color:#fff;font-weight:bold;}
.organization_con .organ1 li > span{display:block;padding-top:10px;height:27px;color:#fff;font-weight:bold;}
.organization_con .organ1 li.or_a{margin-top:40px;width:36px;}
.organization_con .organ1 li.or_a a{position:relative;display:block;padding:23px 11px 0 10px;width:14px;height:177px;color:#555;font-weight:normal;}

.organization_con .organ1 li li{clear:left;margin:0;padding:0;width:93px;height:auto;color:#555}
.organization_con .organ1 li li > a{padding:5px 0;width:93px;height:auto;color:#555;font-weight:normal}
.organization_con .organi_list1 li .or_t3{position:absolute;top:38px;right: 2px;display:block;padding: 45px 6px 0 6px;width:36px;height:135px;font-size:18px;color:#fff;font-weight:bold;box-sizing:border-box;}
.organization_con .organi_list1 li .or_t4{position:absolute;top: 271px;right:0;display:block;padding: 20px 8px 0 8px;width:22px;height:180px;color:#fff;font-weight:bold;line-height:20px;}
.organization_con li a:hover .over,.organization_con li a:focus .over{display:block}
.organization_con li a .over{display:none;position:absolute;top:0px;left:0;width:100%;height:100%;background:url("https://www.geumjeong.go.kr/new_img/geumjeong/sub/over_bg.png") repeat center center;border-radius:0}
.organization_con .organi_list1 li a.health .over{height:37px}

.organization_con .organ1 li .btn_home{position:absolute;left:2px;bottom:8px}
.organization_con .organ1 li .btn_home a{padding:5px;width:auto;height:auto}
.organization_con .organi_list15 li .btn_home{position: relative;left: 2px;bottom: 29px;}
.organization_con .organi_list15 li .btn_home a{padding:2px;width:auto;height:auto}
.organization_con .organi_list2 li .btn_home{position:absolute;left:-1px;top:89px;width:auto;}
.organization_con .organi_list2 li .btn_home a{padding:5px;width:auto;height:auto}

/*금정구 기구표 202107 수정하기*/
.group_chart {position:relative;margin:50px 0;background:url('/new_img/geumjeong/sub/organ_bg1(202106).jpg') no-repeat; }
/* .group_chart {position:relative;margin:50px 0;background: url(/new_img/geumjeong/sub/organ_bg1.jpg) no-repeat;} */


.group_chart .organ {margin-bottom: 30px;}
.group_chart .organ p {
  width:135px; height:135px; line-height: 135px; border-radius:50%; color:#fff; background:#0d55c7; 
   font-size: 18px; font-weight: bold; text-align: center; margin: 0 auto;}
.group_chart .organ_vice {margin-bottom: 145px;}
.group_chart .organ_vice p {
  width: 150px; height: 40px; line-height: 40px; color:#0d55c7; text-align: center; margin: 0 auto; border: 1px solid #ccc;
   font-size: 18px; font-weight: bold; border-radius:5px; background:#fff;}
.group_chart .organ1 p {
  width: 150px; height: 35px; line-height: 35px; text-align: center; margin: 0 auto; border: 1px solid #118c8b;
  background:#1D9594; margin-bottom: 30px; font-size: 16px; border-radius:5px; font-weight: bold; color:#fff;}
.group_chart .organ2 {margin-bottom:30px;}
.group_chart .organ2.grid7{margin-bottom: 10px;}
.group_chart .organ2.grid6{margin-bottom:26px}
.group_chart .organ2.grid5{margin-bottom: 60px;}
.group_chart .organ2 > ul > li { float:left; padding:0 5px;}
.group_chart .organ2.left60px {margin-left: 58px;} /*추가 */
.group_chart .organ2.left110px {margin-left: 110px;} /*추가 */
.group_chart .organ2.left75px {margin-left: 75px;}
.group_chart .organ2.left45px {margin-left: 45px;}

.group_chart .organ2.grid5 > ul > li { width:136px;}
.group_chart .organ2.grid6 > ul > li { width:111px;}
.group_chart .organ2.grid66 > ul > li { width:119px;}
.group_chart .organ2.grid7 > ul > li { width:93px;}

.group_chart .organ2 > ul:after {content: ''; display:block; clear: both;}
.group_chart .organ2 > ul > li > p {
  height:35px; line-height:35px; text-align:center; border:1px solid #a7c1e9; 
  border-radius:5px; background:#dce7f8; margin-bottom: 10px; font-weight: bold;}
.group_chart .organ2 > ul > li > ul {padding:10px; border:1px solid #ccc;background-color:#fff;}
.group_chart .organ2 > ul > li > ul > li {
  font-size:12px; line-height:20px; padding-left: 9px;
  background: url(/new_img/common/li_p_dot3.png) no-repeat 0 10px;}
.group_chart .organ2 > ul > li > p.point {border: 1px solid #118c8b; background:#1D9594; color:#fff;}
.group_chart .organ2 > ul > li.other {margin-top: 47px; }
.group_chart .organ2 > ul > li.other > p { border:1px solid #a9a65f; background:#eeedca;}

.group_chart .organ3 > ul > li { float:left; width:111px; padding:0 5px; margin-bottom:30px;}
.group_chart .organ3 > ul:after {content: ''; display:block; clear: both;}
.group_chart .organ3 > ul > li > p {
  height:35px; line-height:35px; text-align:center; border:1px solid #9ab377; 
  border-radius:5px; background:#dfeeca; margin-bottom: 10px; font-weight: bold;}
.group_chart .organ3 > ul > li > ul {padding:10px; box-sizing:border-box; border:1px solid #ccc;background-color:#fff;}
.group_chart .organ3 > ul > li > ul > li {
  font-size:12px; line-height:20px; padding-left: 9px;
  background: url(../../new_img/common/li_p_dot3.png) no-repeat 0 10px;}

.group_chart .organ5 {position:absolute; left:0; top:167px;}
.group_chart .organ5 > ul > li {float:left;margin-right:10px;width:115px;}
.group_chart .organ5 > ul > li > p {
         height:35px; line-height:35px; text-align:center;
   border-radius:5px;margin-bottom: 10px; font-weight: bold;
   border:1px solid #a9a65f; background:#eeedca;}
.group_chart .organ5 > ul > li > ul {padding:10px; box-sizing:border-box; border:1px solid #ccc;background-color:#fff;}
.group_chart .organ5 > ul > li > ul > li {
  font-size:12px; line-height:20px; padding-left: 9px;
  background: url(../../new_img/common/li_p_dot3.png) no-repeat 0 10px;}

.organization_con .organi_list15{position:relative;width: 81px;height:137px;margin: 0 0 0 4px;float:left;}
.organization_con .organi_list15 li{display:inline-block;margin-left:3px}
.organization_con .organi_list15 li.or_a{margin-top: 8px;width: 32px;margin-left: 6px;}
.organization_con .organi_list15 li.or_a > a{position:relative;padding: 20px 6px 0 9px;width: 19px;display:block;height: 150px;color:#555;font-weight:normal;line-height:18px}

/* 동 주민센터 조직도 */
.organization_con .organi_list2{position:relative;width: 590px;height:137px;float:left;margin: 10px 0 0 8px;}
.organization_con .organi_list2 span{position:absolute;top:0;left:0;display:block;padding-top:7px;width:100%;height:29px;font-size:15px;color:#fff;font-weight:bold;text-align:center}
.organization_con .organi_list2 ul{position:absolute;top: 39px;left:0;width:100%}
.organization_con .organi_list2 ul li{position:relative;float:left;margin-left: 3px;width: 33.4px;line-height:17px}
.organization_con .organi_list2 ul li:first-child{margin-left:0}
.organization_con .organi_list2 ul li a{display:block;padding:15px 7px 0 7px;height:108px;text-align:center;}
.guide_txt .content.ic_subscription{padding:40px 30px 40px 150px;background:url(../../new_img/geumjeong/sub/ic_subscription.png) no-repeat 40px center}

.guide_txt .content.s2_6_3_ic{background:url(../../new_img/geumjeong/sub/s2_6_3_ic.gif) no-repeat 40px 35px}

.s4_2_2_7_bg{background:url(/new_img/geumjeong/sub/s4_2_2_7_bg.jpg) no-repeat right 20px}
.song_box{position:relative;padding:30px 40px;background:url(/new_img/geumjeong/sub/box_bg.gif) repeat;border:1px solid #d8d8d8}
.song_box .btn02{position:absolute;top:-40px;right:0}
.song_box .plug_box{height:45px;overflow:hidden}

.s2_3_ic{background:url('/new_img/child/sub/s2_3_ic.gif') no-repeat 50px center}
.s2_3_box{margin:20px 0;padding:40px 50px;height:100px;background:url('/new_img/child/sub/s2_3_bg.jpg') no-repeat}
.s2_3_box dt{margin-bottom:5px;padding-left:40px;font-size:18px;color:#feffb2;font-weight:bold;background:url('/new_img/child/sub/s2_3_dot.png') no-repeat}
.s2_3_box dd{color:#fff}

.s2_5_ic{background:url('/new_img/child/sub/s2_5_ic.gif') no-repeat 50px center}

/* 문화관광콘텐츠 사용 */
h2.title+.pride_con{margin-top:0}
.pride_con{position:relative;margin:50px 0 8px 0;padding-left:265px;min-height:163px}
.pride_con dt{margin-bottom:10px;height:53px;font-size:18px;color:#fff;font-weight:bold;line-height:50px;background:url('/new_img/child/sub/num_tit_bg.gif') no-repeat}
.pride_con dt span{display:inline-block;margin-right:10px;padding:0 15px;font-weight:800;color:#267fcf}
.pride_con dd.photo{position:absolute;top:0;left:0;margin-left:0}
.pride_con dd{margin-left:10px}

.map_num_box{padding:20px 40px;height:270px;background:url('/new_img/child/sub/s3_2_1_bg.gif') no-repeat}
.map_num_box ul{height:100%;overflow:hidden}
.map_num_box ul li{float:left;margin-bottom:6px;width:33.3%}
.map_num_box ul li .num{display:inline-block;margin-right:5px;width:17px;height:17px;font-size:11px;color:#fff;font-weight:bold;text-align:center;line-height:16px;background:url('/new_img/tour/sub/num_bg.png') no-repeat}

.hot_spot_txt{display:none}

.tour_gallery{height:100%;overflow:hidden}
.tour_gallery li{float:left;margin-bottom:20px;width:33.3%;text-align:center}
.tour_gallery li .ph_box{display:block;margin:0 5px}
.tour_gallery li .tit{display:block;margin:15px auto 0 auto;padding-left:10px;max-width:100%;line-height:14px;text-align:left;border-left:3px solid #578cdc}
.tour_gallery li img{width:100%}
.tour_gallery.col1 li{width:100%}
.tour_gallery.col2 li{width:50%}
.tour_gallery.col5 li{width:20%}
.tour_gallery li a{position:relative;display:block}
.tour_gallery li .view{display:none;position:absolute;top:0;left:0;width:100%;height:100%;color:#fff;text-indent:-999px;overflow:hidden;text-align:center;background:url('/new_img/tour/sub/zoom_ic.png') no-repeat center center;background-size:cover}
.tour_gallery li a:hover .view{display:block}

.photo_box {margin-bottom:30px;height:100%;overflow:hidden}
.photo_box .photo_img{float:left;margin:0 20px 10px 0}
.photo_box .photo_img .tit{display:block;margin:15px auto 0 auto;padding-left:10px;max-width:100%;line-height:14px;text-align:left;border-left:3px solid #578cdc}

/* 의회운영 */
.s4_3_ic{background:url('/new_img/child/sub/s4_3_ic.gif') no-repeat 50px 40px}
.s4_3_box{margin:40px 0;padding:40px 50px;height:125px;background:url('/new_img/child/sub/s4_3_bg.jpg') no-repeat}
.s4_3_box dt{margin-bottom:5px;padding-left:40px;font-size:18px;color:#feffb2;font-weight:bold;background:url('/new_img/child/sub/s2_3_dot.png') no-repeat}
.s4_3_box dd{color:#fff}

/* 레이어팝업 */
.poplay_box{position:absolute;width:730px;background:#fff;border:2px solid #2c6dd1;z-index:100}
.poplay_box h3{padding:10px 20px;font-size:15px;color:#fff;background:#2c6dd1}
.poplay_box .assets_name{padding:15px 20px 10px 20px;background:#f1f5fc;border-bottom:1px solid #cfd5e0}
.poplay_box .poplay_con{padding:25px}
.poplay_box .btn_close{position:absolute;top:15px;right:20px}


@media all and (max-width: 1024px){
	.mquick_link,.mnotice{width: 100%;float: none;}
	.mquick_link{margin-bottom: 30px}
}

@media all and (max-width: 768px){
	.mcon_top{position: relative;overflow: hidden;width: 100%;height: 138px}
	.mcon_top dl{width: 70%;box-sizing: border-box;height: 100%}
	.mcon_top .mbtn_oragn{width: 30%;box-sizing: border-box;height: 100%}
	.mcon_top .mbtn_oragn a{height: 100%;}

	.mquick_link ul li{width: 50%;}
	.mquick_link ul li:nth-child(1),.mquick_link ul li:nth-child(2){margin-bottom: 20px;}

	.mnotice dd li{padding-right: 70px;}
	.mnotice dd li a{display: block;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;width: 100%;}

  .pride_con{padding-left:0;}
  .pride_con dt{clear: both;}
  .pride_con dt span{display:inline-block;margin-right:10px;padding:0 15px;font-weight:800;color:#267fcf;}
  .pride_con dd.photo{float: left; position: relative; margin: 0;}
  .pride_con dd{float: left; clear: both; margin: 5px 0 20px 0;}
}

@media all and (max-width: 450px){
	.mcon_top{height: auto;}
	.mcon_top dl,.mcon_top .mbtn_oragn{width: 100%}
	.mcon_top .mbtn_oragn{background-position: center 20px}
	.mcon_top .mbtn_oragn a{height: 30px;padding-top: 80px;}
}