@charset "utf-8";
/*con0101*/
div.infor-flex-box{display: flex; justify-content: space-between;}
div.infor-flex-box div.left{width:40%; padding-right: 20px; position: relative; transition: 0.5s ease-in-out;}
div.infor-flex-box div.left div.infor-img{position: relative;}
div.infor-flex-box div.left div.infor-img img{display: block; max-width: 100%; transition: 0.5s ease-in-out;}
div.infor-flex-box div.left p.name{display: inline-block; font-family: 'NexonB'; color: #0b95a7; font-size:1.750em; text-align: center;background: rgb(45,105,192);
  background: linear-gradient(90deg, rgba(45,105,192,1) 0%, rgba(11,149,167,1) 100%); color: #fff; padding: 40px 75px; box-sizing: border-box; position: absolute; bottom:40px; right:0px;}
div.infor-flex-box div.left p.name span.sub-name{font-size:0.800em; padding: 0 0 0 5px;}
div.infor-flex-box div.right{width: 60%; transition: 0.5s ease-in-out;}
div.infor-flex-box div.right ul.history-box li{display: flex; justify-content: flex-start; padding: 0px 20px 50px 0; box-sizing: border-box; border-top:solid 1px #e1e1e1; transition: 0.5s ease-in-out; }
div.infor-flex-box div.right ul.history-box li span.tit{width:100px; font-family: 'NexonB'; font-size:1.250em; color: #000000; display: inline-block; text-align: center; position: relative; padding: 20px 0 0 0;}
div.infor-flex-box div.right ul.history-box li span.tit:before{content: ""; width: 50%; height: 2px; background: #005bac; position: absolute; top:0; left:0;}
div.infor-flex-box div.right ul.history-box li span.tit:after{content: ""; width: 50%; height: 2px; background: #0a95a7; position: absolute; top:0; right:0;}
div.infor-flex-box div.right ul.history-box li dl{width: 100%;}
div.infor-flex-box div.right ul.history-box li dl dt.blind{width:1px;height:1px;overflow:hidden;position:absolute;top:-9999px;left:-9999px;display:block;text-indent:-9999px;font-size:0px;line-height:0;}
div.infor-flex-box div.right ul.history-box li dl dd.year{font-family: 'NexonR'; color: #000; font-size:1.08em; padding: 20px 0 0 50px; box-sizing: border-box; text-align: left; display: block;}

@media all and (max-width:1600px){
  div.infor-flex-box div.left{padding-right: 20px;}
}

@media all and (max-width:1200px){
  div.infor-flex-box div.left p.name{padding: 30px 40px;}
}

@media all and (max-width:768px){
  div.infor-flex-box{flex-flow: wrap;}
  div.infor-flex-box div.left{width: 100%;}
  div.infor-flex-box div.left div.infor-img img{display: block; margin: 0 auto;}
  div.infor-flex-box div.left p.name{padding: 20px 30px;transform: translate(-50%, 0px);left: 50%;}
  div.infor-flex-box div.right{width: 100%; margin-top: 20px;}

}

@media all and (max-width:680px){
  div.infor-flex-box div.right ul.history-box li span.tit{font-size:1.000em;}
  div.infor-flex-box div.left p.name{font-size: 1.250em; padding: 15px 25px;}
}

/*con0201*/
div.con0201-box01{width: 100%; border:solid 1px #e1e1e1; border-bottom:none; padding: 60px 30px; box-sizing: border-box; position: relative; transition: 0.5s ease-in-out;}
div.con0201-box01.type0201{background: #fff; border-bottom:solid 1px #e1e1e1;}
div.con0201-box01 img{display: block; margin: 0 auto; max-width: 100%;}
div.con0201-box01 span.tit{width: 162px; padding: 20px 0; background: #005bac; color: #fff; font-family: 'NexonB'; font-size:1.375em; text-align: center; position: absolute; top:-30px; left:-30px;}
div.con0201-box01 span.tit:before{content: ""; width: 100%; height: 3px; background: #09aabd; position: absolute; bottom:0px; left: 0;}

div.con0201-box02{width: 100%; border:solid 1px #e1e1e1; padding: 60px 30px; box-sizing: border-box; position: relative; margin-top: 80px; transition: 0.5s ease-in-out;}
div.con0201-box02 span.tit{width: 162px; padding: 20px 0; background: #005bac; color: #fff; font-family: 'NexonB'; font-size:1.375em; text-align: center; position: absolute; top:-30px; left:-30px;}
div.con0201-box02 span.tit:before{content: ""; width: 100%; height: 3px; background: #09aabd; position: absolute; bottom:0px; left: 0;}
div.con0201-box02 ul.link-ico{display: flex; justify-content: space-between;}
div.con0201-box02 ul.link-ico li{width: 20%; transition: 0.5s ease-in-out;}
div.con0201-box02 ul.link-ico li img{display: block; margin: 0 auto; transition: 0.5s ease-in-out;}
div.con0201-box02 ul.link-ico li span.ico-tit{font-family: 'NexonR'; font-size:1.125em; color: #000000; text-align: center; display: block; padding: 15px 0 0 0;}

@media all and (max-width:1000px){
  div.con0201-box01 span.tit{top:0px; left: 0px;}
  div.con0201-box02 span.tit{top:0px; left: 0px;}

}


@media all and (max-width:768px){
  div.con0201-box01{padding:80px 20px 40px 20px; }
  div.con0201-box02{padding:80px 20px 40px 20px; }
  div.con0201-box01 span.tit{padding: 15px 0; font-size:1.175em;}
  div.con0201-box02 span.tit{padding: 15px 0; font-size:1.175em;}
  div.con0201-box02 ul.link-ico li img{width: 75px;}
  div.con0201-box02 ul.link-ico li span.ico-tit{font-size:1.000em;}
}

@media all and (max-width:680px){
  div.con0201-box02 ul.link-ico{flex-flow: wrap; justify-content: center;}
  div.con0201-box02 ul.link-ico li{width: 48%; margin-bottom: 30px;}
  div.con0201-box02 ul.link-ico li img{width: 65px;}
  div.con0201-box02 ul.link-ico li span.ico-tit{font-size:0.950em;}
  div.con0201-box02 ul.link-ico li span.ico-tit br{display: none;}
}

@media all and (max-width:480px){
  div.con0201-box01 span.tit{padding: 10px 0; font-size:1.000em;}
  div.con0201-box02 span.tit{padding: 10px 0; font-size:1.000em;}
  div.con0201-box02 ul.link-ico li span.ico-tit{font-size:0.850em;}
}



/*con0202*/
.purpose-strategy{border:1px solid #e1e1e1; padding: 60px 30px;}
.purpose-strategy .tit{position:absolute; top:-30px; left:-30px; width: 162px; padding:20px 0px; background:#005bac; color:#fff; font-family:'NexonB'; font-size:1.375em; text-align:center;}
.purpose-strategy .purpose{position:relative; padding:60px 70px 60px 170px;}
.purpose-strategy .purpose .icon-btxt{overflow:hidden;}
.purpose-strategy .purpose .icon-btxt li{width:18%; margin:0px 1%; text-align:center; float:left;}
.purpose-strategy .purpose .icon-btxt li:before{width:100px; height:100px; margin-bottom:15px; border-radius:50%; display:inline-block; background:#f7f7f7; content:"";}
.purpose-strategy .purpose .icon-btxt li.econo:before{background: url("/images/Head/contents/02/purpose-icon-econo.png") center no-repeat #f7f7f7;}
.purpose-strategy .purpose .icon-btxt li.welfa:before{background: url("/images/Head/contents/02/purpose-icon-welfa.png") center no-repeat #f7f7f7;}
.purpose-strategy .purpose .icon-btxt li.farmi:before{background: url("/images/Head/contents/02/purpose-icon-farmi.png") center no-repeat #f7f7f7;}
.purpose-strategy .purpose .icon-btxt li.cultu:before{background: url("/images/Head/contents/02/purpose-icon-cultu.png") center no-repeat #f7f7f7;}
.purpose-strategy .purpose .icon-btxt li.admin:before{background: url("/images/Head/contents/02/purpose-icon-admin.png") center no-repeat #f7f7f7;}
.purpose-strategy .purpose .icon-btxt li .btxt{display:block; font-size:1.125em; font-family: 'NexonR'; color:#111; line-height:140%;}

.purpose-strategy .strategy{position:relative; padding:100px 70px 60px 170px;}
.purpose-strategy .strategy .btxts{}
.purpose-strategy .strategy .btxts:after{clear:both; content:""; display:block;}
.purpose-strategy .strategy .btxts li{position:relative; width:18%; margin:0px 1%; text-align:center; float:left;}
.purpose-strategy .strategy .btxts li:before{position:absolute; top:-150px; left:50%; width:1px; height:150px; background:#dfdfdf; display:block; content:""; z-index:-1;}
.purpose-strategy .strategy .btxts li .btxt{padding:10px 5px; background:#444756; font-size:0.938em; color:#fff; margin-bottom:10px; line-height:160%; border-radius: 80px; font-family:'NotoKrR';}
.purpose-strategy .strategy .btxts li:first-child .btxt{background: #3ea69b;}
.purpose-strategy .strategy .btxts li:nth-child(2) .btxt{background: #27a2db;}
.purpose-strategy .strategy .btxts li:nth-child(3) .btxt{background: #dc8744;}
.purpose-strategy .strategy .btxts li:nth-child(4) .btxt{background: #909090;}
.purpose-strategy .strategy .btxts li:nth-child(5) .btxt{background: #e56353;}

.purpose-strategy .strategy h4.cont-title.h4-pos{position: absolute; top:40px; left:0;}


.purpose-strategy .strategy .btxts li .btxt:last-child{margin-bottom:0px;}

    @media all and (max-width:1000px){
        .purpose-strategy .tit{top:0px; left: 0px;}
        .purpose-strategy .purpose{position:relative; padding:60px 70px 40px 170px;}
        .purpose-strategy .purpose .icon-btxt li:before{width:80px; height:80px; margin-bottom:0px; }
        .purpose-strategy .purpose .icon-btxt li.econo:before{background-size:40px;}
        .purpose-strategy .purpose .icon-btxt li.welfa:before{background-size:35px;}
        .purpose-strategy .purpose .icon-btxt li.farmi:before{background-size:35px;}
        .purpose-strategy .purpose .icon-btxt li.cultu:before{background-size:40px;}
        .purpose-strategy .purpose .icon-btxt li.admin:before{background-size:35px;}
        .purpose-strategy .purpose .icon-btxt li .btxt{font-size:0.8em;}

        .purpose-strategy .strategy{position:relative; padding:80px 70px 40px 170px;}
        .purpose-strategy .strategy .btxts li:before{top:-110px; height:110px;}
        .purpose-strategy .strategy .btxts li .btxt{padding:10px 5px; font-size:0.7em;}
    }


    @media all and (max-width:768px){
        .purpose-strategy .tit{padding: 15px 0; font-size:1.175em;}
    }

    @media all and (max-width:680px){
        .purpose-strategy .purpose{position:relative; padding:80px 10px 30px 10px;}
        .purpose-strategy .strategy{position:relative; padding:100px 10px 30px 10px;}

    .purpose-strategy .strategy h4.cont-title.h4-pos{top:-35px;}
    }

    @media all and (max-width:480px){
        .purpose-strategy .tit{padding: 10px 0; font-size:1.000em;}

        .purpose-strategy .purpose{position:relative; padding:60px 5px 20px 5px;}
        .purpose-strategy .purpose .icon-btxt li:before{width:50px; height:50px;}
        .purpose-strategy .purpose .icon-btxt li.econo:before{background-size:30px;}
        .purpose-strategy .purpose .icon-btxt li.welfa:before{background-size:25px;}
        .purpose-strategy .purpose .icon-btxt li.farmi:before{background-size:25px;}
        .purpose-strategy .purpose .icon-btxt li.cultu:before{background-size:30px;}
        .purpose-strategy .purpose .icon-btxt li.admin:before{background-size:25px;}

        .purpose-strategy .strategy{position:relative; padding:70px 5px 20px 5px;}
        .purpose-strategy .strategy .btxts li:before{top:-70px; height:70px;}
        .purpose-strategy .strategy .btxts li .btxt{padding:5px 3px; font-size:0.6em; margin-bottom:5px;}
        .purpose-strategy .strategy .btxts li .btxt br{display:none;}
    }

/*군수실 인사말*/
ul.head-introduce-box{display: flex; justify-content: flex-start;}
ul.head-introduce-box li:first-child{width: 35%;}
ul.head-introduce-box li:first-child img{max-width: 100%;}
ul.head-introduce-box li:last-child{width: 50%; padding: 50px 0 0 30px;}
ul.head-introduce-box li:last-child span{font-family: 'NanumMyeongjoB'; line-height: 135%; display: block;}
ul.head-introduce-box li:last-child span.tit{  font-size:2.000em; }
ul.head-introduce-box li:last-child span.tit i{font-style: inherit; color: #005bac;}
ul.head-introduce-box li:last-child span.tit i.name-c{color: #000000;}
ul.head-introduce-box li:last-child span.txt{padding: 30px 0 0 0; font-size:1.1em; font-family:'NexonR'; color:#000}
ul.head-introduce-box li:last-child span.named{font-size:1.500em; color: #333; padding: 30px 115px 0 0; position: relative; display: inline-block;}
ul.head-introduce-box li:last-child span.named:after{content: ""; width: 100px; height: 187px; display: inline-block; background: url("/images/Head/contents/01/back_sign.png") no-repeat; position: absolute; top:13px; right:0; background-size:100px;}


@media all and (max-width:680px){
  ul.head-introduce-box{flex-flow: wrap;}
  ul.head-introduce-box li:first-child{width: 100%;}
  ul.head-introduce-box li:last-child{width: 100%; padding: 30px 0 0 0px;}
  ul.head-introduce-box li:first-child img{display:block; margin:0 auto;}
  ul.head-introduce-box li:last-child span.tit{font-size:1.400em;}
  ul.head-introduce-box li:last-child span.txt{font-size:0.95em;padding: 20px 0 0 0;}
  ul.head-introduce-box li:last-child span.named{font-size:1.400em; padding: 30px 100px 0 0;}
  ul.head-introduce-box li:last-child span.named:after{width: 80px; background-size:80px; top:20px;}
  
}

@media all and (max-width:480px){
  ul.head-introduce-box li:last-child span.txt br{display: none;}
}

/*공약관리체계*/
div.box-0302{width: 100%; height: 1093px; background: url("/images/Head/contents/04/0302-img01.png") no-repeat center; position: relative; overflow: hidden;}
div.box-0302 h5.tit{font-family: 'GyeonggiTitleM'; font-size:2.000em; color: #333; text-align: center; padding: 80px 0 0 0;}
div.box-0302 ul.list{margin: 100px 0 0 0; height: 100%; position: relative; }
div.box-0302 ul.list:after{content: ""; width: 1px; height: 75%; background: #cdcdcd; position: absolute; top:0; left:50%; transform: translate(-50%, 0);}
div.box-0302 ul.list li{ position: relative; width: 90px; display: block; margin: 0 auto; padding-bottom: 100px; }
div.box-0302 ul.list li:after{content: ""; width: 18px; height: 10px; background: url("/images/Head/contents/04/0302-img02.png") no-repeat; position: absolute; bottom:40px; left:50%; transform: translate(-50%, 0); z-index: 1;}
div.box-0302 ul.list li:last-child:after{content: none;}


div.box-0302 ul.list li span.process-num{width: 90px; height: 90px; background: #02ba74; border-radius: 50%;  text-align: center; display: block; box-shadow: 3px 3px 0px #e3e3e3; position: relative; z-index: 10;}
div.box-0302 ul.list li span.process-num i{font-family: 'NexonB'; font-style: inherit; color: #fff; font-size:1.200em; display: block; padding-top: 35px;}
div.box-0302 ul.list li div.txt-box{width:342px; border:solid 1px #02ba74; border-radius: 20px; padding: 20px 20px; margin-left: 30px; box-sizing: border-box; position: absolute; top:0; right:-376px;}
div.box-0302 ul.list li div.txt-box h6.box-tit{font-family: 'NexonB'; font-size:1.250em; color: #02ba74; padding-bottom: 10px;}
div.box-0302 ul.list li div.txt-box span.list-txt{font-family: 'NotoKrR';  font-size:0.938em; display: block; position: relative; padding: 0 0 5px 15px;}
div.box-0302 ul.list li div.txt-box span.list-txt b{font-family: 'NotoKrB'; color: #333333;}
div.box-0302 ul.list li div.txt-box span.list-txt:last-child{padding-bottom: 0px;}
div.box-0302 ul.list li div.txt-box span.list-txt:before{content: ""; width: 8px; height: 2px; background: #333; position: absolute; top:10px; left:0;}
div.box-0302 ul.list li:nth-child(2) div.txt-box{left: -400px;}
div.box-0302 ul.list li:nth-child(4) div.txt-box{left: -400px;}
div.box-0302 ul.list li:nth-child(2) span.process-num{background: #09abc8;}
div.box-0302 ul.list li:nth-child(2) div.txt-box{border:solid 1px #09abc8;}
div.box-0302 ul.list li:nth-child(2) div.txt-box h6.box-tit{color: #09abc8;}

div.box-0302 ul.list li:nth-child(3) span.process-num{background: #3277be;}
div.box-0302 ul.list li:nth-child(3) div.txt-box{border:solid 1px #3277be;}
div.box-0302 ul.list li:nth-child(3) div.txt-box h6.box-tit{color: #3277be;}

div.box-0302 ul.list li:nth-child(4) span.process-num{background: #20457b;}
div.box-0302 ul.list li:nth-child(4) div.txt-box{border:solid 1px #20457b;}
div.box-0302 ul.list li:nth-child(4) div.txt-box h6.box-tit{color: #20457b;}

div.box-0302 ul.list li:nth-child(5) span.process-num{background: #2f2d33;}
div.box-0302 ul.list li:nth-child(5) div.txt-box{border:solid 1px #2f2d33;}
div.box-0302 ul.list li:nth-child(5) div.txt-box h6.box-tit{color: #2f2d33;}

@media all and (max-width:1000px){
  div.box-0302{height:auto; background-image: none; border:solid 1px #e1e1e1; padding: 0 20px; box-sizing: border-box; overflow: inherit;}
  div.box-0302 h5.tit{font-size:1.700em;}
  div.box-0302 ul.list:after{height: 90%;}
  div.box-0302 ul.list li{width: 100%;}
  div.box-0302 ul.list li span.process-num{margin: 0 auto;}
  div.box-0302 ul.list li div.txt-box{position: relative; right:auto; width: 400px; margin: 0 auto; margin-top: 20px; z-index: 1; background: #fff;}
  div.box-0302 ul.list li:nth-child(2) div.txt-box{left: auto;}
  div.box-0302 ul.list li:nth-child(4) div.txt-box{left: auto;}

  div.box-0302 ul.list{margin: 50px 0 0 0;}
  div.box-0302 h5.tit{padding: 40px 0 0 0;}
  div.box-0302 ul.list li span.process-num{width: 70px; height: 70px;}
  div.box-0302 ul.list li span.process-num i{font-size:1.000em; padding-top: 23px;}
  div.box-0302 ul.list li div.txt-box h6.box-tit{font-size:1.100em; padding-bottom: 5px;}
}

@media all and (max-width:480px){
  div.box-0302 ul.list li div.txt-box{width: 100%;}

}

/*공약사업 총괄현황*/
div.box-0303{width: 100%; height: auto; border:solid 1px #e1e1e1; background: url("/images/Head/contents/04/0303-img01.png"); background-size: 100%; padding: 80px 80px; box-sizing: border-box; transition: 0.5s ease-in-out;}
div.top-grapth{display: flex; justify-content: space-between; transition: 0.5s ease-in-out;}
div.top-grapth h5.tit{width:16%; font-family: 'GyeonggiTitleM'; font-size:3.000em; line-height: 130%; padding: 120px 0 0 0;}
div.top-grapth h5.tit span.c-mint{color: #00a8e6; display: block;}
div.top-grapth div.img{width: 411px; height: 416px; background: url("/images/Head/contents/04/0303-img02.png") no-repeat center; transition: 0.5s ease-in-out;}
div.top-grapth ul.list-grapth{width: 35%; padding-top: 80px;}
div.top-grapth ul.list-grapth li{width: 100%; padding: 12px 0px 12px 240px; box-sizing: border-box; border-radius: 30px;
  background: linear-gradient(180deg, rgba(238,238,238,1) 0%, rgba(255,255,255,1) 30%); box-shadow: 4px 5px 0px #e3e3e3; margin-bottom: 30px; position: relative;}
div.top-grapth ul.list-grapth li:before{content: "완료"; width: 57%; height: 100%; border-radius: 30px 0 0px 30px; background: #54515d; color: #fff; font-family: 'NexonB'; font-size:1.1em; padding: 0px 0 0px 20px; line-height: 50px; position: absolute; top:0; left:0;}
div.top-grapth ul.list-grapth li:nth-child(2){padding: 12px 0px 12px 95px;}
div.top-grapth ul.list-grapth li:nth-child(2):before{content: "진행중"; width: 17%; background: #1977bc;}
div.top-grapth ul.list-grapth li:nth-child(2) span.num{color: #1977bc;}

div.top-grapth ul.list-grapth li:nth-child(3){padding: 12px 0px 12px 77px;}
div.top-grapth ul.list-grapth li:nth-child(3):before{content: "불가"; width: 12%; background: #e56243;}
div.top-grapth ul.list-grapth li:nth-child(3) span.num{color: #e56243;}

div.top-grapth ul.list-grapth li span.num{font-family: 'NotoKrB'; font-size:1.500em; color: #54515d;}
div.top-grapth ul.list-grapth li span.num i{font-family: 'NotoKrR'; font-style: inherit; font-size:0.700em; color: #333333; display: inline-block;}

div.bottom-grapth{margin-top:30px; padding: 50px 50px; box-sizing: border-box; border:solid 1px #dbdbdb; transition: 0.5s ease-in-out;}
div.bottom-grapth li{display: flex; justify-content: space-between; margin-bottom: 50px; transition: 0.5s ease-in-out;}
div.bottom-grapth li:last-child{margin-bottom: 0px;}
div.bottom-grapth li h6.tit{width: 23%; font-family: 'NexonB'; font-size:1.200em; padding: 7px 0 0 80px; position: relative;color:#111;}
div.bottom-grapth li h6.tit:before{content: ""; width: 62px; height: 62px; background: url("/images/Head/contents/04/0303-img03.png") no-repeat; position: absolute; top:0; left:0;}
div.bottom-grapth li:nth-child(2) h6.tit:before{background: url("/images/Head/contents/04/0303-img04.png") no-repeat;}
div.bottom-grapth li:nth-child(3) h6.tit:before{background: url("/images/Head/contents/04/0303-img05.png") no-repeat;}
div.bottom-grapth li:nth-child(4) h6.tit:before{background: url("/images/Head/contents/04/0303-img06.png") no-repeat;}
div.bottom-grapth li:nth-child(5) h6.tit:before{background: url("/images/Head/contents/04/0303-img07.png") no-repeat;}
div.bottom-grapth li:nth-child(6) h6.tit:before{background: url("/images/Head/contents/04/0303-img08.png") no-repeat;}
div.bottom-grapth li:nth-child(7) h6.tit:before{background: url("/images/Head/contents/04/0303-img09.png") no-repeat;}



div.bottom-grapth li h6.tit span.sub-tit{display: block; font-family: 'NotoKrR'; font-size:0.800em; color: #666666;}
div.bottom-grapth li div.grapth{width: 75%; height: 15px; margin-top: 8px; background: linear-gradient(180deg, rgba(223,223,223,1) 0%, rgba(240,240,240,1) 35%); padding: 12px 0; position: relative;}
div.bottom-grapth li div.grapth:before{content: "75%"; width: 75%;  height: 100%; background: #70b501; position: absolute;
  top:0; left:0; color: #fff; font-family: 'NotoKrb'; font-size:1.200em; text-align: right; line-height: 37px; padding-right: 20px; box-sizing: border-box; }
div.bottom-grapth li:nth-child(2) div.grapth:before{content: "83%"; width:83%; background: #09abc8; }
div.bottom-grapth li:nth-child(3) div.grapth:before{content: "43%"; width:43%; background: #3277be; }
div.bottom-grapth li:nth-child(4) div.grapth:before{content: "50%"; width:50%; background: #e7a649; }
div.bottom-grapth li:nth-child(5) div.grapth:before{content: "100%"; width:100%; background: #54515d; }
div.bottom-grapth li:nth-child(6) div.grapth:before{content: "100%"; width:100%; background: #54515d; }
div.bottom-grapth li:nth-child(7) div.grapth:before{content: "94%"; width:94%; background: #6cca72; }

@media all and (max-width:1600px){
  div.box-0303{padding: 50px 30px;}
  div.top-grapth div.img{background-size: 280px;}
  div.top-grapth h5.tit{font-size:2.500em; padding: 155px 0 0 0;}

  div.bottom-grapth li div.grapth{width: 60%;}
}

@media all and (max-width:1400px){
  div.top-grapth h5.tit{width:22%; font-size:2.200em;}
  div.top-grapth div.img{background-size: 250px;}
  div.top-grapth ul.list-grapth li{padding: 12px 0 12px 180px;}
}

@media all and (max-width:1200px){
  div.top-grapth ul.list-grapth li{padding: 12px 0 12px 150px;}
  div.top-grapth ul.list-grapth li span.num{font-size:1.300em;}
}

@media all and (max-width:1000px){
  div.top-grapth{flex-flow: wrap;}
  div.top-grapth h5.tit{width: 100%; padding: 0px 0 0 0;}
  div.top-grapth div.img{width: 240px; background-size: 240px;}
  div.top-grapth ul.list-grapth{width: 50%; padding-top: 100px;}
  div.top-grapth ul.list-grapth li{padding: 12px 0 12px 229px;}

}

@media all and (max-width:680px){
  div.box-0303{padding: 20px 20px;}
  div.top-grapth h5.tit{font-size:2.000em;}
  div.top-grapth div.img{width: 100%; background-size: 180px; height: 245px;}
  div.top-grapth ul.list-grapth{width: 100%; padding-top: 0px;}
  div.top-grapth ul.list-grapth li{padding: 5px 0 5px 0px;}
  div.top-grapth ul.list-grapth li:nth-child(2){padding: 5px 0px 5px 0px; }
  div.top-grapth ul.list-grapth li:nth-child(3){padding: 5px 0px 5px 0px;}
  div.top-grapth ul.list-grapth li span.num{font-size:1.100em; display: block; text-align: right; padding-right: 20px;}
  div.top-grapth ul.list-grapth li:before{font-size:0.838em; line-height: 35px;}

  div.bottom-grapth{padding: 20px 20px;}
  div.bottom-grapth li{flex-flow: wrap;}
  div.bottom-grapth li h6.tit{width: 100%; font-size:1.000em; padding: 5px 0 0 60px;}
  div.bottom-grapth li h6.tit:before{background-size: 50px;}
  div.bottom-grapth li:nth-child(2) h6.tit:before{background-size: 50px;}
  div.bottom-grapth li:nth-child(3) h6.tit:before{background-size: 50px;}
  div.bottom-grapth li:nth-child(4) h6.tit:before{background-size: 50px;}
  div.bottom-grapth li:nth-child(5) h6.tit:before{background-size: 50px;}
  div.bottom-grapth li:nth-child(6) h6.tit:before{background-size: 50px;}
  div.bottom-grapth li:nth-child(7) h6.tit:before{background-size: 50px;}
  div.bottom-grapth li div.grapth{width: 100%; height: 5px; margin-top: 20px;}
  div.bottom-grapth li div.grapth:before{line-height: 29px; font-size:0.938em;}
}

/*매니페스토*/
div.box-0304{width: 100%; height: 869px; background: url("/images/Head/contents/04/0304-img01.png") no-repeat center; background-size: 100%; padding: 50px 50px; box-sizing: border-box;}
div.box-0304 div.tit img{display: block; margin: 0 auto; padding: 50px 0 50px 0;}
div.box-0304 p.txt-tit{font-family: 'NotoKrb'; font-size:1.200em; color: #005bac; text-align: center;}
div.box-0304 p.txt-con{font-family: 'NotoKrL';font-size:1.140em; color: #555555; padding: 30px 0 0 0; text-align: center; line-height: 170%;}
div.box-0304 a.link-btn-wrap{width: 300px; border:solid 1px #333333; padding: 10px 10px; box-sizing: border-box; display: block; margin: 0 auto; margin-top: 50px; display: flex; justify-content: center;box-shadow:6px 6px 0px #e5e5e5;}
div.box-0304 a.link-btn-wrap span.txt{font-family: 'NotoKrb'; font-size:1.000em; color: #000000; display: block; padding: 15px 20px 0 0; position: relative;}
div.box-0304 a.link-btn-wrap span.txt:after{content: ""; width: 1px; height: 14px; background: #545454; position: absolute; top:19px; right:0;}
div.box-0304 a.link-btn-wrap img{padding: 0 0 0 20px;}

@media all and (max-width:1600px){
  div.box-0304{background-image: none; border:solid 10px #24b880; padding: 30px 30px; height: auto; }
}
@media all and (max-width:1000px){
  div.box-0304 div.tit img{padding: 30px 0 30px 0; max-width: 100%;}
}

@media all and (max-width:680px){
  div.box-0304{border:solid 5px #24b880; }
  div.box-0304 div.tit img{width: 210px; padding: 0px 0 20px 0;}
  div.box-0304 a.link-btn-wrap{width: 100%;}
  div.box-0304 a.link-btn-wrap{padding: 5px 5px;}
  div.box-0304 a.link-btn-wrap img{width: 120px;}
  div.box-0304 a.link-btn-wrap span.txt{font-size:0.938em; padding: 8px 20px 0 0;}
  div.box-0304 a.link-btn-wrap span.txt:after{top:13px;}
  div.box-0304 p.txt-con br{display: none;}
}

/*주민참여와 소통*/
div.box-0305{width: 100%; padding: 30px 30px; box-sizing: border-box; background: #f5f5f5; transition: 0.5s ease-in-out;}
div.box-0305 div.tit-img img{display: block; margin: 0 auto;}
div.box-0305 p.top-txt{font-family: 'NexonB'; font-size:1.500em; text-align: center; line-height: 160%; padding: 30px 0 0 0; color: #000000;}
div.box-0305 p.top-txt span.c-01{color: #005bac;}
div.box-0305 p.top-txt span.c-02{color: #1ca65a;}
div.box-list{display: flex; justify-content: flex-start; padding: 50px 0 0 0; transition: 0.5s ease-in-out;}
div.box-list div.comm{width: 33.333%; height: 351px; overflow: hidden; border-right: solid 1px #e6e6e6; border-bottom:solid 1px #e6e6e6;}
div.box-list div.comm h5.box-tit{width:100%; padding: 15px 0; background: #005bac; color: #fff; text-align: center; font-family: 'NexonB'; font-size:1.200em;}
div.box-list div.comm.box03 h5.box-tit{border-right: none;}
div.box-list div.comm.box01{border-left:solid 1px #e6e6e6;}
div.box-list div.comm div.con{padding: 40px 40px; box-sizing: border-box; background: #fff; height: 100%;}

div.box-list div.comm ul.list{transition: 0.5s ease-in-out;}
div.box-list div.comm ul.list li{width: 100%; margin-bottom: 20px; transition: 0.5s ease-in-out;}
div.box-list div.comm ul.list li a{width: 200px; display: block; padding: 15px 10px 15px 60px; box-sizing: border-box;
  background: #f5f5f5; box-shadow: 3px 3px 0px #e5e5e5; border-radius: 30px; margin: 0 auto; font-family: 'NotoKrM'; font-size:1.000em; color: #111111; position: relative; transition: 0.5s ease-in-out;}
div.box-list div.comm ul.list li a:before{content: ""; width: 37px; height: 37px; background: url("/images/Head/contents/04/0305-img02.png") no-repeat center; position: absolute; top:8px; left:11px;}
div.box-list div.comm.box01 ul.list li:nth-child(2) a:before{background: url("/images/Head/contents/04/0305-img03.png") no-repeat center;}
div.box-list div.comm.box01 ul.list li:nth-child(3) a:before{background: url("/images/Head/contents/04/0305-img04.png") no-repeat center;}

div.box-list div.comm.box02 ul.list{display: flex; justify-content: space-between; flex-flow: wrap;}
div.box-list div.comm.box02 ul.list li{width: 48%;}
div.box-list div.comm.box02 ul.list li a{width: auto;}
div.box-list div.comm.box02 ul.list li:first-child a:before{background: url("/images/Head/contents/04/0305-img05.png") no-repeat center;}
div.box-list div.comm.box02 ul.list li:nth-child(2) a:before{background: url("/images/Head/contents/04/0305-img06.png") no-repeat center;}
div.box-list div.comm.box02 ul.list li:nth-child(3) a:before{background: url("/images/Head/contents/04/0305-img08.png") no-repeat center;}
div.box-list div.comm.box02 ul.list li:nth-child(4) a:before{background: url("/images/Head/contents/04/0305-img07.png") no-repeat center;}
div.box-list div.comm.box02 ul.list li:nth-child(5) a:before{background: url("/images/Head/contents/04/0305-img09.png") no-repeat center;}
div.box-list div.comm.box02 h5.box-tit{background: #444756;}
div.box-list div.comm.box03 h5.box-tit{background: #1ca65a;}
div.box-list div.comm.box03 ul.list li:first-child a:before{background: url("/images/Head/contents/04/0305-img10.png") no-repeat center;}

@media all and (max-width:1600px){
  div.box-list div.comm{height: 405px;}
  div.box-list div.comm div.con{padding: 20px 20px;}
  div.box-list div.comm ul.list li a{width: auto;}
  div.box-list div.comm.box02 ul.list{flex-flow: wrap;}
  div.box-list div.comm.box02 ul.list li{width: 100%; margin-bottom: 10px;}
}

@media all and (max-width:680px){
  div.box-0305 div.tit-img img{width: 65px;}
  div.box-0305 p.top-txt{font-size:1.200em;}
  div.box-0305 p.top-txt br{display: none;}
  div.box-0305{padding: 20px 20px;}
  div.box-list{flex-flow: wrap; padding: 30px 0 0 0;}
  div.box-list div.comm{width: 100%; height: auto;}
  div.box-list div.comm h5.box-tit{padding: 7px 0; font-size:1.100em;}

  div.box-list div.comm ul.list li a{padding:10px 10px 10px 55px; }
  div.box-list div.comm ul.list li a:before{background-size: 30px; top:4px;}
  div.box-list div.comm.box01 ul.list li:nth-child(2) a:before{background-size: 30px;}
  div.box-list div.comm.box01 ul.list li:nth-child(3) a:before{background-size: 30px;}

  div.box-list div.comm.box02 ul.list li:first-child a:before{background-size: 30px;}
  div.box-list div.comm.box02 ul.list li:nth-child(2) a:before{background-size: 30px;}
  div.box-list div.comm.box02 ul.list li:nth-child(3) a:before{background-size: 30px;}
  div.box-list div.comm.box02 ul.list li:nth-child(4) a:before{background-size: 30px;}
  div.box-list div.comm.box02 ul.list li:nth-child(5) a:before{background-size: 30px;}

  div.box-list div.comm.box03 ul.list li:first-child a:before{background-size: 30px;}

}

/*공약지도*/
div.box-0306 h5.top-tit{width: 100%; height: 91px; background: url("/images/Head/contents/04/0306-img01.png") no-repeat center; font-family: 'GyeonggiTitleM'; font-size:2.300em; color: #fff; text-align: center;}
div.box-0306 h5.top-tit span{display: block; padding: 35px 0 0 0;}
div.box-0306 div.map-box{width: 100%; height: 508px; background: url("/images/Head/contents/04/0306-img03.png") center #f7f7f7; background-size: 100%;}
div.box-0306 div.map-box img{display: block; margin: 0 auto; padding-top: 45px; max-width:100%;}

div.box-0306 div.map-list{display: flex; justify-content: space-between; flex-flow: wrap; margin-top: 70px;}
div.box-0306 div.map-list div.comm{width: 47%; margin-bottom: 40px;}
div.box-0306 div.map-list div.comm h6.tit{font-family: 'NexonB'; font-size:1.438em; color: #000000; padding-bottom: 20px; border-bottom:solid 1px #5cb2fe; margin-bottom: 20px; line-height: 130%;}
div.box-0306 div.map-list div.comm h6.tit span.num{color: #005bac;}
div.box-0306 div.map-list div.comm h6.tit span.c-01{color: #005bac;}
div.box-0306 div.map-list div.comm ul.list{padding: 0 20px; box-sizing: border-box;}
div.box-0306 div.map-list div.comm ul.list li{display: flex; justify-content: flex-start; padding-bottom: 10px;}
div.box-0306 div.map-list div.comm ul.list li:last-child{padding-bottom: 0px;}
div.box-0306 div.map-list div.comm ul.list li span{display: inline-block;}
div.box-0306 div.map-list div.comm ul.list li span.area{width: 80px;  background: #333; padding: 2px 15px; box-sizing: border-box; border-radius: 30px; font-family: 'NotoKrM'; font-size:0.875em; text-align: center; color: #fff; margin-right: 15px; height: 28px; }
div.box-0306 div.map-list div.comm ul.list li span.area.donghae{background: #347c89;}
div.box-0306 div.map-list div.comm ul.list li span.area.haehwa{background: #825045;}
div.box-0306 div.map-list div.comm ul.list li span.area.guman{background: #825045;}
div.box-0306 div.map-list div.comm ul.list li span.area.maam{background: #08aa99;}
div.box-0306 div.map-list div.comm ul.list li span.area.gaecheon{background: #f16c49;}
div.box-0306 div.map-list div.comm ul.list li span.area.daega{background: #4b3535;}
div.box-0306 div.map-list div.comm ul.list li span.area.yeongoh{background: #c545c7;}
div.box-0306 div.map-list div.comm ul.list li span.area.yeonghyun{background: #64b406;}
div.box-0306 div.map-list div.comm ul.list li span.area.sangre{background: #e62b72;}
div.box-0306 div.map-list div.comm ul.list li span.area.hi{background: #1b4dbf;}
div.box-0306 div.map-list div.comm ul.list li span.area.hiil{background: #269526;}
div.box-0306 div.map-list div.comm ul.list li span.area.samsan{background: #b64040;}
div.box-0306 div.map-list div.comm ul.list li span.area.goseong{background: #662ee5;}
div.box-0306 div.map-list div.comm ul.list li span.area.georyu{background: #b68900;}
div.box-0306 div.map-list div.comm ul.list li span.infor{width:85%; font-family: 'NotoKrR'; font-size:1.000em; color: #333333;}
div.box-0306 div.map-list div.comm ul.list li span.infor.ht-st{padding-top: 25px;}
div.box-0306 div.map-list div.comm ul.list li span.area.ht-st{width:80px; height: 75px; border-radius: 20px; padding: 2px 5px;}
div.box-0306 div.map-list div.comm ul.list li span.infor.ht-st02{padding-top: 13px;}
div.box-0306 div.map-list div.comm ul.list li span.area.ht-st02{width:80px; height: 50px; border-radius: 20px; padding: 2px 5px;}
div.box-0306 div.map-list div.comm ul.list li span.infor.ht-st06{padding-top: 55px;}
div.box-0306 div.map-list div.comm ul.list li span.area.ht-st06{width:80px; height: 140px; border-radius: 20px; padding: 2px 5px;}


@media all and (max-width:680px){
  div.box-0306 div.map-box{height: auto;}
  div.box-0306 div.map-box img{padding: 20px 0;}
  div.box-0306 div.map-list div.comm{width: 100%;}
  div.box-0306 h5.top-tit{font-size:1.800em; height: 60px;}
  div.box-0306 h5.top-tit span{padding: 20px 0 0 0;}
  div.box-0306 div.map-list{margin-top: 30px;}
  div.box-0306 div.map-list div.comm h6.tit{font-size:1.200em;}
  div.box-0306 div.map-list div.comm ul.list li span.area{padding: 0px 7px; font-size:0.800em; margin-right: 10px;}
  div.box-0306 div.map-list div.comm ul.list li span.infor{font-size:0.938em;}

  div.box-0306 div.map-list div.comm ul.list li span.area.ht-st{width: 80px; padding: 2px 7px;}
  div.box-0306 div.map-list div.comm ul.list li span.area.ht-st02{width: 80px; padding: 2px 7px;}
  div.box-0306 div.map-list div.comm ul.list li span.area.ht-st06{width: 80px; padding: 2px 7px;}
}