@charset "utf-8";
@import url('./sub01.css');

@media screen and (max-width: 1024px) {
	#content {padding: 3rem 1rem !important;}
}
/*************************************
	Title
**************************************/
#conts h4:before,
#conts .h4:before {content:""; display:block; position:absolute; transform-origin:0 50%; -webkit-transform-origin:0 50%;}

#conts h4:not(.blind),
#conts h4:not(.blind) {margin-top:8rem;}
#conts h4:first-child {margin-top:1rem;}
#conts h4 {color:#333;position: relative;}
#conts h4:not(#seach_title):before {position: absolute;left: 0;}

#conts h4 {position:relative; text-align: center; font-family: 'THEChung'; font-size:3.8rem; color:#222; font-weight:800; letter-spacing: -3px; padding:2rem 0 0; line-height:1.4; word-break: break-all; margin: 5rem 0 3rem 0;}
#conts h4:before {content:""; display:block; position:absolute; top:0; left: 50% !important; margin-left: -3rem; margin-top:0;  height:0.1rem; width:6rem; background:rgba(0,0,0,.2);}

#conts h5 {font-size:2.2rem; padding:0; line-height: 150%; font-family: 'THEChung'; color:#0050a9; margin-left:0; margin-bottom:1.2rem; font-weight:800;}
#conts h5:before {display:none;}

#conts .mh4 {margin-left:0rem !important;}
#conts .mh5 {margin-left:0rem !important;}

#conts * + h4 {margin-top:4rem;}
#conts * + h5 {margin-top:4rem;}

@media all and (max-width:1024px) {
	#conts h4 {font-size:2.6rem;}

	#conts .s-title, #conts *.box-design .s-title,
	#conts *.box-design p.s-title {font-size: 2.6rem !important;}
}
@media all and (max-width:769px) {
	#conts h4 {font-size:2.4rem;}

	#conts .s-title, #conts *.box-design .s-title,
	#conts *.box-design p.s-title {font-size: 2.4rem !important;}

}
#conts .txt_point { color:#0050a9 !important; }

#conts .flow .item { border-radius: 0; }
#conts *.box-notice { border-radius: 0; padding: 3rem 2.5rem; }
#conts .tbl.thst02 tbody th {background: #f2f5f9 !important; font-weight: 600;}

.button,
.bod_head .bod_search input[type="submit"], .bod_head .bod_search a,
.bod_head .bod_search select, .bod_head .bod_search input[type="text"], .bod_head .bod_search input[type="number"],
.btn_wrap >a, .btn_wrap >input, .btn_wrap >button,
.communi_head .communi_search select, .communi_head .communi_search input[type="text"], .communi_head .communi_search input[type="number"],
input[type="submit"] { border-radius: 0 !important; }

#conts .flx-cont.color,
#conts .flx-cont .flx-box { border-radius: 0; }
@media (max-width: 640px) {
	.mo-col-1 .cell { display: block !important; width: 100%; }

}
/*************************************
	라인+아이콘이미지 Box (가이드기본)
**************************************/

#conts *.box-design { border-radius:0; background:none; padding: 1rem; border: 2px solid #003876; border-left: 6px solid #003876;}
#conts *.box-design .cell {border-radius:0;}
#conts *.box-design .cell + .cell {border-radius:0;}
#conts *.box-design .s-title, #conts *.box-design p.s-title {font-family: 'THEChung'; font-size:2.6rem !important; color:#222 !important; font-weight:800 !important; letter-spacing: -3px;}

