@charset "utf-8";
/* CSS Document */

.basic_btn a[target="_blank"] span:after, .basic_btn button[target="_blank"] span:after {display:none !important;}
.header.active	{ border-bottom:none !important; }


#container														{ margin-bottom:9em; }
@media all and (max-width:1568px){
	#container													{ margin-bottom:8em; }
}
@media all and (max-width:1268px){
	#container													{ margin-bottom:7em; }
}
@media all and (max-width:868px){
	#container													{ margin-bottom:6em; }
}
@media all and (max-width:468px){
	#container													{ margin-bottom:5em; }
}


/* 시민청원 */
.gallery_list.chief>ul>li .gl_info>dt>strong							{ -webkit-line-clamp:2; min-height:2.8em }
.gallery_list.chief>ul>li .gl_info>dd.hit								{ font-size:16px }
.gallery_list.chief .hit .sns.cate1,
.gallery_list.chief .hit .sns.cate2,
.gallery_list.chief .hit .sns.cate3,
.gallery_list.chief .hit .sns.cate4,
.gallery_list.chief .hit .sns.cate5,
.gallery_list.chief .hit .sns.cate6,
.gallery_list.chief .hit .sns.cate7,
.gallery_list.chief .hit .sns.cate8,
.gallery_list.chief .hit .sns.cate9							{ font-size:.95rem !important; }	
@media all and (max-width:1168px){
	.gallery_list.chief>ul>li								{ width:calc((100% - 40px) / 3); }
}
@media all and (max-width:768px){
	.gallery_list.chief>ul>li								{ width:calc((100% - 20px) / 2); }
	.gallery_list.chief>ul>li .gl_info>dd.hit				{ font-size:15px }
	.gallery_list.chief .hit .sns.cate1,
	.gallery_list.chief .hit .sns.cate2,
	.gallery_list.chief .hit .sns.cate3,
	.gallery_list.chief .hit .sns.cate4,
	.gallery_list.chief .hit .sns.cate5,
	.gallery_list.chief .hit .sns.cate6,
	.gallery_list.chief .hit .sns.cate7,
	.gallery_list.chief .hit .sns.cate8,
	.gallery_list.chief .hit .sns.cate9							{ font-size:.9rem !important; }
}	
@media all and (max-width:468px){
	.gallery_list.chief>ul>li								{ width:100%; }
	.gallery_list.chief>ul>li .gl_info>dt>strong			{ min-height:inherit }
}					
/**********************************************************************

 							location 

**********************************************************************/
.location_wrap													{ width:100%; border-style:solid; border-width:1px 0 1px 0; border-color:#e5e5e5; }
.location_wrap .con_inner										{ display:flex; align-items:center; justify-content:space-between; --sizeHig:53px; height:var(--sizeHig) }

/* 위치 */
.location_wrap .lco												{ display:flex; align-items:center; }
.location_wrap .lco>li											{ position:relative; padding:0 20px }
.location_wrap .lco>li+li::before								{ position:absolute; width:1px; height:17px; left:0; top:50%; background:#e5e5e5; content:''; transform:translateY(-50%)}
.location_wrap .lco [data-location="home"] a					{ display:flex; font-size:0px; width:var(--sizeHig); height:var(--sizeHig); opacity:.7 }
.location_wrap .lco [data-location="home"] a::before			{ content:''; display:block; width:100%; height:100%; background:url(/resource/mayor/images/sub/icon_home.svg) no-repeat 50% 50%; background-size:auto 14.5px; 
																	opacity:1; }
.location_wrap .lco>li>button									{ display:flex; height:var(--sizeHig); align-items:center; padding-right:3.75em; opacity:.7; }
.location_wrap .lco>li>button::before							{ position:absolute; right:0; top:50%; width:7px; height:7px; border-style:solid; border-width:0 1px 1px 0; border-color:#575757; transform:translateY(-80%) rotate(45deg); 
																	transition:var(--trans-ani); content:''; vertical-align:middle;  top:50%; right:30px; }
.location_wrap .lco>li.active>button::before					{ transform:translateY(-40%) rotate(225deg); }
.location_wrap .lco>li:not(:has(button))						{ padding:0; }
.location_wrap .lco>li .loc_wrap								{ position:absolute; display:none; left:-1px; z-index:112; width:calc(100% + 2px); top:calc(var(--sizeHig) - 1px); padding:1.25em; background:var(--color-white); 
																	border:1px solid #e5e5e5; border-radius:0 0 10px 10px }
.location_wrap .lco>li .loc_wrap li > a							{ display:inline-flex; justify-content:flex-start; align-items:center; padding:5px 0px; color:var(--color-base); transition:color var(--trans-ani); opacity:.64; line-height:1.2; 
																	word-break: break-all; }
.location_wrap .lco>li .loc_wrap li a[target='_blank']::after	{ content:""; display:inline-block; opacity:.8; transition:all .4s; margin-left:7px; vertical-align:middle; width:11px; height:10px; 
																	background:url(/resource/mayor/images/common/icon_blank.svg) no-repeat 50% 50% / auto 10px; }
.location_wrap .lco>li .loc_wrap li > a:hover,
.location_wrap .lco>li .loc_wrap li > a:focus					{ opacity:1; font-weight:600;}





@media all and (max-width:1368px){
	.location_wrap .con_inner										{ --sizeHig:48px; }
	.location_wrap .lco>li>button									{ font-size:.95rem; }
	.location_wrap .lco>li .loc_wrap li > a							{ font-size:.9rem; }
}
@media all and (max-width:1168px){
	.location_wrap .con_inner										{ --sizeHig:45px; }
	.location_wrap .lco>li>button									{ font-size:.9rem; }
	.location_wrap .lco>li .loc_wrap								{ padding:1em; }
	.location_wrap .lco>li											{ padding:0 1em; }
	.location_wrap .lco>li>button::before							{ right:1em; }
	.location_wrap .lco>li .loc_wrap li > a							{ font-size:.85rem; }
}
@media all and (max-width:968px){
	.location_wrap .con_inner										{ --sizeHig:42px; }
	.location_wrap .lco>li>button									{ padding-right:1.75em; }
	.location_wrap .lco>li>button span								{ max-width:80px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden }
	
}
@media all and (max-width:668px){
	.location_wrap .con_inner										{ --sizeHig:40px; }
	.location_wrap .lco>li>button									{ padding-right:1em; }
	.location_wrap .lco>li>button span								{ max-width:70px;  }
	
}
@media all and (max-width:568px){
	.location_wrap													{ border:none; }
	.location_wrap .con_inner										{ border-radius:10px; border:1px solid #e6e6e6; --sizeHig:42px; }
	.location_wrap .lco>li:nth-child(2)								{ display:none ;}
	.location_wrap .lco>li											{ padding:0 .75em; }
	
}
/**********************************************************************

 							lnb_wrap 

**********************************************************************/
.lnb_wrap														{ margin-top:3.75em; }
.lnb_scroll_wrap												{ position:relative; width:100%; height:var(--sizeHig); overflow-x:scroll; overflow-y:hidden; --sizeHig:60px; }
.lnb_scroll_wrap::-webkit-scrollbar 							{ display:none }
.lnb_scroll_wrap .list											{ position:absolute; top:0; left:0; overflow-x:scroll; display:flex; justify-content:start; gap:.63em; }
.lnb_scroll_wrap .list::-webkit-scrollbar 						{ display:none }
.lnb_scroll_wrap .list>li										{ display:flex; justify-content:center; align-items:center; border-radius:.5rem; background:#e6e6e6; transition:var(--trans-ani);}
.lnb_scroll_wrap .list>li>a										{ padding:0 2em; display:flex; width:max-content; align-items:center; font-weight:700; font-size:1.06em; line-height:1; height:var(--sizeHig); letter-spacing:0; }
.lnb_scroll_wrap .list>li>a>span								{ position:relative; display:inline-block; }
.lnb_scroll_wrap .list>li.active>a>span::after,
.lnb_scroll_wrap .list>li>a:hover>span::after,
.lnb_scroll_wrap .list>li>a:focus>span::after					{ position:absolute; right:-10px; top:-6px; width:6px; height:6px; background:var(--color-white); border-radius:100%; content:''; transition:var(--trans-ani);}
.lnb_scroll_wrap .list>li.active,
.lnb_scroll_wrap .list>li:hover,
.lnb_scroll_wrap .list>li:focus									{ background:var(--color-point); color:var(--color-white) }

/* 공유 */
.page_util											{ display:flex; align-items:center; --sizeHig:40px; gap:6px;}
.page_util>li										{ position:relative; }
.page_util>li>button								{ display:flex; width:var(--sizeHig); height:var(--sizeHig); border-radius:8px; background:#ededed }
.page_util>li>button:before							{ content:''; flex:none; display:block; width:100%; height:100%; margin:0 auto; background-repeat:no-repeat; background-position:50% 50%; }
.page_util>li .share_bt:before						{ background-image:url(/resource/mayor/images/sub/ico_share.svg); background-size:16px;}
.page_util>li>button.copy:before					{ background-image:url(/resource/mayor/images/sub/ico_copy_link.svg);}
.page_util>li>button.print:before					{ background-image:url(/resource/mayor/images/sub/ico_print.svg); background-size:17px 16px;}
.page_util>li>button.braille:before					{ background-image:url(/resource/mayor/images/sub/ico_bx_link.svg); background-size:19px 10px;}
.page_util>li>button.braille_down:before			{ background-image:url(/resource/mayor/images/sub/ico_bx_down.svg); background-size:21px 13px; background-position:50% 55%}
.page_util>li.share .share_drop												{ display:none; position:absolute; top:-1px; left:-1px; z-index:10; width:calc(var(--sizeHig) + 2px); box-sizing:border-box; background-color:var(--color-white); 
																				border:1px solid #e5e5e5;  text-align:center; z-index:1 ; border-radius:8px;}																								
.page_util>li.share .share_drop ul											{ padding-top:10px; display:flex; flex-flow:column; gap:7px; }
.page_util>li.share .share_drop ul > li a									{ display:flex; justify-content:center; align-items:center; width:100%; height:100%;}
.page_util>li.share .share_drop ul > li[data-share] a:before				{ content:''; display:block; width:30px; height:30px; background-repeat:no-repeat; background-position:50% 50%; background-size:auto 100%; border-radius:100%;}
.page_util>li.share .share_drop ul > li[data-share="blog"] a:before			{ background-image:url(/resource/mayor/images/sub/icon_blog.svg); background-color:#32b44a;}
.page_util>li.share .share_drop ul > li[data-share="youtube"] a:before		{ background-image:url(/resource/mayor/images/sub/icon_youtube.svg); background-color:#e03232;}
.page_util>li.share .share_drop ul > li[data-share="facebook"] a:before		{ background-image:url(/resource/mayor/images/sub/icon_facebook.svg); background-color:#385691;}
.page_util>li.share .share_drop ul > li[data-share="instar"] a:before		{ background:url(/resource/mayor/images/sub/icon_instar.svg) no-repeat 50% 50% / cover, linear-gradient(to bottom right, #4a48e8 20% , #ee3183 60%, #f0c05c 100%);}
.page_util>li.share .share_drop ul > li[data-share="kakao"] a:before		{ background-image:url(/resource/mayor/images/sub/icon_kakaoch.svg); background-color:#ffde00; }
.page_util>li.share .share_drop ul > li[data-share="twitter"] a:before		{ background-image:url(/resource/mayor/images/sub/icon_twitter.png); background-color:#000;}
.page_util>li.share .share_drop ul > li[data-share="band"] a:before			{ background-image:url(/resource/mayor/images/sub/icon_band.png); background-color:#50b748;}
.page_util>li.share .share_drop ul > li[data-share="copy"] a:before			{ background-image:url(/resource/mayor/images/sub/icon_copy.svg); background-color:#555555;}
.page_util>li.share .share_close											{ position:relative; width:30px; height:30px; margin-top:10px; margin-bottom:5px; background:#e5e5e5; border-radius:100%;}
.page_util>li.share .share_close::before									{ position:absolute; width:1px; height:11px; left:50%; top:50%; transform:translate(-50%,-50%) rotate(45deg); content:''; background:var(--color-base); }
.page_util>li.share .share_close::after										{ position:absolute; width:1px; height:11px; left:50%; top:50%; transform:translate(-50%,-50%) rotate(-45deg); content:''; background:var(--color-base);}
.page_util>li.share .share_close:hover										{ transform:rotate(90deg); }


@media all and (max-width:1368px){
	.lnb_scroll_wrap											{ --sizeHig:55px; }
	.lnb_scroll_wrap .list>li>a									{ padding:0 1.88em; font-size:1.03em; }
}
@media all and (max-width:1168px){
	.lnb_scroll_wrap											{ --sizeHig:50px; }
	.lnb_scroll_wrap .list>li>a									{ padding:0 1.5em; font-size:1em; }
}
@media all and (max-width:968px){
	.lnb_wrap													{ margin-top:3em; }
	
	.lnb_wrap .flex												{ flex-flow:column; align-items:flex-start; gap:1em }					
	.page_util>li.share .share_drop								{ width:max-content; padding:.4em 5em .4em 1em; left:calc(var(--sizeHig) +  5px)  }
	.page_util>li.share .share_drop ul							{ flex-flow:row wrap; padding:0 }
	.page_util>li.share .share_close							{ position:absolute; right:1em; top:.4em; margin-top:0 }
}
@media all and (max-width:668px){
	.lnb_scroll_wrap											{ --sizeHig:45px; }
	.lnb_scroll_wrap .list										{ gap:.4em; }
	.lnb_scroll_wrap .list>li.active>a>span::after,
	.lnb_scroll_wrap .list>li>a:hover>span::after,
	.lnb_scroll_wrap .list>li>a:focus>span::after				{ right:-7px; top:-4px; width:4px; height:4px; }
}
@media all and (max-width:568px){
	.page_util													{ --sizeHig:35px;}
}
@media all and (max-width:468px){
	.lnb_wrap													{ margin-top:2.5em; }
}


/**********************************************************************

 							title 

**********************************************************************/
.h2_title														{ display:flex; font-size:3.13em; font-weight:700; line-height:1; align-items:end; gap:.3em .38em; margin-bottom:.75em; flex-flow:row wrap; font-family:var(--font-tway)}
@media all and (max-width:1368px){
	.h2_title													{ font-size:2.6em; }
}
@media all and (max-width:968px){
	.h2_title													{ font-size:2.3em; }
}
@media all and (max-width:468px){
	.h2_title													{ font-size:1.9em; }
}

/**********************************************************************

 							section_middle 

**********************************************************************/
.section_middle													{ position:relative; margin-top:2.5em;  }
.section_middle::after											{ position:absolute; width:var(--sizeWidth); height:2px; top:-1px; left:0; background:var(--color-point); content:''; }

/* 3차 메뉴*/
.section_middle	.snb_wrap										{ margin-bottom:2em; position:relative; width:100%; height:var(--sizeHig); overflow-x:scroll; overflow-y:hidden; --sizeHig:50px; }
.section_middle .snb_wrap::-webkit-scrollbar 					{ display:none }
.section_middle	.snb_wrap .list									{  position:absolute; top:0; left:0; overflow-x:scroll; display:flex; justify-content:start; gap:.5em;  }
.section_middle	.snb_wrap .list::-webkit-scrollbar 				{ display:none }	
.section_middle	.snb_wrap .list>li>a							{ position:relative; display:flex; width:max-content; height:var(--sizeHig); align-items:center; line-height:1; font-size:1.03em; font-weight:500; padding:0 1.5em; 
																	transition:var(--trans-ani); border:1px solid #e5e5e5; border-radius:8px; }
.section_middle	.snb_wrap .list>li.active>a,
.section_middle	.snb_wrap .list>li>a:hover,
.section_middle	.snb_wrap .list>li>a:focus						{ color:var(--color-point); border-color:var(--color-point) }	
.section_middle .content										{ width:100%; }
@media all and (max-width:1368px){
	.section_middle	.snb_wrap									{ --sizeHig:45px; }
	.section_middle	.snb_wrap .list>li>a						{ font-size:1em; padding:0 1.25em }
}
@media all and (max-width:668px){
	.section_middle												{ margin-top:1.5em;  }
	.section_middle	.snb_wrap									{ --sizeHig:40px; }
	.section_middle	.snb_wrap .list								{ gap:.3em; }
	.section_middle	.snb_wrap .list>li>a						{ padding:0 1em }
}


/**********************************************************************

 							인사말

**********************************************************************/
[data-subarea="greeting"] .img_box						{ position:relative; display:flex; flex-flow:column; padding:5.63em; border-radius:0 0 150px 0; overflow:hidden; background:#efefef url(/resource/mayor/images/contents/img_greeting.png) no-repeat 50% 50% / cover;  }
[data-subarea="greeting"] .img_box .color_purple		{ font-size:1.56em; font-weight:600 }
[data-subarea="greeting"] .img_box strong				{ font-size:4.06em; font-family:var(--font-tway); line-height:1.3; margin-top:.5em }
[data-subarea="greeting"] .img_box dl					{ font-family:var(--font-tway); font-size:1.56em; margin-top:3.25em }
[data-subarea="greeting"] .img_box dl em				{ font-size:1.6em; }
[data-subarea="greeting"] .text							{ flex:0 1 50%; display:flex; flex-flow:column; gap:1.75em; font-size:1.25em; line-height:1.4; padding:3em; padding-bottom:0 }
[data-subarea="greeting"] .text>li>strong				{ font-weight:bold; }
[data-subarea="greeting"] .text>li.sign em				{ font-family:var(--font-tway); font-size:1.6em;}

@media all and (max-width:1768px){
	[data-subarea="greeting"] .img_box						{ padding:5em; }
	[data-subarea="greeting"] .img_box .color_purple		{ font-size:1.5em; }
	[data-subarea="greeting"] .img_box strong				{ font-size:3.5em; }
	[data-subarea="greeting"] .img_box dl					{ font-size:1.46em; }
	[data-subarea="greeting"] .text							{ font-size:1.167em; }
}
@media all and (max-width:1668px){
	[data-subarea="greeting"] .img_box						{ padding:4.5em; }
	[data-subarea="greeting"] .img_box .color_purple		{ font-size:1.4em; }
	[data-subarea="greeting"] .img_box strong				{ font-size:3.25em; }
	[data-subarea="greeting"] .img_box dl					{ font-size:1.3em; }
	[data-subarea="greeting"] .text							{ padding:3em 2.5em; }
}
@media all and (max-width:1568px){
	[data-subarea="greeting"] .img_box						{ padding:4em; }
	[data-subarea="greeting"] .img_box .color_purple		{ font-size:1.3em; }
	[data-subarea="greeting"] .img_box strong				{ font-size:3em; }
	[data-subarea="greeting"] .img_box dl					{ font-size:1.267em; }
	[data-subarea="greeting"] .text							{ padding:3em 2em; }
}
@media all and (max-width:1368px){
	[data-subarea="greeting"] .img_box						{ padding:3.5em; }
	[data-subarea="greeting"] .img_box .color_purple		{ font-size:1.267em; }
	[data-subarea="greeting"] .img_box strong				{ font-size:2.8em; }
	[data-subarea="greeting"] .img_box dl					{ font-size:1.267em; }
	[data-subarea="greeting"] .text							{ font-size:1.067em; padding:3em 1em; }
}
@media all and (max-width:1268px){
	[data-subarea="greeting"] .img_box						{ padding:3.5em; }
	[data-subarea="greeting"] .img_box .color_purple		{ font-size:1.2em; }
	[data-subarea="greeting"] .img_box strong				{ font-size:2.6em; }
}
@media all and (max-width:1168px){
	[data-subarea="greeting"] .flex							{ flex-wrap:wrap; padding:3em 1em; padding-bottom:0 }
	[data-subarea="greeting"] .text							{ flex:100%; gap:1em; padding:0; }
	[data-subarea="greeting"] .text+.text					{ margin-top:1em; }
}
@media all and (max-width:868px){
	[data-subarea="greeting"] .img_box						{ padding:3em; border-radius:0 0 100px 0 }
	[data-subarea="greeting"] .img_box .color_purple		{ font-size:1.167em; }
	[data-subarea="greeting"] .img_box strong				{ font-size:2.4em; }
	[data-subarea="greeting"] .img_box dl					{ font-size:1.167em; }
}
@media all and (max-width:668px){
	[data-subarea="greeting"] .img_box						{ padding:2em; border-radius:0 0 50px 0 }
	[data-subarea="greeting"] .img_box .color_purple		{ font-size:1.067em; }
	[data-subarea="greeting"] .img_box strong				{ font-size:2.2em; }
	[data-subarea="greeting"] .img_box dl					{ font-size:1.067em; }
}
@media all and (max-width:568px){
	[data-subarea="greeting"] .img_box						{ position:relative; padding:1.5em; padding-bottom:12em; background-size:100% auto; background-image:url(/resource/mayor/images/contents/img_greeting_m.png); background-position:center bottom;
																border-radius:0 0 50px 0}
	[data-subarea="greeting"] .img_box dl					{ margin-top:2em; }
	[data-subarea="greeting"] .img_box .color_purple		{ font-size:1em; }
	[data-subarea="greeting"] .img_box strong				{ font-size:2em; }
	[data-subarea="greeting"] .img_box dl					{ font-size:1.03em; }
	[data-subarea="greeting"] .flex							{ padding:2em 1em; padding-bottom:0 }
}
@media all and (max-width:468px){
	[data-subarea="greeting"] .img_box .color_purple		{ font-size:.9em; }
	[data-subarea="greeting"] .img_box strong				{ font-size:1.8em; }
	[data-subarea="greeting"] .img_box dl					{ font-size:1em; }
}
@media all and (max-width:320px){
	[data-subarea="greeting"] .img_box .color_purple		{ font-size:.9em; }
	[data-subarea="greeting"] .img_box strong				{ font-size:1.6em; }
	[data-subarea="greeting"] .img_box dl					{ font-size:.95em; }
}

