/* 정책소통플랫폼 소개  ===================================================================================== */ 
.sub_title_txt01				{margin-bottom:10px; font-size:2.6em; line-height:1.4; letter-spacing:-3px; color:#000; font-weight:100;}
.sub_title_txt01 span			{font-weight:700; }
.sub_title_txt02				{font-size:1.6em; line-height:1.4; letter-spacing:-2.5px; color:#005bbe; font-weight:700;} 
.sub_title_txt03				{font-weight:500; color:#000; box-shadow: inset 0 -10px 0 #d4f2ff;}

.int_top						{text-align:center;}
.int_top .txt					{margin-top:20px; font-size:1.1em; line-height:160%; letter-spacing:-1px;}

.int_item							{text-align:center; margin-top:40px; text-align:center; border-top:1px solid #ddd; border-bottom:1px solid #ddd; padding:60px 30px;}
.int_item li						{position:relative; overflow:hidden; margin:-20px 0;}
.int_item .circle					{float:left; width:220px; height:220px; border-radius:100%; }
.int_item li:first-child .circle	{background:url("../image/sub/int_acc01.png") no-repeat center 50% rgba(0, 198, 186, 0.8); background-size:57px;}
.int_item li:nth-child(2) .circle	{background:url("../image/sub/int_acc02.png") no-repeat center 50% rgba(0, 156, 190, 0.8); background-size:57px;}
.int_item li:nth-child(3) .circle	{background:url("../image/sub/int_acc03.png") no-repeat center 50% rgba(0, 114, 190, 0.8); background-size:57px;}
.int_item li:last-child .circle		{background:url("../image/sub/int_acc04.png") no-repeat center 50% rgba(26, 71, 130, 0.8); background-size:57px;}
.int_item .circle p					{display:inline-block; margin-top:125px; color:#fff; font-size:1.4em; font-weight:500; text-align:center; letter-spacing:-1.5px; line-height:140%;}
.int_item dl						{position:relative; padding:60px 0 0 270px; text-align:left;}
.int_item dl dt						{font-weight:700; font-size:1.4em; letter-spacing:-1.5px; color:#333; margin-bottom:10px;}
.int_item li:first-child dl			{padding:10px 0 0 270px;}

.int_table							{margin-top:40px;}
.int_table .step01					{display:flex; gap:0 30px; justify-content:space-between; text-align:center;}
.int_table dl						{display:grid; position:relative; width:100%; border:1px solid #ddd;}
.int_table dl:after					{position:absolute; content:''; right:-20px; top:45%; border: solid #ccc; border-width:3px 3px 0 0; padding:6px; transform:rotate(45deg);}
.int_table dl:last-child:after		{display:none;}
.int_table dl dt					{font-size:1.05em; color:#414141; background:#f3f6fb; height:50px; line-height:50px; font-weight:500; letter-spacing:-1px; }
.int_table dl dd					{padding:20px 15px;}
.int_table dl dd span				{display:block; font-size:0.95em; color:#777; margin-top:10px;}
.int_table .sub_list01				{font-size:0.95em; text-align:left;}

.int_table .step02					{position:relative; text-align:center; width:65%; margin:0 auto;}
.int_table .step02 .tit				{position:relative; margin:40px 0; font-size:1.05em; letter-spacing:-1px; background:#3a7cda; color:#fff; text-align:center; padding:10px 25px; display:inline-block; border-radius:50px;}
.int_table .step02 .tit:before		{position:absolute; content:''; left:50%; transform:translate(-50%); top:-22px; border: solid #005bbe; border-width:3px 3px 0 0; padding: 6px; -webkit-transform: rotate(45deg);  transform: rotate(315deg);}
.int_table .step02 .tit:after		{position:absolute; content:''; left:50%; transform:translate(-50%); bottom:-22px; border: solid #ddd; border-width:0 3px 3px 0; padding: 6px; -webkit-transform: rotate(45deg);  transform: rotate(45deg);}
.int_table .step02 .form_table		{border:1px solid #ddd;}
.int_table .step02 .form_table thead th	{border-bottom:0;}
.int_table .step02 .form_table thead th:last-child {border-right:1px solid #ddd;}
.int_table .step02 .form_table tbody td:first-child	{border-left:1px solid #ddd; }
.int_table .step02 .form_table tbody td:last-child	{border-right:1px solid #ddd; }

.sub_list					{overflow:hidden; margin:5px 0;}
.sub_list dt				{float: left; color:#333; width: 125px;text-align: center; border: 2px solid #ddd;border-radius: 50px; height: 42px;  line-height: 39px;font-weight: 500; letter-spacing: -1.5px;}
.sub_list dd				{ padding: 10px 0 0 150px; }


/* 도민정책참여단  ===================================================================================== */ 
.domingroup_top					{position:relative; width:100%; }
.domingroup_top .sub_list dd	{padding:0 0 0 150px;}
.domingroup_top	.img_box		{position:relative; }
.domingroup_top .btn			{position:absolute; top:40%; left:50%; transform:translate(-50%);}
.domingroup_top .wrap			{background:#fffaf6; padding:20px 50px 50px 50px;}
.domingroup_top .tit			{background:#67c0ac; color:#fff; padding:10px 20px; font-weight:700; font-size:1.4em; letter-spacing:-2px;}
.domingroup_top .txt			{background:#fff; padding:20px 30px;}
/*.domingroup_top dl				{overflow:hidden; margin:5px 0;}
.domingroup_top dl dt			{float:left; font-weight:500; color:#38bea0; border:2px solid #67c0ac; width:120px; font-size:0.9em; line-height:26px; text-align:center; border-radius:22px; }
.domingroup_top dl dd			{padding:2px 0 0 140px; color:#414141;}*/
.domingroup_top .gray_box		{margin-top:10px; border:0; font-size:0.9em; padding:20px; border-radius:2px;}
.domingroup_top .small			{font-size:0.85em; color:#777; margin-top:5px;}
.domingroup_top .sub_list01		{text-align:left;}

.domingroup_top						{position:relative; width:100%; }
.domingroup_top .sng_form_btn		{font-weight:500; line-height:52px; padding:0 30px; font-size:1.1em; background:#fcd437; color:#333; border-color:#fcd437;}
.domingroup_top .sng_form_btn:hover	{background:#333; color:#fff; border-color:#333;}

.domingroup_form .sng_form_btn		{background:#333; color:#fff; border-color:#333;}
.domingroup_form .sng_form_btn:hover{background:#fcd437; color:#333; border-color:#fcd437;}
#group_join_div						{display:none;}

#info_layer							{display:none; position:absolute;  left:50%; top:58%; transform:translate(-50%, -50%); text-align:center; border-radius:5px; width:350px !important; z-index:9999999; overflow:hidden; background:#fff;}
#info_layer .img img				{width:80px;}
#info_layer .wrap					{padding:20px;}
#info_layer .txt					{margin:20px 0; color:#333; line-height:160%;}
#info_layer .txt span				{font-weight:500; color:#000;}
#info_layer .btn					{line-height:46px; width:200px; background:#3a7cda; margin:0 auto 10px auto; border-radius:50px; }
#info_layer .btn a					{display:inline-block; width:100%; font-weight:500; font-size:0.95em; color:#fff;}
#info_layer .btn:hover				{background:#000;}
#info_layer .info_layer_checkbox	{background:#f2f2f2;  padding:10px; text-align:center; width:50%; float:left; border-right:1px solid #ddd;border-top:1px solid #ddd;}
#info_layer .info_layer_checkbox label	{color:#333; font-size:0.9em;}
#info_layer .info_layer_close		{background:#f2f2f2; color:#333; padding:10px; text-align:center; width:50%; float:left; cursor:pointer; font-size:0.9em; border-top:1px solid #ddd;}

#info_layer2							{display:none; position:absolute;  left:50%; top:58%; transform:translate(-50%, -50%); text-align:center; border-radius:5px; width:350px !important; z-index:9999999; overflow:hidden; background:#fff;}
#info_layer2 .img img				{width:80px;}
#info_layer2 .wrap					{padding:20px;}
#info_layer2 .txt					{margin:20px 0; color:#333; line-height:160%;}
#info_layer2 .txt span				{font-weight:500; color:#000;}
#info_layer2 .btn					{line-height:46px; width:200px; background:#3a7cda; margin:0 auto 10px auto; border-radius:50px; }
#info_layer2 .btn a					{display:inline-block; width:100%; font-weight:500; font-size:0.95em; color:#fff;}
#info_layer2 .btn:hover				{background:#000;}
#info_layer2 .info_layer_checkbox	{background:#f2f2f2;  padding:10px; text-align:center; width:50%; float:left; border-right:1px solid #ddd;border-top:1px solid #ddd;}
#info_layer2 .info_layer_checkbox label	{color:#333; font-size:0.9em;}
#info_layer2 .info_layer_close2		{background:#f2f2f2; color:#333; padding:10px; text-align:center; width:50%; float:left; cursor:pointer; font-size:0.9em; border-top:1px solid #ddd;}

#group_info_layer, 
#idea_ins_layer,
#mb_hp_layer						{display:none; position:absolute;  left:50%; top:58%; transform:translate(-50%, -50%); text-align:center; border-radius:5px; width:500px !important; z-index:9999999; overflow:hidden; background:#fff;}
#group_info_layer .img img, #idea_ins_layer .img img, #mb_hp_layer .img img		{width:80px;}
#group_info_layer .wrap, #idea_ins_layer .wrap, #mb_hp_layer .wrap				{padding:20px;}
#group_info_layer .txt, #idea_ins_layer .txt, #mb_hp_layer .txt					{margin:20px 0; color:#333; line-height:160%; text-align:center;}
#group_info_layer .txt span, #idea_ins_layer .txt span, #mb_hp_layer .txt span	{font-weight:500; color:#000;}
#group_info_layer .btn, #idea_ins_layer .btn, #mb_hp_layer .btn					{line-height:46px; width:200px; background:#3a7cda; margin:0 auto 10px auto; border-radius:50px; }
#group_info_layer .btn a,#idea_ins_layer .btn a ,	#mb_hp_layer .btn a			{display:inline-block; width:100%; font-weight:500; font-size:0.95em; color:#fff;}
#group_info_layer .btn:hover, #idea_ins_layer .btn:hover, #mb_hp_layer .btn:hover	{background:#000;}
#group_info_layer .group_info_layer_close,
#idea_ins_layer .idea_ins_layer_close, #mb_hp_layer .mb_hp_layer_close	{background:#f2f2f2; color:#333; padding:10px; text-align:center; width:100%; cursor:pointer; font-size:0.9em; border-top:1px solid #ddd;}


/* 청년참여예산 소개  ===================================================================================== */ 
.youthChart							{display:flex; justify-content:center; text-align:center; margin-top:20px;}
.youthChart li						{margin:0 -10px; color:#fff; font-size:1.4em; font-weight:700; letter-spacing:-2px; width:220px; height:220px; line-height:1.3; background:rgba(0,198,186,0.8); border-radius:100%;}
.youthChart li:nth-child(2)			{background:rgba(0,114,190,0.8);}
.youthChart li:last-child			{background:rgba(26,71,130,0.8);}
.youthChart i						{display:block; font-size:45px; margin:50px 0 15px 0;}


@media screen and (max-width:1024px) {
	.sub_title_txt01				{font-size:2.2em;}
	.sub_title_txt02				{font-size:1.2em;}
	.int_top .txt					{margin-top:10px; font-size:1em;}

	#info_layer .txt, #info_layer2 .txt, #group_info_layer .txt, #idea_ins_layer .txt		{font-size:0.9em; }
	#info_layer .info_layer_close, #info_layer .btn a, #info_layer .info_layer_checkbox label, 
	#info_layer2 .info_layer_close2, #info_layer2 .btn a, #info_layer2 .info_layer_checkbox label, 		
	#group_info_layer .group_info_layer_close, #group_info_layer .btn a, #group_info_layer .info_layer_checkbox label,		
	#idea_ins_layer .idea_ins_layer_close 		{font-size:0.85em;}

	.int_item						{padding:20px;}
	.int_item li					{margin:5px 0;}
	.int_item .circle				{float:none; margin:0 auto; width:150px; height:150px;}
	.int_item dl					{padding:20px 0 0 0 !important;text-align:center; }
	.int_item dl dt					{font-size:1.2em; }
	.int_item dl dd					{font-size:0.95em;}

	.int_table .step01				{gap:20px;}
	.int_table dl:after				{right:-15px; padding:5px;}
	.int_table .step02				{width:80%;}

	.youthChart li					{width:150px; height:150px; font-size:1.2em; line-height:1.3;}
	.youthChart i					{font-size:30px; margin:30px 0 10px 0;}

}



@media screen and (max-width:768px) {
	#group_info_layer,				
	#info_layer,
	#info_layer2,
	#idea_ins_layer					{width:90% !important;}

	.int_table .step01				{display:grid; justify-content:unset;}
	.int_table dl:after				{right:49.5%; top:auto; bottom:-15px; border-width:0 3px 3px 0;}
	.int_table dl dt				{height:42px; line-height:42px;}
	.int_table dl dd				{padding:15px 10px;}
	.int_table dl dd span			{margin:0;}
	.int_table .step02				{width:100%;}

	.sub_list dt					{width:120px; font-size:0.9em;}
	.sub_list dd					{padding:10px 0 0 140px; font-size:0.95em;}
	.domingroup_top .sub_list dd	{padding:0 0 0 140px;}

}



@media screen and (max-width:580px) {


}