.bod_guide { border-radius:0; background:none; padding: 3rem 4rem; border: 2px solid #003876; border-left: 6px solid #003876;}
.bod_guide:before {content:none;}
.bod_guide br { display: none;}
#conts .bod_guide p{ font-size: 1.8rem !important;}
#conts .bod_guide .s-title, #conts .bod_guide p.s-title {font-family: 'THEChung'; font-size:2.6rem !important; color:#222 !important; font-weight:800 !important; letter-spacing: -3px;}
#conts *.box_color { border-radius:0; }
#conts .bod_guide .s-title.st2 { border: 0; font-size:2.2rem !important; padding:0; line-height: 150%; font-family: 'THEChung'; color:#0050a9 !important; margin-left:0; margin-bottom:1.2rem !important; font-weight:800 !important;}

.justy-list { display: table; width: 100%; table-layout:fixed; }
.justy-list .title{ display: table-cell; width: 2.5rem; vertical-align: top; }
.justy-list .cont{ display: table-cell; width: 7.5rem; padding: 0 .2rem; }

.list-box { display: table; width:100%;; border-spacing: 20px; }
.list-box li{ display: table-cell !important; border: 1px solid #ccc; padding: 2.5rem 1rem; line-height: 1.4; font-size: 1.8rem; }
.list-box li span{ font-size: 1.6rem; color: #845e46; }
@media all and (max-width:800px) {
	.justy-list { display: block; }
	.justy-list .title,
	.justy-list .cont{ display: block; width: 100%; }

}
@media all and (max-width:640px) {
	.list-box{ display: block; width:100%; border-spacing: 0px; }
	.list-box li{ display: block !important; width:100%; font-size: 1.6rem; margin: 10px 0; }
}
/* 인사말 */
.mayor_greeting {position:relative;}
.mayor_greeting .greeting_txt {width:49%;float:left;padding-left: 30px;}
.mayor_greeting .greeting_txt .greeting_txt_img {text-align:center;}
.mayor_greeting .greeting_txt .txt {position:relative; background:url(/mayor/img/content/01/sub01_img04.png) no-repeat top; padding-top:50px; margin-top:50px; margin-bottom:100px}
.mayor_greeting .greeting_txt .txt p {font-size:18px !important; margin-bottom:20px}
.mayor_greeting .greeting_img {width:49%; float:right;}
.mayor_greeting .greeting_img .mayor_img {text-align:right;}
.mayor_greeting .greeting_img .mayor_name {text-align:right; margin-top:20px;}

@media all and (max-width:1024px){
	.mayor_greeting .greeting_txt .txt br{display: none;}
}
@media all and (max-width:840px){
	.mayor_greeting .greeting_txt {width:100%;float:none;padding: 0;}
	.mayor_greeting .greeting_img {width:100%; margin-bottom:50px; float:none;}
	.mayor_greeting .greeting_img .mayor_img {max-width: 390px;margin: 0 auto;}
	.mayor_greeting .greeting_img .mayor_name {display: none;}
	.mayor_greeting .greeting_txt .txt {text-align:center;}
}

@media all and (max-width:640px){
	.mayor_greeting .greeting_img {margin-bottom:25px}
	.mayor_greeting .greeting_txt .txt {margin-top:30px; padding-top:30px;}
	.mayor_greeting .greeting_txt .txt p {font-size:inherit !important; margin-bottom:15px}
}

@media all and (max-width:460px){
	.mayor_greeting .greeting_img .mayor_img {max-width:280px;}
}

/* 시민참여 평가 - 하단 평가사진 */
.flow-list.no-arrow.mayor_sub0603 li img{height:150px;}

/*  */
.button.sns_btn {width: 33%;padding-left: 50px;}
.button.sns_btn.facebook {background: url(/mayor/img/content/03/sub0604_ico_facebook.png) no-repeat 15px center;}
.button.sns_btn.facebook:hover {color:#fff !important;background: url(/mayor/img/content/03/sub0604_ico_facebook_on.png) no-repeat 15px center #216cda;}
.button.sns_btn.twitter {color:#1c81ad !important; border:1px solid #1c81ad; background: url(/mayor/img/content/03/sub0604_ico_twitter.png) no-repeat 15px center;}
.button.sns_btn.twitter:hover {color:#fff !important; background: url(/mayor/img/content/03/sub0604_ico_twitter_on.png) no-repeat 15px center #1c81ad;}
.button.sns_btn.blog {color:#20773d !important; border: 1px solid #20773d; background: url(/mayor/img/content/03/sub0604_ico_blog.png) no-repeat 15px center;}
.button.sns_btn.blog:hover {color:#fff !important; background: url(/mayor/img/content/03/sub0604_ico_blog_on.png) no-repeat 15px center #20773d;}
.button.sns_btn.instagram {color: #cf006f !important;border: 1px solid #cf006f;background: url(/mayor/img/content/03/sub0604_ico_instagram.png) no-repeat 15px center;}
.button.sns_btn.instagram:hover {color:#fff !important; background: url(/mayor/img/content/03/sub0604_ico_instagram_on.png) no-repeat 15px center #cf006f;}
.button.sns_btn.youtube {color:#d23131 !important; border:1px solid #d23131; background: url(/mayor/img/content/03/sub0604_ico_youtube.png) no-repeat 15px center;}
.button.sns_btn.youtube:hover {color:#fff !important; background: url(/mayor/img/content/03/sub0604_ico_youtube_on.png) no-repeat 15px center #d23131;}
.button.sns_btn.kakao {color: #885f14 !important;border: 1px solid #885f14;background: url(/mayor/img/content/03/sub0604_ico_kakao.png) no-repeat 15px center #ffffff;}
.button.sns_btn.kakao:hover {color:#fff !important; background: url(/mayor/img/content/03/sub0604_ico_kakao_on.png) no-repeat 15px center #885f14;}

@media all and (max-width:768px){
    .button.sns_btn {width:50%;}
}

@media all and (max-width:540px){
    .button.sns_btn {width:100%;}
}

/* 역대 시장 */
.mayor_history_wrap {position:relative; overflow:hidden;}
.mayor_cont {position:relative;width:49%;height: 265px;border: 1px solid #ccc;margin-bottom:20px;margin-right:2%;padding: 25px 25px 15px;float:left;overflow:hidden;}
.mayor_cont:nth-child(even) {margin-right:0;}
.mayor_cont .mayor_img {width: 108px;height: 120px;float:left;margin-right: 10px;}
.mayor_cont .mayor_txt {display: inline-block;width: 70%; }
.mayor_cont .mayor_txt .mayor_name {font-size:20px !important;font-weight: 600;margin-bottom: 10px;}
.mayor_cont .mayor_txt .mayor_term > span {font-weight:bold; color:#0872db;}

@media all and (max-width:1023px){
	.mayor_cont {width:100%;height: auto;}
}

@media all and (max-width:580px){
	.mayor_cont {padding:20px 10px}
	.mayor_cont .mayor_txt .mayor_term {font-size:15px !important;}
}

@media all and (max-width:500px){
	.mayor_cont {width:100%;}
	.mayor_cont .mayor_img {width:100%; text-align:center;}
}


/* 공약사업별 실천계획 추진현황 */
#conts .contTab {margin:0 0 50px;}
#conts .contTab ul:after {content:''; clear:both; display:table;}
#conts .contTab ul {border-top:1px solid #b6c8de; border-left:1px solid #b6c8de;}
#conts .contTab li {font-size: 1.8rem; width:20%;float:left;padding: 1.5rem 0.5rem;border: 1px solid #b6c8de;border-left-width:0; border-top-width:0;color: #222;text-align:center;cursor : pointer;}
#conts .contTab li span {display:inline-block; font-size:.9em; color:#1c338a; margin-right:.25em; border:1px solid #bbb; border-radius:1em; padding:.25em .75em;}
#conts .contTab li.on span {border:1px solid #fff; color:#fff;}
#conts .contTab li.on {background: #1c338a;color:#fff; border-color: #1c338a;
	-webkit-box-shadow: 10px 10px 20px 0px rgba(0,0,0,0.2);
	-moz-box-shadow: 10px 10px 20px 0px rgba(0,0,0,0.2);
	box-shadow: 10px 10px 20px 0px rgba(0,0,0,0.2);
}

#conts .contTab .col-2 li {width:50%;}
#conts .contTab .col-3 li {width:33.333%;}
#conts .contTab .col-4 li {width:25%;}

#conts .contWrap {height: auto; overflow: hidden;}

#conts .contWrap .tbl {word-break:keep-all;}
#conts .contWrap .tbl a.button.small {height:3rem; line-height:2.8rem; padding:0 1rem;}
#conts .contWrap .tbl a.button.small.icon:after {display:none;}

#conts .contWrap dl{display:table; table-layout: fixed; width:100%; border-bottom:1px solid #ddd; padding:1.5rem; line-height:1.5; }
#conts .contWrap dl:last-child {border-bottom:none; padding-bottom:30px;}
#conts .contWrap dt{display:table-cell; width:15%; color:#32766f; }
#conts .contWrap dd{display:table-cell; width:100%; }
#conts .contWrap dd em { display:block; color:#777; font-weight:300;}




@media all and (max-width:1024px) {
	#conts .contWrap dt{width:20%; }
	
}

@media all and (max-width:640px) {
	#conts .contTab li,
	#conts .contTab .col-2 li,
	#conts .contTab .col-3 li,
	#conts .contTab .col-4 li {width:50%; border-right-width:1px !important;}
	#conts .contWrap dl {display:block; padding:1.5rem 0;}
	#conts .contWrap dt,
	#conts .contWrap dd { display:block; width:100%; }
	#conts .contWrap dt br {display:none;}

}

@media all and (max-width:480px) {
	#conts .contWrap {padding:1.5rem;}
	#conts .contTab li,
	#conts .contTab .col-2 li,
	#conts .contTab .col-3 li,
	#conts .contTab .col-4 li {width:100%; border-right-width:1px !important;}
	#conts .contTab li:nth-child(-n+14) {border-bottom-width:0;}
}

/* 4년간 재정운영계획 */
tr.beige {background: #fff7e5;}
tr.skyblue {background:#f0f9ff}

/* 연차별·분기별 추진계획 */
td.finish {text-indent: -9999px;border-left: 1px solid #3f7caf !important;background: #204fc7;}
td.after {text-indent: -9999px;border-left: 1px solid #d6e9ef !important;background: #86afec;}
th.city_plan_th {padding: 0 !important;}

.color_notice {position:relative; width: 45%; float: left;}
.color_notice:after {content:''; display:block; clear:both;}
.color_notice .color01 {width:80px;text-indent:-9999px;background: #204fc7;float:left;}
.color_notice .color02 {width:80px;text-indent:-9999px;background: #86afec;float:left;}
.color_notice div + p {width:300px;}

@media all and (max-width:768px){
    .color_notice {width:100%;}
    .color_notice:first-child {margin-bottom:15px;}
}

/* 매니페스토란 */
#conts .bod_guide p.mani_st {font-size: 2.3rem !important; font-weight: 500; margin-bottom: 5px;}

/* 공약총괄도표 */
@media all and (max-width:1024px){
    #conts .flow-list.ty2 .flow.mayor_030301 .item .tit br {display:none;}
    #conts .flow.mayor_030301 .item .txt {height:auto !important;}
}

/* 공약 확정절차 */
.qna-list.mayor_sub030303 dt {padding-left:20px;}
.qna-list.mayor_sub030303 dt:after {content: ''; display: inline-block; position: absolute; left:15px; top: 50%;  transform:translateY(-50%); font-size:20px; color:#00a69c;}

/* 공약추진현황 */
.mayor_sub0404 .img_m {display:none;}

#conts .tbl th.slash {background: #f0f2f6 url(/mayor/img/content/03/slash.png); background-size: 100% 100%;}
#conts .tbl th span.cate_top {position: absolute; right: 0; top: 0; margin-top: 65px; margin-right: 20px;}
#conts .tbl th span.cate_bot {position: absolute; left: 0; bottom: 0; margin-bottom: 50px; margin-left: 25px;}

@media all and (max-width:1000px){
	#conts .tbl th span.cate_top {margin-right: 0;}
	#conts .tbl th span.cate_bot {margin-left: 0;}
}
@media all and (max-width:640px){
	.mayor_sub0404 .img_pc {display:none;}
	.mayor_sub0404 .img_m {display:block;}
}


/* 연차별 소요예산 */
#conts .contTab .col-2 li {width:50%;}
#conts .contTab .bo-bottom {border-bottom-width: 1px !important;}


/* 종합적 기대효과 */
.expect_con {position: relative; display: block; overflow: hidden; margin-bottom:50px; padding-bottom: 50px; border-bottom: 1px dashed #ccc;}
.expect_con:last-child {margin-bottom:0; padding-bottom: 0; border-bottom: 0;}
.expect_con .img_con {width: 50%;border:1px solid #ddd;box-sizing:border-box;padding:20px 0;float: right;}
.expect_con .img_con ul  li {width:50%; text-align:center; float:left;}
.expect_con .txt_con {width:48%; float:left;}
.expect_con .txt_con .title{ font-family: 'THEChung'; font-size:3.8rem; color:#222; font-weight:800; letter-spacing: -3px; margin: 3rem 0 2rem 0rem;}

.expect_con.st2 .img_con {float: left;}
.expect_con.st2 .txt_con {float:right;}

@media all and (max-width:840px){
	.expect_con .img_con {width:100%;margin-top:20px;padding: 20px;}
	.expect_con .txt_con {width:100%;}

	.expect_con:first-child {margin-top: 50px;}
	.qna-list.mayor_sub030303 .expect_con:first-child {margin-top: 0px;}
	.expect_con .txt_con .title{ font-size:2.4rem; margin: 0rem 0 2rem 0rem;}
	#conts .expect_con .txt_con .mh4{ margin-left: 0rem !important;}
}

@media all and (max-width:460px){
	.expect_con .img_con ul li {width:100%;}
}

/*************************************
	Image Box
**************************************/
.box-img {position:relative;text-align:center;overflow:hidden;border:1px solid #ddd;border-radius:0;padding:50px 0;}

#conts .flow .item:before {border-radius:0rem;}
#conts .flow-list.ty2 .flow .item .tit {background:#0c66b1; color:#fff; border-radius:0rem;}
#conts .flow-list.ty2 .flow li:nth-child(even) .item .tit {background:#1b9db4;}

#conts .sub0201 .box-img{ padding: 0; }
#conts .sub0201 .gc-goal{ display: block; overflow: hidden; margin: 0 -0.5%; }
#conts .sub0201 .gc-goal li{ width: 24%; margin: 1% 0.5%; float: left; text-align: center; min-height: 340px; padding: 185px 5px 10px; background-size: cover !important; }
#conts .sub0201 .gc-goal li p{ color: #fff; font-size: 2.8rem; }
#conts .sub0201 .gc-goal li p.num{ font-weight: 100; }
#conts .sub0201 .gc-goal li p.txt{ font-family: 'THEChung'; font-weight: 800; line-height: 1.2; }
#conts .sub0201 .gc-goal li:nth-child(1){ background: url(/mayor/img/content/02/sub01_img02-new1.png) no-repeat center top; }
#conts .sub0201 .gc-goal li:nth-child(2){ background: url(/mayor/img/content/02/sub01_img02-new2.png) no-repeat center top; }
#conts .sub0201 .gc-goal li:nth-child(3){ background: url(/mayor/img/content/02/sub01_img02-new3.png) no-repeat center top; }
#conts .sub0201 .gc-goal li:nth-child(4){ background: url(/mayor/img/content/02/sub01_img02-new4.png) no-repeat center top; }
@media all and (max-width:1024px){
	#conts .sub0201 .gc-goal li p{ color: #fff; font-size: 2.3rem; }
}
@media all and (max-width:1000px){
	#conts .sub0201 .gc-goal li{ width: 49%;  }
}
@media all and (max-width:640px){
	#conts .sub0201 .gc-goal li{ min-height: 280px; padding: 150px 5px 10px; }
	#conts .sub0201 .gc-goal li p{ font-size: 2.2rem; }
}
@media all and (max-width:480px){
	#conts .sub0201 .gc-goal li{ width: 100%; min-height: 340px; padding: 185px 5px 10px; }
	#conts .sub0201 .gc-goal li p{ font-size: 2.4rem; }
}

#conts .sub0301 .bt-line{ padding-bottom: 50px; margin-bottom: 50px; border-bottom: 1px dashed #ccc; }
#conts .sub0301 .bt-line p{ line-height: 1.8; font-size: 2rem; }
#conts .sub0301 .cont-box .box-img{ padding: 0; }
#conts .sub0301 .cont-box .txt{ padding: 50px 20px; line-height: 1.8; font-size: 1.8rem; color: #666; }


.sub030201 .img_cont {border:1px solid #d8d8d8;border-bottom:3px solid #d8d8d8;border-top:1px solid #000; line-height:1.7;}
.sub030201 .img_cont + .img_cont {margin-top:3em !important;}
.sub030201 .img_cont {display:table; width:100%; table-layout:fixed; }
.sub030201 .img_cont .cell {display:table-cell; padding:3rem 5rem; vertical-align:middle; min-height: 24rem;}
.sub030201 .img_cont .thumb {width:35rem; text-align:center;}
.sub030201 .img_cont .thumb img {max-width:90%;}
.sub030201 .img_cont .thumb + .cell {padding-left:0;}
.sub030201 .img_cont .s-title { font-family: 'THEChung'; font-size:2.6rem !Important; color:#0050a9 !important; font-weight:800 !important; letter-spacing: -3px !important;}

@media all and (max-width:1024px) {
	.sub030201 .img_cont .cell {padding:2rem 3rem;}
	.sub030201 .img_cont .thumb {width:30rem;}
	.sub030201 .img_cont .s-title { font-size:2.2rem !Important; line-height: 1.4;}
}
@media all and (max-width:640px) {
	.sub030201 .img_cont {display:block;margin-top:3em !important;}
	.sub030201 .img_cont .cell {display:block; padding:2rem 1.5rem; min-height: auto;}
	.sub030201 .img_cont .thumb {width:auto; height: 20rem; padding-bottom:0; overflow: hidden;}
	.sub030201 .img_cont .thumb + .cell {padding-left:1.5rem;}
}