@charset "utf-8";

.txt_hidden{position:absolute;top:-9999em;left:0;user-select:none;font-size:1rem;}
.txt_indent { text-indent:-99999px;}
.center.mar_5{display:block;margin:0 auto;margin-right:-5px;}


/*인사말*/
.greeting_box{background:#f7fafc;padding: 80px 60px;position: relative; overflow:hidden;}
.greeting_box .top_tit{text-align:center;margin-bottom: 60px;}
.greeting_box .top_tit .logo{background:url("/contents/19310/mp_logo.png")no-repeat;width: 94px;height: 42px;text-indent:-999em;position: absolute;right: 30px;top: 30px;}
.greeting_box .top_tit .t01{font-size:40px;margin-bottom: 25px;}
.greeting_box .top_tit .t01:before{content:'“';font-size: 90px;margin-right: 20px;height: 50px;display: inline-block;vertical-align: middle;}
.greeting_box .top_tit .t01:after{content:'”';font-size: 90px;margin-left: 20px;display: inline-block;vertical-align: middle;height: 50px;}
.greeting_box .top_tit .t01 > b{font-weight:400;}
.greeting_box .top_tit .t02{font-size:22px; }
.greeting_box .btm_txt > div{float:left;}
.greeting_box .btm_txt > div.left{width: 42.5%;position: relative;z-index: 1;}
.greeting_box .btm_txt > div.left .photo{position:relative;}
.greeting_box .btm_txt > div.left .photo img{border-radius:30px;box-shadow: 5px 15px 20px rgba(23, 64, 105, 0.3); width: 100%; height: auto;}
.greeting_box .btm_txt > div.left .photo .ph_name{position:absolute;bottom:0;left:0;background: #046fd9;background: -moz-linear-gradient(135deg, #116cb1 10%, #1fcc8d 95%);background: -webkit-linear-gradient(135deg, #116cb1 10%, #1fcc8d 95%);background: linear-gradient(135deg, #116cb1 10%, #1fcc8d 95%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#116cb1', endColorstr='#1fcc8d',GradientType=1 );opacity: 0.95;width: 290px;height: 76px;color: #fff;box-sizing: border-box;text-align: center;padding: 23px 0 0 0;border-radius: 0 50px 0 0;}
.greeting_box .btm_txt > div.left .photo .ph_name:before { content: ''; display: inline-block; width: 38px; height: 20px; background: url("/contents/19310/symbol_w.png") no-repeat; vertical-align: middle; margin-right: 6px;}

.greeting_box .btm_txt > div.left .photo .ph_name > span{display: inline-block;text-indent:-999em;width:76px;height: 32px;background:url("/contents/19310/sign_name.png") no-repeat;vertical-align: middle;margin: 0 0 0 15px;}
.greeting_box .btm_txt > div.right{width: 52.5%;margin-left: 5%;position: relative;z-index: 0;}
.greeting_box .btm_txt > div.right:before{content:'MOKPO CITY';font-size: 85px;color: #e8f2f9;font-weight: bold;position: absolute;left: -15%;bottom: -81px;width: 664px;z-index: -1;-webkit-text-stroke: 3px #e8f2f9;-webkit-text-fill-color: #f7fafc;}
.greeting_box .btm_txt > div.right:after{content:'GREETING';font-size: 95px;color: #e8f2f9;font-weight: bold;position: absolute;right: -60px;bottom: -165px;z-index: 0;}
.greeting_box .btm_txt > div.right p.basic:first-child{margin-top:20px;}
.greeting_box .btm_txt > div.right p.basic{margin-top: 25px;}

/*컬러색*/
.txt_bl {color: #1a4ab9;}
.txt_gr {color: #1fcc8d;}


/*걸어온길*/
.profile_box { position: relative;}
.profile_box .logo { background: url("/contents/19310/mp_logo.png")no-repeat; width: 94px; height: 42px; text-indent: -999em; position: absolute; right: 30px; top: 30px; z-index: 1;}
.profile_box .profile_top {position: relative; background: #f7fafc; overflow: hidden; padding: 60px 50px;}
.profile_box .profile_top .photo {position: relative; float: left; width: 47.7%;}
.profile_box .profile_top .profile_txt { float: left; margin-left: 5%; width: 47.3%;}
.profile_box .profile_top .profile_txt h4 { margin-top: 20px; font-weight: 400;}
.profile_box .profile_top .profile_txt ul.basic, .profile_box .profile_top .profile_txt p.basic {margin-top: 15px; border-bottom: 1px solid #333; padding-bottom: 15px;}
.profile_box .profile_top .profile_txt span.tit {font-weight: 400; padding-right: 10px; min-width: 72px; float: left;}
.profile_box .profile_top .profile_txt span.tit:after { content: ''; width: 2px; height: 13px; background: #c9d2dd; display: inline-block; vertical-align: middle; border-radius: 100px; float: right; margin-top: 6px; margin-left: 10px;}
.profile_box .profile_top .photo img { border-radius: 150px 150px 0 150px; box-shadow: 5px 15px 20px rgba(23, 64, 105, 0.3);width: 100%; height: auto;}
.profile_box .profile_top .photo .ph_name {position: absolute; bottom: 0; right: 0;  background: #046fd9;
    background: -moz-linear-gradient(135deg, #116cb1 10%, #1fcc8d 95%);
    background: -webkit-linear-gradient(135deg, #116cb1 10%, #1fcc8d 95%);
    background: linear-gradient(135deg, #116cb1 10%, #1fcc8d 95%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#116cb1', endColorstr='#1fcc8d',GradientType=1 );
    opacity: 0.95; width: 290px; height: 76px; color: #fff; box-sizing: border-box; text-align: center; padding: 23px 0 0 0; border-radius: 50px 0 0 0;}
.profile_box .profile_top .photo .ph_name > span{display: inline-block;text-indent:-999em;width:76px;height: 32px;background:url("/contents/19310/sign_name.png") no-repeat;vertical-align: middle;margin: 0 0 0 15px;}
.profile_box .profile_top .photo .ph_name:before {content: ''; display: inline-block; width: 38px; height: 20px; background: url("/contents/19310/symbol_w.png") no-repeat; vertical-align: middle; margin-right: 6px;}

.profile_box .profile_btm { border: 10px solid #f7fafc; margin-top: 30px; padding: 40px 50px;}
.profile_box .profile_btm .his_box h4 { text-align: center; font-weight: 400;  margin-bottom: 30px;}
.profile_box .profile_btm .his_box .his_item { background: #f7fafc;  width: 100%; overflow: hidden; border-radius: 10px; line-height: 48px;  height: 48px;  margin-top: 20px;}
.profile_box .profile_btm .his_box .his_item .year { background: #1fcc8d; background:linear-gradient(135deg, #116cb1 10%, #1fcc8d 95%); color: #fff; float: left;  width: 35%;  height: 100%;  margin: 0;  text-align: center; box-sizing: border-box; border-radius: 10px;}
.profile_box .profile_btm .his_box .his_item .cont { float: left; margin: 0; padding: 0 30px; box-sizing: border-box; width: 65%;}



/*시정방침*/
.policy_box div.box{position:relative;}
.policy_box div.box.policy_txt{ padding: 80px 0 0 20px;box-sizing: border-box;}
.policy_box div.box > span.num{position:absolute;left: -50px;top: 0px;display: block;width: 90px;height: 50px;line-height: 50px;background: #22cd8e;border-radius: 0 20px 0 20px;text-align: center;color: #fff;font-size: 22px;font-weight: bold;}
.policy_box .img_txt{background:#fff;box-sizing: border-box;display: block;border-bottom: 1px solid #eee;}
.goal_box .goal_list {overflow:hidden;border-top: 1px dashed #d1d1d1;padding-top: 20px;margin-top: 30px;}
.goal_box .goal_list li{ background: #f7fafc; width: 100%; overflow: hidden; border-radius: 500px;  line-height: 50px;  height: 50px; margin-top: 20px;}
.goal_box .goal_list li .tit { background: #1fcc8d; background: linear-gradient(135deg, #116cb1 10%, #1fcc8d 95%); color: #fff; float: left; width: 35%; height: 100%; margin: 0; text-align: center; box-sizing: border-box; border-radius: 50px;    font-size: 20px; font-weight: 400; letter-spacing: 2px;}
.goal_box .goal_list li .txt{float:left;width:65%;box-sizing: border-box;padding: 0 30px;}


/*선거공약집*/
.vision_box .box.right{box-sizing: border-box; padding-left: 30px;}


/*매니페스토*/
.manifesto_box{background:#f7fafc; padding:80px 50px 50px 50px;overflow:hidden; position:relative;}
.manifesto_box .mp_logo{position:absolute; top:30px; right:40px; background: url("/contents/19310/mp_logo.png")no-repeat; width: 94px; height: 42px; text-indent: -999em;}
.manifesto_box .mf_top{padding: 0 50px 100px 90px; overflow: hidden; position:relative;}
.manifesto_box .mf_top > div{float:left;text-align: center;width: 30%;}
.manifesto_box .mf_top > div.tit h4 .t01{background:url("/contents/24765/manifesto_txt.png")no-repeat;text-indent:-999px;width: 241px;height: 101px;margin: 0 auto 10px; display: block;}
.manifesto_box .mf_top > div.tit h4 .t02{font-weight:400;background: linear-gradient(90deg, #046fd9, #1fcc8d);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.manifesto_box .mf_top > div.cont{border-left:1px solid #333;padding: 0 0 0 50px;margin-left: 50px;width: 51%;box-sizing: border-box;text-align: left;}
.manifesto_box .mf_top > div.cont p.txt{font-size:24px;}
.manifesto_box .mf_top > div.cont p.txt > b{font-weight:400;}
.manifesto_box .mf_btm{background:#fff;margin-top: -15px;  position: relative;  padding: 80px 50px;}
.manifesto_box .mf_top:before {content: 'MOKPO CITY'; font-size: 85px; color: #e8f2f9; font-weight: bold; position: absolute; left: 0; bottom: 0;  z-index: 0; }
.manifesto_box .mf_top:after {content: 'MAYOR'; font-size: 85px;  color: #e8f2f9; font-weight: bold; position: absolute; right: 0px; bottom: 0; z-index: 0; -webkit-text-stroke: 3px #e8f2f9; -webkit-text-fill-color: #f7fafc;}

/*h4타이틀 배경*/
h4.h4_bg{width: fit-content;margin: 0 auto;padding: 20px 40px;border-radius: 30px 0 30px 0;color: #fff;background: #046fd9;background: -moz-linear-gradient(135deg, #116cb1 10%, #1fcc8d 95%);background: -webkit-linear-gradient(135deg, #046fd9 10%, #1fcc8d 95%);background: linear-gradient(135deg, #046fd9 10%, #1fcc8d 95%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#116cb1', endColorstr='#1fcc8d',GradientType=1 );font-size: 26px;box-shadow: 4px 2px 20px rgba(39 56 73 / 30%);}
h4.h4_bg.mb_25{margin-bottom: -25px;position: relative;}


/*주민과의 소통*/
.communication_box .img_txt { text-align: center;}
.communication_box .img_txt i { background: #f3f4f6 url("/contents/24764/communication_icon.png")no-repeat; width: 95px; height: 95px; display: block; float: left; border-radius: 100px;}
.communication_box .img_txt i.icon1 {background-position: 0px 0px;}
.communication_box .img_txt i.icon2 {background-position: -108px 0px;}
.communication_box .img_txt i.icon3 {background-position: -214px 0px;}
.communication_box .img_txt i.blog {background: #5db12a url("/contents/24764/communication_icon.png")no-repeat 0px -113px;}
.communication_box .img_txt i.facebook { background: #3d56a7 url("/contents/24764/communication_icon.png")no-repeat -108px -113px;}
.communication_box .img_txt .txt {width: calc(100% - 110px);float: left;margin-left: 15px; margin-top: 5px;}
.communication_box .img_txt .c_box2 {padding: 3%; border-radius: 0 29px 0 36px; border: 1px solid #333; }
.communication_box .img_txt .c_box2 .txt h4 { font-size: 26px}
