@charset "utf-8";
/**
 * @File Name : content.css
 * @Description : Subpage Body Contents CSS.
 * @Modification Information
 * <pre>
 * ������ | ������ | ��������
 * 2018.00.00 | ���̸� | ���� ���
 * </pre>
 * @author ��ǥ��ȭ�� ������
 * @since 2018.05.10
 *
 * @Copyright (C) IACTS.CO.KR All rights reserved.
 */

/*! Subpage Body Content Each Template v.20150905~ 20160929. 20170621 | by @Who
 �� ���ʡ����� �۾��ڴ� * ������ | ������ | �������� ~ �� �׻� �����ּ���!
 */

/* [IE8+]compatible! */

/* Table of contents ))
 | .content1template1
 | ��
 */

/* All Device �ߡߡߡߡߡߡߡߡߡ� */

/* �ޡ� StyleName. YYYYMMDD. @Who	 �ޡ� */

[class*='panel'].hue2a3{
	padding:20px;
	border-top-color:#000;
	border-bottom-color:#ccc;
	border-bottom-style:
	dashed;
}
[class*='panel'].hue2a3:before{content:'';display:block;
	position:absolute;left:0;top:-2px;
	width:150px;height:30px;
	/* border-top:4px solid #2b4380; */border-top:4px solid #cd4747;
	border-left:5px solid #cd4747;
}

[class*='panel']>[class*='deco1']{float:left;
	width:100px;
	height:100px;
	margin:0 30px;
	background:url(../../img/sub/cont_2022/ic160deco1bulb1.png) no-repeat center center;
	background-size:contain;
}

.search1select10 .button .ic1{display: none;}


.br_b{display:block;}/* ����Ͽ����� �ٹٲ� ���� ���� */
.br_mb{display:inline-block;}
@media all and (max-width:767px){
	.br_b{display:inline-block;}
	.br_mb{display:block;}
}



* �Ϲݸ�� */
ul.bu{list-style:none;margin-left:0;padding:0;text-align:left;}
ul.bu ul{list-style:none;margin:.5em 0;padding:0;}
ul.bu li{
	margin:.375em 0;
	padding:.1em 0 0 .75em;
}
ul.bu li,
ul.bu.bu1 li{/* background:url(../../img/lib/li1bg.png) no-repeat .125em .375em; */}
ul.bu li ul>li,
ul.bu.bu2 li{/* background:url(../../img/lib/li2bg.png) no-repeat .125em .375em; */}
ul.bu li li ul>li,
ul.bu.bu3 li{background:url(../../img/lib/li3bg.png) no-repeat .125em .375em;}
ul.bu li li li ul>li,
ul.bu.bu4 li{background:url(../../img/lib/li4bg.png) no-repeat .125em .375em;}


ul.buu{list-style:none;margin-left:0;padding:0;text-align:left;}
ul.buu ul{list-style:none;margin:.5em 0;padding:0;}
ul.buu li{
	margin:.375em 0;
	padding:0 0 0 1.25em;
}


