@charset "utf-8";


/* 블릿 */
.bullet-A li { position:relative; padding-left:10px; line-height:150%; }
.bullet-A li:before { content:'-'; position:absolute; left:0; top:0; }

.bullet-B li { position:relative; padding-left:20px; line-height:150%; }
.bullet-B li:before { content:'ㆍ'; position:absolute; left:0; top:0; font-size:20px; font-weight:600; }

.subNameH4 { position: relative; margin-top: 40px; padding-left:0; font-size: 22px; line-height: 1em; font-weight:600;}


/* colum */
.colum {display:inline-block;float: left;}
.colum.wid20 { width:20%; }
.colum.wid30 {width: 33%;}
.colum.wid40 { width:40%; }
.colum.wid50 {width:50%;box-sizing: border-box;}
.colum.wid60 { width:60%; }
.colum.wid70 { width:67%; }
.colum.wid80 { width:80%; }



/* 서브 비주얼 */
.subVisual {position:relative;width:100%;/*padding-bottom:35%; */background: url('/upload_data/board_data/BBS_0000050/162423791969358.jpg')no-repeat center center;min-height:350px;display: flex;justify-content: center;align-items:center;text-align:center;}
.subVisual > div { color:#fff;  }
.subVisual .subVisual-Txt { font-size:40px; font-weight:600;}
.subVisual ul { margin-top:40px; position:relative; padding-left:30px;}
.subVisual ul:before { content:''; position:absolute; top:0; background:url(https://www.haeundae.go.kr/eng/img/sub/home_ico.png) left center no-repeat; width:18px; height:16px;}
.subVisual ul li { display:inline; padding:0 15px 0 20px; position:relative;}
.subVisual ul li:first-child { padding-left:50px;}
.subVisual ul li:first-child:before { left:30px;}
.subVisual ul li:before { content:''; position:absolute; left:0; top:0; background:url(https://www.haeundae.go.kr/eng/img/sub/home_arrow.png) left 1px no-repeat; width:8px; height:13px;}

/* 오시는길 */
.mapConts { clear:both; margin-bottom:50px; }
.mapConts-info { clear:both; position:relative; width:100%; }
.mapConts-info dl { clear:both; width:100%; margin-bottom:50px; overflow:hidden; padding-top:30px; }
.mapConts-info dl dt { position:relative; width:320px; float:left; font-size:30px; color:#282b4c; font-weight:600; }
.mapConts-info dl dt:before { content:'~'; position:absolute; left:-3px; top:-30px; font-weight:600; font-size:40px; color:#282b4c; }
.mapConts-info dl dd { width:auto; float:left; font-size:16px; color:#333; font-weight:600; padding-top:10px;}

.mapConts-metro { padding-left:140px; padding-bottom:50px; position:relative;}
.mapConts-metro .mapConts-metro-ttl { color:#d3383e; font-size:16px; margin-bottom:20px; display:block;}
.metro-ico:before { content:''; position:absolute; left:0; top:0; display:inline-block; width:120px; height:120px; border-radius:100%; border:1px solid #e2e3e5; background:url(https://www.haeundae.go.kr/eng/img/sub/mertoMap_ic.png) center no-repeat;}
.bus-ico:before { content:''; position:absolute; left:0; top:0; display:inline-block; width:120px; height:120px; border-radius:100%; border:1px solid #e2e3e5; background:url(https://www.haeundae.go.kr/eng/img/sub/busMap_ic.png) center no-repeat;}
.car-ico:before { content:''; position:absolute; left:0; top:0; display:inline-block; width:120px; height:120px; border-radius:100%; border:1px solid #e2e3e5; background:url(https://www.haeundae.go.kr/eng/img/sub/carMap_ic.png) center no-repeat;}

.busInfo { clear:both;}
.busInfo li { position:relative; padding-left:70px;}
.busInfo li span { position:absolute; left:0; top:0; width:70px;}
.busInfo li:before { content:'';}

.busInfo-Vill li { padding-left:0;}
.busInfo-Vill li span { display:inline-block; width:180px;}
.busInfo-Vill li:before { content:'';}


/* 코드 */
.codeView { border:1px solid #e1e2e4; padding:10px 30px; margin-bottom:10px;}
.codeView img { margin-right:30px;}

.manager-info { border:1px solid #e1e2e4; padding:20px 30px; overflow:hidden; margin-bottom:20px;}
.manager-info li { position:relative; font-size:15px; float:left; padding-left:20px; }
.manager-info li:first-child { padding-right:50px;}
.manager-info li:before { content:''; position:absolute; left:0; top:0; background:url(https://www.haeundae.go.kr/eng/img/sub/bullet_line.png) left 4px no-repeat; width:11px; height:15px;}
.manager-info li span { color:#333; font-weight:600; margin-right:10px;}

/* 구정목표 */
.VisionImg { text-align:center;}
.mobpop{display:none}



/* 조직도 */
.org a:hover {text-decoration:underline;}
.org {background: url('https://www.haeundae.go.kr/eng/img/sub/organization_line2.png') no-repeat 33px 46px; background-position:center top;}
.org .group .top_level2, .org .group .top_level2-3 {position:relative;}
.org .group .top_level2 ul { padding-bottom:29px;  }
.org .group .top_level2-3 ul { padding-bottom:29px;  }
.org .group .top_level2 li, .org .group .top_level2-3 li {font-size:18px; text-align:center;}
.org .group .top_level2 li span, .org .group .top_level2-3 li a {display:block; width:190px; height:137px; padding-top:16px; line-height:24px;}


.org .link_list_part {}
.org .link_list_part > li {float:left; font-size:18px; text-align:center; background:#436692; height:137px; padding-top:16px; line-height:24px;}
.org .link_list_part > ul.three li { width:29%; margin:0 2%}
.org .link_list_part > ul.four li { width:21%; margin:0 2%}
.org .group { position:relative; }
.org .group .top_level3 {position:relative;}
.org .group .top_level3 ul {height:287px; padding-bottom:29px; }
.org .group .top_level3 li {font-size:18px; text-align:center;}
.org .group .top_level3 li a {display:block; width:190px; height:137px; padding-top:16px; line-height:24px;}

.org .group .top_level2 .level01 , .org .group .top_level2-3 .level01, .org .group .top_level3 .level01 {padding-bottom:12px;  font-size:20px;}
.org .group .top_level2 .level01 span, .org .group .top_level2-3 .level01 span, .org .group .top_level3 .level01 a {height:auto;margin:0 auto;padding-top:8px;padding-bottom:8px;border:10px solid #0054a6;background-color:#fff;color:#005bab;}

.org .group .top_level3 .level02 {position:relative; z-index:20; width:190px; margin:0 auto; padding-top:20px; padding-bottom:136px; }
.org .group .top_level3 .level02 span {height:auto;padding-top:8px;padding-bottom:8px;border:10px solid #1690dd;background-color:#fff;color:#16679a;display: block;}

.org .group .top_level3 .level04 {position:absolute; right:85px; top:140px; z-index:10; padding-left:8px;}
.org .group .top_level3 .level04 a {height:auto; padding-top:8px; padding-bottom:8px; border:10px solid #71B141; background-color:#fff; color:#75b347;}

.org .group .top_level3 .level03 {position:absolute; right:85px; top:50px; padding-left:70px; height:150px; background:url('https://www.haeundae.go.kr/eng/img/sub/organization_line04.gif') no-repeat center left 10px;}
.org .group .top_level3 .level03 a {height:24px; padding-top:8px; padding-bottom:8px; border:10px solid #41ADB1; background-color:#fff; color:#41adb1;}

.org .link_list_part3 {margin-left:2%;}
.org .link_list_part3 > li {float:left; width:29%; margin:0 2%;}
.org .group .link_list_part3 > li > a {display:block; padding:10px 0 10px; margin-bottom:10px; font-size:18px; line-height:22px; color:#fff; text-align:center; background:#436692;}

.org .group .level2-1 {border: 1px solid #15b4b3;background: #fff;display:inline-block;width:140px;position:absolute;color: #15b4b3;padding:10px;top:56px;left: 50%;margin-left: 160px;text-align:center;}
.org .group .level4-1 {background: #128988;display:inline-block;width:150px;position:absolute;color:#fff;padding:0;top: 340px;left:0; margin-left:0;}
.org .group .level4-2 {background: #128988;display:inline-block;width:150px;position:absolute;color:#fff;padding:0px;top:420px;left:0px; margin-left:0;}
.org .group .level4-3 {background: #128988;display:inline-block;width:150px;position:absolute;color:#fff;padding:0px;top:500px;left:0px; margin-left:0;}

.org .link_list_part4 {margin-left:2%;}
.org .link_list_part4 > li {float:left; width:21%; margin:0 2%;}
.org .group .link_list_part4 > li > span {display:block; padding:10px 0 10px; margin-bottom:10px; font-size:18px; line-height:22px; color:#fff; text-align:center; background:#436692;}


.org .link_list { }
.org .link_list > li {float:left;width:16.7%; margin-left:1%;}
.org .link_list > li > a,
.org .dong_office > span {display:block; padding:10px 0 10px; margin-bottom:10px; line-height:22px; color:#fff; text-align:center;}
.org .group .link_list > li > a,  .org .group .link_list > li > p{display:block;background: #128988;color:#fff;padding:10px 0 10px;text-align:center;}
.org .link_list > li:nth-child(4) { margin-left: 160px;}

.org .dong_office > span {background: #2f80c3;}
.org .link_list li li {margin-top:4px;}
.org .link_list li li:first-child {margin-top:0;}
.org .link_list li li a {background:#f2f2f2;display:block;padding: 8px 3px 8px 18px;font-size:15px;color:#4f5d69;}
.org .link_list li li a span {display:block; padding-right:15px; background-repeat:no-repeat; background-position:right 2px; font-weight:600;}
.org .group .link_list li li a {background:#f2f2f2;text-decoration: none;cursor: auto;}
.org .group .link_list li li a span {}

.org .immediate_office, .org .dong_office { clear:both; width:100%; display:block; margin:38px 0;}
.org .immediate_office .link_list1 li {float:left;width: 19%; margin:0 0.5%;}
.org .immediate_office .link_list1 li > ul { width:100%; display:block;}
.org .immediate_office .link_list1 li > ul > li { width:100%; display:block;}
.org .immediate_office .link_list1 > li > a {background: #9e7454;display:block;padding:10px 0 10px;margin-bottom:10px;font-size:18px;line-height:22px;color:#fff;text-align:center;}

.org .immediate_office .link_list1 li li a {background:#f2f2f2;display:block;padding:8px 10px 8px 24px;font-size:15px;color:#4f5d69;font-weight: 600;}

.org .immediate_office .link_list1 li li a span {}
.org .immediate_office .link_list1 li li {margin-top:4px;margin-left: 0;}

.org .dong_office li li a {background:#f2f2f2;}
.org .dong_office li li a span {}
.org .dong_office .link_list2 li {float:left; width:13.28%; margin:0 0.5%; margin-bottom: 4px;}
.org .dong_office .link_list2 li > ul { width:100%; display:block;}
.org .dong_office .link_list2 li > ul > li { width:100%; display:block;}
.org .dong_office .link_list2 li:last-child{ margin-right:0;}
.org .dong_office .link_list2  li li a {background:#f2f2f2;display:block;padding:8px 10px 8px 24px;font-size:15px;  color:#4f5d69;font-weight: 600;}

.org .group .link_list li li a span >b.sub{  display: block; font-weight: 400; margin-top: 4px;}
.org.foreign_org .group .top_level3 li{font-size:16px;}
.org.foreign_org .link_list > li > a, .org .dong_office > span{/* font-size:13px; */}
.org.foreign_org .link_list li li a span{font-size:13px; line-height:18px;}

/*추가조직도*/
.org.cul { background: none;}
.org.cul .link_list > li{width:40%; margin-left:74px;}
.org.cul .group .top_level3 .level03 a{height:58px;}
.org.cul .group .top_level3 ul{height:229px; /* background-image:url(/upload_data/board_data/BBS_0000050/154139541851041.png); */}
.org.cul .group .top_level3 .level01{padding-bottom:140px; background-repeat:repeat-y;}
.org.cul .group .top_level3 .level03{padding-left:204px; top:85px; height:58px; background:url(/upload_data/board_data/BBS_0000050/154139512026385.jpg)  repeat-x center left 0px}

.org.cul  .group .org_dep-2{display:block; height:58px; margin-bottom:10px; line-height:36px; font-size:18px; text-align:center; color:#3ab9e0; border:10px solid #3ab9e0;}
.org.cul  .group .link_list > li > ul > li.level4 > a{font-size:18px; margin-bottom:10px; background:#15b4b3; display:block; color:#fff; text-align:center;}


.tbl-contsA {border-left: solid 2px #fff; border-right: solid 2px #fff;margin-top:20px;margin-bottom:0px;}
.tbl-contsA th,
.tbl-contsA td {padding: 15px; font-size: 16px; border: solid 1px #e1e1e1;}
.tbl-contsA thead th {text-align: center; background: #f5f5f5; font-weight: 500; border-top: solid 1px #555;}
.tbl-contsA tbody tr {text-align: center; background: #fff; font-weight: 500;}
.tbl-contsA tbody tr td:last-child {text-align:center;}
.tbl-contsA tbody tr .t_color {background: #f5f5f5;}
.tbl-contsA tbody ul li {text-align:left;}
.tbl-contsA tbody tr th { background: #f5f5f5; }

/* 테이블 반응형 */
.brdList {}
.brdList th,
.brdList td {text-align: center; padding: 15px; font-size: 11pt;}
.brdList th {border-top: solid 1px #454545; border-bottom: solid 1px #ccc; font-weight: 500; background: #fafafa;}
.brdList td {border-bottom: solid 1px #ccc;}
.brdList td.bdlNum {color: #666;}
.brdList td.bdlTitle {text-align: left;}
.brdList td.bdlTitle a {display: inline-block; max-width: 85%; color: #555; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: middle;}
.brdList td.bdlTitle a .bdlNew {display: inline-block; vertical-align: middle; width: 18px; height: 18px; line-height: 18px; text-align: center; margin-top: -2px; background: #3e82e7; color: #fff; margin-left: 5px; font-size: 8pt; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%;}
.brdList td.bdlTitle img {display: inline-block; vertical-align: middle; margin-left: 5px;}
.brdList td.bdlUser {}
.brdList td.bdlDate {}
.brdList td.bdlCount {}
.brdList tr.noti td.bdlNum {color: #3e82e7; font-weight: 500; font-size: 9pt;}
.brdList tr.noti td.bdlTitle a {color: #222;}


/* 탭메뉴 */
.tab_menu{margin-bottom:50px; overflow:hidden;}
.tab_menu > ul > li{float:left; /*margin-left:-1px*/}
.tab_menu ul li a{display:block;border:#d0d0d0 solid 1px;background-color:#f4f4f4;line-height:22px;padding:16px 4% 17px;text-align:center;color:#333333;font-weight:600;}

.tab_menu ul li.on a, .tab_menu ul li a:hover{background-color:#FFF;border-top-color:#696969;border-right-color:#a0a0a0;border-bottom-color:#FFF;color:#303030;}
.tab_menu ul li:first-child.on a, .tab_menu ul li:first-child a:hover{border-left-color:#a0a0a0;}

/* 탭메뉴 type2 : 갯수 6개 이상일시 자동으로 type2적용됨, 수동으로 type2 클래스 부여해도 됨 */
.tab_menu.type2 ul li {float:left;}
.tab_menu.type2 ul li a{background-repeat:no-repeat;background-position:95% 14px;background-image:url(https://www.haeundae.go.kr/eng/img/main/next-arrow.png);padding-right:14px;display: block;padding:11px 4% 11px 8%;text-align:left;border-color:#dcdcdc;background-color:#FFF;color:#555555;font-weight:400;}

.tab_menu.type2 ul li a[target="_blank"]:after {display:inline-block;width:20px;height: 13px;margin: 0px 0 0 7px;background: url(/user_res/images/common/btnSmall_linkTyp2_icon.png)no-repeat 0 0;content:'';}
.tab_menu.type2 ul li.on a, .tab_menu.type2 ul li a:hover[target="_blank"]:after { background: url(/user_res/images/common/btnSmall_link_icon.png)no-repeat 0 0;}
.tab_menu.type2 ul li.on a, .tab_menu.type2 ul li a:hover{background-color:#005aab;  color:#FFF;}
.tab_menu.type2 ul li a span{line-height:22px;}
.tab_menu.type2 ul li.on a , .tab_menu.type2 ul li a:hover {background-position:95% 14px; background-image:url(https://www.haeundae.go.kr/eng/img/main/greeting_arrow.png); }

/* 4차탭메뉴 */
.tab_menu_4depth{margin-bottom:50px; border:#e0e0e0 solid 1px; border-bottom-color:#005aab; padding:5px 4%;}
.tab_menu_4depth ul li{position:relative; float:left; padding-right:26px; border-bottom:#cbcbcb dashed 1px;}
.tab_menu_4depth ul li:before{position:absolute; right:13px; top:calc(50% - 6px); width:1px; height:11px; background-color:#b8b8b8; content:'';}
.tab_menu_4depth ul li:last-child:before{display:none;}
.tab_menu_4depth ul li a{display:block; line-height:22px; padding:18px 24px 18px 3px; background-repeat:no-repeat; background-position:98% 25px; color:#555555;}
.tab_menu_4depth ul li.on a, .tab_menu_4depth ul li a:hover{ background-image:url(/user_res/images/common/tab_menu_4depth_on_arrow.png); color:#005aab;}

.btn {display:inline-block;padding:11px 32px 12px 32px;background-repeat:no-repeat;background-position:right center;font-size:16px;line-height:20px;vertical-align:middle;text-align:left;transition-property:border-top-color, border-right-color, border-bottom-color, border-left-color, background-color, color;transition-duration:0.5s;transition-timing-function:ease-in-out;margin-bottom: 3px;}
input.btn {height:auto; margin-top:0; margin-right:0; margin-bottom:0; margin-left:0; border-top-width:0; border-right-width:0; border-bottom-width:0; border-left-width:0; line-height:20px;}
input[type='submit'].btn {height:auto; line-height:20px;}
.btn.download, .btn.link {padding-right: 21px;}
a.btn, button.btn, input[type='button'].btn, input[type='submit'].btn, input[type='reset'].btn {color:#fff;background-color: #344b60;}
a.btn:hover, button.btn:hover, input[type='button'].btn:hover, input[type='submit'].btn:hover, input[type='reset'].btn:hover {background-color:#1d3762;}

.btn.type2 {padding-bottom:10px; border:1px solid #2a3a4c;}
a.btn.type2, button.btn.type2, input[type='button'].btn.type2, input[type='submit'].btn.type2, input[type='reset'].btn.type2 {color:#333; background-color:#fff;}
a.btn.type2:hover, button.btn.type2:hover, input[type='button'].btn.type2:hover, input[type='submit'].btn.type2:hover, input[type='reset'].btn.type2:hover {background-color:#d7e2ef;}

a.btn.type3, button.btn.type3, input[type='button'].btn.type3, input[type='submit'].btn.type3, input[type='reset'].btn.type3 {background-color:#e74949;}
a.btn.type3:hover, button.btn.type3:hover, input[type='button'].btn.type3:hover, input[type='submit'].btn.type3:hover, input[type='reset'].btn.type3:hover {background-color:#e23d3d;}

.btn.type4 {padding-bottom:10px; border:1px solid #2a3a4c;}
a.btn.type4, button.btn.type4, input[type='button'].btn.type4, input[type='submit'].btn.type4, input[type='reset'].btn.type4 {color:#333; background-color:#fff;}
a.btn.type4:hover, button.btn.type4:hover,
input[type='button'].btn.type4:hover,
input[type='submit'].btn.type4:hover,
input[type='reset'].btn.type4:hover {border-top-color:#979797; border-right-color:#979797; border-bottom-color:#979797; border-left-color:#979797; background-color:#fafafa;}

.btn > span {display:inline-block;padding-right: 41px;background-repeat:no-repeat;background-position:right center;vertical-align:baseline;transition-duration:0.5s;transition-timing-function:ease-in-out;}
.btn.download > span {background-image:url('https://www.haeundae.go.kr/eng/img/sub/btn_download_icon.png'); background-position:right 2px;}
.btn.type2.download > span {background-image:url('https://www.haeundae.go.kr/eng/img/sub/common/btn_downloadType2_icon.png');}
.btn.link > span {background-image: url('https://www.haeundae.go.kr/eng/img/sub/btn_link_icon.png');background-position: 99% 3px;}
.btn.type2.link > span {background-image:url('https://www.haeundae.go.kr/eng/img/sub/btn_linkType2_icon.png');}
.btn.poll { padding:30px 50px; background:#ff5446; font-size:20px; border-radius:7px;}

ul.w2 li { width:50% }
ul.w3 li { width:33.3%}
ul.w4 li { width:25%}
ul.w5 li { width:20%}
ul.w6 li { width:16.6%}
ul.w7 li {width:14%;}
ul.w8 li {width:12.5%;}

/* 국내교류도시 */
.sister_wrap { position:relative; width:100%; height:400px; }
.sister_wrap.img01 {  background:url(https://www.haeundae.go.kr/eng/img/sub/sister_img1.jpg) no-repeat; background-size:97% 93%; }
.sister_wrap.img02 {  background:url(https://www.haeundae.go.kr/eng/img/sub/sister_img2.jpg) no-repeat; background-size:97% 93%;}
.sister_wrap.img03 {  background:url(https://www.haeundae.go.kr/eng/img/sub/sister_img3.jpg) no-repeat; background-size:97% 93%;}
.sister_wrap.img04 {  background:url(https://www.haeundae.go.kr/eng/img/sub/sister_img4.jpg) no-repeat; background-size:97% 93%;}
.sister_wrap.img05 {  background:url(https://www.haeundae.go.kr/eng/img/sub/sister_img5.jpg) no-repeat; background-size:97% 93%;}
.sister_wrap.img06 {  background:url(https://www.haeundae.go.kr/eng/img/sub/sister_img6.jpg) no-repeat; background-size:97% 93%;}
.sister_wrap.img07 {  background:url(/upload_data/board_data/BBS_0000050/163479722288482.jpg) no-repeat; background-size:97% 93%;}
.sister_wrap .thumb { position:absolute; bottom:-30px; left:0px;}
.sister_wrap .cont { position:absolute; right:0; top:160px; width:50%; background:rgba(20,93,176,0.9); padding:40px; }
.sister_wrap ul li {margin-top:5px;padding-left:7px;color:#fff;font-size: 15px; line-height:150%;}
.sister_wrap ul > li:first-child {margin-top:0;}
.sister_wrap ul > li:before { display:inline-block; content:''; width:3px; height:3px; background:#fff; margin:0px 5px 5px 0; }
.sister_wrap ul > li strong { font-weight:600; }
.sister_wrap ul > li > ul {margin-top: 10px;}
.sister_wrap ul > li > ul > li {margin-top:5px; font-size:14px;}
.sister_wrap ul > li > ul > li:first-child {margin-top:0;}
.sister_wrap ul > li > ul > li:before { content:'-'; width:0px; height:0px; margin:0px 10px 5px 0px;}     


.table-wrap { width: 100%;  overflow-x: auto;  overflow-y: hidden; }
.table-wrap .table-xscroll { width:100%; min-width: 600px; max-width: 100%;}

.table-xscroll { overflow-x:scroll;}       



/* 역사 */
.his_wrap {padding:30px 50px;background:url(https://www.haeundae.go.kr/eng/img/sub/history_bg1.jpg) no-repeat center center;width:100%;margin: 30px 0; background-size:cover; box-sizing:border-box;}
.his_wrap h4 {font-size: 32px;margin: 10px auto;color:#fff;text-align:center;letter-spacing: -0.07em;}
.his_wrap h4:after { width:20px; height:1px; background:#fff; content:''; display:block; margin:25px auto;}
.his_wrap p { color:#fff; line-height:150%; }

.progress_tab{padding-bottom: 50px;width:100%;margin: 0 auto;}
.progress_tab ul{overflow: hidden;}
.progress_tab ul li{float: left;width: 23%;margin: 0 1%; text-align: center;}
.progress_tab ul li a{display: block;font-size: 16px;font-weight: 400;padding: 10px 20px;border: 1px solid #000;border-radius: 50px;}
.progress_tab ul li a:hover{border: 1px solid #fe6d10;color:#fe6d10;font-weight: 500;}
.progress_tab ul li a.active{border: 1px solid #fe6d10;color:#fe6d10;font-weight: 500;}


.progress_wrap{max-width:1090px;margin:0 auto;}
.progress_wrap h2{text-align:center;}
.progress_wrap h2 span{display:inline-block;font-size:20px;color:#fe6d10;border:2px solid #fe6d10;border-radius: 50px;padding:5px 30px;}
.progress_list {position:relative; padding-top: 30px;}
.progress_list:after { content:''; position:absolute; left:50%; top:0; width:1px; height:100%; background:#e5e5e5; z-index:-1;}
.progress_list > ul > li {position:relative; margin-bottom:50px;}
.progress_list > ul > li:nth-child(1):after { content:''; position:absolute; left:-75%; bottom:80px; background:url(https://www.haeundae.go.kr/eng/img/sub/history_img1.jpg) center no-repeat; border:1px solid #acb1b7; box-shadow:7px 10px 10px rgba(0,0,0,0.1); width:374px; height:249px;}
.progress_list > ul > li:nth-child(2):after { content:''; position:absolute; right:-80%; bottom:20px; background:url(https://www.haeundae.go.kr/eng/img/sub/history_img2.jpg) center no-repeat; border:1px solid #acb1b7; box-shadow:7px 10px 10px rgba(0,0,0,0.1); width:374px; height:249px;}
.progress_list > ul > li:nth-child(3):after { content:''; position:absolute; left:-75%; bottom:80px; background:url(https://www.haeundae.go.kr/eng/img/sub/history_img3.jpg) center no-repeat; border:1px solid #acb1b7; box-shadow:7px 10px 10px rgba(0,0,0,0.1); width:374px; height:249px;}
.progress_list > ul > li:nth-child(4):after { content:''; position:absolute; right:-80%; bottom:20px; background:#fff url(https://www.haeundae.go.kr/eng/img/sub/history_img4.jpg) center no-repeat; border:1px solid #acb1b7; box-shadow:7px 10px 10px rgba(0,0,0,0.1); width:374px; height:248px;}
.progress_list > ul > li{width: 48%;}
.progress_list > ul > li.left{margin-left: 50%;padding-left: 2.2%;}
.progress_list > ul > li.left .txt{text-align: left;}
.progress_list > ul > li.right{margin-right: 50%;padding-right: 0.2%;}
.progress_list > ul > li.right .txt{text-align: right;}
.progress_list > ul > li .txt{ line-height:150%;}
.progress_list > ul > li .txt > ul{}
.progress_list > ul > li .txt > ul > li{position: relative; padding-bottom:15px;}
.progress_list > ul > li.left .txt > ul > li:before{content: '';width: 20px;height: 20px;background: url(https://www.haeundae.go.kr/eng/img/sub/ico_diamond.png) no-repeat;position: absolute;left: -29px;top: 10px;}
.progress_list > ul > li.right .txt > ul > li:before{content: '';width: 20px;height: 20px;background: url(https://www.haeundae.go.kr/eng/img/sub/ico_diamond.png) no-repeat;position: absolute;right: -34px;top: 10px;}
.progress_list > ul > li .txt > ul > li > strong{font-size:25px;line-height:150%;display:block;padding-bottom:3px;color:#fe6d10;}
.progress_list > ul > li .txt > ul > li > p{font-size:16px;line-height:150%;color:#000;padding-bottom: 10px;}


/* 문화/역사 */
.culture-title { font-size:26px;}
.culture { margin:30px 0; padding-bottom:30px; border-bottom:1px dotted #CCC;}
.culture h4 {margin-top: 13px;margin-bottom:14px;padding:5px 0 0 10px; font-size:20px;line-height:26px;font-weight:600;}
.culture .wid40 img { width:300px; text-align:center;}
.culture ul li { line-height:200%; font-size:15px;}
.culture ul li span { font-weight:600;}

.Noline { border:1px solid #d0d0d0; border-top:none; border-left:none;}
.Noline li a { border-bottom:none !important; border-right:none !important;}

/* 생활시설 */
.facilityies { border-bottom:none;}

/* 외국인을 위한 정보 */
.foreigners { clear:both; margin-top:40px;}
.foreigners h4 {margin-top: 13px;margin-bottom:14px;padding:5px 0 0 10px; font-size:20px;line-height:26px;font-weight:600;}
.foreigners h5 {margin-top: 13px;margin-bottom:14px;padding:5px 0 0 10px; font-size:17px;line-height:26px;font-weight:600; color:#36C;}
.foreigners ul { padding-left:7px;}
.foreigners ul li { line-height:150%;}
.foreigners ul li .ul li { position:relative; padding-left:10px; line-height:150%; }
.foreigners ul li .bullet-A li:before { content:'-'; position:absolute; left:7px; top:0; font-size:10px; color:#666; }

.prFlw { margin:30px 0 0 0; padding:0 5%; box-sizing:border-box;}
.prFlw:after {content: ''; display: table; clear: both;}
.prFlw .arw {position: relative; margin-bottom: 30px !important;}
.prFlw .arw:before {content: ''; display: block; width: 20px; height: 13px; position: absolute; top: 100%; margin-top: 10px; left: 50%; margin-left: -10px; background: url('https://www.haeundae.go.kr/eng/img/sub/diagram_arrow.png')no-repeat center center;}
.prfCont {padding: 20px 30px; background: #fff; border: solid 2px #ccc; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px;}
.prfCont:after {content: ''; display: table; clear: both;}
.prfCont dl {float: left; width:100%; margin: 2px 0;}
.prfCont dt { display:inline-block; color: #fff; font-weight: 500; position: relative; font-size:15px; background:#3e81e7; width:25px; height:25px; line-height:23px; font-weight:600; border-radius:100%; text-align:center; margin-right:10px;}
.prfCont dd { display:inline; font-size:15px;}
.prfCont p {float: left; width: 100%;}


/* 관광명소 갤러리 */
.bdCont {margin-top: 60px;}
.brdTop {padding-bottom: 10px;}
.brdTop:after {content: ''; display: table; clear: both;}
.brdTop p {float: left; font-size: 15px; color: #555; margin-top: 20px; position: relative;}
.brdTop p span {color: #3e82e7;}
.brdSch {float: right;}
.brdSch:after {content: ''; display: table; clear: both;}
.brdSch dt {float: left; margin-right: 5px;}
.brdSch dt select {display: block; width: 130px;}
.brdSch dd {float: left; position: relative;}
.brdSch dd input[type="text"] {display: block; width: 220px; height: 38px; border: solid 1px #ccc; padding-left: 10px; padding-right: 40px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;}
.brdSch dd a,
.brdSch dd button {display: block; width: 38px; height: 38px; position: absolute; right: 0; top: 0; text-indent: -9999px; background: url('https://www.haeundae.go.kr/eng/img/sub/board_search.png')no-repeat center center;}
/* 갤러리 */
.gryList {margin-top:20px;}
.gryList:after {content: ''; display: table; clear: both;}
.gryList li {float: left; width:31.3%; padding: 0; margin:0 1% 30px; box-sizing:border-box;}
.gryList li a {display: block;}
.gryList li a em {display: block; padding-bottom: 67.7%; background-size: cover !important;}
.gryList li a h5 {margin-top: 15px; font-size: 18px; font-weight:600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.gryList li a p {font-size: 15px; margin-top: 10px; overflow:hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp:2; line-height:140%; color:#333;}

.paging {text-align:center; margin-top: 30px;}
.paging a {display:inline-block; vertical-align:middle; width:40px; height:40px; line-height:40px; position: relative; color: #999; font-size: 11pt;}
.paging > a {text-indent:-9999px;}
.paging a.first {background:url('https://www.haeundae.go.kr/eng/img/sub/paging_first.png')no-repeat center center;}
.paging a.prev {background:url('https://www.haeundae.go.kr/eng/img/sub/paging_prev.png')no-repeat center center;}
.paging a.next {background:url('https://www.haeundae.go.kr/eng/img/sub/paging_next.png')no-repeat center center;}
.paging a.last {background:url('https://www.haeundae.go.kr/eng/img/sub/paging_last.png')no-repeat center center;}
.paging ul {display:inline-block; vertical-align:middle;}
.paging ul li {display:inline-block; vertical-align:middle; position: relative;}
.paging ul li:before {content: ''; display: block; width: 1px; height: 12px; background: #e2e2e2; position: absolute; left: 0; top: 50%; margin-top: -6px;}
.paging ul li:last-child:after {content: ''; display: block; width: 1px; height: 12px; background: #e2e2e2; position: absolute; right: 0; top: 50%; margin-top: -6px;}
.paging ul li.on a {font-weight: 700; color: #3b83f4;}
.brdBtn {margin-top: 20px; text-align: right;}
.brdBtn a {display: inline-block; width: 100px; height: 50px; line-height: 48px; text-align: center; border: solid 1px #003276; color: #003276; font-size: 16px; font-weight: 500; margin-left: 5px;}


/* 갤러리 글쓰기 */
.gryWrite { margin:30px 0; padding-bottom:30px; border-bottom:1px dotted #CCC;}
.gryWrite h4 {margin-top:25px;margin-bottom:14px;padding:10px 0 0 10px; font-size:24px;line-height:26px;font-weight:600;}
.gryWrite .wid40 { width:35%; margin-right:5%;}
.gryWrite .wid40 img { width:100%; text-align:center; background:#fff; border:1px solid #e5e5e5; padding:10px; box-sizing:border-box;}
.gryWrite ul li { line-height:250%; font-size:17px; border-bottom:1px dashed #CCC; margin:5px 0;}
.gryWrite ul li:last-child {b}
.gryWrite ul li span { font-weight:600;}
.gryWrite-map { background:#fff url(https://www.haeundae.go.kr/eng/img/sub/road_ico.png) 10px center no-repeat; border:1px solid #0293d9; box-sizing:border-box; color:#0293d9; padding:10px 10px 10px 35px; margin-top:20px; }
.gryWrite-map span { font-weight:600;}

.gryWrite-conts { clear:both; margin-bottom:50px;}
.gryWrite-conts h4 {margin-top:25px;margin-bottom:14px;padding:10px 0 0 0; font-size:27px;line-height:26px;font-weight:600;}
.gryWrite-conts p {line-height:140%; font-size:16px; margin-top:20px;}
.gryWrite-conts-map { width:100%; height:500px; background:#CCC;}

/* 부산시티투어버스 */
.cityT{overflow: hidden;}
.cityT > div{float:left;width: 32.5%;padding:20px;border:1px solid #e1e1e1;text-align: center; box-sizing:border-box;}
.cityT div.left,.cityT div.center{margin-right:1%}
.cityT div img{width:100%}
.cityT div{min-height: 349px;}

.cityT > div h1{margin:30px 0 70px 0;font-size:25px;font-weight:700;position:relative}
.cityT > div h1:after{position:absolute;content:'';display:block;width:30px;height:5px;background-color:#ebebeb;bottom:-20px;left:calc(50% - 15px)}
.cityT > div img{display:inline-block;margin: 0 0 50px 0;}         


/****************************************************************************************/
/****************************************************************************************/
/*Media Query*/
/****************************************************************************************/
/****************************************************************************************/

@media all and (max-width:800px){
	.sister_wrap { padding-top:298px; height:auto; } 
	.sister_wrap .cont  {width:100%;position: static;}
	.sister_wrap .thumb { left:auto; right:10px; top:10px;}
	.mobpop{display:block;margin:10px auto;border:1px solid black;width:100px;padding:10px}
}



@media all and (max-width:1024px) {
    .org .group .top_level3 .level03 {right:0;}
    .org .group .top_level3 .level04 {right:0;}
	
    .org { background:none}
    .org .link_list {margin-left:-2%;}
    .org .link_list > li {width:23%; margin-left:2%;}
    .org .link_list > li:nth-child(4) {margin-left: 0px;}

    .org .link_list {margin:0;}
    .org .link_list > li {float:none; width:100%; margin:0;}
    .org .link_list > li > a {margin:15px 0;}
    .org ul ul ul,.org > div ul ul {margin-left:-2%;}
    .org .link_list li li {float:left; width:31.3%; margin:0 0 2% 2%;}
    .org .group .level2-1 { position:static; width:100%; margin-left:0; margin-bottom:15px; box-sizing:border-box; }
    .org .group .level4-1, .org .group .level4-2, .org .group .level4-3 {width:100%;position:static;padding:0;margin-bottom:5px;}
    .org .group .level4-1 a, .org .group .level4-2 a, .org .group .level4-3 a { margin:0}
	
	
	.VisionImg img {width:100%;}
	/* 역사 */
	.his_wrap h4 {font-size:20px}
	.his_wrap { padding:10px; box-sizing:border-box; }
	.progress_list > ul { background:none}
	.progress_list > ul > li:after { content:''; display:none;}
	.progress_list > ul > li.left .txt > ul > li:before { left:-22px;}
	.progress_list > ul > li.right .txt > ul > li:before { right:-25px;}
	
}

@media all and (max-width:760px) {
    .org .group .top_level3 ul {height:auto;padding-bottom:30px;background-image:none;}
    .org .group .top_level3 li a {width:auto; height:auto;}
    .org .group .top_level3 .level01 {padding-bottom:0;}
    .org .group .top_level3 .level02 {width:auto;padding-bottom:0px;}
    .org .group .top_level3 .level03 {position:static; float:left; width:50%; padding-left:0; background-image:none;}
    .org .group .top_level3 .level04 {position:static; float:left; width:50%; height:auto; padding-left:0; background-image:none;}
	
	.org .immediate_office .link_list1 li { width:49%;}
	.org .dong_office .link_list2 li { width:49%;}
	.org .immediate_office .link_list1 > li > a { font-size:15px;}
	.org .link_list li li a { padding-left:3px;}
	
	
	
	.brdList thead,
	.brdList colgroup {display: none;}
	.brdList,
	.brdList tbody,
	.brdList tr,
	.brdList td {display: block; width: 100%;}
	.brdList {border-top: solid 1px #2f4a3e;}
	.brdList tr {border-bottom: dotted 1px #aaa; padding: 15px 40px 15px 0; position: relative;}
	.brdList tr:after {content: ''; display: table; clear: both;}
	.brdList td {text-align: left; padding: 0; font-size: 11pt; border-bottom: none;}
	.brdList td.bdlNum {width: auto; font-size: 9pt; position: absolute; right: 0; top: 17px;}
	.brdList td.bdlNum:before {content: 'No. ';}
	.brdList td.bdlTitle {width: 100%; float: left;}
	.brdList td.bdlTitle a {font-size: 12pt; font-weight: 500;}	
	.brdList td.bdlFile,
	.brdList td.bdlUser,
	.brdList td.bdlDate,
	.brdList td.bdlCount {float: left; width: auto; position: relative; font-size: 9pt; letter-spacing: 0.025em;}
	.brdList td.bdlFile {margin-right: 5px; padding-top: 2px;}
	.brdList td.bdlFile img {display: block; width: 16px;}
	.brdList td.bdlUser,
	.brdList td.bdlDate {padding-right: 8px; margin-right: 7px;}
	.brdList td.bdlUser:after,
	.brdList td.bdlDate:after {content: ''; display: block; width: 1px; height: 10px; background: #aaa; position: absolute; right: 0; top: 50%; margin-top: -5px;}
	.brdList tr.noti {background: none;}
	.brdList tr.noti td.bdlNum {color: #fff; background: #3e82e7; font-size: 8pt; padding: 2px 5px; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px;}
	.brdList tr.noti td.bdlNum:before {display: none;}
	
	.tbl-mobile th { font-size:15px; padding:10px 5px;}
	.tbl-mobile td { font-size:13px; padding:5px;}
	.tbl-mobile .blueLine_Btn { font-size:13px;}
	
	.progress_list > ul > li { width:100%;}
	.progress_list > ul > li.left { margin-left:0; padding-left:0;}
	.progress_list > ul > li.right { margin-right:0;}
	.progress_list > ul > li.right .txt { text-align:left;}
	.progress_list > ul > li.right .txt > ul > li:before { right:0; left:0;}
	.progress_list > ul > li.left .txt > ul > li:before { left:0;}
	.progress_list > ul > li .txt > ul > li > strong { padding-left:25px;}
	.progress_list:after { content:''; background:none;}
	
	.culture .wid40 img { width:100%;}
	.colum.wid60 { padding-left:20px; box-sizing:border-box;}
	
	.cultureTabM .w2 li { width:100% !important; }
	.cultureTabM.type2 ul li a{background-repeat:no-repeat;background-position:95% 42%;background-image:url(https://www.haeundae.go.kr/eng/img/main/next-arrow.png);padding-right:14px;display: block;padding:11px 20px 11px 20px;text-align:left;border-color:#dcdcdc;background-color:#FFF;color:#555555;font-weight:400;}

}


@media screen and (max-width:640px) {
	
.colum {display:block;float: none;}
.colum.wid20 { width:100%; }
.colum.wid30 {width: 100%;}
.colum.wid40 { width:100%; }
.colum.wid50 {width:100%;}
.colum.wid60 { width:100%; }
.colum.wid70 { width:100%; }
.colum.wid80 { width:100%; }

ul.w2 li { width:50% }
ul.w3 li { width:50%}
ul.w4 li { width:50%}
ul.w5 li { width:50%}
ul.w6 li { width:50%}
ul.w7 li {width:50%;}
ul.w8 li {width:50%;}

.cityT > div{float:none;width:100% !important;margin:0}
.cityT > div.left{margin-bottom:20px}

}





                                                                                                              