@charset "utf-8";



body{padding-top:0;}
.site-header, .site-header_su{float:none;width:100%;background:#fff;}
.site-header .h_wrap, .site-header_su .h_wrap_su{display:flex;align-items:center;justify-content:space-between;height: 80px;padding: 0 25px;}
.site-header .logo, .site-header_su .logo_su{text-align:left;display:flex;align-items:center;gap:8px;}
.site-header .logo a, .site-header_su .logo_su a{display:inline-flex;align-items:center;}
.site-header .logo img, .site-header_su .logo_su img{display:block;height:28px;}
.site-header .logo-sub, .site-header_su .logo-sub_su{display:inline-block;font-size:14px;line-height:1.2;color: var(--hover-purple);font-weight: 700;max-width:110px;white-space:normal;word-break:keep-all;text-align:left;}
.hamburger, .hamburger_su{display:block;}
.btn-gnb, .btn-gnb_su{position:relative;display:inline-flex;flex-direction:column;justify-content:center;gap: 6px;background:transparent;cursor:pointer;}
.btn-gnb .bar, .btn-gnb_su .bar_su{display:block;width: 25px;height: 3px;background: var(--primary-purple);border-radius: 3px;}

/* 메뉴 */
.gnb, .gnb_su{display:none;background:#fff;}
.gnb .gnb-list, .gnb_su .gnb-list_su{padding:24px 20px;list-style:none;}
.gnb .gnb-list li+li, .gnb_su .gnb-list_su li+li{margin-top:12px;}
.gnb .gnb-list a, .gnb_su .gnb-list_su a{display:block;font-size:16px;line-height:1.4;color:#111;}
.side-widget, .side-widget_su{display:none;}

/* 재활용배출안내 */
.weekly, .weekly_su{display:none;}
/* 푸터 */
#footer{background: #f4f5f8;color: #292929;}
#footer .ft_wrap{padding: 24px 25px 32px;}
#footer .logo{margin:0 auto 16px;text-align:center;border-bottom: 1px solid rgba(255, 255, 255, 0.3);}
#footer .logo a{display:inline-block;}
#footer .logo img{margin:0 auto;width: 40%;margin-bottom: 25px;}
#footer .foot_shc{padding-top:23px;} 
#footer .foot_shc ul{display: flex;flex-wrap: nowrap;}
#footer .foot_shc li{width: 100%;text-align:center;}
#footer .foot_shc .ft_shc3{display:none;}
#footer .foot_shc .ft_shc4{display:none;}
#footer .foot_shc a{color: #292929;font-size:14px;}
#footer .foot_shc .ft_shc1 span{color:#f5a200;font-size: 15px;}
#footer .ft_left address,#footer .ft_left .tel,#footer .ft_left .copy{color: #292929;font-size:16px;line-height:1.6;margin:8px 0 0;font-style: normal;}
#footer .f_web{margin-top: 20px;}

@media (min-width:768px){
  body{padding-top:0;}
  .site-header, .site-header_su{float:none;width:100%;border-right:0;}
  .site-header .h_wrap, .site-header_su .h_wrap_su{display:flex;align-items:center;justify-content:space-between;height:80px;padding: 0 40px;}
  .site-header .logo, .site-header_su .logo_su{display:block;text-align:left;}
  .site-header .logo a, .site-header_su .logo_su a{display:inline-block;}
  .site-header .logo img, .site-header_su .logo_su img{height: 44px;margin:0;}
  .site-header .logo-sub, .site-header_su .logo-sub_su{display: inline-block;margin-top:4px;font-size: 18px;line-height: 44px;color: var(--hover-purple);font-weight:700;max-width:none;}
  .hamburger, .hamburger_su{display:block;}
  .gnb, .gnb_su{display:none;padding:0;}
  .gnb .gnb-list, .gnb_su .gnb-list_su{padding:24px 0 0;list-style:none;}
  .gnb .gnb-list li+li, .gnb_su .gnb-list_su li+li{margin-top:12px;}
  .gnb .gnb-list a, .gnb_su .gnb-list_su a{display:block;padding:16px 20px;border-radius:12px;background:var(--primary-purple);color:#fff;font-size:16px;font-weight:500;text-align:center;/* transition:all 0.3s ease; */}
  .gnb .pc_ver{transition:color .3s ease,background-color .3s ease-out;}
  .gnb .pc_ver:hover{background:#43358c;color:#fff;}
	
  /* footer */
  #footer .ft_wrap{display:block;padding: 24px 40px 50px;}
  #footer .logo{float:left;width: 20%;border-right:1px solid rgba(255,255,255,0.18);border-bottom:0;}
  #footer .logo img{margin:0;width: 100%;display: block;margin-right: 30px;}
  #footer .foot_shc ul{display:flex;align-items:center;justify-content:flex-end;gap: 35px;margin-right: 40px;}
  #footer .foot_shc li{width:auto;text-align:right;}
  #footer .foot_shc a{font-size:14px;display:inline-block;white-space:nowrap;}
  #footer .foot{float:left;width: 60%;margin-top: -11px;padding-right:0;margin-left: 30px;}
  #footer .ft_wrap::after{content:"";display:block;clear:both;}
}


/* PC */
@media (min-width:1200px){
  /* 레이아웃 래퍼: 헤더 높이 동기화 */
  .layout-wrap{display:flex;align-items:stretch;flex-wrap:wrap;}
  .main-content{flex:1;min-width:0;}
  
  .site-header, .site-header_su{width:var(--sidebar-w-pc);flex-shrink:0;box-shadow: 0 4px 12px rgba(0,0,0,0.08);} 
  .site-header .h_wrap, .site-header_su .h_wrap_su{padding: 78px 49px 0;}
  .site-header .logo img, .site-header_su .logo_su img{height:60px;}
  .site-header .logo-sub, .site-header_su .logo-sub_su{font-size: 21px;margin-top:10px;color: var(--hover-purple);font-weight: 700;white-space:nowrap;max-width:none;word-break:normal;text-align:center;}
  .hamburger, .hamburger_su{display:none;}
  
  .gnb, .gnb_su{display:block;padding:0 32px 32px;}
  .gnb .gnb-list, .gnb_su .gnb-list_su{margin-top: 87px;}
  .gnb .gnb-list li+li, .gnb_su .gnb-list_su li+li{margin-top: 20px;}
  .gnb .gnb-list a, .gnb_su .gnb-list_su a{padding: 18px 24px;font-size: 18px;border-radius: 12px;}
  
  /* 공통 버튼 클래스 */
  .gnb .gnb-list > li > a.menu-btn,
  .gnb .gnb-list > li > .top-link.menu-btn,
  .gnb_su .gnb-list_su > li > a.menu-btn_su,
  .gnb_su .gnb-list_su > li > .top-link_su.menu-btn_su{display:block;background:var(--primary-purple);color:#fff;font-weight:700;text-align:center;border-radius: 8px;box-shadow: 0 6px 13px rgba(104,86,204,.28);} 
  .gnb .gnb-list > li > a.menu-btn:hover,
  .gnb .gnb-list > li > .top-link.menu-btn:hover,
  .gnb_su .gnb-list_su > li > a.menu-btn_su:hover,
  .gnb_su .gnb-list_su > li > .top-link_su.menu-btn_su:hover{background:var(--hover-purple);} 
  .side-widget, .side-widget_su{display:block;}
  .gnb .gnb-list .sub_gnb, .gnb_su .gnb-list_su .sub_gnb_su{display:none;}

    /* footer */
  #footer{margin-left:0;width:100%;}
  #footer .ft_wrap{padding: 35px 100px 50px;display:block;}
  
  #footer .logo{float:left;width: 15%;border-right: 1px solid #b1b1b1;margin-top: 30px;}
  #footer .logo img{margin:0;width:100%;max-width:180px;height:auto;}
  #footer .foot_shc{float:right;margin:0;padding-top:0;border-top:0;margin-right: 70px;margin-top: 25px;}
  #footer .foot_shc ul{display:flex;align-items:center;gap: 45px;}
  #footer .foot_shc li{width:auto;text-align:right;}
  #footer .foot{float:left;width:50%;margin-top:0;padding-right:0;}
  #footer .ft_wrap::after{content:"";display:block;clear:both;}
  #footer .foot_shc .ft_shc3,#footer .foot_shc .ft_shc4{display: block;}
  #footer .foot_shc a{font-size:14px;}
  #footer .foot_w{width:100%;}
  #footer .f_web{float: right;margin-top: 25px;width: 6%;}

}
/* 모바일/태블릿 전용 드로워와 2차 메뉴 노출 */
@media (max-width:1199px){
  /* 헤더 고정 및 상단 여유 확보 */
  body{padding-top:80px;}
  .site-header, .site-header_su{position:fixed;top:0;left:0;right:0;z-index:1100;}
  /* 드로워 기본: 숨김 */
  .gnb, .gnb_su{position:fixed;right:0;top:80px;width:85%;max-width:360px;height:calc(100vh - 80px);z-index:1001;background:#fff;overflow:auto;display:none;}
  .gnb .gnb-list, .gnb_su .gnb-list_su{padding:18px 16px 40px;}
  .gnb .gnb-list > li > a, .gnb_su .gnb-list_su > li > a{display:block;padding:14px 16px;border-radius:6px;background:var(--primary-purple);color:#fff;font-weight:700;text-align:left;} 
  .gnb .gnb-list > li > a:hover, .gnb_su .gnb-list_su > li > a:hover{background:var(--hover-purple);} 
  .gnb .sub_gnb a, .gnb_su .sub_gnb_su a{background:#efeaff;color:#3c3280;padding: 13px 12px;border-radius:6px;text-align:center;}
  .gnb .sub_gnb, .gnb_su .sub_gnb_su{list-style:none;padding:10px 0 4px 12px;margin:0;display:none;}
  .gnb .has-sub.open > .sub_gnb, .gnb_su .has-sub_su.open > .sub_gnb_su{display:block;}
  .gnb .gnb-close, .gnb_su .gnb-close_su{display:none;}
  .gnb-dim, .gnb-dim_su{display:none;}
  .gnb-toggle:checked ~ .gnb, .gnb-toggle_su:checked ~ .gnb_su{display:block;}  
  .gnb, .gnb_su{top: 80px;height:100vh;} 
} 

/*로그인*/
    .login_wrap{max-width:900px;margin:80px auto;}
    .login_title{font-size:26px;font-weight:700;color:#6856cc;margin-bottom:24px}
    .auth_icon img{width:80%;}
    .auth_box{background:#fff;border-radius:20px;padding:60px 20px;text-align:center;box-shadow:0 10px 30px rgba(0,0,0,.05);border:1px solid #ddd;}
    .auth_icon{width:72px;height:72px;margin:0 auto 20px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:32px;color:#fff}
    .auth_title{font-size:24px;font-weight:700;color:#222;margin:0 0 12px}
    .auth_desc{font-size: 16px;line-height:1.6;color:#555;margin-bottom:32px}
    .auth_btn{width:180px;height:52px;border:none;border-radius:14px;background: #6856cc;color:#fff;font-size: 17px;font-weight:600;cursor:pointer;transition:background .2s}
    .auth_btn:hover{background: #333;}

    @media all and (min-width:1023px) {
        .auth_btn{min-width:260px;height:60px;}
    }

/* 배출시설 지도 */
.fm_wrap { display:grid; grid-template-columns:220px 1fr; gap:20px; margin-top:16px; }
.fm_left { position:relative; }
.fm_card { position:relative; }
.fm_select_btn {width:100%; height:48px; padding:0 16px; border-radius:10px; border:1px solid #d3d7df;background:#ffffff; color:#1f2937; font-weight:600; letter-spacing:-0.2px; text-align:left;box-shadow:0 1px 2px rgba(0,0,0,.04);}
.fm_select_btn:after {content:""; position:absolute; right:16px; top:50%; width:8px; height:8px; border-right:2px solid #64748b;border-bottom:2px solid #64748b; transform:translateY(-60%) rotate(45deg);}
.fm_dropdown {position:absolute; left:0; top:56px; width:100%; max-height:520px; overflow:auto; z-index:10;background:#fff; border:1px solid #e5e7eb; border-radius:12px; box-shadow:0 8px 24px rgba(0,0,0,.08);display:none;}
.fm_card.open .fm_dropdown {display:block;}
.fm_list { list-style:none; margin:0; padding:8px; }
.fm_option {display:flex; align-items:center; width:100%; padding:10px 12px; border-radius:8px; border:0; font-size: 15px; background:transparent;color:#111827; font-weight:500; text-align:left; cursor:pointer;}
.fm_option:hover { background:#f3f6ff; }
.fm_option.selected { background:#e9f0ff; color:#0b57d0; font-weight:700; }

.fm_statbar {display:grid; grid-template-columns:repeat(4, 1fr); gap:8px; margin-bottom:16px;}
.fm_stat {background:#f5f5f5;  border-radius:12px; padding:18px 10px; text-align:center;}
.fm_stat .fm_label { display:block; font-size:16px; color:#333; font-weight:600; margin-bottom:6px; }
.fm_stat .fm_num { display:block; font-size:18px; color:#333; font-weight:800; }
.fm_dropdown { display: none; }

.fm_map {height:560px;border: 1px solid #dddddd;border-radius:14px;position:relative;}

/* 배출시설지도_시설 선택 */
.fm_statbar .fm_stat{cursor:pointer;user-select:none;border:2px solid transparent;border-radius:12px;transition:background-color .2s,border-color .2s,box-shadow .2s,transform .05s}
.fm_statbar .fm_stat:active{transform:translateY(1px)}
.fm_statbar .fm_stat.is-selected{background-color: #e9e9e9;border-color: #c7c7c7;}
.fm_statbar .fm_stat.is-selected .fm_label{color:#333}
.fm_statbar .fm_stat.is-selected .fm_num{color:#333}
.fm_statbar .fm_stat img,.fm_statbar .fm_stat .fm_icon{opacity:.8;transition:opacity .2s,filter .2s}
.fm_statbar .fm_stat.is-selected img,.fm_statbar .fm_stat.is-selected .fm_icon{opacity:1;filter:saturate(1.2)}
@media (max-width: 1080px) {
	.fm_wrap { grid-template-columns:1fr; }
	.fm_statbar { grid-template-columns:repeat(3, 1fr); }
}
@media (max-width: 640px) {
	.fm_statbar { grid-template-columns:repeat(2, 1fr); }
}
/* 배출시설안내_시설버튼 (기본 상태) */
.fm_statbar a:nth-child(2) .fm_stat{background:#a1d0b140;}
.fm_statbar a:nth-child(2) .fm_label,.fm_statbar a:nth-child(2) .fm_num{color:#246f3e}

.fm_statbar a:nth-child(3) .fm_stat{background: #ffeff0;}
.fm_statbar a:nth-child(3) .fm_label,.fm_statbar a:nth-child(3) .fm_num{color:#d71b22}

.fm_statbar a:nth-child(4) .fm_stat{background:#fff8e2d4;}
.fm_statbar a:nth-child(4) .fm_label,.fm_statbar a:nth-child(4) .fm_num{color:#333}

.fm_statbar a:nth-child(5) .fm_stat{background:#ddf0ff80;}
.fm_statbar a:nth-child(5) .fm_label,.fm_statbar a:nth-child(5) .fm_num{color:#0871bf}

.fm_statbar a:nth-child(6) .fm_stat{background: #d9944c42;}
.fm_statbar a:nth-child(6) .fm_label,.fm_statbar a:nth-child(6) .fm_num{color:#905f2c}

/* 배출시설안내_시설버튼 (선택 상태) */
.fm_statbar a:nth-child(2) .fm_stat.is-selected{
background:#e1f3e8;border-color:#2e7d32;}
.fm_statbar a:nth-child(2) .fm_stat.is-selected .fm_label,
.fm_statbar a:nth-child(2) .fm_stat.is-selected .fm_num{color:#2e7d32}

.fm_statbar a:nth-child(3) .fm_stat.is-selected{
background##ffe0eb;border-color:#dd2027;}
.fm_statbar a:nth-child(3) .fm_stat.is-selected .fm_label,
.fm_statbar a:nth-child(3) .fm_stat.is-selected .fm_num{color:#db1e25}

.fm_statbar a:nth-child(4) .fm_stat.is-selected{
background:#ffd65b66;border-color:#f6bd2e;}
.fm_statbar a:nth-child(4) .fm_stat.is-selected .fm_label,
.fm_statbar a:nth-child(4) .fm_stat.is-selected .fm_num{color:#333}

.fm_statbar a:nth-child(5) .fm_stat.is-selected{
background:#d1ecff;border-color:#1987da;}
.fm_statbar a:nth-child(5) .fm_stat.is-selected .fm_label,
.fm_statbar a:nth-child(5) .fm_stat.is-selected .fm_num{color:#007bd7}

.fm_statbar a:nth-child(6) .fm_stat.is-selected{
background:#c5823c63;border-color:#905f2c;}
.fm_statbar a:nth-child(6) .fm_stat.is-selected .fm_label,
.fm_statbar a:nth-child(6) .fm_stat.is-selected .fm_num{color:#663d11}


/* 통계 대시보드 */
.tab-panel_sl { display: block; margin-top:50px;}

.stat-cards { display: grid; grid-template-columns: 1fr; gap: 12px; margin: 12px 0 20px; }
.stat-card { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid #cfcfcf; border-radius: 8px; background: #fafafa; }
.stat-card strong { display: block; font-size: 15px; color: #333; }
.stat-card em { display: block; font-style: normal; font-weight: 700; font-size: 18px; color: #111; }

.chart-grid {margin-bottom:20px;}
.chart_box {border:1px solid #cfcfcf; border-radius:8px; background:#fff;}
.chart_box {height:500px; margin-bottom:50px;}
.table-wrap { margin-top: 16px; }
.tbl-stats { width: 100%; border-collapse: collapse; }
.tbl-stats th, .tbl-stats td { border: 1px solid #ccd7ea; padding: 16px 8px; text-align: center; }
.tbl-stats thead th { background: #f2f5fa; color: #111; }
.tbl-stats tbody th { background: #f2f5fa; font-weight: 600; }

			
/* (연도/월) 공통 스타일 */
.fm_card { position:relative; }
.fm_select_btn {width:100%;height:48px;padding:0 40px 0 16px;border-radius:10px;border:1px solid #d3d7df;background:#ffffff;color:#333;font-weight: 500;letter-spacing:-0.2px;box-shadow:0 1px 2px rgba(0,0,0,.04);cursor:pointer;font-size: 15px;}
.fm_select_btn:focus {outline:none; border-color:#9db2ff; box-shadow:0 0 0 3px rgba(11,87,208,.15);}
.fm_select_btn option {padding:10px 12px;}
.fm_card.open .fm_select_btn:after {transform:translateY(-60%) rotate(-135deg);}


.tbl-stats tbody th { text-align: left; }
.tbl-stats tbody td { text-align: left; }

/* .tbl-stats tbody td:nth-child(2)::before { content: "악취"; display: inline-block; margin-right: 8px; font-weight: 600; color: #111; }
.tbl-stats tbody td:nth-child(3)::before { content: "쓰레기"; display: inline-block; margin-right: 8px; font-weight: 600; color: #111; }
.tbl-stats tbody td:nth-child(4)::before { content: "가전"; display: inline-block; margin-right: 8px; font-weight: 600; color: #111; }
.tbl-stats tbody td:nth-child(5)::before { content: "해양폐기물"; display: inline-block; margin-right: 8px; font-weight: 600; color: #111; }
.tbl-stats tbody td:nth-child(6)::before { content: "위험물"; display: inline-block; margin-right: 8px; font-weight: 600; color: #111; }
.tbl-stats tbody td:nth-child(7)::before { content: "재활용"; display: inline-block; margin-right: 8px; font-weight: 600; color: #111; }
.tbl-stats tbody td:nth-child(8)::before { content: "계"; display: inline-block; margin-right: 8px; font-weight: 600; color: #111; } */

@media (min-width: 641px){
	.stat-cards{ grid-template-columns: repeat(2, minmax(220px, 1fr)); }
	.tbl-stats { display: table; }
	.tbl-stats thead { display: table-header-group; }
	.tbl-stats tbody { display: table-row-group; }
	.tbl-stats tr { display: table-row; }
	.tbl-stats th, .tbl-stats td { display: table-cell; width: auto; text-align: center; }
	.tbl-stats tbody th { text-align: center; }
	.tbl-stats tbody td::before { display: none; content: none; }
	.tbl-stats tbody td:nth-child(2)::before,
	.tbl-stats tbody td:nth-child(3)::before,
	.tbl-stats tbody td:nth-child(4)::before,
	.tbl-stats tbody td:nth-child(5)::before,
	.tbl-stats tbody td:nth-child(6)::before,
	.tbl-stats tbody td:nth-child(7)::before,
	.tbl-stats tbody td:nth-child(8)::before { display: none; content: none; }
}               


/* 재활용  분리배출 안내 */
		.re_wrap { margin-top: 30px; }
		.re_cards { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
		.re_card { background:#f4f4f4; border-radius:12px; padding:18px 16px; box-shadow:0 2px 8px rgba(0,0,0,0.04); }
		.re_card h6 { margin:0 0 12px 0; font-size:18px; line-height:1.2; background:#6856cc; color:#fff; padding:10px 12px; border-radius:10px; }
                .re_card h6::before{display:none;}
		.re_card ul { list-style:none; margin:0; padding:2px 0 0 0; }
		.re_card ul li { position:relative; padding-left:14px; margin:8px 0; }
		.re_card ul li:before { content:""; width:6px; height:6px; border-radius:50%; background:#f5a200; position:absolute; left:0; top:6px; }
		
		@media (max-width: 1024px) { .re_cards { grid-template-columns: 1fr; } }

/* 폐의약품 안내 */
		.rx-steps{background: #f2f5fa;border-radius:16px;padding:20px 16px;}
		.rx-steps>ol{display:grid;gap:44px;}
		.rx-steps>ol>li{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:18px 14px;position:relative;}
		.rx-steps>ol>li:not(:last-child)::after{content:"";position:absolute;left:50%;bottom:-28px;transform:translateX(-50%);width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top: 12px solid #f5a200;}
		.rx-steps>ol>li>strong{display:block;font-size:18px;line-height:1.4;color:#333;margin-bottom:10px;word-break:keep-all;}
		.rx-steps>ol>li:first-child>div>ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
		.rx-steps>ol>li:first-child>div>ul>li{border:1px solid #e5e7eb;border-radius:10px;padding:12px 10px;color:#333;background:#fff;}
		.rx-badge{display:inline-block;margin-left:11px;margin-top: 7px;padding: 7px 13px;border-radius: 20px;background:#3b82f6;color:#fff;}
		.rx-warning{display:flex;align-items:center;gap:12px;font-size: 20px;}
		.rx-warning::before{content:"";display:inline-block;width:100px;height:100px;background:url('/images/clean/layout/nope.png') no-repeat 50% 50%/contain;}
		@media (min-width:768px){
			.rx-steps{padding:24px 20px;border-radius:18px;}
			.rx-steps>ol{gap:45px;}
			.rx-steps>ol>li{padding:20px 16px;}
			.rx-steps>ol>li:first-child>div>ul{grid-template-columns:repeat(3,minmax(0,1fr));}
			.rx-badge{margin-top:-3px;}
		}
		.rx-warning2{display:flex;align-items:center;gap:12px;font-size: 20px;}
		.rx-warning2::before{content:"";display:inline-block;width:100px;height:100px;background:url('/upload_data/board_data/BBS_0000522/177251403604951.png') no-repeat 50% 50%/contain;}

 /*재활용품인척하는 */
		.re_wrap2{margin-top:30px;}
		.re_wrap2 h5{background: #6856cc;color:#fff;padding:15px 20px;border-radius:10px;font-size: 20px;}
		.re_wrap2 h5::before{display:none;}
		.re_wrap2 h5 span{color: #ff8282;}
		.re_cards2{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
		.re_card2{border:1px solid #cecece;border-radius:12px;padding: 10px 20px;}
		.re_card2 h6{margin:0;font-size:18px;line-height:1.2;color: #333;padding: 10px 0;border-radius:10px;font-weight:700;}
		.re_card2 h6::before{display:none;}
		.re_card2 ul{list-style:none;margin:0;padding: 0px 0 0 0;}
		.re_card2 ul li{position:relative;padding-left: 19px;margin: 10px 0;}
		.re_card2 ul li:before{content:"";width:6px;height:6px;border-radius:50%;background:#f5a200;position:absolute;left: 0px;top:6px;}
		@media(max-width:1024px){.re_cards2{grid-template-columns:1fr;}}                               


/* 재활용품인 척하는 쓰레기 아이콘 */
		.illust{width: 100px;height:100px;margin:12px auto 0;display:block;background:url('/images/clean/layout/trush.png') no-repeat;background-size: 100%;}
		
		.ico-1{background-position: 0 34%;width: 120px;height:110px;}
		.ico-2{background-position: 0 28.7%;}
		.ico-3{background-position: 0 38.3%;width: 120px;height: 120px;}
		.ico-4{background-position: 0 43%;width: 120px;}
		.ico-5{background-position: 0 48%;margin-top: 23px;}
		.ico-6{background-position: 0 54%;height: 120px;}
		.ico-7{background-position: 0 59%;}
		.ico-8{background-position: 0 64%;margin-top: 20px;}
		.ico-9{background-position: 0 69%;}
		.ico-10{background-position: 0 73.5%;}
		.ico-11{background-position: 0 78.5%;}
		.ico-12{background-position: 0 83%;}
		.ico-13{background-position: 0 88.5%;}
		.ico-14{background-position: 0 93.5%;}
		.ico-15{background-position: 0 99%;}

/* 폐페트병 분리배출 단계 아이콘 */
		.basic_step .tr_img{ text-align:center; }
		.basic_step .tr_img span{display: block;position:relative;}
		.basic_step .tr_img span::after{content:"";position:absolute;left:50%;top: 19px;transform:translateX(-50%);background:url('/images/clean/layout/trush.png') no-repeat;}
		.basic_step .tr_img .tr_1::after{background-position:0 0;margin-top: 30px;}
		.basic_step .tr_img .tr_2::after{background-position: 0px 6%;margin-top: 40px;}
		.basic_step .tr_img .tr_3::after{background-position: 0 11%;margin-top: 30px;}
		.basic_step .tr_img .tr_4::after{background-position: 0 17%;margin-top: 38px;background-size: 85%;height: 120px;}
		.basic_step .tr_img .tr_5::after{background-position:0 100%;background: url('/images/clean/layout/trush2.png')no-repeat;width: 150px;margin-top: 43px;}
		
		.basic_step .tr_img{display:flex;justify-content:center;min-height:220px;}
		.basic_step .tr_img span{width:400px;text-align:center;padding: 30px 0 0 0;height: 190px;}
		.basic_step .tr_img span::after{width: 100px;height: 130px;}
		@media (max-width:1024px){
			.basic_step .tr_img span{width:200px;}
			.basic_step .tr_img span::after{width:120px;height:120px;}
		}                       


 /* 대시보드_ 지도 */
.report_map_wrap, .report_map_wrap *{box-sizing:border-box}
.report_map_wrap{display:grid;grid-template-columns:1fr;gap:16px;width:100%}
.report_left,.report_right{width:100%;min-width:0}

.report_filter{display:grid;gap:12px;width:100%}
.report_filter_item{position:relative;display:flex;flex-direction:column;gap:6px;width:100%}
.report_filter_label{font-size: 16px;font-weight:600;color:#333}

.date_range{display:flex;align-items:center;gap:6px;width:100%}
.date_input{flex:1;min-width:0;height:44px;padding:0 12px;font-weight: 500; color:#333; border:1px solid #d1d5db;border-radius:10px;font-size:15px}
.date_dash{flex:0 0 auto;font-size:14px;color:#6b7280}

.report_table_wrap{margin-top:16px;width:100%;overflow-x:auto}
.report_table{width:100%;border-collapse:collapse;table-layout:fixed}
.report_table th,.report_table td{border:1px solid #d1d5db;padding:10px;text-align:center;word-break:break-word;overflow-wrap:anywhere}
.report_table th{background:#f2f5fa;font-weight:600}

.report_btn_view{padding: 4px 16px;border-radius:6px;background: #e9e9e9;color: #333;font-size: 16px;font-weight: 500;}
.report_btn_view:hover{background:#6e6e6e;color:#fff;}

.report_map_area{width:100%;height:320px;border:1px solid #ddd;border-radius:14px}

.report_search{margin-top:4px}
.report_btn_search{width:100%;height:44px;border-radius:10px;border:0;background:#6856cc;color:#fff;font-size:15px;font-weight:600;cursor:pointer}
.report_btn_search:hover{background: #8473e2;}
.report_btn_search:active{transform:translateY(1px)}


@media(max-width:767px){
.report_map_wrap{overflow-x:hidden}
.report_table_wrap{overflow-x:hidden}
.report_table th:nth-child(1), .report_table td:nth-child(1){width:42%}
.report_table th:nth-child(2), .report_table td:nth-child(2){width:23%}
.report_table th:nth-child(3), .report_table td:nth-child(3){width:35%}
.report_table th,.report_table td{padding:7px 6px;font-size:14px;line-height:1.25}
.report_btn_view{padding:4px 10px;font-size:14px}
}

@media(min-width:768px){
.report_map_area{height: 550px;}
.date_range{gap:8px}
}

@media(min-width:1200px){
.report_map_wrap{grid-template-columns:360px 1fr;gap:24px}
.report_map_area{height:617px;}
.date_input,.fm_select_btn{height:48px;font-size:15px;font-weight: 500;}
.report_btn_search{height:48px;font-size:16px;}
}


/* 대시보드_ 통계팝업 */	
.photo_pop{display:block;position:fixed;inset:0;z-index:9999;padding:24px;overflow:auto;/* background:rgba(17,24,39,.58); */}
.photo_pop .inner{position:relative;margin: 50px 0 0 90px;width: 500px;height: 700px;background: #ffffff;border-radius:18px;padding: 40px;border: 1px solid #c7c7c7;box-shadow: 0 4px 12px rgb(0 0 0 / 12%);}
.photo_pop .pop_head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.photo_pop .pop_title{margin:0;font-weight:800;color:#111;}
.photo_pop .btn_close_x{width:40px;height:40px;border-radius:12px;border: 1px solid #c7c7c7;background:#fff;color: #111;font-weight:900;font-size:16px;cursor:pointer;transition: .15s ease,border-color .15s ease;line-height: 20px;}
.photo_pop .btn_close_x:hover{background:#f3f4f6;border-color:#d1d5db}
.photo_pop .btn_close_x:active{transform:translateY(1px)}

.toggle_table{width:100%;table-layout:fixed;border: 1px solid #c7c7c7;background:#fff;/* margin-top:10px; */}
.toggle_table th,.toggle_table td{padding: 16px 20px;border-right: 1px solid #ddd;line-height: 27px;}
.toggle_table th{text-align:left;font-weight:400;color: #333;line-height:26px;}
.toggle_table .row_parent td span{font-variant-numeric:tabular-nums}
.row_parent.is-open > th,.row_parent.is-open > td{background: #e6e2ff;} 
.toggle_table tr:last-child th,.toggle_table tr:last-child td{border-top:#ddd;}
.btn_toggle{margin-right: 26px;width:28px;height:28px;border: 1px solid #111;border-radius:999px;background: #111;color:#fff;font-weight:900;line-height: 1.2;cursor:pointer;transition:transform .15s ease,background .15s ease,border-color .15s ease}
.row_parent{background:#fff}
.row_parent2{background:#6856cc;color:#fff; font-weight:600;font-size:17px;}
.row_parent2 th{color:#fff;font-weight:600;font-size:17px;}
.row_child{overflow:hidden}
.row_child td{padding:0;border-top:0}
.row_child_inner{display:block}
.child_table{width:100%;table-layout:fixed;background:#ffffff}
.child_table th,.child_table td{padding:14px 18px;border-bottom:1px solid #eef2f7}
.child_table th{text-align:left;color:#333;}
.child_table td{text-align:left;color:#333;}
.child_table tr{cursor:pointer}
.child_table tr:hover > th,.child_table tr:hover > td{background:#f5f5f5}
.child_table tr:last-child th,.child_table tr:last-child td{border-bottom:0}

/* Tablet */
@media(max-width:1199px){
.photo_pop{padding:18px}
.photo_pop .inner{width:min(980px,100%);height:auto;max-height:calc(100vh - 96px);margin:48px auto;padding:28px;overflow:auto}
.toggle_table th,.toggle_table td{padding:14px 14px}
.btn_toggle{margin-right:16px}
.child_table th,.child_table td{padding:12px 12px}
}
@media(max-width:767px){
.photo_pop{padding:12px}
.photo_pop .inner{width:100%;height:auto;max-height:calc(100vh - 24px);margin:12px auto;padding:16px;border-radius:14px;overflow:auto}
.toggle_table th,.toggle_table td{padding:12px 10px;word-break: keep-all;}
.btn_toggle{margin-right:12px}
.child_table th,.child_table td{padding:10px 10px}
}

/* 폐형광등 컨텐츠 */
.led_guide{width:100%}
.led_top{text-align:center;background:#ffe66a;padding:30px 15px;border-radius:15px;margin-bottom:30px}
.led_eng{color:#1f9d63;font-weight:700;font-size:18px}
.led_top h3{font-size:32px;margin:5px 0;color:#1f9d63}
.led_txt{font-size:16px}
.led_wrap{display:flex;flex-direction:column;gap:25px;margin-bottom: 50px;}
.led_box{background:#f8f8f8;border-radius:15px;padding:20px;border:1px solid #e5e5e5}
.led_box h4{font-size: 26px;margin-bottom: 23px;display: flex;flex-direction: row;margin-top: 20px;}
.led_items{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.led_card{text-align:center;background:#fff;border-radius:10px;padding:15px;border:1px solid #eee}
.led_card img{max-width: 40%;margin:10px auto;display:block}
.led_card.small img{max-width: 30%;}
.led_title{font-weight:700;margin-bottom:5px;font-size: 17px;}
.led_desc{font-size: 15px;color: #292929;}
.led_result{text-align:center;margin-left: 49px;padding: 9px 17px;border-radius:10px;color:#fff;font-weight: 600;font-size: 18px;/* width: 9%; */float: right;margin-top: 5px;}
.led_result img{max-width: 22%;margin:auto;display:block;margin-bottom:10px}

.green{background:#22a060}
.blue{background:#1e7cc7}

.led_bottom{margin-top:30px;padding-top:20px;border-top:1px solid #ddd}
.led_info{margin-bottom:15px}
.led_info li{margin-bottom:5px}
.led_org a{display:block;margin-bottom:10px;color:#1e7cc7}
.led_tel{margin-top:10px;font-weight:700}

@media(max-width:600px){
.led_items{grid-template-columns:1fr}
.led_top h3{font-size:26px}
}                 

.led_result{position:relative;margin-top: -6px;}
.led_result.green:before{content:"";position:absolute;top: -5px;left: -11%;transform:translateX(-50%);width: 162px;height: 52px;background:url('/upload_data/board_data/BBS_0000522/177503145275785.png') no-repeat center/contain;}
.led_result.blue:before{content:"";position:absolute;top: -5px;left: -5%;transform:translateX(-50%);width: 162px;height: 52px;background:url('/upload_data/board_data/BBS_0000522/177503161058322.png') no-repeat center/contain}                                                      

/* 푸터 바로가기 링크 */
#footer .ft_links{margin-top:15px;}
#footer .ft_links ul{font-size:0;text-align:right;}
#footer .ft_links li{display:inline-block;vertical-align:top;margin-left:8px;margin-bottom:8px;}
#footer .ft_links li:first-child{margin-left:0;}
#footer .ft_links a{display:inline-block;border-radius: 8px;background:#e9e9e9;color:#333;font-size: 14px;font-weight: 500;text-align:center;padding: 15px 31px;transition:background .3s ease;}
#footer .ft_links a:hover{background:#ccd7ea;}
#footer .ft_links a:focus-visible{outline:3px dashed #000;outline-offset:2px;}

@media (max-width:767px){
#footer .ft_links ul{text-align:center;}
#footer .ft_links li{display:block;width:100%;margin:0 0 8px 0;}
#footer .ft_links a{display:block;width:100%;}
}
@media (min-width:768px) and (max-width:1199px){
#footer .ft_links{clear:both;text-align:right;}
#footer .ft_links ul{text-align: center;margin-bottom: -65px;padding-top: 25px;}
}
@media (min-width:1200px){
#footer .ft_links{float:right;margin-top: 30px;max-width:420px;}
#footer .ft_links ul{text-align:right;}
#footer .ft_links a{padding: 10px 28px;}
}  