.wrap-process{
	position:relative;
	width:100%;
}

.wrap-process img{
	width:100%;
}

.wrap-process{
	line-height: 1.96;
}

.tip_box{
	position:relative;
	padding:20px;
	width:100%;
	line-height: 1.86;
	margin-top:30px;
	border:1px solid #e2e2e2;
	border-radius:10px;
}

.tip_box .tp1{
	color:#D40D11;
	font-size:20px;
}

.wrap-process .fa-circle{
	font-size:10px;
	position: relative;
	top:-3px;
	margin-right:5px;
	color:#3E6D9C;
}


.padp{padding-left:15px;}

.integ_table{
	width:100%;
}

.integ_table .table_inner {
    width: 100%;
}

.integ_table .table_inner table:not(.table_v) {
  border: 1px solid #ccc;
  text-align: center;
  table-layout: fixed;
  max-width: none;
  width: auto;
  min-width: 100%;
}
.integ_table .table_inner th {
    border-bottom: none;
    color: #fff;
    background-color: #4E89AE;
}
.integ_table .table_inner th, .table_inner td {
    border: 1px solid #ccc;
    padding: 5px;
}
.integ_table .td1 {
    background-color: #F6F6F6;
}
.integ_table.td_txt a {
    color: #838383;
}
.integ_table .tr_em .td_txt {
    color: #F15412;
    font-weight: bold;
}

.wrap-process .integ_img{
	position:relative;
	width:70%;
	left:15%;
	margin-top:60px;
}

.process_area .wrap-process{
	margin-bottom:30px;
}

/* 일감정보 */
.worklist_area{
	position:relative;
	width:100%;
}

.wl_iframe{
	position:relative;
	width:100%;
	height:1300px;
	border:1px solid #cccccc;
}

.worklist_box .edui_subp{
	margin:0 0 20px 0;
}

.volunteer_area .ta_c{
	text-align:center;
}

.wrap_volunteer{width:100%;}

.wrap_volunteer .fa-circle {
    font-size: 8px;
    position: relative;
    top: -3px;
    margin-right: 8px;
    color: #3E6D9C;
}

.voleq{
line-height: 1.96;
}

.wvol2 .fa-circle{
	color: #348498;
}

.wrap_volunteer .fa-cube{
	font-size: 16px;
  position: relative;
  margin-right: 5px;
  color: #3E6D9C;
}

.txtred{
color:#DA1212;
}

.txtred2{
color:#1F8A70;
}

.wrap_volunteer .fa-question-circle{
	font-size: 16px;
  position: relative;
  margin-right: 5px;
}

/* 참여현황 */
.wrap_partici{
	position:relative;
	width:100%;
}

.part_table{
	width:100%;
	border:1px solid #cccccc;
	margin-bottom:20px;
}


.part_table td{
  color: #555;
  text-align: center;
  padding: 5px 15px;
  font-size: 16px;
	border-bottom:1px solid #cccccc;
}

.part_table th {
  padding: 10px 0;
  background-color: #277BC0;
  color: #ffffff;
  text-align: center;
  font-size: 16px;
	border-bottom:1px solid #cccccc;
	border-right:1px solid #cccccc;
}

.wrap_partici .part_img{
	position:relative;
	width:100%;
}

.wrap_partici {
	margin-bottom:20px;
}


.wrap_partici .h3sub_tit{
	margin-bottom:5px;
}

/* 상해보험 */
.wrap_insurance{
	position:relative;
	width:100%;
	margin-bottom:30px
}

.wrap_insurance .wrap_table{
	width:100%;
}

.table_ty {
	text-align: center;
  border-collapse: collapse;
  table-layout: fixed;
  border-spacing: 0;
	width: 100%;
}

.table_ty:first-child{
	border-top:1px solid rgb(219, 219, 219);
}

.table_ty th:first-child{
	border-left:1px solid rgb(219, 219, 219);
}