.fc01{color:#431c72;}/* û����*/
.fc02{color:#009491;}/* û���*/
.fc03{color:#a60082;}/* ���ֺ�����*/
.fc04{color:#eb6000;}/* ��Ȳ*/
.fc05{color:#431c72;}/* 601985*/

.even-grid img {
	width: 100%;
}

/* �λ縻 2022�� */
.greeting2{display:block;}
/* .greeting2 .wrap1{position:relative;margin:0 20px;} */
.greeting2 .wrap1{margin:0 auto;width:1200px;padding:30px 0;}
.greeting2 .greeting2s1{
	background:url(../../img/sub/cont_2022/greeting_bg03.png) no-repeat;
	/* background-size:contain; */
	background-size:cover;
	margin:0 -360px;
	/* text-align:center; */
}
.greeting2 .f1{display: block;}
.greeting2 .tg1{display: block;color:#000;line-height:1.5;font-weight:600;margin-left:-15px;}
.greeting2 .tg1 .t1{font-size:32px;font-weight:bold;margin:0 0 40px;}
.greeting2 .tg1 .t2{font-size:28px;margin:30px 0;}
.greeting2 .tg1 .t3{font-size:18px;margin:30px 0;}
.greeting2 .tg1 .t4{font-size:22px;}
.greeting2 .tunder1{text-decoration:underline;}

@media all and (max-width:1200px){
	.greeting2 .wrap1{position:relative;margin:0 20px;width:auto;}
	.greeting2 .greeting2s1{margin:0 auto;}
	.greeting2 .br_b{display:inline-block;}
}

@media all and (max-width:1100px){
	.greeting2 .even-grid[class*='evenmix-12']>.column{width:100% !important;}
	.greeting2 .f1{text-align:center;}
	.greeting2 .greeting2s1{background-size:auto;}
	
}

@media all and (max-width:768px){
	.greeting2 .greeting2s1{background-image:none;}
	.greeting2 .tg1 .t1{font-size:28px;margin:40px 0 20px;}
	.greeting2 .tg1 .t2{font-size:22px;}
	.greeting2 .tg1 .t3{font-size:16px;}
	.greeting2 .tg1 .t4{font-size:18px;}
	.greeting2 .even-grid[class*='evenmix-12']>.column{width:auto !important;}
	.greeting2 .f1 img{width:100%;}
}

@media all and (max-width:399px){
	
}


/* ������ */
.profile2{display:block;}
.profile2 .profile2s1{margin:0 -360px;}
.profile2 .profile2s1 .tg1{position: relative;display: block;width:81.25%;height:420px;background:#f6f6f6 url(../../img/sub/cont_2022/profile2_bg01.png) no-repeat left bottom;border-top-right-radius:200px;box-sizing:border-box;}
.profile2 .wrap1{float:right;margin:0 auto;width:1200px;padding:0;}
.profile2 .profile2s1 .tg1 .title1{display: block;margin:70px 0 0 24px;}
.profile2 .profile2s1 .tg1 .f1{position:absolute;bottom:0;right:70px;width:650px;height:90.48%;}
.profile2 .profile2s1 .tg1 .f1:before{position:absolute;bottom:0;right:0px;content:'';width:335px;height:100%;background:url(../../img/sub/cont_2022/profile2_02.png) no-repeat 50% 100%;background-size:contain;}
.profile2 .profile2s1 .tg1 .f1 .mayor_m{position:absolute;bottom:30px;left:0px;font-size:36px;color:#000;font-weight:bold;line-height:1}

@media all and (max-width:1200px){
	.profile2 .wrap1{position:relative;display: block;float:none;margin:0 20px;width:auto;height:100%;}
	.profile2 .profile2s1{margin:0 auto;}
	.profile2 .profile2s1 .tg1{width:auto;height:360px;}
	.profile2 .profile2s1 .tg1 .f1{right:0px;width:100%;}
	.profile2 .profile2s1 .tg1 .f1 .mayor_m{left:calc(50% - 30%);}
	.profile2 .profile2s1 .tg1 .title1{display: block;margin:0px 0 0 24px;padding-top:60px;}
	.profile2 .profile2s1 .tg1 .title1 img{width:60%;height:auto;}
}

@media all and (max-width:768px){
	.profile2 .profile2s1 .tg1{height:300px;border-top-right-radius:0px;}
	.profile2 .profile2s1 .tg1 .f1:before{width:300px;}
	.profile2 .profile2s1 .tg1 .f1 .mayor_m{font-size:26px;}
}

@media all and (max-width:600px){
	.profile2 .profile2s1 .tg1{height:340px;border-top-right-radius:0px;}
	.profile2 .profile2s1 .tg1 .f1:before{width:200px;}
	.profile2 .profile2s1 .tg1 .title1{margin:0;padding-top:30px;}
	.profile2 .profile2s1 .tg1 .title1 img{width:100%;height:auto;}
	.profile2 .profile2s1 .tg1 .f1 .mayor_m{left:0;bottom:15px;font-size:18px;}
}

.profile2 .profile2s2{position: relative;display: block;margin:60px 20px;}
.profile2 .profile2s2 .h2{display:block;}
.profile2 .profile2s2 .h2 .t1{display:inline-block;font-size:24px;color:#000;font-weight:bold;vertical-align:top;margin:8px 0 0 15px;}
.profile2 .profile2s2 .h2 .ic{display:inline-block;width:50px;height:50px;border-radius:100px;box-sizing:border-box;background:#a3488f url() no-repeat 50% 50%;background-size:contain;} 
.profile2 .profile2s2 .h2 .ic.ic01{background-image:url(../../img/sub/cont_2022/profile2_ic01.png)}
.profile2 .profile2s2 .h2 .ic.ic02{background-image:url(../../img/sub/cont_2022/profile2_ic02.png)}
.profile2 .profile2s2 .h2 .ic.ic03{background-image:url(../../img/sub/cont_2022/profile2_ic03.png)}
 
.profile2 ul.bu>li:before{display:none;}



/* ������ ö�� 2022 */
.vision2{display:block;}
.vision2 .wrap1{margin:0 auto;width:1200px;padding:30px 0;}
.vision2 .vision2s1{
	position: relative;
	background:url(../../img/sub/cont_2022/vision2_bg01.png) no-repeat top center;
	background-size:contain;	
	margin:0 -360px;
	text-align:center;
}
.vision2 .vision2s2{
	position: relative;
	background:#f9f8f4 url(../../img/sub/cont_2022/vision2_bg02.png) no-repeat center center;
	/* background-size:contain; */
	background-size:cover;
	margin:0 -360px;
	text-align:center;
} 

/* .vision2 .vision2s1:after{position:absolute;top:5px;right:95px;content:'';width:413px;height:241px;background:url(../../img/sub/cont_2022/vision2_bg05.png) no-repeat;background-size:contain;}
.vision2 .vision2s2:before{position:absolute;top:-146px;left:110px;content:'';width:447px;height:241px;background:url(../../img/sub/cont_2022/vision2_bg04.png) no-repeat;background-size:contain;} */

.vision2 .vision2s3{
	background:url(../../img/sub/cont_2022/vision2_bg03.png) no-repeat center bottom;
	background-size:contain;	
	margin:0 -360px;
	text-align:center;
} 
.vision2 .tg1 .h2{display: inline-block;margin:30px auto;width:170px;padding:8px 20px 10px;background:#a70182;border-radius:100px;box-sizing:border-box;font-size:20px;color:#fff;line-height:1}
.vision2 .tg1 .t1{margin-bottom:50px;}

/* .vision2 .vision2s1 .tg1{padding-top:50px;} */
.vision2 .vision2s2 .tg1{width:70%;margin:auto;margin-bottom:30px;}
.vision2 .vision2s3 .tg1{margin-bottom:4%;}


@media all and (max-width:1200px){
	.vision2 .wrap1{position:relative;margin:0 20px;width:auto;}
	.vision2 .vision2s1, .vision2 .vision2s2, .vision2 .vision2s3{margin:0 auto;}
}

@media all and (max-width:999px){
	.vision2 .vision2s2 .tg1{width:auto;}
}
@media all and (max-width:768px){
	.vision2 .vision2s1 .tg1 img, .vision2 .vision2s3 .tg1 img{width:100%;}
}
	
.box {
    position: relative;
    margin: 20px 0;
    padding: 5px;
    background: url(/_res/mayor/img/sub/box1_pattern1.png) repeat;
}
.box .inner_box{padding:25px 35px;background:#fff;}

/*  [공약이행 현황] - [총괄이행현황] */
.cnt2520_title{background:#0c4e81 url('../images/contents/cnt2520_title_bg01.gif') no-repeat left top;color:#fff;text-align:center;}
.cnt2520_title > div{height:150px;background:url('../images/contents/cnt2520_title_bg02.gif') no-repeat right top;}
.cnt2520_title strong{display:inline-block;margin-top:4%;font-size:35px;line-height:1.5em;font-weight:normal;font-family:'NanumMJ';}
@media all and (max-width:800px) {
	.cnt2520_title > div{padding:0 3%;}
	.cnt2520_title strong{font-size:28px;}
}
@media all and (max-width:639px) {
	.cnt2520_title{padding-bottom:20px;background-image:none;}
	.cnt2520_title > div{height:auto;background:none;}
	.cnt2520_title strong{font-size:26px;margin:20px 0 15px;}
}
/* 약속과 실천 > 시장공약 > 공약이행현황 > 사업별 관리카드 */
.cnt2526 .box2 strong{font-size:25px;color:#4d94ef;font-weight:normal;}
.cnt2526 .text_right{font-size:15px;color:#909090;}

.cnt2526 .graph_box {  margin:0 auto; text-align:center;}
.cnt2526 .graph_box .graph_area { display:inline-block;/* width:210px; */width:430px; vertical-align:middle; text-align:center;}
.cnt2526 .graph_box .graph_area .percent { height:176px; margin-bottom:20px;  background:url(../images/contents/cts2526_graph.png) no-repeat center top;font-size:20px; color:#707070; line-height:176px;}
.cnt2526 .graph_box .text_area {display:inline-block;width:325px; margin-left:60px; vertical-align:middle;}
.cnt2526 .graph_box .text_area ul li { padding:3px 0; background:url(/_res/mayor/img/sub/08099_graph_line.gif) repeat-x left center; text-align:right;}
.cnt2526 .graph_box .text_area ul li span { background:#ffffff;font-size:18px; }
.cnt2526 .graph_box .text_area ul li span.tit { float:left; padding-right:5px; color:#454545;}
.cnt2526 .graph_box .text_area ul li span.case { padding-left:5px; color:#245a9f;} 
 
@media all and (max-width:700px) {
.cnt2526 .graph_box .graph_area { width:100%; margin-bottom:30px;}
.cnt2526 .graph_box .graph_area img{max-height:275px;margin-bottom:10px;}
.cnt2526 .graph_box .text_area {width:100%; margin-left:0; }
}
	
@media all and (max-width:390px) {
.cnt2526 .graph_box .graph_area img{max-height:225px;margin-bottom:10px;}
}	

/* 5대 핵심공약 */
.keyCommit{width:100%;margin:0 auto;background-color: #f3f3f3;padding-top: 20px;padding-bottom: 10px;overflow:hidden;}
.keyCommit > h4{font-size:35px; font-weight: 700; text-align: center; padding:20px 0; }
.keyCommit > ul{display:flex; justify-content: space-around; width:95%; margin:0 auto; padding:20px 0; overflow:hidden;}
.keyCommit > ul >li{width: calc(100% / 5 - 20px); margin-left:0;text-align:center; position: relative; }
.keyCommit > ul >li > .rankN{width:60px;line-height: 30px;background-color: #e83f7f;color:#fff;border-radius: 20px;position:absolute;left:50%;top:-13px;transform: translateX(-50%);font-size: 15px;}
.keyCommit > ul >li > .comitDesc{display:flex;flex-direction: column;justify-content: space-evenly;width:100%;min-height: 162px;padding-top: 10px;border-radius: 20%;font-size:17px;background-color:#fff;color:#000;/* box-shadow: 0px 10px 21px 0px rgba(0, 34, 102, 0.06); */}


@media all and (max-width:640px) {	
.keyCommit > h4{font-size:40px;}
.keyCommit > ul{width: 600px;}
.keyCommit > ul >li {  width: calc(100% / 1 - 10px); }
.keyCommit > ul >li > .rankN{font-size:15px;}
.keyCommit > ul >li > .comitDesc{height:135px; font-size:16px;border-radius:5%;}

.keyCommit > ul{display:block;  width: 100%;}
.keyCommit > ul >li{width: calc(100% - 50px);margin-left: 25px;margin-top: 20px;float: left;}
.keyCommit > ul >li > .comitDesc{font-size:16px;}
}

@media all and (min-width:768px) {	
.keyCommit > h4{font-size:40px;}
.keyCommit > ul{width: 600px;}
.keyCommit > ul >li {  width: calc(100% / 1 - 10px); }
.keyCommit > ul >li > .rankN{font-size:15px;}
.keyCommit > ul >li > .comitDesc{height:135px; font-size:16px;border-radius:5%;}

.keyCommit > ul{display:block;  width: 100%;}
.keyCommit > ul >li{width: calc(30% - 25px);margin-left: 36px;margin-top: 20px;float: left;}
.keyCommit > ul >li > .comitDesc{font-size:16px;}
}	

@media all and (min-width:1200px) {	
.keyCommit{width:100%;margin:0 auto;background-color: #f3f3f3;padding-top: 20px;padding-bottom: 10px;overflow:hidden;}
.keyCommit > h4{font-size:35px; font-weight: 700; text-align: center; padding:20px 0; }
.keyCommit > ul{display:flex; justify-content: space-around; width:95%; margin:0 auto; padding:20px 0; overflow:hidden;}
.keyCommit > ul >li{width: calc(100% / 5 - 20px); margin-left:0; text-align:center; position: relative; }
.keyCommit > ul >li > .rankN{width:70px;line-height: 30px;background-color: #e83f7f;color:#fff;border-radius: 20px;position:absolute;left:50%;top:-13px;transform: translateX(-50%);font-size: 17px;}
.keyCommit > ul >li > .comitDesc{display:flex;flex-direction: column;justify-content: space-evenly;width:100%;min-height: 162px;padding-top: 10px;border-radius: 10%;font-size:17px;background-color:#fff;/* box-shadow: 0px 10px 21px 0px rgba(0, 34, 102, 0.06); */}
}