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

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

				돌봄지도
				
********************************************/
.responsiveArea 		 											{ position:relative; width:100%; height:100%; border-top:1px solid #ddd; overflow:hidden }
.responsiveArea .map 												{ position:relative; width:100%; height:90vh;min-height:40rem;  }
.responsiveArea .map .icon											{ width:36px; filter:drop-shadow(2px 2px 4px #c3c3c3);}

/* 검색 */
.result_list														{ position:absolute; left:0; top:0; height:100%; width:425px; box-shadow:1px 1px 5px rgba(0,0,0,0.35); background:#fff; transition:left 0.5s; z-index:5 }
.result_list.close 													{ left:-425px; }
.result_list .search_wrap											{ position:relative; background:#fff; z-index:2; }
.result_list .search_wrap .tab_menu									{ background:#fdf0a7; padding:15px; display:flex; flex-wrap:wrap; gap:5px;}
.result_list .search_wrap .tab_menu>li button						{ display:flex; width:100%; height:40px; border-radius:5px; background:#fff; align-items:center; justify-content:center; font-size:15px; border:1px solid rgba(0,0,0,.15); }
.result_list .search_wrap .tab_menu>li								{ width:calc((100% - 10px) /3); }
.result_list .search_wrap .tab_menu>li .icon						{ display:inline-block; vertical-align:middle; width:25px; height:25px; border-radius:100%; position:relative; margin-right:5px; }
.result_list .search_wrap .tab_menu>li .icon::before				{ position:absolute; width:100%; height:100%; left:0; top:0; content:''; background-position:center; background-repeat:no-repeat; background-size:auto 15px; filter:invert(1);}
.result_list .search_wrap .tab_menu>li .icon1						{ background-color:var(--color-sky); }
.result_list .search_wrap .tab_menu>li .icon1::before				{ background-image:url(../images/contents/icon/icon01.svg); }
.result_list .search_wrap .tab_menu>li .icon2						{ background-color:#8b36ff; }
.result_list .search_wrap .tab_menu>li .icon2::before				{ background-image:url(../images/contents/icon/icon02.svg); }
.result_list .search_wrap .tab_menu>li .icon3						{ background-color:#008e4a; }
.result_list .search_wrap .tab_menu>li .icon3::before				{ background-image:url(../images/contents/icon/icon03.svg); }
.result_list .search_wrap .tab_menu>li .icon4						{ background-color:#ed2872; }
.result_list .search_wrap .tab_menu>li .icon4::before				{ background-image:url(../images/contents/icon/icon04.svg); }
.result_list .search_wrap .tab_menu>li .icon5						{ background-color:var(--color-orange); }
.result_list .search_wrap .tab_menu>li .icon5::before				{ background-image:url(../images/contents/icon/icon05.svg); }
.result_list .search_wrap .tab_menu>li .icon6						{ background-color:#ef1919; }
.result_list .search_wrap .tab_menu>li .icon6::before				{ background-image:url(../images/contents/icon/icon06.svg); }
.result_list .search_wrap .tab_menu>li.active button				{ background-color:var(--color-orange); color:#fff; }
.result_list .search_wrap .tab_menu>li.active button .icon			{ background-color:#fff; }
.result_list .search_wrap .tab_menu>li.active button .icon::before	{ filter:invert(0.1); }
.result_list .search_wrap .tab_box									{ padding:10px 15px; background:#f4f4f4; overflow-y:auto; overflow-x:hidden; max-height:6em; }
.result_list .search_wrap .tab_box .btn_box							{ display:flex; flex-wrap:wrap; justify-content:end; margin-bottom:.5em }
.result_list .search_wrap .tab_box .btn_box	.ref					{ position:relative; display:flex; background:#222; color:#fff; border-radius:30px; font-size:.85em; align-items:center; justify-content:center; padding:7px 10px; line-height:1; }
.result_list .search_wrap .tab_box .btn_box	.ref span::before		{ display:inline-block; vertical-align:middle; margin-right:5px; width:14px; height:14px; background:url(../images/contents/icon_refresh.svg) no-repeat 50% 50% / cover; content:''; }
.result_list .search_wrap .tab_box>ul								{ display:flex; flex-wrap:wrap; gap:10px 20px;}
.result_list .search_wrap .tab_box>ul>li							{ font-size:15px; display:flex; align-items:center; gap:0 5px; line-height:1 }
.result_list .search_wrap .search_form								{ padding:15px; }
.result_list .search_wrap .search_form>ul							{ display:flex; flex-wrap:wrap; gap:5px 10px;}
.result_list .search_wrap .search_form>ul>li						{ flex:auto; }
.result_list .search_wrap .search_form>ul>li *						{ width:100%;  border-radius:.5em; height:40px;}
.result_list .search_wrap .search_form>ul>li select					{ background:#ffffff url(../images/common/arr_brown.png) calc(100% - 1em) center no-repeat; padding-right:0;}
.result_list .search_wrap .search_form .btn>button					{ display:block; width:100%; background:var(--color-orange); color:#fff; }

.responsiveArea  .map_info{position: absolute;left: 440px;top: 10px;z-index: 3;background: rgba(255, 255, 255, .9);padding: 7px 15px;border-radius: 7px;}

/* 버튼 */
.controlBtn 														{ position:absolute; top:50%; right:-35px; width:70px; height:70px; background:var(--color-orange); border-radius:100%; transform:translateY(-50%); text-align:right; 
																		line-height:3rem; z-index:1; cursor:pointer }
.controlBtn>a														{ display:block; width:100%; height:100%; }
.controlBtn::before													{ position:absolute; width:11px; height:11px; right:10px; top:50%; border-style:solid; border-color:#fff; border-width:0 0 2px 2px; content:''; transform:translateY(-50%) rotate(45deg); 
																		transition:all 0.3s;}
.controlBtn.close::before											{ transform:translateY(-50%) rotate(-135deg); right:15px;  }


/** 리스트 **/
.result_list .cont 												{ position:relative; height:calc(100% - 23.5rem); padding:0; background:#fff; z-index:3;  }
.result_list .result_box 										{ position:relative; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; background:#faf7e3; padding:15px; z-index:3; text-align:center; 
																	border-top:1px solid #ffba8d}
.result_list .result_box .btn									{ font-size:15px; background:var(--color-orange); color:#fff; padding:5px 20px 3px 20px; border-radius:5px; }
.result_list .result_box p										{ text-align:right; font-weight:400; color:#343d48; letter-spacing:-.065em }
.result_list .result_box p strong								{ font-weight:400; margin-left:15px; }
.result_list .result_box p strong em							{ font-weight:bold; margin-right:5px; color:var(--color-orange) }
.result_list .result_box span									{ display:block; font-size:1em; color:rgba(52,61,72,.5); line-height:1.4; margin-top:.3em }
.result_list .cont .list_box 									{ height:calc(100% - 2rem);}
.result_list .cont .scroll_wrap 								{ height:calc(100% - .5rem); margin:.5rem 0 0 0; padding:0; overflow-x:hidden; overflow-y:auto } 
.result_list .cont .scroll_wrap::-webkit-scrollbar 				{ -webkit-appearance: none; width:3px;} 
.result_list .cont .scroll_wrap::-webkit-scrollbar:vertical 	{ width:5px; } 
.result_list .cont .scroll_wrap::-webkit-scrollbar:horizontal 	{ height:8px; } 
.result_list .cont .scroll_wrap::-webkit-scrollbar-thumb 		{ background-color:#6a6c6f; border-radius:10px; border:1px solid #6a6c6f; } 
.result_list .cont .scroll_wrap::-webkit-scrollbar-track 		{ border-radius:10px; background-color:#f1f1f1; }
.result_list .cont .search_list li								{ padding:1rem 1.5rem; border-bottom:1px dotted #9b9b9b;}
.result_list .cont .search_list dt								{ display:block; font-size:1.267em; font-weight:600; color:#000; letter-spacing:-.065em; }
.result_list .cont .search_list dd								{ font-size:15px; display:flex; align-items:center;}
.result_list .cont .search_list .clss							{ font-size:13px; }
.result_list .cont .search_list dd.add::before					{ display:inline-block; content:''; width:20px; height:15px; margin-right:5px; background:url(../images/contents/icon/icon_add.svg) no-repeat 0 0 / auto 15px; opacity:.7 }
.result_list .cont .search_list dd.tel::before					{ display:inline-block; content:''; width:20px; height:15px; margin-right:5px; background:url(../images/contents/icon/icon_tel.svg) no-repeat 0 0 / auto 12px; opacity:.7 }							
.result_list .paging_area										{ margin-top:7px;  }
.result_list .paging_area>ul									{ display:flex; align-items:center; justify-content:center; gap:4px; }
.result_list .paging_area>ul>li>a								{ position:relative; display:flex; align-items:center; justify-content:center; width:30px; height:30px; border:1px solid rgba(0,0,0,.1); border-radius:100%; font-size:13px; }
.result_list .paging_area>ul>li.on>a							{ background:var(--color-orange); border-color:var(--color-orange); color:#fff; }
.result_list .paging_area>ul>li.icon>a::before					{ position:absolute; position:absolute; width:9px; height:9px; left:50%; top:50%; border-style:solid; border-color:rgba(0,0,0,.5); content:''; transform:translate(-50%,-50%) rotate(45deg);}
.result_list .paging_area>ul>li.icon>a.page_prev::before		{ border-width:0 0 1px 1px; transform:translate(-40%,-50%) rotate(45deg);}
.result_list .paging_area>ul>li.icon>a.page_next::before		{ border-width:0 1px 1px 0; transform:translate(-60%,-50%) rotate(-45deg);}
.result_list .paging_area>ul>li.start>a::after,
.result_list .paging_area>ul>li.end>a::after					{ position:absolute; width:9px; height:9px; left:50%; top:50%; border-style:solid; border-color:rgba(0,0,0,.5); transform:translate(-50%, -50%); content:''; }
.result_list .paging_area>ul>li.start>a::before					{ border-width:0px 0px 1px 1px; transform:translate(-50%, -50%) rotate(45deg);}
.result_list .paging_area>ul>li.start>a::after					{ border-width:0px 0px 1px 1px; transform:translate(-10%, -50%) rotate(45deg);}
.result_list .paging_area>ul>li.end>a::before					{ border-width:1px 1px 0px 0px; transform:translate(-85%, -50%) rotate(45deg);}
.result_list .paging_area>ul>li.end>a::after					{ border-width:1px 1px 0px 0px; transform:translate(-45%, -50%) rotate(45deg);}


/* 모달창 */
.modal															{ display:none; }
.modal.active													{ display:block; }
.layerPop														{ position:absolute; width:100%; left:50%; top:50%; -webkit-transform:translate(50%, -70%); transform:translate(50%, -70%); max-width:400px; z-index:3}


.info_area														{ width:100%; background:#fff; border-radius:15px; overflow:hidden; box-shadow:0px 0px 8px rgba(0,0,0,0.25); padding-bottom:1rem	}
.info_area *													{ white-space:inherit !important }
.info_area .orange												{ display:block; font-size:1em; font-weight:400; padding:1.8rem 2rem 0 2rem; margin-bottom:.1em; color:var(--color-orange) }
.info_area h4													{ display:block; font-size:1.567em; font-weight:500; color:#000; padding:0 2rem 1rem 2rem; border-bottom:1px solid #eeeeee; word-break: normal !important; line-height: 1.2;}
.info_area .textArea											{ display:block; width:100%; margin:0; padding:1rem 2rem; max-height:20em; overflow-y:auto; overflow-x:hidden }
.info_area .detail_list li										{ float:none; display:flex; flex-wrap:wrap; position:relative; margin:0; padding-top:.3em; padding-bottom:.3em; overflow:hidden }
.info_area .detail_list li *									{ vertical-align:middle; line-height:1.6 }
.info_area .detail_list li .tt									{ min-width:26%; position:relative; font-size:1.033em; font-weight:300; color:rgba(0,0,0,.5)}
.info_area .detail_list li .txt									{ display:flex; flex-wrap:wrap; gap:0px 10px; align-items:center; width:74%; font-size:1.067em; color:rgba(0,0,0,.8); font-weight:300; letter-spacing:-.08em; line-height: 1.3; }
.info_area .detail_list li .txt a								{ display:inline-block; vertical-align:text-bottom; height:inherit; line-height:normal;  }
.info_area .detail_list li .site a								{ display:inline-block; border-radius:25px; font-size:13px; color:#fff; background:var(--color-blue); padding:5px 10px;  }
.info_area .detail_list li .site span							{ white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }
.info_area .detail_list li .site a::after						{ display:inline-block; vertical-align:middle; margin-left:5px; width:9px; height:9px; content:''; background:url(../images/common/i_newW.png) no-repeat 50% 50% / auto; }
.info_area .img													{ position:relative; width:100%; height:0; padding-top:50%; overflow:hidden; margin-top:.5em; }
.info_area .img	img												{ position:absolute; top:50%; left:50%; min-width:100%; min-height:100%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%);
   																	 -webkit-transform:translate(-50%,-50%); -moz-transform: translate(-50%,-50%); object-fit:cover; -o-object-fit:cover;}
.info_area .close_btn											{ position:absolute; width:40px; height:40px; left:50%; border-radius:100%; background:#222; transform:translateX(-50%); bottom:-18px; }
.info_area .close_btn::after									{ position:absolute; width:1px; height:15px; left:50%; top:50%; background:#fff; transform:translate(-50%,-50%) rotate(45deg); content:''; }
.info_area .close_btn::before									{ position:absolute; width:1px; height:15px; left:50%; top:50%; background:#fff; transform:translate(-50%,-50%) rotate(-45deg); content:''; }

@media all and (max-width:1565px){
	.responsiveArea .map										{ height:75vh }
}
@media all and (max-width:1368px){
	.responsiveArea .map										{ height:72vh }
	.result_list .search_wrap .tab_menu>li button,
	.result_list .search_wrap .tab_box>ul>li					{ font-size:14px; }
	.result_list .search_wrap .tab_menu>li .icon				{ width:22px; height:22px; background-size:auto 13px;}
	.result_list .cont											{ height:calc(100% - 21.5rem); }
	.result_list .cont .search_list li							{ padding:.75rem 1.5rem; }
	.info_area .orange											{ padding:1.5rem 1rem 0 1rem; }
	.info_area h4												{ padding:0 1rem 1rem 1rem; }
	.info_area .textArea										{ padding:1rem; max-height:17rem; overflow-y:auto; overflow-x:hidden}
	.result_list .cont .list_box 								{ height:calc(100% - 3.5rem);}
	
}
@media all and (max-width:1268px){
	.responsiveArea 											{ overflow:hidden; }
	.responsiveArea .map										{ min-height:34rem; max-height:48rem; position:relative; overflow:hidden}
	.result_list .search_wrap .tab_menu>li						{ width:calc((100% - 20px) / 5); }
	.result_list .search_wrap .tab_box							{ max-height:5em; }
	
	.responsiveArea  .map_info{left: 10px;top: 10px;}
	
	/* 검색결과 레이아웃 */
	.layerPop													{ -webkit-transform:translate(-50%, -50%); transform:translate(-50%, -65%); }
	.result_list 												{ position:absolute; left:0; top:inherit; bottom:0; width:100%; height:4rem; min-height:0; -webkit-transition: height 0.5s; transition: height 0.5s; }
	.result_list.close 											{ left:0; height:80%; }
	.result_list .result_box									{ position:absolute; left:0; bottom:0; width:100%; height:4rem; z-index:210; }
	.result_list .cont											{ position:initial; height:calc(100% - 12.5rem); border-top:none; background:none; }
	.result_list .cont .list_box								{ height:calc(100% - 11.5rem) }
	.controlBtn													{ left:50%; right:inherit; top:-30px; width:60px; height:60px; box-shadow:0 -4px 5px rgb(0 0 0 / 15%); transform:translate(-50%,0);}
	.controlBtn::before											{ right:inherit; left:50%; top:15px; transform:translate(-50%,0) rotate(135deg)}
	.controlBtn.close::before									{ right:inherit; top:10px; transform:translate(-50%,0) rotate(315deg)} 
}
@media all and (max-width:768px){
	.responsiveArea												{ overflow:inherit; height:auto; display:flex; flex-wrap:wrap; }
	.responsiveArea .map										{ min-height:inherit; max-height:inherit; height:50vh; }
	.result_list												{ position:initial; order:2; height:auto; box-shadow:none }
	.result_list .search_wrap .tab_box							{ max-height:inherit; overflow:inherit; }
	.controlBtn													{ display:none; }
	.result_list .result_box									{ position:initial; }
	.result_list .paging_area									{ padding:30px 0; }
	.result_list .cont .list_box								{ height:auto; }
	.layerPop													{ transform: translate(-50%, 0%); top:50px }
	.info_area .textArea										{ max-height: 12rem; }

	.responsiveArea  .map_info{left:0;top:0;width:100%;border-radius:0}
}
@media all and (max-width:668px){
	.result_list .search_wrap .tab_menu							{ padding:10px; }
	.result_list .search_wrap .tab_menu>li						{ width:calc((100% - 10px) /3)}
	.result_list .search_wrap .tab_menu>li button				{ height:36px; }
}
@media all and (max-width:568px){
	.result_list .search_wrap .tab_box							{ padding:10px; }
	.result_list .search_wrap .tab_menu>li button, 
	.result_list .search_wrap .tab_box>ul>li					{ font-size:13px; }
	.result_list .search_wrap .search_form						{ padding:10px; }
	.result_list .cont .search_list li							{ padding:.5rem 1rem; }
	.result_list .paging_area>ul>li>a							{ width:25px; height:25px; }
	.result_list .result_box									{ padding:10px; height:3.5rem }
	.layerPop 													{ max-width:300px!important; }
	.info_area .orange											{ padding:1rem 1rem 0 1rem }
	.info_area h4												{ padding:0 1rem .75rem 1rem; font-size:1.4em }
	.info_area .textArea										{ padding:.55rem 1rem 1rem 1rem; max-height:calc(100vh - 75vh); overflow-y:scroll; overflow-x:hidden  }
	.info_area .detail_list li									{ padding:.2em 0; }
	.info_area .detail_list li .tt,								
	.info_area .detail_list li .txt								{ font-size:.95em }
}
@media all and (max-width:414px){

	.result_list .search_wrap .tab_menu>li						{ width:calc((100% - 5px) / 2); }
	.result_list .search_wrap .search_form>ul>li:first-child	{ flex:0 1 100%; }
	.result_list .search_wrap .search_form>ul>li *				{ height:35px; min-height:35px;}
	.result_list .cont .scroll_wrap								{ margin-top:0; }
	.result_list .result_box									{ padding:8px 10px; }
	.result_list .cont .search_list dt							{ font-size:1.2em; }
	.result_list .cont .search_list dd							{ font-size:14px; }
}