.table_ty th {
  padding: 10px;
  text-align: center;
  border-right-color: rgb(219, 219, 219);
  border-bottom-color: rgb(219, 219, 219);
  border-right-width: 1px;
  border-bottom-width: 1px;
  border-right-style: solid;
  border-bottom-style: solid;
	line-height: 1.8;
}

.table_ty thead th {
    background: rgb(245, 245, 245);
    padding: 8px 10px;
    color: rgb(36, 110, 185);
    font-size: 15px;
    font-weight: 500;
    word-break: keep-all;
}


.table_ty td:first-child {
    border-left-color: rgb(219, 219, 219);
    border-left-width: 1px;
    border-left-style: solid;
		color:#000;
}

.table_ty td {
    color: rgb(51, 51, 51);
    font-size: 15px;
}

.table_ty td {
    padding: 10px;
    text-align: center;
    border-right-color: rgb(219, 219, 219);
    border-bottom-color: rgb(219, 219, 219);
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-right-style: solid;
    border-bottom-style: solid;
		vertical-align: middle;
		color:#000;
}

.wrap_insurance img{width:100%; margin:25px 0;}

.insu_i{color: #D40D11;}

/* 자원봉사 마일리지제 */

.wrap_mileage .fa-circle {
  font-size: 8px;
  position: relative;
  top: -3px;
  margin-right: 8px;
  color: #3E6D9C;
}

.wrap_mileage{
	margin-bottom:40px;
}

.mileage_btn{
	position:relative;
	width:200px;
	height:50px;
	background-color:#1746A2;
	margin-top:20px;
}

.mileage_btn a{
	display:inline-block;
	width:100%;
	height:100%;
	color:white;
	font-size:20px;
	line-height:50px;
	text-align:center;
}

.mileage_btn:hover{background-color:#002E94;}

.milege_location{
	width:100%;
	height:500px;
	margin-bottom:30px;
	margin-top:10px;
	border-bottom:1px solid black;
}

.milege_location .milege_cf{
	width:100%;
	height:100%;
	outline:none;
}

.mil_card{width:100%;}

.wm1{margin-top:30px;}

.location_area{
	position:relative;
	width:100%;
}

.wrap_map{
	position:relative;
	width:100%;
	border:1px solid #cccccc;
	padding:10px;
}

.uploadcheck{
	margin-bottom: 10px;
  padding: 10px;
  line-height: 1.86;
}

.img_up .up_cont{
	margin-bottom: 20px;
  line-height: 1.86;
}

.wrap_volunteer{
margin-bottom:30px;
}

.wrap_volcharacter{
	position:relative;
	width:100%;
}

.img_vol01{
	width:100%;
	margin:30px 0 0 0;
}

.dregi_btn{
	width:140px;
	height:30px;
	text-align: center;
  line-height: 30px;
}
.dregi_btn a{
	display:inline-block;
	width:100%;
	height:100%;
	color: #fff;
	background: #FC5404;
}

.dregi_btn a:hover{color:black;}

.location_area{margin-bottom:30px;}

.esp{margin-bottom:30px;}

.honor_area{
	position:relative;
	width:100%;
}

.honor_area .readEdit span{font-size:16px;}

.wrap_honorread{
	position:relative;
	margin-bottom:30px;
	margin-top:30px
}

.honor_area .cont{padding:0;}

.honor_area .title{
	display:inline-block;
	position:relative;
	font-size:18px;
	margin-bottom:5px;
}
.honor_area .cont{
	display:block;
	font-size:15px;
	color:#13005A;
}

.honor_area .title::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 10px;
  background: rgba(0,104,183,0.4);
	opacity:0.4;
  z-index: -1;
  left: 0px;
	top:18px;
}

.honor_area .readTop{
	width:100%; 
	position:relative;
	height:60px;
	margin-bottom:60px;
	display:flex;
}

.honor_area .readTop .imgTitle_sub{
	float:left;
	width:100%;
}

.honor_area .readEdit span{
	font-size: 16px;
  margin-top: 10px;
  width: 100%;
  text-align: center;
  position: relative;
  display: block;
}

.rtbow{ width:100%; position:relative; height: 100%; display:flex; flex-flow:row wrap; justify-content: space-around; }

.rtbb{
	height:100%;
	text-align:center;
	padding-top:2px;
}

.rtbb:first-child{width:19%;}
.rtbb:nth-child(2){width:19%; border-right: 1px solid #e2e2e2; border-left: 1px solid #e2e2e2;}
.rtbb:nth-child(3){width:19%; border-right: 1px solid #e2e2e2;}
.rtbb:last-child{width:43%;}


.rtbow:first-child{border-left: 1px solid #e2e2e2;}
.rtbow:last-child{border-right: 1px solid #e2e2e2;}

.honor_area .col-sm-6{text-align:center;}

.honor_area .readEdit img{
	left:25%;
	position:relative;
}

.honor_area .btn-sm{padding:10px 25px;}

.lm_tit img{width:40px;}

.sub_notice_area{width:100%; position:relative;}

.point_br{display:none;}

.honor_area .title{font-size:16px;}

.insurance_area .vol_btn {
    padding: 10px 50px;
    border: none;
    color: #fff;
    background-color: #FC7300;
    transition: 0.3s;
		cursor:pointer;
		border-radius: 30px;
		font-size:20px;
		display:inline-block;
}

.vol_btn:hover{
background-color:black;
}

.orgapply_area{
	position:relative;
	width:100%;
}

.orgapply_area .fa-circle {
  font-size: 8px;
  position: relative;
  top: -3px;
  margin-right: 8px;
  color: #3E6D9C;
}

.orgprocess_img{width:100%; margin-bottom:30px;}

.orgapply_area table{position:relative; width:100%;}

.orgapply_area th, .orgapply_area td {
  border: 1px solid #ccc;
  padding: 8px 5px;
}

.orgapply_area th {
  border-bottom: none;
  color: #fff;
  background-color: #277BC0;
  vertical-align: middle;
}

.orgapply_area table:not(.table_v) {
  border: 1px solid #ccc;
  text-align: center;
  table-layout: fixed;
  max-width: none;
  width: auto;
  min-width: 100%;
  border-collapse: collapse;
}

.orgapply_area .tleft {
  text-align: left;
  padding-left: 15px;
	text-align:left;
}

.read_btn{text-align:center;}

.wrap-insuranebtn{position:relative; width:100%; height:50px; margin-top:10px; padding-left:10px;}

.wrap-insuranebtn .fa-hand-o-right{float:left; font-size:35px; line-height:50px; margin-right:10px;}

.ellipsis{
	text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  overflow: hidden;
  float:left;
	width:calc(100% - 70px);
}

.uploadcheck_box1{
	position:relative;
	width:100%;
}

.uploadcheck_adress{
	display:flex;
	width:100%;
	flex-direction: column;
}

.wadress{
	display:flex;
	width:100%;
}

.uploadcheck_adress .wadress p{
	min-width:60px;
}

.uploadcheck_adress input{
	width:300px;
	height:28px;
}

.wadr2{margin:10px 0;}

.uploadcheck_adress .by_zipcode{width:190px;}

.uploadcheck_adress .title label{font-size:16px;}

.uploadcheck_box2{
	position:relative;
	width:100%;
	padding:15px;
	border:1px solid #e2e2e2;
	margin-bottom:15px;
}

.ubpox2_tit{margin-top:15px;}

.uploadcheck_box2 button{cursor:pointer;}

.cardinfo_img{width:100%; margin-bottom:10px;}

.img_insu{width:100%;}

.d_info .fa-circle{
	font-size: 10px;
  position: relative;
  top: -3px;
  margin-right: 5px;
  color: #3E6D9C;
}

.vm_space{
	display: inline-block;
  width: 68px;
}

.orange{
	color:#FF5F00;
}

.table_ty .non_cen.howcen{
	position:relative;
	margin-top:15px;
}

.howcen .sind{
	position:relative;
	width:100%;
	color:#27548A;
}

.howcen .sind > a{
	width:100%;
	display:block;
}

.howcen .sind > a:hover{
	text-decoration:underline;
}

@media all and (max-width: 800px){
	.wrap_table{
		overflow-x: scroll;
	}

	.wrap_table table {
		min-width: 1150px;
	}
}

@media all and (max-width: 650px){
	.demand_standard th, .demand_standard td{font-size:14px;}
	.tip_box p{font-size:14px;}
	.tip_box .tp1{font-size:16px;}
	.wrap_insurance{margin-bottom:30px;}
	.wrap_mileage{margin-bottom:30px;}
	.table_ty td{font-size:14px;}
	.mileage_btn a{font-size:16px; line-height:40px;}
	.mileage_btn{width:120px; height:40px;}

	.ynav{width:180px;}
	.yearb_cont{padding:0;}
	.wrap_volunteer{margin-bottom:30px;}
	.process_area .wrap-process{margin-bottom:30px;}
	.honor_area .readTop{margin-bottom:30px;}
	.rtbb{
		width:25%; 
		padding-top: 5px;
	}

	.b_new{display:none;}
	.yearbest-area .wrap-h2subtit{margin-bottom:10px;}
	.yearb_nav{padding-bottom:10px;}
	.wrap-ysel{bottom:10px;}
	.rtbb:first-child{width:33%; border-left:1px solid #e2e2e2;}
	.rtbb:nth-child(2){width:33%;}
	.rtbb:nth-child(3){width:33%;}
	.rtbb:last-child{width:100%; margin-top:15px;}
	.honor_area .readTop{height:auto;}
	.rtbow:last-child{border:none;}
	.rtbow:first-child {border:none;}
	.honor_area .readTop{margin-bottom:15px;}
	.wrap_partici{margin-bottom:10px;}
	.part_table th{font-size:14px;}
}
/* 
@media all and (max-width: 600px){
	.rtbb:first-child{width:33%; border-left:1px solid #e2e2e2;}
	.rtbb:nth-child(2){width:33%;}
	.rtbb:nth-child(3){width:33%;}
	.rtbb:last-child{width:100%; margin-top:15px;}
	.honor_area .readTop{height:auto;}
	.rtbow:last-child{border:none;}
	.rtbow:first-child {border:none;}
	.honor_area .readTop{margin-bottom:15px;}
} */

@media all and (max-width: 550px){
	.yearb_nav{padding-left:10px; padding-right: 10px;}
	.ynav{width:100px;}
	.wrap-ysel select{width:80px;}
	.wrap-ysel{right:10px;}
	.ynav p{font-size:12px;}
	.ynav .yn_tit{font-size:16px}
	.b_search_wrap.demand_search{justify-content: end;}
	.b_search_wrap select{width:57px;}
	.b_search_wrap select:first-child{width:80px;}
	.b_search_wrap input{width:85px;}
	.table_ty thead th{font-size:12px;}
	.milege_location{height:300px;}
	.wrap_mvision{margin-bottom:20px;}
	.part_table th{font-size:14px;}
	.part_table td{font-size:14px;}
	.integ_table .table_inner th, .table_inner td{font-size:14px;}
	.orgapply_area th, .orgapply_area td{font-size:14px;}
	.bycom_table .find_table_thead th{font-size:13px;}
	.wrap-nav p{font-size:16px;}
	.basic_board td{font-size:13px;}
	.honor_area .read_txt_wrap iframe {width:100% !important;}
	.honor_area .readEdit img{width:100% !important; left:0;}
	.honor_area .readEdit img{left:0;}
	.insu_i{font-size:14px;}
	.read_txt_wrap img{width:100% !important; height:auto !important;}
	.read_txt_wrap{padding:0;}
	.uploadcheck_adress input{width:100%;}
	.uploadcheck_adress .by_detail_adress{width:100%;}
	.uploadcheck_adress .wadress p{width:60px;}
	.uploadcheck_adress .by_zipcode{width:calc(80% - 70px);}
	.uploadcheck{padding:0;}
	.tip_box{margin-top:0;}
	
}

@media all and (max-width: 500px){
	.dregi_btn{width:100%;}
}

@media all and (max-width: 450px){
	.point_br{display:block;}
	.table_ty .point_p{line-height:1.3;}
	.greeting_na{font-size:16px;}
	.grname{font-size:16px;}
	.wrap-mycard{left:-55px;}
	.honor_area .title{font-size:14px;}
	.honor_area .title::before{top:10px;}
}

@media all and (max-width: 400px){
	.wrap-mycard{left:-70px;}
}


.mileage_area .table_ty{
	border-top:2px solid #666;
}

.table_ty .non_cen{text-align:left; line-height: 1.6; color:#000;}

.color_blue{
	line-height:1.5;
	position: relative;
  display: inline-block;
}

.color_blue{
	color:#4300FF;
}

.vm_lc{
	letter-spacing:0.5px;
}

.es_sub{
	font-size:16px;
	color:#FF5F00;
	margin-bottom:4px;
	margin-top:15px;
}

.vm_space2{
	display: inline-block;
  width: 59px;
}

.table_margin{
margin-bottom:15px;
}

.by_ma .vm_table_scroll {
    overflow-x: auto; /* 가로 스크롤을 만들기 위해 */
    max-width: 100%; /* 부모 요소의 너비에 맞추기 위해 */
}

.by_ma .minty {
    min-width: 700px; /* 최소 너비 설정 */
    width: 100%; /* 가로 너비 100%로 설정하여 부모 요소의 너비에 맞춤 */
}


.park_info > div{
	width:100%;
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-moz-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-moz-box-justify-content: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.park_info > div > div:first-child{
	padding-right:20px;
}

.park_info > div > div:last-child{
  width: 191px;
}

.pi_p{
	cursor:pointer;
	text-align:center;
}

.pi_p:hover{
	color:#1746A2;
}

.pi_p .fa{
	font-size:14px;
	position:relative;
	top:-1px;
}



.pi_img{
	width:100%;
}

/* 모달 배경 */
.modal-bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7); /* 반투명 배경 */
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 9999; /* 다른 요소 위에 표시 */
}

/* 모달 내부 */
.modal-content {
    position: relative;
    overflow: hidden; 
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
		width:auto;
		height:90%;
}

/* 이미지 */
.modal-content img {
	max-height: 100%; 이미지의 최대 높이
	height:100%; 
	width: auto; /* 이미지의 너비는 자동으로 조정 */
	object-fit: contain; /* 이미지가 비율 유지하면서 모두 표시될 수 있도록 설정 */
	display: block; /* 인라인 요소를 블록 요소로 변환 */
	margin: 0 auto; /* 이미지를 가운데 정렬 */
}

/* 클로스 버튼 스타일 */
.close {
	position: absolute;
	top: 0;
	right: 0;
	font-size: 30px;
	color: #fff;
	cursor: pointer;
	background-color: rgba(0, 0, 0, 0.3);
	width: 40px;
	height: 40px;
	line-height: 40px;
}

.vm_space02{
	display: inline-block;
	width:16px;
}

@media all and (max-width: 550px){
	.vm_space{display:none;}
	.modal-content{height:60%;}
}

@media all and (max-width: 500px){
	.es_sub{font-size:15px;}
	.table_ty td{font-size:13px;}
}



/** 메인페이지수정 - 20241126 **/
	.count_bak{
  position:relative;
  width:100%;
  height: 95px;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;

  -webkit-box-align: center;
  -moz-align-items: center;
  -ms-flex-align: center;
  align-items: center;

  -webkit-box-pack: center;
  -moz-box-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;

  /* background-color: #eff4f8;
  border-top: 1px solid #efe3ec;
  border-bottom: 1px solid #efe3ec; */
	
	margin-top:10px;
}

.notice_sec{
	padding-top:10px;
}

.wrap_count{
  position:relative;
  width: 100%;
  max-width:1280px;
  margin:0 auto;
  height:100%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;

  -webkit-box-align: center;
  -moz-align-items: center;
  -ms-flex-align: center;
  align-items: center;

  -webkit-box-pack: center;
  -moz-box-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
	background-color:#FFF6E3;
}

.wrap_count > .wrap_cb{
	flex:1;
	display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
	-webkit-box-align: center;
  -moz-align-items: center;
  -ms-flex-align: center;
  align-items: center;
	-webkit-box-pack: center;
  -moz-box-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
	height:60%;
	border-right:1px solid #ddd;
}

.count_box{

  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;

  -webkit-box-orient: vertical;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;

  -webkit-box-align: center;
  -moz-align-items: center;
  -ms-flex-align: center;
  align-items: center;

  -webkit-box-pack: center;
  -moz-box-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  height:100%;

}

/* .count_box:last-child{
  border-right:none;
} */

.wrap_count > .wrap_cb:last-child{
	border-right:none;
}

.count_box > p{
	font-size: 18px;
	line-height: normal;
}

.count_box > p:last-child{
	margin-top:5px;
}


.count_box > p > span{
  font-size:33px;
  font-weight: bold;
	/* color: #F96E2A; */
	color: #1C325B;
}

.mascot_img{
	width:176px;
	height:auto;
	left:0;
	bottom:5px;
}

.mascot_img > dotlottie-player{
	width:100%;
}

.quick_btn {
	animation: blink 1.5s step-start infinite;
}

.ordinary_box:hover .quick_btn{
	animation: none;
}

.wrap_quick1 .ordinary_box a:hover .quick_btn{
border:none;
}

@keyframes blink {
	50% {
		opacity: 0;
	}
}

@media all and (max-width: 769px){
	.count_bak{height:auto; padding:0 10px;}
	.wrap_count{
		height:auto;
		-webkit-box-lines: multiple;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	.wrap_count > .wrap_cb{
		width:50%;
		flex: auto;
		border-right:none;
		height:auto;
		max-height:67px;
		padding:10px 0;
	}
	.count_box > p{
		font-size:17px;
	}
	.count_box > p > span{
		font-size:25px;
	}
	
	.wrap_count > .wrap_cb:first-child{
		border-right:1px solid #ddd;
		border-bottom:1px solid #ddd;
	}
	.wrap_count > .wrap_cb:nth-child(3){
		border-right:1px solid #ddd;
	}

	.wrap_count > .wrap_cb:nth-child(2){
		border-bottom:1px solid #ddd;
		border-right:none;
	}

	
}

@media all and (max-width: 650px){
	.mascot_img{
		width: 97px;
		height: auto;
		left: auto;
		right:5px;
		position: absolute;
    bottom: 2px;
	}
}

@media all and (max-width: 500px){
	.wrap_count > .wrap_cb{padding:0;}
	.mascot_img{
		width: 77px;
		height: auto;
		left: auto;
		right:5px;
		position: absolute;
    bottom: 2px;
	}
	
	.count_box > p{
		font-size:16px;
	}
	.count_box > p > span{
		font-size:19px;
	}
	.count_box{
		padding:13px 0;
	}
}



@media all and (max-width: 380px){
	.mascot_img{
		width: 67px;
	}
}


@media all and (max-width: 366px){
	.mascot_img{
		width: 63px;
		height: auto;
		left: auto;
		right:1px;
		position: absolute;
    bottom: auto;
		top:7px;
	}
}
