@charset "UTF-8";



.red {
	color: #FD481C;
}
.orange {
	color: #FF850C;
}
.yellow {
	color: #FFC136;
}
.yellow2 {
	color: #FFB000;
}
.blue {
	color: #6EB2F3 !important;
}
.blue2 {
	color: #69AEF2 !important;
}
.green {
	color: #6CD700 !important;
} 
.green2 {
	color: #48CCDE;
} 
.gray {
	color: #AEBCC4;
}
.purple {
	color: #54248E;
}
.lightpurple {
	color: #9C9CFF;
}
.sky1 {
	/* color: #6BE1ED; */
	color: #8eb8f9;
}
.sky2 {
/* 	color: #6EB2F3; */
	color: #7ce2ba;
}
.sky3 {
/* 	color: #7DA5B7; */
	color: #f0c51e;
}
.sky4 {
/* 	color: #586073; */
	color: #de2929;
}
.red_back {
	background: #FD481C !important;
	color: #fff !important;
}
.orange_back {
	background: #FF850C !important;
	color: #fff !important;
}
.orange_back2 {
	background: #FFAA00 !important;
	color: #fff !important;
}
.orange_back3 {
	background: #FF850C !important;
	color: #fff !important;
}
.orange_back4 {
	background: #FFF6EE !important;	
}
.yellow_back {
	background: #FFC136 !important;
	color: #fff !important;
}
.yellow_back2 {
	background: #FFB000 !important;
	color: #fff !important;
}
.yellow_back3 {
	background: #FFF5DF;
}
.blue_back {
	background: #6EB2F3 !important;
	color: #fff !important;
}
.blue_back2 {
	background: #69AEF2 !important;
	color: #fff !important;
}
.blue_back3 {
	background: #E9F4FF !important;
}
.green_back {
	background: #6CD700 !important;
	color: #fff !important;
} 
.green_back2 {
	background: #A8C644 !important;
	color: #fff !important;
} 
.green_back3 {
	background: #48CCDE !important;
	color: #fff !important;
} 
.green_back4 {
	background: #E9FFFE !important;
	}
.gray_back {
	background: #AEBCC4 !important;
	color: #fff !important;
}
.purple_back {
	background: #54248E !important;
	color: #fff !important;
}
.lightpurple_back {
	background: #B3B3FF !important;
	color: #fff !important;
}
.lightpurple_back2 {
	background: #F4F4FF !important;
}
.lightpurple_pastel {
	background: #E1E1FF !important;
	color: #9C9CFF !important;
}
.sky1_back {
/* 	background: #6BE1ED !important; */
	background: #8eb8f9 !important;
	color: #fff !important;
}
.sky2_back {
/* 	background: #6EB2F3 !important; */
	background: #7ce2ba !important;
	color: #fff !important;
}
.sky3_back {
/* 	background: #7DA5B7 !important; */
	background: #f0c51e !important;
	color: #fff !important;
}
.sky4_back {
/* 	background: #586073 !important; */
	background: #de2929 !important;
	color: #fff !important;
}
.red_pastel {
	color: #FD481C;
	background: #FFEFEC !important;
}
.orange_pastel {
	color: #FF850C;
	background: #FFF2E6 !important;
}
.orange_pastel2 {
	color: #FFAA00;
	background: #FFF2E6 !important;
}
.orange_pastel3 {
	color: #FF850C;
	/* background: #FFE5CB !important; */
}

.yellow_pastel {
	color: #FFC136;
	background: #FFF9DD;
}
.yellow_pastel2 {
	background: #FFFEF5;
}
.yellow_pastel3 {
	color: #FFE8B4;
	background: #F5A900 !important;
}

.blue_pastel {
	color: #6EB2F3;
	background: #F1F7FF !important;
}
.blue_pastel2 {
	background: #F8FBFF;
}
.blue_pastel3 {
	background: #D1E8FF;
	color: #69AEF2;
}
.green_pastel {
	color: #6CD700;
	background: #EAFFD7;
} 
.green_pastel2 {
	color: #A8C644;
	background: #F8FFE1;
}
.green_pastel3 {
	color: #48CCDE;
	background: #D3FEFC;
}
.gray_pastel {
	color: #AEBCC4;
	background: #F7FBFB;
}

.gray_pastel2 {
	background: #F4F4F4;
}


.title_header {
	display: flex;
	flex-direction: column;
	margin: 0;
	width: 100%;
}
.title_header .header_box {
	display: flex;
	justify-content: space-between;
	margin: 0;
	align-items: center;
}
.title_header .title .tulle_tip_hover {
	display: none;
	/* height: 26px; */
	/* position: absolute; */
	/* background: #ddd; */
	/* border-radius: 10px; */
	position: absolute;
	background: #767676;
	height: 18px;
	/* white-space: nowrap; */
	font-size: 10px;
	top: 55px;
	border-radius: 5px;
	justify-content: center;
	align-items: center;
	padding: 0 15px;
	color: white;
}
.title_header.small .title .tulle_tip_hover::after {
    display: block;
    position: absolute;
    left: 50%;
    content: '';
    transform: rotate(135deg) translate(0px, 5px);
    border-bottom: 10px solid #767676;
    border-left: 0px solid transparent;
    border-right: 10px solid transparent;
    top: 0px;
}
.title_header.small:hover .title .tulle_tip_hover {
	display: flex;
}
.title_header .title {
	margin: 0;
	color: #696969;
	font-family: 'NanumSquare';
	font-weight: 500;
	font-size: 16px;
	text-overflow: ellipsis;
	white-space: nowrap;
	word-break:break-all;
	overflow: hidden;
	word-break: break-all;
	/* position: relative; */
}
.title_header .popup_btn {
	background: url('./image/address_btn.png') no-repeat right;
	width: 15px;
	height: 18px;
	background-size: contain;
	margin: 0;
	cursor: pointer;
	z-index: 1;
}
.title_header .address_btn {
	margin: 0;
	text-align: left;
	margin-top: 8px;
	background: #fff0;
	color: #ACACAC;
	font-weight: 400;
	font-size: 14px;
	cursor: pointer;
}
.title_header .address_btn.small {
	display:none;
}
.title_header .tab {
	margin: 0;
	display: flex;
	gap: 5px;
}
.title_header .tab > button {
	padding: 0 15px;
	border-radius: 50px;
	height: 35px;
	background: #F4F4F4;
	font-weight: 400;
	color: #696969;
}
.title_header .tab > button.plus_btn {
	
font-size: 28px;
	
font-weight: 200;
	
width: 35px;
	
height: 35px;
	
display: flex;
	
justify-content: center;
	
align-items: center;
	
align-content: center;
	
color: #D9D9D9;
}
.title_header .tab > button.on {
background: #696969;		
color: #fff;
}
.main_topic {
	height: calc(100% - 42px - 16px);
	width: 100%;
	padding: 26px 0;
	box-sizing: border-box;
}
.main_topic.middle {padding: 10px 0 !important;height: calc(100% - 42px - 26px) !important;}
.main_topic2.middle {padding: 10px 0 !important;height: calc(100% - 42px - 26px) !important;}
.main_topic.small {
	
}
.main_topic.mrkr.big select {
    border-radius: 10px;
    background: #fff url(./image/new/select.png) no-repeat 98% 50%;
    cursor: pointer;
    height: 40px;
    font-weight: 500;
    color: #696969;
    background-size: 12px;
    display: block;
}
.main_topic.mrkr.middle select {
    border-radius: 10px;
    background: #fff url(./image/new/select.png) no-repeat 96% 50%;
    cursor: pointer;
    height: 35px;
    font-weight: 500;
    color: #696969;
    background-size: 12px;
}
.map_popup {
	
	display: flex;	
	justify-content: flex-end;
}
.map_popup .map_btn {
		
	background: #f4f4f4 url(./image/map_btn.png) no-repeat center;	
	width: 26px;		
	height: 26px;		
	background-size: 46%;		
	border-radius: 30px;		
	background-position: center;		
	margin: 0;		
	margin-left: 6px;		
	cursor: pointer;
}
.map_popup .modal_btn {
	margin: 0;
	height: 26px;
	background: #F4F4F4;
	border-radius: 30px;
	width: 96px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	font-weight: 500;
	cursor: pointer;
}
.map_popup .modal_btn.small {	
	width: 25px;
}
.map_popup .modal_btn.small span {
	display: none;
}
.map_popup .modal_btn span {
	margin: 0;
}
.map_popup .modal_btn.small span.plus {
	margin: 0;
}
.map_popup .modal_btn span.plus {
	background: #f4f4f4 url(./image/+_btn.png) no-repeat 50%;
	width: 14px;
	height: 14px;
	background-size: contain;
	margin: 0;
	margin-left: 5px;
	background-position: center;
	display: block;
}





/* 위젯 기본 s */
.widget_pop .address {
	
display: flex;
	
gap: 10px;
}
.widget_pop .txt {
	font-size: 14px;
	color: #707070;
	font-weight: 600;
	/* padding: 14px 0; */
	background: none;
	/* width: 100%; */
	text-align: left;
	border-top: 1px solid #EEEEEE;
	height: 35px;
	line-height: 35px;
	/* margin: 18px 0; */
	margin: 0;
}
.widget_pop .address_search {
	position: relative;
	margin: 0;
	/* margin-right: 5px; */
	width: calc(100% - 45px);
}
.widget_pop input[type="text"] {
	height: 35px;
	background: #F5F5F5;
	min-width: 150px;
	margin-bottom: 14px;
	padding: 0 45px 0 20px;
	line-height: 35px;
}
.widget_pop .search {
	background: url('./image/new/main_search.png') no-repeat 50%;
	width: 35px;
	height: 35px;
	position: absolute;
	right: 10px;
	top: 0;
	background-size: 50%;
	padding: 0;
	cursor: pointer;
}
.widget_pop .gps {
	background: #f5f5f5 url(./image/new/main_gps.png) no-repeat 50%;
	width: 35px;
	height: 35px;
	margin: 0;
	background-size: 50%;
	cursor: pointer;
	border-radius: 50px;
	background-position: center;
}
/* 위젯 기본 e */




/* 보드추가 s */
.addWidget .pop-up-plus {
	/* padding: 22px; */
	top: calc(50% - -70px);
	/* transform: translate(10px, 10px); */
	height: 332px;
	left: 100px;
}
.addWidget .board-search {
	height: 30px;
	border: none;
}
.addWidget .board-search input {
	height: 30px;
	line-height: 30px;
	background: whitesmoke;
}
.addWidget .board-search .search-button {
	background: url(./image/new/main_search.png) no-repeat 50%;
    width: 30px;
    height: 30px;
    position: absolute;
    right: 10px;
    top: 0;
    background-size: 60%;
    padding: 0;
    cursor: pointer;
}
.addWidget .pop-up-plus>.plus-content {
	margin-bottom: 20px;
}
.addWidget .widgetName {
	padding-left: 20px !important;
	margin: 0 !important;
	height: 34px;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	text-align: left;
	width: 100%;
}
.addWidget .board-title-check {
	margin-right: 15px;
	height: 100%;
}
.addWidget .board-content {
	width: 100%;
}
.addWidget .widgetName .grid-stack-item-content {
	padding: 6px 0;
	text-align: left;
	margin: 0;
}
.addWidget .pop-up-plus>.plus-content {
	max-height: 184px;
	height: initial;
}
.addWidget .board-content > div {
	margin: 0;
}
.addWidget .widgetName .grid-stack-item-content div {
	margin-right: 15px;
}
.addWidget .board-row {
	margin: 0;
}
/* 보드추가 e */

/*위젯 주소 및 사이즈 팝업 s*/
.widget_popup {
	display: none;
	background: #fff;
	/* height: 300px; */
	min-width: 250px;
	padding: 10px 22px;
	margin: 0;
	border-radius: 20px;
	z-index: 10;
	position: absolute;
	box-shadow: 0px 0px 12px 4px #0000000f;
	margin: 22px;
}
.widget_popup.on {
	display: block;
}
.widget_popup .date {
	font-size: 13px;
	color: #acacac;
	/* border-bottom: 1px solid #EEEEEE; */
	height: 35px;
	/* padding: 14px 0; */
	display: flex;
	margin: 0;
	line-height: 35px;
}
.widget_popup_header {
	display: flex;
	justify-content: space-between;
	margin: 14px 0;
}
.remove-box {
	width: 100%;
	margin-bottom: 14px;
}
.remove-box .elimination {
	    width: 100%;
    border-top: initial;
    display: flex;
    background: #ffefef;
    align-items: center;
    justify-content: center;
    color: #fa3f3f;
    border-radius: 5px;
}
.widget_popup .txt.elimination {
	cursor: pointer;
}
.widget_popup .button {
	display: flex;
	gap: 10px;
	height: 44px;
	padding-bottom: 14px;
	/* border-bottom: 1px solid #EEEEEE; */
}
.widget_popup .button button.on {
	color: #fff;
	background: #acacac;
}
.widget_popup .button button {
	width: 100%;
	border-radius: 5px;
	font-size: 14px;
	color: #ACACAC;
	cursor: pointer;
}

/*위젯 주소 및 사이즈 팝업 e*/
/*위젯 주소 설정 팝업 s*/
.widget_address_popup {
	display: none;
	background: #fff;
	/* height: 300px; */
	width: 278px;
	padding: 10px 22px;
	margin: 0;
	border-radius: 20px;
	z-index: 10;
	position: absolute;
	box-shadow: 0px 0px 12px 4px #0000000f;
}
.widget_address_popup.on {
	display: block;
}
.widget_address_header  {
	display: flex;
	padding: 10px 0;
	justify-content: space-between;
}
.widget_address_popup .txt {
	border: none;
}

/*위젯 주소 설정 팝업 e*/
















/*댐 가뭄 단계 정보 s*/
.main_topic.dam {
	display: none;
} 
/*대 s*/
.main_topic.dam.big {
	display: block;
} 
.main_topic.dam.big .caution {
	height: calc(100% - 40px - 40px - 20px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin-bottom: 20px;
}
.main_topic.dam.big select {
	border-radius: 10px;
	background: #fff url('./image/new/select.png') no-repeat 98% 50%;
	cursor: pointer;
	height: 40px;
	font-weight: 500;
	color: #696969;
	background-size: 12px;
} 
.main_topic.dam.big ul {
	
	display: flex;
		
	justify-content: center;
		
	gap: 5px;
		
	/* margin-top: 30px; */
}
.main_topic.dam.big ul li {
		
	display: flex;		
	justify-content: center;		
	background: #F4F4F4;		
	color: #696969;		
	width: 92px;		
	height: 30px;		
	margin: 0;	
	border-radius: 30px;		
	align-items: center;	
	font-weight: 500;		
	font-size: 16px;
}
.main_topic.dam.big .adjustment {
	display: none;
}
.main_topic.dam.big .adjustment .tulle_tip_hover {
	display: none;
}
.main_topic.dam.big .img {
	background: #fff url('./image/new/dam/dam_green.png') no-repeat 100% 50%;
	width: 45%;
	height: 45%;
	background-size: contain;
	margin-top: 20px;
	background-position: center;
}
.main_topic.dam.big .middle_txt {
	display: none;
}

.main_topic.dam.big .txt {
	font-size: 20px;
	margin-top: 30px;
}

.main_topic.dam.big .txt span {
	
	font-weight: 500;
}
.main_topic.dam.big .range {
	height: 40px;
	display: flex;
	align-content: center;
	align-items: center;
}
.main_topic.dam.big .range .bar {
	width: 100%;
	background: #F4F4F4;
	height: 4px;
	position: relative;
	border-radius: 10px;
}
.main_topic.dam.big .range .bar .tulle_tip {
	width: 200px;
	position: absolute;
	top: -60px;
	height: 35px;
	display: flex;
	justify-content: center;
	align-items: center;
	left: calc(30% - 100px);
}
.main_topic.dam.big .range .bar .tulle_tip.on {
	width: 200px;
	position: absolute;
	top: -60px;
	height: 35px;
	display: flex;
	justify-content: center;
	align-items: center;
	left: calc(10%);
}
.main_topic.dam.big .range .bar .tulle_tip.off {
	width: 200px;
	position: absolute;
	top: -60px;
	height: 35px;
	display: flex;
	justify-content: center;
	align-items: center;
	left: calc(10%);
}
.main_topic.dam.big .range .bar .rod {
	
width: 30%;
	
background: #6cd700;
	
height: 4px;
	
position: absolute;
	
left: 0;
	
border-radius: 10px;
}
.main_topic.dam.big .range .bar .drop {
	width: 18px;
	height: 24px;
	position: absolute;
	
	background: url('./image/new/dam/water_green.png') no-repeat;
	background-size: contain;
	top: -8px;
	left: calc(30% - 9px);
}
.main_topic.dam.big .range .bar .tulle_tip.green_pastel:after {
	content: '';
	display: block;
	position: absolute;
	/* left: -50%; */
	bottom: -5px;
	content: '';
	width: 10px;
	height: 10px;
	/* border-top: 10px solid #eaffd7; */
	border-right: 10px solid #eaffd7;
	border-bottom: 10px solid #eaffd7;
	transform: rotate(45deg);
	/* transform: translate(-50%, -50%); */
}
.main_topic.dam.big .range .bar .tulle_tip.green_pastel.on:after {
	content: '';
	display: block;
	position: absolute;
	left: -10px;
	bottom: -10px;
	content: '';
	width: 0px;
	height: 0px;
	/* background: #ffefec; */
	border-top: 10px solid #eaffd700;
	border-left: 10px solid #eaffd700;
	border-right: 10px solid #eaffd7;
	border-bottom: 10px solid #eaffd7;
	transform: rotate(315deg);
	/* transform: translate(-50%, -50%); */
}
.main_topic.dam.big .range .bar .tulle_tip.green_pastel.off:after {
	content: '';
	display: block;
	position: absolute;
	right: -10px;
	bottom: -10px;
	content: '';
	width: 0px;
	height: 0px;
	/* background: #ffefec; */
	border-top: 10px solid #eaffd7;
	border-left: 10px solid #eaffd7;
	border-right: 10px solid #ffefec00;
	border-bottom: 10px solid #ffefec00;
	transform: rotate(315deg);
	/* transform: translate(-50%, -50%); */
}
.main_topic.dam.big .range .bar .tulle_tip.blue_pastel:after {
	content: '';
	display: block;
	position: absolute;
	/* left: -50%; */
	bottom: -5px;
	content: '';
	width: 10px;
	height: 10px;
	/* border-top: 10px solid #eaffd7; */
	border-right: 10px solid #f1f7ff;
	border-bottom: 10px solid #f1f7ff;
	transform: rotate(45deg);
	/* transform: translate(-50%, -50%); */
}
.main_topic.dam.big .range .bar .tulle_tip.blue_pastel.on:after {
	content: '';
	display: block;
	position: absolute;
	left: -10px;
	bottom: -10px;
	content: '';
	width: 0px;
	height: 0px;
	/* background: #ffefec; */
	border-top: 10px solid #f1f7ff00;
	border-left: 10px solid #f1f7ff00;
	border-right: 10px solid #f1f7ff;
	border-bottom: 10px solid #f1f7ff;
	transform: rotate(315deg);
	/* transform: translate(-50%, -50%); */
}
.main_topic.dam.big .range .bar .tulle_tip.blue_pastel.off:after {
	content: '';
	display: block;
	position: absolute;
	right: -10px;
	bottom: -10px;
	content: '';
	width: 0px;
	height: 0px;
	/* background: #ffefec; */
	border-top: 10px solid #f1f7ff;
	border-left: 10px solid #f1f7ff;
	border-right: 10px solid #ffefec00;
	border-bottom: 10px solid #ffefec00;
	transform: rotate(315deg);
	/* transform: translate(-50%, -50%); */
}
.main_topic.dam.big .range .bar .tulle_tip.red_pastel:after {
	content: '';
	display: block;
	position: absolute;
	/* left: -50%; */
	bottom: -5px;
	content: '';
	width: 10px;
	height: 10px;
	/* border-top: 10px solid #eaffd7; */
	border-right: 10px solid #ffefec;
	border-bottom: 10px solid #ffefec;
	transform: rotate(45deg);
	/* transform: translate(-50%, -50%); */
}
.main_topic.dam.big .range .bar .tulle_tip.red_pastel.on:after {
	content: '';
	display: block;
	position: absolute;
	left: -10px;
	bottom: -10px;
	content: '';
	width: 0px;
	height: 0px;
	/* background: #ffefec; */
	border-top: 10px solid #ffefec00;
	border-left: 10px solid #ffefec00;
	border-right: 10px solid #ffefec;
	border-bottom: 10px solid #ffefec;
	transform: rotate(315deg);
	/* transform: translate(-50%, -50%); */
}
.main_topic.dam.big .range .bar .tulle_tip.red_pastel.off:after {
	content: '';
	display: block;
	position: absolute;
	right: -10px;
	bottom: -10px;
	content: '';
	width: 0px;
	height: 0px;
	/* background: #ffefec; */
	border-top: 10px solid #ffefec;
	border-left: 10px solid #ffefec;
	border-right: 10px solid #ffefec00;
	border-bottom: 10px solid #ffefec00;
	transform: rotate(315deg);
	/* transform: translate(-50%, -50%); */
}
.main_topic.dam.big .range .bar .tulle_tip.on.orange_pastel:after {
	content: '';
	display: block;
	position: absolute;
	left: -10px;
	bottom: -10px;
	content: '';
	width: 0px;
	height: 0px;
	/* background: #ffefec; */
	border-top: 10px solid #fff8dd00;
	border-left: 10px solid #fff8dd00;
	border-right: 10px solid #fff8dd;
	border-bottom: 10px solid #fff8dd;
	transform: rotate(315deg);
	/* transform: translate(-50%, -50%); */
}
.main_topic.dam.big .range .bar .tulle_tip.orange_pastel:after {
	content: '';
	display: block;
	position: absolute;
	/* left: -50%; */
	bottom: -5px;
	content: '';
	width: 10px;
	height: 10px;
	/* border-top: 10px solid #eaffd7; */
	border-right: 10px solid #fff8dd;
	border-bottom: 10px solid #fff8dd;
	transform: rotate(45deg);
	/* transform: translate(-50%, -50%); */
}
.main_topic.dam.big .range .bar .tulle_tip.orange_pastel.off:after {
	content: '';
	display: block;
	position: absolute;
	right: -10px;
	bottom: -10px;
	content: '';
	width: 0px;
	height: 0px;
	/* background: #ffefec; */
	border-top: 10px solid #fff8dd;
	border-left: 10px solid #fff8dd;
	border-right: 10px solid #fff8dd00;
	border-bottom: 10px solid #fff8dd00;
	transform: rotate(315deg);
	/* transform: translate(-50%, -50%); */
}
.main_topic.dam.big .range .bar .tulle_tip.on.yellow_pastel:after {
	content: '';
	display: block;
	position: absolute;
	left: -10px;
	bottom: -10px;
	content: '';
	width: 0px;
	height: 0px;
	/* background: #ffefec; */
	border-top: 10px solid #fff8dd00;
	border-left: 10px solid #fff8dd00;
	border-right: 10px solid #FFF9DD;
	border-bottom: 10px solid #FFF9DD;
	transform: rotate(315deg);
	/* transform: translate(-50%, -50%); */
}
.main_topic.dam.big .range .bar .tulle_tip.yellow_pastel:after {
	content: '';
	display: block;
	position: absolute;
	/* left: -50%; */
	bottom: -5px;
	content: '';
	width: 10px;
	height: 10px;
	/* border-top: 10px solid #eaffd7; */
	border-right: 10px solid #FFF9DD;
	border-bottom: 10px solid #FFF9DD;
	transform: rotate(45deg);
	/* transform: translate(-50%, -50%); */
}
.main_topic.dam.big .range .bar .tulle_tip.yellow_pastel.off:after {
	content: '';
	display: block;
	position: absolute;
	right: -10px;
	bottom: -10px;
	content: '';
	width: 0px;
	height: 0px;
	/* background: #ffefec; */
	border-top: 10px solid #FFF9DD;
	border-left: 10px solid #FFF9DD;
	border-right: 10px solid #fff8dd00;
	border-bottom: 10px solid #fff8dd00;
	transform: rotate(315deg);
	/* transform: translate(-50%, -50%); */
}
.main_topic.dam.big .range .bar .tulle_tip span {
	margin: 0;
	margin-left: 5px;
}

.main_topic.dam.big input[type="range"] {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 10px;
    background: #ccc;
    outline: none;
    opacity: 0.7;
    transition: opacity .2s;
    border-radius: 3px;
    padding: 0;
    overflow: visible;
}
.main_topic.dam.big input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 18px;
    height: 25px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    border-radius: 50%;
    background-image: var(--thumb-image, url('./image/new/dam/water_green.png'));
}
.main_topic.dam.big input[type="range"]::-moz-range-thumb {
    width: 18px;
    height: 25px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    border-radius: 50%;
    background-image: var(--thumb-image, url('./image/new/dam/water_green.png'));
}
/*대 e*/


/*중 s*/
.main_topic.dam.middle {
	display: block;
	/* background: #EAFFD7; */
	border-radius: 10px;
	padding: 0;
	/* margin: 10px 0; */
	height: calc(100% - 42px - 26px - 0px) !important;
} 
.main_topic.dam.middle .caution {
	height: calc(100% - 40px - 5px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* background: #EAFFD7; */
	margin-top: 10px;
	border-radius: 10px;
	/* padding: 0 10px; */
	box-sizing: border-box;
	/* position: relative; */
}
.main_topic.dam.middle select {
	height: 35px;
	border-radius: 10px;
	font-size: 14px;
	font-weight: 500;
	background: #fff url('./image/new/select.png') no-repeat 96% 50%;
	color: #696969;
	background-size: 12px;
} 
.main_topic.dam.middle ul {
	display: none;
	position: relative;
}
.main_topic.dam.middle ul li {
}
.main_topic.dam.middle .adjustment {
	display: block;
	/* background: #6cd700; */
	/* color: #fff; */
	height: 26px;
	/* width: 62px; */
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 10px;
	font-size: 15px;
	font-weight: 500;
	position: absolute;
	left: 50%;
	transform: translate(-50%, -158%);
	padding: 0 15px;
	box-sizing: border-box;
}
.main_topic.dam.middle .adjustment .tulle_tip_hover {
	display: none;
}
.main_topic.dam.middle .img {
	background: url('./image/new/dam/dam_green.png') no-repeat 50% 50%;
	width: 100%;
	height: calc(100% - 55%);
	background-size: contain;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	background-position: center;
	margin-top: 15px;
}
.main_topic.dam.middle .middle_txt {
	display: flex;
	height: 20px;
	align-items: center;
	margin-top: 10px;
	font-size: 14px;
	color: #696969;
	font-weight: 500;
}
.main_topic.dam.middle .middle_txt span{
	margin-left: 6px;
}
.main_topic.dam.middle .txt {
	display: none;
}

.main_topic.dam.middle .range {
	display: none;
}
/*중 e*/

/*소 s*/
.main_topic.dam.small {
	display: block;
	/* background: #EAFFD7; */
	border-radius: 10px;
	padding: 0;
	margin: 10px 0;
	height: calc(100% - 20px - 18px - 26px);
	gap: 5px;
	display: flex;
	flex-direction: column;
	justify-content: center;
} 
.main_topic.dam.small .caution {
	height: calc(50% - 2.5px);
	display: flex;
	margin: 0;
}
.main_topic.dam.small select {
	height: calc(50% - 2.5px);
	border-radius: 10px;
	font-size: 13px;
	font-weight: 500;
	background: #fff url('./image/new/select.png') no-repeat 92% 50%;
	color: #696969;
	background-size: 10px;
} 
.main_topic.dam.small ul {
	display: none;
}
.main_topic.dam.small ul li {
}
.main_topic.dam.small .adjustment {
	display: block;
	background: #6cd700;
	color: #fff;
	height: 100%;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 10px;
	font-size: 13px;
	font-weight: 500;
	position: initial;
	left: 50%;
	transform: none;
	position: relative;
	left: 0;
	cursor: pointer;
}
.main_topic.dam.small .adjustment .tulle_tip_hover { /** 수정필요 **/
	display: none;
	position: absolute;
	background: #767676;
	height: 18px;
	/* width: 100%; */
	/*width: max-content;*/
	white-space: nowrap;/** 한줄로 보이기 위해서 **/
	font-size: 10px;
	top: 32px;
	border-radius: 5px;
	justify-content: center;
	align-items: center;
	padding: 0 15px;
}
.main_topic.dam.small .adjustment .tulle_tip_hover::after{
	display: block;
    position: absolute;
    left: 50%;
    content: '';
    transform: rotate(135deg) translate(0px, 5px);
    border-bottom: 10px solid #767676;
    border-left: 0px solid transparent;
    border-right: 10px solid transparent;
    top: 0px;
}
.main_topic.dam.small .adjustment:hover .tulle_tip_hover {
	display: flex;
}
.main_topic.dam.small .img {
	display: none;
}
.main_topic.dam.small .middle_txt {
	display: none;
}
.main_topic.dam.small .txt {
	display: none;
}

.main_topic.dam.small .range {
	display: none;
}
/*소 e*/

/*커스텀 로딩*/
.custom-loader-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
}

.custom-bouncing-dots {
    display: flex;
    justify-content: space-between;
    width: 60px;
}

.custom-dot {
    width: 15px;
    height: 15px;
    background-color: #FF5C35;
    border-radius: 50%;
    animation: bounce 1.5s infinite;
}

.custom-dot:nth-child(1) {
    animation-delay: 0s;
}

.custom-dot:nth-child(2) {
    animation-delay: 0.3s;
}

.custom-dot:nth-child(3) {
    animation-delay: 0.6s;
}

@keyframes bounce {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-20px);
    }
}

/*커스텀 로딩 끝*/

/*댐 가뭄 단계 정보 e*/


/*우리동네 가뭄정보 s*/
.main_topic.drought {
	display: none;
} 
/*대 s*/
.main_topic.drought.big {
	display: block;
} 
.main_topic.drought.big .caution {
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* background: url('./image/new/drought/droughtback_1.png') no-repeat 100% 50%; */
	/* background-size: cover; */
	/* border-radius: 10px; */
	/* display: none; */
	/* margin: 0; */
	/* width: 100%; */0%; */
	box-sizing: border-box;
}
.main_topic.drought.big .img {
	background: url('./image/new/drought/drought_1.png') no-repeat 100% 50%;
	width: 45%;
	height: 55%;
	background-size: contain;
	background-position: center;
}
.main_topic.drought.big .txt {
	font-size: 22px;
	margin-top: 30px;
	line-height: 1.4em;
	/* font-weight: 500; */
}
.main_topic.drought.big .txt span {	
	font-weight: 600;
}
.main_topic.drought.big .caution .adjustment {
	display: none;
}
/*대 e*/
/*중 s*/
.main_topic.drought.middle {
	display: block;
	padding: 10px 0;
} 
.main_topic.drought.middle .caution {
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* background: url('./image/new/drought/droughtback_blue.png') no-repeat 100% 50%; */
	background-size: cover;
	border-radius: 10px;
}
.main_topic.drought.middle .img {
	background: url('./image/new/drought/drought_blue.png') no-repeat 100% 50%;
	width: 35%;
	height: 55%;
	background-size: contain;
	background-position: center;
}
.main_topic.drought.middle .middle_txt {
	display: none;
}
.main_topic.drought.middle .txt {
	font-size: 15px;
	margin-top: 10px;
	line-height: 1.4;
	font-weight: 500;
}
.main_topic.drought.middle .txt span {	
	font-weight: 600;
}
.main_topic.drought.middle .caution .adjustment {
	display: none;
}
/*중 e*/
/*소 s*/
.main_topic.drought.small {
	display: block;
	padding: 10px 0;
	height: calc(100% - 45px);
} 
.main_topic.drought.small .caution {
	height: 100%;
	display: flex;
	flex-direction: row;
	justify-content: space-evenly;
	background: none;
	background-size: cover;
	border-radius: 10px;
	align-items: center;
	background: #f6faff;
}
.main_topic.drought.small .img {
	background: url('./image/new/drought/drought_1.png') no-repeat 100% 50%;
	width: 28%;
	height: 55%;
	background-size: contain;
	background-position: center;
	margin: 0;
}
.main_topic.drought.small .txt {
	display: none;
}
.main_topic.drought.small .txt span {	
	font-weight: 600;
}
.main_topic.drought.small .caution .adjustment {
	margin: 0;
	/* margin-left: 5px; */
	font-size: 16px;
	font-weight: 600;
}
/*소 e*/
/*우리동네 가뭄정보 e*/



/*무더위 쉼터 s*/
.main_topic.shelter {
	display: none;
	height: calc(100% - 42px - 26px);
} 
/*대 s*/
.main_topic.shelter.big {
	display: block;
}
.main_topic.shelter.big .caution{	
	display: flex;		
	flex-direction: column;	
	height: 100%;		
	gap: 10px;
} 
.main_topic.shelter.big .caution .address{
	margin: 0;		
	height: calc(60% - 10px);		
	position: relative;		
	background: url(./image/new/shelter/shelter_back.png) no-repeat;		
	background-size: cover;		
	width: 100%;		
	border-radius: 10px;		
	padding: 26px;		
	box-sizing: border-box;
}
.main_topic.shelter.big .caution .address .txt {
	
	margin: 0;		
	display: flex;		
	flex-direction: column;		
	justify-content: space-between;		
	height: 100%;	
	align-items: flex-start;
}
.main_topic.shelter.big .caution .address .title {
	margin: 0;
	background: #b4d1fb;
	height: 30px;
	padding: 0 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	border-radius: 10px;
	font-weight: 500;
}
.main_topic.shelter.big .caution .address .middle_txt {
	margin: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	color: #696969;
}
.main_topic.shelter.big .caution .address .middle_txt div {
	margin: 0;
	font-size: 15px;
	/* text-overflow: ellipsis; */
	/* white-space: nowrap; */
	/* height: 14px; */
	/* overflow: hidden; */
	/* text-overflow: ellipsis; */
	/* white-space: nowrap; */
	/* word-break: break-all; */
	/* width: 100%; */
	/* text-align: left; */
}
.main_topic.shelter.big .caution .address .middle_txt div:first-child {		
	font-size: 18px;
	font-weight: 500;
}
.main_topic.shelter.big .caution .address .img {
	background: url(./image/new/shelter/senior_facilities.png) no-repeat;
	width: 60%;
	height: 130%;
	background-size: contain;
	position: absolute;
	bottom: 0;
	right: 0;
}
.main_topic.shelter.big .map {
	height: 40%;
	width: 100%;
	background: #f7f7f7;
	border-radius: 10px;
	position: relative;
}
.main_topic.shelter.big .map .icon{
}
.main_topic.shelter.big .map button {
	width: 28px;
	height: 28px;
	/* background-size: contain !important; */
	background-color: #fff !important;
	border: 1px solid #d9d9d9;
	box-sizing: border-box;
	position: absolute;
	right: 26px;
	background-size: 50% !important;
	cursor: pointer;
}

.main_topic.shelter.big .map .enlargement {
	background: url(./image/new/max.png) no-repeat 50%;
	top: 26px;
}
.main_topic.shelter.big .map .enlargement:hover{
	background: url(./image/new/max_hover.png) no-repeat 50%;
	border: 1px solid #69aef2;
}
.main_topic.shelter.big .map .plus{
	background: url(./image/new/plus.png) no-repeat 50%;
	bottom: 53px;
}
.main_topic.shelter.big .map .minus{
	background: url(./image/new/min.png) no-repeat 50%;
	bottom: 26px;
}
/*대 e*
/*중 s*/
.main_topic.shelter.middle {
	display: block;
	padding: 10px 0;
}
.main_topic.shelter.middle .caution{	
	display: flex;		
	flex-direction: column;	
	height: 100%;		
	gap: 10px;
} 
.main_topic.shelter.middle .caution .address{
	margin: 0;
	height: 70%;
	position: relative;
	background: url(./image/new/shelter/shelter_back.png) no-repeat;
	background-size: cover;
	width: 100%;
	border-radius: 10px;
	padding: 15px;
	box-sizing: border-box;
}
.main_topic.shelter.middle .caution .address .txt {
	display: flex;
	flex-direction: column;
	align-items: baseline;
}
.main_topic.shelter.middle .caution .address .title {
	margin: 0;
	background: #b4d1fb;
	height: 30px;
	padding: 0 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	border-radius: 10px;
	font-weight: 500;
	z-index: 100;
	line-height: 30px;
}
.main_topic.shelter.middle .caution .address .middle_txt {
	width: 100%;
	margin: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	color: #696969;
	position: absolute;
	bottom: -38%;
	height: 30%;
	justify-content: center;
	left: 0;
}
.main_topic.shelter.middle .caution .address .middle_txt div {
	margin: 0;
	font-size: 14px;
}
.main_topic.shelter.middle .caution .address .middle_txt div:first-child {
	font-weight: 600;
}
.main_topic.shelter.middle .caution .address .middle_txt div:last-child {		
	display: none;
}
.main_topic.shelter.middle .caution .address .img {
	background: url(./image/new/shelter/senior_facilities.png) no-repeat;
	width: 60%;
	height: 130%;
	background-size: contain;
	position: absolute;
	bottom: 0;
	right: 0;
	background-position-x: calc(100% - 5px);
}
.main_topic.shelter.middle .map {
	display: none;
}
/*중 e*/
/*소 s*/
.main_topic.shelter.small {
	display: block;
	padding: 10px 0;
	height: calc(100% - 42px);
}
.main_topic.shelter.small .caution {
	height: 100%;
}
.main_topic.shelter.small .caution .address {
	margin: 0;
	height: 100%;
	position: relative;
	background: url(./image/new/shelter/shelter_back.png) no-repeat;
	background-size: cover;
	width: 100%;
	border-radius: 10px;
	padding: 10px;
	box-sizing: border-box;
}
.main_topic.shelter.small .caution .address .txt {
	display: flex;
	flex-direction: column-reverse;
	gap: 5px;
	align-items: center;
	height: 100%;
	justify-content: center;
	color: #69aef2;
}
.main_topic.shelter.small .caution .address .middle_txt div {
	display: none;
}
.main_topic.shelter.small .caution .address .middle_txt div:first-child {
	display: block;
	font-weight: 600;
}
.main_topic.shelter.small .map {
	display: none;
}
/*소 e*/
/*무더위 쉼터 e*/


/*댐정보 s*/
.grid-stack-item-content.dam_img {
	background: url(./image/new/daminformation/dam_information_blue.png) no-repeat;
	width: 100%;
	background-size: contain;
	background-position-y: bottom;
}

.main_topic.dam_information {
	display: none;
} 
/*대 s*/
.main_topic.dam_information.big {
	display: block;
	height: calc(100% - 42px - 26px);
}

.main_topic.dam_information.big {}
.main_topic.dam_information.big select {
    border-radius: 10px;
    background: #fff url(./image/new/select.png) no-repeat 98% 50%;
    cursor: pointer;
    height: 40px;
    font-weight: 500;
    color: #696969;
    background-size: 12px;
}
.main_topic.dam_information.big .caution {
	height: calc(100% - 54px - 20px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin-bottom: 20px;
	margin-top: 40px;
	gap: 10px;
}
.main_topic.dam_information.big .caution .level {
	display: flex;
	justify-content: center;
	margin-bottom: 20px;
	margin: 0;
	gap: 10px;
}
.main_topic.dam_information.big .caution .level li {
	background: #fff;
	width: 100%;
	height: 100%;
	border-radius: 10px;
}
.main_topic.dam_information.big .caution .level_img {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	height: 20%;
	width: 60%;
}

.main_topic.dam_information.big .caution .img_box {
	width: 80%;
	height: 80%;		
	display: flex;		
	justify-content: center;		
	align-items: center;			
	border-radius: 10px;		
	flex-direction: column;		
	backdrop-filter: blur(5px);
}
.main_topic.dam_information.big .caution .img_box .water_level {
	display: none;
}
.main_topic.dam_information.big .caution .img_box.blue_pastel {
	background: #f5f9ffe0 !important;	
}
.main_topic.dam_information.big .caution .img_box.orange_pastel {
	background: #fffef5e6 !important;	
}
.main_topic.dam_information.big .caution .img_box.red_pastel {
	background: #fff8f5ed !important;	
}
.main_topic.dam_information.big .caution .img_box.blue_pastel::after {
	display: block;
	position: absolute;
	bottom: -10px;
	content: '';
	transform: rotate(315deg);
	border-bottom: 20px solid #f5f9ffe0;
	border-left: 0px solid transparent;
	border-right: 20px solid transparent;
	left: calc(100% - 76.8%);
}
.main_topic.dam_information.big .caution .img_box.red_pastel::after {
	display: block;
	position: absolute;
	bottom: -10px;
	content: '';
	transform: rotate(315deg);
	border-bottom: 20px solid #fff8f5ed;
	border-left: 0px solid transparent;
	border-right: 20px solid transparent;
	left: calc(100% - 27%);
}
.main_topic.dam_information.big .caution .img_box.orange_pastel::after {
	display: block;
	position: absolute;
	bottom: -10px;
	content: '';
	transform: rotate(315deg);
	border-bottom: 20px solid #fffef5e6;
	border-left: 0px solid transparent;
	border-right: 20px solid transparent;
	left: calc(100% - 51.7%);
}
.main_topic.dam_information.big .caution .img_box .img {
	background: url(./image/new/daminformation/dam_blue.png) no-repeat 98% 50%;
	width: 60%;
	height: 40%;
	background-position: center;
	background-size: contain;
	margin-bottom: 22px;
}

.main_topic.dam_information.big .caution .level li {
	background: #fff;
	min-width: 110px;
	min-height: 110px;
	border-radius: 10px;
	display: flex;
	justify-content: center;
	flex-direction: column;
	gap: 10px;
	font-size: 13px;
	color: #696969;
	font-weight: 600;
	padding: 10px;
	box-sizing: border-box;
	font-weight: 500;
}
.main_topic.dam_information.big .caution .level li span {
	display: none;
}
.main_topic.dam_information.big .caution .level li div:nth-child(2) {
	font-size: 18px;
	font-weight: 600;
}
.main_topic.dam_information.big .caution .level li div:nth-child(1).blue {
	
/* font-size: 22px; */
	
color: #696969;
}
.main_topic.dam_information.big .caution .level li div.color { 
	color: #ACACAC;
	font-weight: 400;
}
.main_topic.dam_information.big .caution .level_img li {
	
	width: 33.333%;
}
.main_topic.dam_information.big .caution .level_img li .img {
	background-size: contain !important;
	width: 100%;
	height: 50px;
	margin: 0;
	display: flex;
	justify-content: center;
	background-position: center !important;
	background-size: 30% !important;
}
.main_topic.dam_information.big .caution .level_img.blue li div.b {
	color: #fff;
	font-weight: 600;
}
.main_topic.dam_information.big .caution .level_img.blue div {
	color: #8DC3F7;
}
.main_topic.dam_information.big .caution .level_img.orange li div.o {
	color: #fff;
	font-weight: 600;
}
.main_topic.dam_information.big .caution .level_img.orange div {
	color: #FFBF2C;
}
.main_topic.dam_information.big .caution .level_img.red li div.r {
	color: #fff;
	font-weight: 600;
}
.main_topic.dam_information.big .caution .level_img.red div {
	color: #FF6C48;
}
.main_topic.dam_information.big .caution .level_img li div {
	
	font-size: 13px;
}
.main_topic.dam_information.big .caution .level_img.blue li:nth-child(1) .img {
	background: url(./image/new/daminformation/img1.png) no-repeat 50% 50%;
}
.main_topic.dam_information.big .caution .level_img.blue li:nth-child(2) .img {
	background: url(./image/new/daminformation/img2.png) no-repeat;
}
.main_topic.dam_information.big .caution .level_img.blue li:nth-child(3) .img {
	background: url(./image/new/daminformation/img3.png) no-repeat 50% 50%;
	/* background-size: 55% !important; */
}
.main_topic.dam_information.big .caution .level_img.orange li:nth-child(1) .img {
	background: url(./image/new/daminformation/img4.png) no-repeat;
}
.main_topic.dam_information.big .caution .level_img.orange li:nth-child(2) .img {
	background: url(./image/new/daminformation/img5.png) no-repeat;
}
.main_topic.dam_information.big .caution .level_img.orange li:nth-child(3) .img {
	background: url(./image/new/daminformation/img6.png) no-repeat;
}
.main_topic.dam_information.big .caution .level_img.red li:nth-child(1) .img {
	background: url(./image/new/daminformation/img7.png) no-repeat;
}
.main_topic.dam_information.big .caution .level_img.red li:nth-child(2) .img {
	background: url(./image/new/daminformation/img8.png) no-repeat;
}
.main_topic.dam_information.big .caution .level_img.red li:nth-child(3) .img {
	background: url(./image/new/daminformation/img9.png) no-repeat;
}
/*대 e*/
/*중 s*/
.main_topic.dam_information.middle {
	display: block;
	padding: 10px 0;
}
.main_topic.dam_information.middle select {
    border-radius: 10px;
    background: #fff url('./image/new/select.png') no-repeat 96% 50%;
    cursor: pointer;
    height: 35px;
    font-weight: 500;
    color: #696969;
    background-size: 12px;
}
.main_topic.dam_information.middle .caution {
	height: calc(100% - 45px);
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	margin-bottom: 10px;
	margin-top: 10px;
	/* gap: 10px; */
	box-sizing: border-box;
	position: relative;
}
.main_topic.dam_information.middle .caution .level {
	display: flex;
	justify-content: center;
	margin-bottom: 20px;
	margin: 0;
	gap: 10px;
	height: calc(40% - 5px);
	width: 100%;
}
.main_topic.dam_information.middle .caution .level li {
	background: #fff;
	width: 100%;
	height: 100%;
	border-radius: 10px;
}
.main_topic.dam_information.middle .caution .level_img {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	height: 20%;
	width: 60%;
}

.main_topic.dam_information.middle .caution .img_box {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	border-radius: 10px;
	flex-direction: column;
	backdrop-filter: blur(5px);
	justify-content: space-between;
	background: #ffffff00 !important;
}
.main_topic.dam_information.middle .caution .img_box .img {
	background: url(./image/new/daminformation/dam_1.png) no-repeat;
	width: 28%;
	height: calc(60% - 5px);
	background-position: right;
	background-size: contain;
	position: absolute;
	right: 15px;
	background-size: 80%;
}
.main_topic.dam_information.middle .water_level {
	height: calc(60% - 5px);
	border-radius: 10px;
	background: #ddd;
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	padding: 0 20px;
	box-sizing: border-box;
	gap: 8px;
}
.main_topic.dam_information.middle .water_level > span {
	margin: 0;
	border-radius: 10px;
	background: #aaa;
	padding: 0px 15px;
	color: #fff;
	font-weight: 500;
	font-size: 15px;
	height: 30px;
	display: flex;
	align-items: center;
	line-height: 30px;
}
.main_topic.dam_information.middle .water_level div {
	margin: 0;
	color: #696969;
	font-size: 14px;
	font-weight: 400;
	display: flex;
	gap: 5px;
}
.main_topic.dam_information.middle .water_level div span {
	
}
.main_topic.dam_information.middle .caution .level li {
	background: #F9F9F9;
	width: 100%;
	height: 100%;
	border-radius: 10px;
	display: flex;
	justify-content: center;
	flex-direction: column;
	gap: 5px;
	font-size: 13px;
	color: #696969;
	font-weight: 600;
	padding: 10px;
	box-sizing: border-box;
}
.main_topic.dam_information.middle .caution .level li:nth-child(2) {
	display: none;
}
.main_topic.dam_information.middle .caution .level li div:nth-child(1) {
	font-weight: 300;
}
.main_topic.dam_information.middle .caution .level li div:nth-child(3) {
	display: none;
}
.main_topic.dam_information.middle .caution .red_pastel .level li div:nth-child(1) {
	color: #FD481C;
}
.main_topic.dam_information.middle .caution .blue_pastel .level li div:nth-child(1) {
	color: #6EB2F3;
}
.main_topic.dam_information.middle .caution .orange_pastel .level li div:nth-child(1) {
	color: #FF850C;
}
.main_topic.dam_information.middle .caution .level_img {
	display: none;
}
.main_topic.dam_information.middle #dam_step .tulle_tip_hover {
	display: none;
}
/*중 e*/
/*소 s*/
.main_topic.dam_information.small {
	border-radius: 10px;
	padding: 0;
	margin: 10px 0;
	height: calc(100% - 20px - 18px - 26px);
	gap: 5px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.main_topic.dam_information.small select {
    height: calc(50% - 2.5px);
	border-radius: 10px;
	font-size: 13px;
	font-weight: 500;
	background: #fff url('./image/new/select.png') no-repeat 92% 50%;
	color: #696969;
	background-size: 10px;
	max-height: 35px;
}
.main_topic.dam_information.small .caution {
	margin: 0;
	height: calc(75% - 2.5px);
}
.main_topic.dam_information.small .caution .level {
	display: none;
}
.main_topic.dam_information.small .caution .img_box {
	background: none !important;
	height: 100%;
}
.main_topic.dam_information.small .caution .img_box div {
	height: 100%;
	border-radius: 10px;
}
.main_topic.dam_information.small .caution .img_box .img {
	display: none;
}
.main_topic.dam_information.small .water_level span {
	margin: 0;
	border-radius: 10px;
	background: #aaa;
	padding: 0px 15px;
	color: #fff;
	font-weight: 500;
	font-size: 13px;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.main_topic.dam_information.small .water_level div {
	display: none;
}
.main_topic.dam_information.small .caution .level_img {
	display: none;
}
.main_topic.dam_information.small #dam_step .tulle_tip_hover {
	display: none;
	position: absolute;
	background: #767676;
	height: 18px;
	/* width: 100%; */
	/*width: max-content;*/
	white-space: nowrap;/** 한줄로 보이기 위해서 **/
	font-size: 10px;
	top: 60%;
	border-radius: 5px;
	justify-content: center;
	align-items: center;
	padding: 0 15px;
}
.main_topic.dam_information.small #dam_step .tulle_tip_hover::after{
	display: block;
    position: absolute;
    left: 50%;
    content: '';
    transform: rotate(135deg) translate(0px, 5px);
    border-bottom: 10px solid #767676;
    border-left: 0px solid transparent;
    border-right: 10px solid transparent;
    top: 0px;
}
.main_topic.dam_information.small #dam_step:hover .tulle_tip_hover {
	display: flex;
}
/*소 e*/
/*댐정보 e*/


/*자외선지수 s*/
.main_topic.uv_index {
	display: none;
} 
/*대 s*/
.main_topic.uv_index.big {
	display: block;
} 
.main_topic.uv_index.big .caution {
	height: 100%;
	width: 100%;
}
.main_topic.uv_index.big .caution .img{
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	background: url('./image/new/ultraviolet/ultraviolet_1.png') no-repeat;
	background-size: 80%;
	border-radius: 10px;
	align-items: center;
	width: 100%;
	background-position: 40%;
	position: relative;
	background-position-x: 38%;
}
.main_topic.uv_index.big .caution .tulle_tip {
	position: absolute;
	width: 80px;
	height: 80px;
	border-radius: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
	left: 50%;
	top: 42%;
	transform: translate(-192%, -50%);
	font-size: 15px;
	font-weight: 500;
	flex-direction: column;
	background: #fff;
	box-shadow: 1px 1px 6px 1px #ffc136;
	gap: 2px;
	padding-top: 5px;
	box-sizing: border-box;
}
.main_topic.uv_index.big .caution .tulle_tip::after {
	display: block;
	position: absolute;
	right: 0px;
	content: '';
	top: 60%;
	transform: rotate(257deg);
	border-bottom: 20px solid #ffffff;
	border-left: 0px solid transparent;
	border-right: 20px solid transparent;
	left: calc(90% - 14%);
	box-shadow: -3px 2px 4px -1px #ffc136;
}
.main_topic.uv_index.big .caution .tulle_tip span{
	font-size: 14px;
}
.main_topic.uv_index.big .caution .tulle_tip span:last-child{
	color:#fd481c;
	font-size: 26px;
}
.main_topic.uv_index.big .txt {
	font-size: 22px;
	/* margin-top: 30px; */
	line-height: 1.4;
	font-weight: 300;
	position: absolute;
	bottom: 19%;
	left: 50%;
	transform: translate(-50%, 0);
	/* font-weight: 500; */
}
.main_topic.uv_index.big .txt span {	
	font-weight: 600;
}
.main_topic.uv_index.big .caution .adjustment {
	display: none;
}
/*대 e*/
/*중 s*/
.main_topic.uv_index.middle {
	display: block;
	padding: 10px 0;
} 
.main_topic.uv_index.middle .caution{
	height: 100%;
	width: 100%;
	display: flex;
	align-content: space-between;
	flex-direction: column;
	justify-content: space-between;
	box-sizing: border-box;
}
.main_topic.uv_index.middle .caution .img{
	height: calc(100% - 40px);
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	background: url('./image/new/ultraviolet/m_ultraviolet_1.png') no-repeat 100% 50%;
	background-size: contain;
	border-radius: 10px;
	background-position-x: 48%;
	/* background-position-y: 20%; */
	width: 100%;
}
.main_topic.uv_index.middle .caution .tulle_tip {
	position: absolute;
	width: 80px;
	height: 80px;
	border-radius: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
	left: 50%;
	top: 42%;
	transform: translate(-135%, -50%);
	font-size: 15px;
	font-weight: 500;
	flex-direction: column;
	background: #fff;
	box-shadow: 1px 1px 6px 1px #ffc136;
	gap: 2px;
	padding-top: 5px;
	box-sizing: border-box;
}
.main_topic.uv_index.middle .caution .tulle_tip::after {
	display: block;
	position: absolute;
	right: 0px;
	content: '';
	top: 60%;
	transform: rotate(257deg);
	border-bottom: 20px solid #ffffff;
	border-left: 0px solid transparent;
	border-right: 20px solid transparent;
	left: calc(90% - 14%);
	box-shadow: -3px 2px 4px -1px #ffc136;
}
.main_topic.uv_index.middle .caution .tulle_tip span{
	font-size: 14px;
}
.main_topic.uv_index.middle .caution .tulle_tip span:last-child{
	color:#fd481c;
	font-size: 26px;
}
.main_topic.uv_index.middle .middle_txt {
	display: none;
}
.main_topic.uv_index.middle .txt {
	font-size: 15px;
	margin-bottom: 0px;
	line-height: 1.4;
	font-weight: 300;
	height: 42px;
}
.main_topic.uv_index.middle .txt span {	
	font-weight: 600;
}
.main_topic.uv_index.middle .caution .adjustment {
	display: none;
}
/*중 e*/
/*소 s*/
.main_topic.uv_index.small {
	display: block;
	padding: 10px 0;
	height: calc(100% - 45px);
} 
.main_topic.uv_index.small .caution {
	height: 100%;
	display: flex;
	flex-direction: row;
	justify-content: space-evenly;
	background: none;
	background-size: cover;
	border-radius: 10px;
	align-items: center;
	background: #FFF8DD;
	position: relative;
}
.main_topic.uv_index.small .caution:hover .tulle_tip {
	display: flex !important;
}
.main_topic.uv_index.small .caution:hover .tulle_tip::after{
	display: block;
    position: absolute;
    left: 50%;
    content: '';
    transform: rotate(135deg) translate(0px, 5px);
    border-bottom: 10px solid #767676;
    border-left: 0px solid transparent;
    border-right: 10px solid transparent;
    top: 0px;
}
.main_topic.uv_index.small .caution .tulle_tip {
    display: none;
    position: absolute;
    background: #767676;
    height: 18px;
    /* width: 100%; */
    /* width: max-content; */
    white-space: nowrap;
    font-size: 10px;
    top: 65px;
    border-radius: 5px;
    justify-content: center;
    align-items: center;
    padding: 0 15px;
    flex-direction: row;
    gap: 2px;
}
.main_topic.uv_index.small .caution .tulle_tip span{
    display: block;
    color: #fff;
}
.main_topic.uv_index.small .img {
	background: url('./image/new/ultraviolet/icon_1.png') no-repeat 100% 50%;
	width: 28%;
	height: 55%;
	background-size: contain;
	background-position: center;
	margin: 0;
}
.main_topic.uv_index.small .txt {
	display: none;
}
.main_topic.uv_index.small .txt span {	
	font-weight: 600;
}
.main_topic.uv_index.small .caution .adjustment {
	margin: 0;
	margin-right: 5px;
	font-size: 16px;
	font-weight: 600;
}
/*소 e*/
/*자외선지수 e*/


/*체감온도 s*/
.main_topic.temperature {
	display: none;
} 
/*대 s*/
.main_topic.temperature.big {
	display: block;
	font-size: initial;
} 
.main_topic.temperature.big .caution {
	height: calc(100% - 110px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin-bottom: 20px;
	background: url('./image/new/temperature/back1.png') no-repeat;
	width: 100%;
	background-size: contain;
	margin-top: 10px;
	border-radius: 10px;
}
.main_topic.temperature.big select {
	border-radius: 10px;
	background: #fff url(./image/new/select.png) no-repeat 98% 50%;
	cursor: pointer;
	height: 40px;
	font-weight: 500;
	color: #696969;
	background-size: 12px;
} 
.main_topic.temperature.big ul {	
	display: flex;		
	justify-content: center;		
	gap: 5px;		
	/* margin-top: 30px; */
}
.main_topic.temperature.big ul li {
		
	display: flex;		
	justify-content: center;		
	background: #F4F4F4;		
	color: #696969;		
	width: 92px;		
	height: 30px;		
	margin: 0;	
	border-radius: 30px;		
	align-items: center;	
	font-weight: 500;		
	font-size: 16px;
}
.main_topic.temperature.big .adjustment {
	display: none;
}
.main_topic.temperature.big .img {
	background: url('./image/new/temperature/farm/f_1.png') no-repeat;
	width: 45%;
	height: 65%;
	background-size: contain;
	background-position: center !important;
}
.main_topic.temperature.big .middle_txt {
	display: none;
}

.main_topic.temperature.big .txt {
	font-size: 22px;
}

.main_topic.temperature.big .txt span {
	
font-weight: 600;
}
.main_topic.temperature.big .range {
	height: 40px;
	display: flex;
	align-content: center;
	align-items: center;
	width: 100%;
}
.main_topic.temperature.big .range .bar {	
	width: 100%;		
	background: #F4F4F4;		
	height: 4px;		
	position: relative;
}
.main_topic.temperature.big .range .bar .tulle_tip {
	width: 150px;
	position: absolute;
	top: -55px;
	height: 35px;
	display: flex;
	justify-content: center;
	align-items: center;
	left: calc(30% - 75px);
	font-size: 14px;
	background: #F9F9F9;
}
.main_topic.temperature.big .range .bar .rod {
		
	width: 30%;		
	background: #feda78;		
	height: 4px;		
	position: absolute;		
	left: 0;
}
.main_topic.temperature.big .range .bar .tulle_tip:after {
	content: '';
	display: block;
	position: absolute;
	bottom: -5px;
	content: '';
	width: 10px;
	height: 10px;
	border-right: 10px solid #F9F9F9;
	border-bottom: 10px solid #F9F9F9;
	transform: rotate(45deg);
}
.main_topic.temperature.big .range .bar .tulle_tip span {
	margin: 0;
	margin-left: 5px;
}


/*대 e*/


/*중 s*/
.main_topic.temperature.middle {
	display: block;
	/* background: #EAFFD7; */
	border-radius: 10px;
	padding: 0;
	/* margin: 10px 0; */
	height: calc(100% - 42px - 26px - 0px) !important;
	font-size: initial;
} 
.main_topic.temperature.middle .caution {
	height: calc(100% - 45px);
	display: flex;
	flex-direction: row-reverse;
	justify-content: center;
	/* margin-bottom: 20px; */
	background: url(./image/new/temperature/back_1.png) no-repeat;
	width: 100%;
	background-size: cover;
	margin-top: 10px;
	border-radius: 10px;
}
.main_topic.temperature.middle .range{
	display: none;
}

.main_topic.temperature.middle select {
	height: 35px;
	border-radius: 10px;
	font-size: 14px;
	font-weight: 500;
	background: #fff url('./image/new/select.png') no-repeat 96% 50%;
	color: #696969;
	background-size: 12px;
} 
.main_topic.temperature.middle ul {
	display: none;
	position: relative;
}
.main_topic.temperature.middle ul li {
}
.main_topic.temperature.middle .adjustment {
	display: block;
	background: #6cd700;
	color: #fff;
	height: 26px;
	/* width: 62px; */
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 10px;
	font-size: 15px;
	font-weight: 500;
	position: absolute;
	left: 50%;
	transform: translate(-50%, -158%);
	padding: 0 15px;
	box-sizing: border-box;
}
.main_topic.temperature.middle .img {
	background: url('./image/new/temperature/farm/f_1.png') no-repeat;
	width: 50%;
	height: 100%;
	background-size: contain;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	background-position: center;
	/* padding: 10px 20px; */
	box-sizing: border-box;
	margin-right: 15px;
	background-position-x: right;
}
.main_topic.temperature.middle .middle_txt {
	display: flex;
	/* height: 20px; */
	align-items: flex-start;
	/* margin-top: 10px; */
	font-size: 14px;
	color: #696969;
	font-weight: 500;
	flex-direction: column;
	width: 50%;
	padding: 15px 0 15px 15px;
	box-sizing: border-box;
	gap: 10px;
	justify-content: flex-start;
}
.main_topic.temperature.middle .middle_txt > span{
	margin-left: 6px;
	height: 30px;
	padding: 0 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	border-radius: 10px;
	font-weight: 500;
	z-index: 100;
	margin: 0;
	line-height: 30px;
}
.main_topic.temperature.middle .middle_txt > span > span{
	display: none;
}
.main_topic.temperature.middle .middle_txt div {
	margin: 0;
	display: flex;
	gap: 5px;
	text-align: left;
	font-size: 14px;
}
.main_topic.temperature.middle .middle_txt div span {
	margin: 0;
}
.main_topic.temperature.middle .txt {
	display: none;
}

.main_topic.dam.middle .range {
	display: none;
}
/*중 e*/

/*소 s*/
.main_topic.temperature.small {
	display: block;
	/* background: #EAFFD7; */
	border-radius: 10px;
	padding: 0;
	margin: 10px 0;
	height: calc(100% - 20px - 18px - 26px);
	gap: 5px;
	display: flex;
	flex-direction: column;
	justify-content: center;
} 
.main_topic.temperature.small .caution {
	height: calc(50% - 2.5px);
	display: flex;
	margin: 0;
}
.main_topic.temperature.small select {
	height: calc(50% - 2.5px);
	border-radius: 10px;
	font-size: 13px;
	font-weight: 500;
	background: #fff url('./image/new/select.png') no-repeat 92% 50%;
	color: #696969;
	background-size: 10px;
} 
.main_topic.temperature.small ul {
	display: none;
}
.main_topic.temperature.small ul li {
}
.main_topic.temperature.small .adjustment {
	display: block;
	background: #6cd700;
	color: #fff;
	height: 100%;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 10px;
	font-size: 13px;
	font-weight: 500;
	position: initial;
	left: 50%;
	transform: none;
}
.main_topic.temperature.small .img {
	display: none;
}
.main_topic.temperature.small .middle_txt {
	/* border-radius: 10px; */
	display: flex;
	font-size: 13px;
	height: 100%;
	width: 100%;
}
.main_topic.temperature.small .middle_txt > span {
	width: 100%;
	height: 100%;
	border-radius: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: 500;
}
.main_topic.temperature.small .middle_txt > span > span{
	margin: 0;
	font-weight: 100;
	margin-left: 5px;
	display: block;
}
.main_topic.temperature.small .middle_txt div {
	display: none;
}
.main_topic.temperature.small .txt {
	display: none;
}

.main_topic.temperature.small .range {
	display: none;
}
/*소 e*/
/*체감온도 e*/



/*대기정체지수 s*/
.main_topic.aircongestionindex {
	display: none;
} 
/*대 s*/
.main_topic.aircongestionindex.big {
	display: block;
	font-size: initial;
} 
.main_topic.aircongestionindex.big .caution {
	height: calc(100% - 40px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* margin-bottom: 20px; */
	/* background: url('./image/new/temperature/back1.png') no-repeat; */
	width: 100%;
	background-size: contain;
	/* margin-top: 10px; */
	border-radius: 10px;
	gap: 20px;
}
.main_topic.aircongestionindex.big .adjustment {
	display: none;
}
.main_topic.aircongestionindex.big .img {
	background: url('./image/new/air/air_1.png') no-repeat;
	width: 70%;
	height: 70%;
	background-size: contain;
	background-position: center;
	color: #fff;
	font-size: 50px;
	font-weight: 600;
	display: flex;
	justify-content: center;
	align-items: center;
}
.main_topic.aircongestionindex.big .middle_txt {
	display: none;
}

.main_topic.aircongestionindex.big .txt {
	font-size: 22px;
	display: flex;
	/* font-weight: 500; */
}

.main_topic.aircongestionindex.big .txt span {
	
font-weight: 600;
	
margin-left: 5px;
}
.main_topic.aircongestionindex.big .range {
	height: 40px;
	display: flex;
	align-content: center;
	align-items: center;
	width: 100%;
}
.main_topic.aircongestionindex.big .range .bar {
	width: 100%;
	background: #F4F4F4;
	height: 4px;
	position: relative;
	border-radius: 10px;
}
.main_topic.aircongestionindex.big .range .bar .tulle_tip {
	width: 150px;
	position: absolute;
	top: -60px;
	height: 35px;
	display: flex;
	justify-content: center;
	align-items: center;
	left: calc(30% - 75px);
	font-size: 14px;
	background: #F9F9F9;
}
.main_topic.aircongestionindex.big .range .bar .rod {
	width: 30%;
	background: #aebcc4;
	height: 4px;
	position: absolute;
	left: 0;
	border-radius: 10px;
}
.main_topic.aircongestionindex.big .range .bar .cloud {
    width: 30px;
    height: 18px;
    position: absolute;
    background: url(./image/new/air/cloud_1.png) no-repeat;
    background-size: contain;
    top: -8px;
    left: calc(30% - 15px);
}


/*대 e*/


/*중 s*/
.main_topic.aircongestionindex.middle {
	display: block;
	/* background: #EAFFD7; */
	border-radius: 10px;
	padding: 0 !important;
	margin: 10px 0;
	height: calc(100% - 42px - 26px - 20px) !important;
} 
.main_topic.aircongestionindex.middle .caution {
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* background: #EAFFD7; */
	margin-top: 10px;
	border-radius: 10px;
	/* padding: 0 10px; */
	box-sizing: border-box;
	gap: 15px;
}
.main_topic.aircongestionindex.middle .adjustment {
	display: none;
}
.main_topic.aircongestionindex.middle .img {
	background: url('./image/new/air/air_1.png') no-repeat;
	width: 100%;
	height: calc(100% - 25%);
	background-size: contain;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	background-position: center;
	color: #fff;
	font-size: 30px;
	font-weight: 600;
}
.main_topic.aircongestionindex.middle .middle_txt {
	display: none;
}
.main_topic.aircongestionindex.middle .middle_txt span{
	margin-left: 6px;
}
.main_topic.aircongestionindex.middle .txt {
	font-size: 15px;
	margin-bottom: 0px;
	line-height: 1.4em;
	font-weight: 300;
	height: 42px;
}
.main_topic.aircongestionindex.middle .txt span {
	font-weight: 600;
}
/* .main_topic.dam.middle .range {
	display: none;
} */
/*중 e*/

/*소 s*/
.main_topic.aircongestionindex.small {
	display: block;
	/* background: #EAFFD7; */
	border-radius: 10px;
	padding: 0;
	margin: 10px 0;
	height: calc(100% - 20px - 18px - 26px);
	gap: 5px;
	display: flex;
	flex-direction: column;
	justify-content: center;
} 
.main_topic.aircongestionindex.small .caution {
	background: url('./image/new/air/rectangle_1.png') no-repeat;
	height: 100%;
	display: flex;
	margin: 0;
	border-radius: 10px;
	background-size: cover;
	width: 100%;
}

.main_topic.aircongestionindex.small .adjustment {
	display: block;
	/* background: #6cd700; */
	/* color: #fff; */
	height: 100%;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 10px;
	font-size: 16px;
	font-weight: 600;
	position: initial;
	left: 50%;
	transform: none;
}
.main_topic.aircongestionindex.small .img {
	display: none;
}
.main_topic.aircongestionindex.small .middle_txt {
	display: none;
}
.main_topic.aircongestionindex.small .txt {
	display: none;
}

.main_topic.aircongestionindex.small .range {
	display: none;
}
/*소 e*/
/*대기정체지수 e*/



/*우리동네 상수도정보 s*/
.main_topic.waterworks {
	display: none;
} 
/*대 s*/
.main_topic.waterworks.big {
	display: block;
} 
.main_topic.waterworks.big .caution {
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	border-radius: 10px;
	gap: 10px;
}

.main_topic.waterworks.big .caution .img_data{
	height: calc(45% - 10px);
	display: flex;
	width: 100%;
	flex-direction: column;
	gap: 10px;
	justify-content: center;
}
.main_topic.waterworks.big .caution .img_data .img {
	width: 100%;
	display: flex;
	height: 60%;
}
.main_topic.waterworks.big .caution .img_data .img li {
	width: calc(25% - 25px);
	background-size: 65% !important;
	border-radius: 100px;
	/* background: #F9F9F9; */
	background-position: center !important;
	box-sizing: border-box;
	border: 4px solid #F9F9F9;
	height: fit-content;
}
.main_topic.waterworks.big .caution .img_data .img li:after {
	display:block;
	content:'';
	padding-bottom: 100%;
}
.main_topic.waterworks.big .caution .img_data .img li.on {
	border: 4px solid #78b7f4;
}
.main_topic.waterworks.big .caution .img_data .img .water1 {
	background: #F9F9F9 url('./image/new/supply/supply_1.png') no-repeat;
}
.main_topic.waterworks.big .caution .img_data .img .water2 {
	background: #F9F9F9 url('./image/new/supply/supply_2.png') no-repeat;
}
.main_topic.waterworks.big .caution .img_data .img .water3 {
	background: #F9F9F9 url('./image/new/supply/supply_3.png') no-repeat;
}
.main_topic.waterworks.big .caution .img_data .img .water4 {
	background: #F9F9F9 url('./image/new/supply/supply_4.png') no-repeat;
}
.main_topic.waterworks.big .caution .img_data .img li.line {
	
	width: 50px;		
	display: flex;	
	justify-content: center;		
	border: none;		
	background: url(./image/new/supply/jum.png) no-repeat;		
	height: 90%;		
	background-size: 80% !important;
}
.main_topic.waterworks.big .caution .img_data .txt {
	width: 100%;
	display: flex;
	font-size: 16px;
}
.main_topic.waterworks.big .caution .img_data .txt li {
	
	width: calc(25% - 25px);		
	word-wrap: break-word;		
	display: flow-root;		
	overflow: hidden;		
	text-overflow: ellipsis;		
	white-space: nowrap;
}
.main_topic.waterworks.big .caution .img_data .txt li.blue {
	font-weight: 400;
}
.main_topic.waterworks.big .caution .img_data .txt li.arrow {
	
	width: 50px;		
	display: flex;		
	justify-content: center;
}
.main_topic.waterworks.big .caution .data{
	height: 55%;
	width: 100%;
	background: #F8FBFF;
	border-radius: 10px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 10%;
	font-weight: 400;
}
.main_topic.waterworks.big .caution .data .title {
	font-size: 20px;
}
.main_topic.waterworks.big .caution .data ul {
	display: flex;
	gap: 30px;
	width: 65%;
}
.main_topic.waterworks.big .caution .data ul.on {
	width: 95%;
	gap: 10px;
}
.main_topic.waterworks.big .caution .data ul li {
	position: relative;
	width: 50%;
	background-color: #fff;
	border-radius: 20px;
	box-shadow: 0px 4px 8px 0px #a4c3e063;
}
.main_topic.waterworks.big .caution .data ul > li::after {
  display: block;
  content: "";
  padding-bottom: 100%;
}
.main_topic.waterworks.big .caution .data ul > li > div {
  width: 100%;
  height: 100%;
  position: absolute;
  display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
  font-size: 20px;
  padding: 5px 15px;
  box-sizing: border-box;
  line-height: 1.2;
}
.main_topic.waterworks.big .caution .data ul.on > li:nth-child(2) > div > div:nth-child(1) {
  width: 58px;
  border-bottom: none;
}
.main_topic.waterworks.big .caution .data ul.on > li > div {
  font-size: 18px;
  align-items: center;
}
.main_topic.waterworks.big .caution .data .swiper-wrapper {
	
}
.main_topic.waterworks.big .caution .data .swiper-slide {
	
	display: flex;	
	flex-direction: column;	
	justify-content: center;	
	gap: 20px;
}
.main_topic.waterworks.big .caution .data ul > li > div > div {
	width: 100%;
	height: 50%;
	display: flex;
	margin: 0;
	justify-content: center;
	align-items: center;
	border-top: 1px solid #D9D9D9;
}
.main_topic.waterworks.big .caution .data ul > li > div > div:nth-child(1) {
	border: none;
}
.main_topic.waterworks.big .caution .data ul > li > div .blue {
	/* height: 50%; */
	/* border-bottom: 1px solid #D9D9D9; */
}

.main_topic.waterworks.big .swiper-button-next {
	background: #fff;
	width: 50px;
	height: 50px;
	border-radius: 50px;
	box-shadow: 0px 4px 8px 0px #a4c3e063;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	/* margin-left: 2px; */
	right: 5px;
	top: calc(70% - 20px);
}
.main_topic.waterworks.big .swiper-button-prev {
	background: #fff;
	width: 50px;
	height: 50px;
	border-radius: 50px;
	box-shadow: 0px 4px 8px 0px #a4c3e063;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	left: 5px;
	top: calc(70% - 20px);
}
.main_topic.waterworks.big .swiper-button-next:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-left: 4px;
} 
.main_topic.waterworks.big .swiper-button-prev:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-right: 4px;
}
/*대 e*/
/*중 s*/
.main_topic.waterworks.middle {
	display: block;
	padding: 10px 0;
} 
.main_topic.waterworks.middle .caution {
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	border-radius: 10px;
	gap: 10px;
}

.main_topic.waterworks.middle .caution .img_data{
	display: flex;
	width: 100%;
	flex-direction: column;
	justify-content: center;
	height: 30%;
	gap: 0;
}
.main_topic.waterworks.middle .caution .img_data .img {
	width: 100%;
	display: flex;
	height: fit-content;
}
.main_topic.waterworks.middle .caution .img_data .img li {
	background-size: 65% !important;
	border-radius: 100px;
	/* background: #F9F9F9; */
	background-position: center !important;
	box-sizing: border-box;
	border: 4px solid #F9F9F9;
	height: fit-content;
	width: calc(25% - 3.5%);
}
.main_topic.waterworks.middle .caution .img_data .img li:after {
	display:block;
	content:'';
	padding-bottom: 100%;
}
.main_topic.waterworks.middle .caution .img_data .img li.on {
	border: 4px solid #78b7f4;
}
.main_topic.waterworks.middle .caution .img_data .img .water1 {
	background: #F9F9F9 url('./image/new/supply/supply_1.png') no-repeat;
}
.main_topic.waterworks.middle .caution .img_data .img .water2 {
	background: #F9F9F9 url('./image/new/supply/supply_2.png') no-repeat;
}
.main_topic.waterworks.middle .caution .img_data .img .water3 {
	background: #F9F9F9 url('./image/new/supply/supply_3.png') no-repeat;
}
.main_topic.waterworks.middle .caution .img_data .img .water4 {
	background: #F9F9F9 url('./image/new/supply/supply_4.png') no-repeat;
}
.main_topic.waterworks.middle .caution .img_data .img li.line {
	display: none;
}
.main_topic.waterworks.middle .caution .img_data .txt {
	display: none;
}

.main_topic.waterworks.middle .caution .data{
	height: 66%;
	width: 100%;
	background: #F8FBFF;
	border-radius: 10px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 10%;
	font-weight: 400;
}
.main_topic.waterworks.middle .caution .data .title {
	font-size: 15px;
}
.main_topic.waterworks.middle .caution .data ul {
	display: flex;
	gap: 10px;
	width: 80%;
}
.main_topic.waterworks.middle .caution .data ul.on {
	width: 95%;
	gap: 5px;
}
.main_topic.waterworks.middle .caution .data ul li {
	position: relative;
	width: 50%;
	background-color: #fff;
	border-radius: 20px;
	box-shadow: 0px 4px 8px 0px #a4c3e063;
}
.main_topic.waterworks.middle .caution .data ul > li::after {
  display: block;
  content: "";
  padding-bottom: 100%;
}
.main_topic.waterworks.middle .caution .data ul > li > div {
  width: 100%;
  height: 100%;
  position: absolute;
  display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
  font-size: 15px;
  padding: 5px 15px;
  box-sizing: border-box;
}
.main_topic.waterworks.middle .caution .data ul.on > li:nth-child(2) > div > div:nth-child(1) {
	width: 35px;
	border-bottom: none;
	line-height: 1.2;
}
.main_topic.waterworks.middle .caution .data ul.on > li > div > div {
	height: 50%;
}
.main_topic.waterworks.middle .caution .data ul.on > li > div {
	font-size: 12px;
	padding: 5px;
	align-items: center;
}
.main_topic.waterworks.middle .caution .data .swiper-wrapper {
	
}
.main_topic.waterworks.middle .caution .data .swiper-slide {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 10px;
}
.main_topic.waterworks.middle .caution .data ul > li > div > div {
	width: 100%;
	height: 40%;
	display: flex;
	margin: 0;
	justify-content: center;
	align-items: center;
}
.main_topic.waterworks.middle .swiper-button-next {
	background: #fff;
	width: 35px;
	height: 35px;
	border-radius: 50px;
	box-shadow: 0px 4px 8px 0px #a4c3e063;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	/* margin-left: 2px; */
	right: 10px;
	top: calc(70% - 20px);
}
.main_topic.waterworks.middle .swiper-button-prev {
	background: #fff;
	width: 35px;
	height: 35px;
	border-radius: 50px;
	box-shadow: 0px 4px 8px 0px #a4c3e063;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	left: 10px;
	top: calc(70% - 20px);
}
.main_topic.waterworks.middle .swiper-button-next:after {
	font-size: 18px;
	display: flex;
	color: #D9D9D9;
	margin-left: 4px;
} 
.main_topic.waterworks.middle .swiper-button-prev:after {
	font-size: 18px;
	display: flex;
	color: #D9D9D9;
	margin-right: 4px;
}
/*중 e*/
/*우리동네 상수도정보 e*/


/*초미세먼지 s*/
.main_topic.dust {
	display: none;
} 

/*대 s*/
.main_topic.dust.big {
	display: block;
	font-size: initial;
} 
.main_topic.dust.big .caution {
	height: calc(100% - 80px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin-bottom: 20px;
	/* background: url('./image/new/temperature/back1.png') no-repeat; */
	width: 100%;
	background-size: contain;
	/* margin-top: 10px; */
	border-radius: 10px;
	gap: 20px;
}
.main_topic.dust.big .adjustment {
	display: none;
}
.main_topic.dust.big .img {
	background: url('./image/new/dust/dust_1.png') no-repeat;
	width: 75%;
	height: 75%;
	background-size: contain;
	background-position: center;
	color: #fff;
	font-size: 50px;
	font-weight: 600;
	display: flex;
	justify-content: center;
	align-items: center;
}
.main_topic.dust.big .middle_txt {
	display: none;
}
.main_topic.dust.big .txt {
	font-size: 22px;
	display: flex;
}
.main_topic.dust.big .txt span {	
	font-weight: 600;		
	margin-left: 5px;
}
.main_topic.dust.big .range {
	height: 60px;
	display: flex;
	align-items: flex-start;
	width: 100%;
}
.main_topic.dust.big .range .bar {
	width: 100%;
	background: #E7E7E7;
	height: 6px;
	position: relative;
	margin-top: 10px;
}
.main_topic.dust.big .range .bar div {
	color: #ACACAC;
	font-size: 14px;
}
.main_topic.dust.big .range .bar .tulle_tip {
	width: 150px;
	position: absolute;
	top: -60px;
	height: 35px;
	display: flex;
	justify-content: center;
	align-items: center;
	left: calc(30% - 75px);
	font-size: 14px;
	background: #F9F9F9;
}
.main_topic.dust.big .range .bar .rod {
	width: 33.33%;
	background: #aebcc4;
	height: 6px;
	position: absolute;
	left: 0;
}
.main_topic.dust.big .range .bar.sky1_back .rod {
	background: #73e2ee;	
}
.main_topic.dust.big .range .bar.sky2_back .rod {
	background: #6EB2F3;	
}
.main_topic.dust.big .range .bar.sky3_back .rod {
	background: #7DA5B7;	
}
.main_topic.dust.big .range .bar.sky4_back .rod {
	background: #586073;	
}
.main_topic.dust.big .range .bar > div {
	width: 100px;
	height: auto;
	margin: 0;
	position: absolute;
	top: 0px;
	display: flex;
	flex-direction: column;
	gap: 15px;
}
.main_topic.dust.big .range .bar > div div {
	display: flex;
	justify-content: center;
}
.main_topic.dust.big .range .bar .check {
	width: 18px;
	height: 18px;
	border-radius: 30px;
	background: #E7E7E7;
	display: flex;
	margin: 0;
}
.main_topic.dust.big .range .bar > div div:nth-child(2) {
	margin: 0;
}
.main_topic.dust.big .range .bar div:nth-child(2) {
	left: 0%;
	top: -6px;
	align-items: flex-start;
}
.main_topic.dust.big .range .bar div:nth-child(3) {
	left: calc(33.33% - 50px);
	top: -6px;
	align-items: center;
}
.main_topic.dust.big .range .bar div:nth-child(4) {
	left: calc(66.66% - 50px);
	top: -6px;
	align-items: center;
}
.main_topic.dust.big .range .bar div:nth-child(5) {
	right: calc(0% - 0px);
	top: -6px;
	align-items: flex-end;
}
.main_topic.dust.big .range .bar div:nth-child(5) div:nth-child(2) {
	right: 0;
	left: initial;
	display: flex;
	/* width: 100px; */
	flex-direction: row-reverse;
}
.main_topic.dust.big .range .bar div .cloud {
    width: 30px;
    height: 18px;
    position: absolute;
    background: url(./image/new/air/cloud_1.png) no-repeat;
    background-size: contain;
    top: -8px;
    left: calc(30% - 15px);
}
/*대 e*/

/*중 s*/
.main_topic.dust.middle {
	display: block;
	/* background: #EAFFD7; */
	border-radius: 10px;
	padding:  0 !important;
	margin: 10px 0;
	height: calc(100% - 42px - 26px - 20px) !important;
} 
.main_topic.dust.middle .caution {
	height: 100% !important;
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* background: #EAFFD7; */
	margin-top: 10px;
	border-radius: 10px;
	/* padding: 0 10px; */
	box-sizing: border-box;
	gap: 15px;
}
.main_topic.dust.middle .range {
	display: none;
} 
.main_topic.dust.middle ul {
	display: none;
	position: relative;
}
.main_topic.dust.middle ul li {
}
.main_topic.dust.middle .adjustment {
	display: none;
}
.main_topic.dust.middle .img {
	background: url('./image/new/dust/dust_1.png') no-repeat;
	width: 100%;
	height: calc(100% - 25%);
	background-size: contain;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	background-position: center;
	color: #fff;
	font-size: 30px;
	font-weight: 600;
}
.main_topic.dust.middle .middle_txt {
	display: none;
}
.main_topic.dust.middle .middle_txt span{
	margin-left: 6px;
}
.main_topic.dust.middle .txt {
	font-size: 15px;
	margin-bottom: 0px;
	line-height: 1.4;
	font-weight: 300;
	height: 42px;
}
.main_topic.dust.middle .txt span {
	font-weight: 600;
}
/*중 e*/

/*소 s*/
.main_topic.dust.small {
	display: block;
	/* background: #EAFFD7; */
	border-radius: 10px;
	padding: 0;
	margin: 10px 0;
	height: calc(100% - 20px - 18px - 26px);
	gap: 5px;
	display: flex;
	flex-direction: column;
	justify-content: center;
} 
.main_topic.dust.small .caution {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: row;
	justify-content: space-evenly;
	background: none;
	background-size: cover;
	border-radius: 10px;
	align-items: center;
	background: #f6faff;
}
.main_topic.dust.small .adjustment {
	font-size: 16px;
	font-weight: 600;
	margin: 0;
}
.main_topic.dust.small .img {
	background: url('./image/new/dust/d_icon_1.png') no-repeat;
	width: 28%;
	height: 55%;
	background-size: contain;
	background-position: center;
	margin: 0;
}
.main_topic.dust.small .middle_txt {
	display: none;
}
.main_topic.dust.small .txt {
	display: none;
}

.main_topic.dust.small .range {
	display: none;
}
/*소 e*/
/*초미세먼지 e*/



/*통합대피소 s*/
.main_topic.integrated {
	display: none;
}
/*대 s*/
.main_topic.integrated.big {
	display: block;
}
.main_topic.integrated.big select {
    border-radius: 10px;
    background: #fff url(./image/new/select.png) no-repeat 98% 50%;
    cursor: pointer;
    height: 40px;
    font-weight: 500;
    color: #696969;
    background-size: 12px;
}
.main_topic.integrated.big .caution{
	display: flex;
	flex-direction: column;
	height: calc(100% - 45px);
	gap: 10px;
	margin-top: 10px;
} 
.main_topic.integrated.big .caution .address{
	margin: 0;
	height: calc(65% - 10px);
	position: relative;
	width: 100%;
	border-radius: 10px;
	padding: 26px;
	box-sizing: border-box;
}
.main_topic.integrated.big .caution .address .txt {
	
	margin: 0;		
	display: flex;		
	flex-direction: column;		
	justify-content: space-between;		
	height: 100%;	
	align-items: flex-start;
}
.main_topic.integrated.big .caution .address .title {
	margin: 0;
	background: #b4d1fb;
	height: 30px;
	padding: 0 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	border-radius: 10px;
	font-weight: 500;
	line-height: 30px;
}
.main_topic.integrated.big .caution .address .middle_txt {
	margin: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	color: #696969;
}
.main_topic.integrated.big .caution .address .middle_txt div {
	margin: 0;
	font-size: 15px;
}
.main_topic.integrated.big .caution .address .middle_txt div:first-child {		
	font-size: 18px;
	font-weight: 500;
}
.main_topic.integrated.big .caution .address .img {
	background: url(./image/new/all_shelter/shelter_1.png) no-repeat;
	width: 50%;
	height: 95%;
	background-size: contain;
	position: absolute;
	bottom: 0;
	right: 0;
	background-position: center;
	background-position-x: calc(100% - 20px);
	background-position-y: calc(100% - 10px);
}
.main_topic.integrated.big .map {
	height: 35%;
	width: 100%;
	background: #f7f7f7;
	border-radius: 10px;
	position: relative;
}
.main_topic.integrated.big .map canvas{
	border-radius: 10px;
}
.main_topic.integrated.big .map .icon{
}
.main_topic.integrated.big .map button {
	width: 28px;
	height: 28px;
	/* background-size: contain !important; */
	background-color: #fff !important;
	border: 1px solid #d9d9d9;
	box-sizing: border-box;
	position: absolute;
	right: 26px;
	background-size: 50% !important;
	cursor: pointer;
	z-index: 1;
}

.main_topic.integrated.big .map .enlargement {
	background: url(./image/new/max.png) no-repeat 50%;
	top: 26px;
}
.main_topic.integrated.big .map .enlargement:hover{
	background: url(./image/new/max_hover.png) no-repeat 50%;
	border: 1px solid #69aef2;
}
.main_topic.integrated.big .map .plus{
	background: url(./image/new/plus.png) no-repeat 50%;
	bottom: 53px;
}
.main_topic.integrated.big .map .minus{
	background: url(./image/new/min.png) no-repeat 50%;
	bottom: 26px;
}
.main_topic.integrated.big .address .tulle_tip_hover {
    display: none !important;
}
/*대 e*
/*중 s*/
.main_topic.integrated.middle {
	display: block;
	padding: 10px 0;
}
.main_topic.integrated.middle select {
    height: 35px;
	border-radius: 10px;
	font-size: 14px;
	font-weight: 500;
	background: #fff url('./image/new/select.png') no-repeat 96% 50%;
	color: #696969;
	background-size: 12px;
}
.main_topic.integrated.middle .caution{
	display: flex;
	flex-direction: column;
	height: calc(100% - 45px);
	gap: 10px;
	margin-top: 10px;
} 
.main_topic.integrated.middle .caution .address.blue_pastel  {
	margin: 0;
	height: 100%;
	position: relative;
	background: url(./image/new/all_shelter/shelter_back1.png) no-repeat !important;
	background-size: cover !important;
	width: 100%;
	border-radius: 10px;
	padding: 15px;
	box-sizing: border-box;
	/* background: linear-gradient(to bottom, #C3E1FF, #EDF6FF) !important; */
}
.main_topic.integrated.middle .caution .address.orange_pastel {
	margin: 0;
	height: 100%;
	position: relative;
	background: url(./image/new/all_shelter/shelter_back2.png) no-repeat !important;
	background-size: cover !important;
	width: 100%;
	border-radius: 10px;
	padding: 15px;
	box-sizing: border-box;
	/* background: linear-gradient(to bottom, #C3E1FF, #EDF6FF) !important; */
}
.main_topic.integrated.middle .caution .address .txt {
	display: flex;
	flex-direction: column;
	align-items: baseline;
	height: 100%;
}
.main_topic.integrated.middle .caution .address .title {
	/* margin: 0; */
	/* background: #b4d1fb; */
	/* height: 30px; */
	/* padding: 0 15px; */
	/* display: flex; */
	/* align-items: center; */
	/* justify-content: center; */
	/* color: #fff; */
	/* border-radius: 10px; */
	/* font-weight: 500; */
	/* z-index: 100; */
	display: none;
}
.main_topic.integrated.middle .caution .address .middle_txt {
	width: calc(100% - 30px);
	margin: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	color: #696969;
	position: absolute;
	height: initial;
	justify-content: center;
	left: 15px;
	bottom: 15px;
}
.main_topic.integrated.middle .caution .address .middle_txt div {
	margin: 0;
	font-size: 14px;
}
.main_topic.integrated.middle .caution .address .middle_txt div:first-child {
	font-weight: 600;
}
.main_topic.integrated.middle .caution .address .middle_txt div:last-child {
	/* display: none; */
}
.main_topic.integrated.middle .caution .address.blue_pastel .img {
	border: 2px solid #6eb2f3;
	/* background-color: #fff !important; */
	width: 50px;
	height: 50px;
	background-size: 70% !important;
	position: absolute;
	top: 15px;
	right: 15px;
	border-radius: 50px;
	background-position: center;
}
.main_topic.integrated.middle .caution .address.orange_pastel .img {
	border: 2px solid #FFC136;
	background: #fff url(./image/new/all_shelter/shelter_2.png) no-repeat;
	width: 60px;
	height: 60px;
	background-size: 70%;
	position: absolute;
	top: 15px;
	right: 15px;
	border-radius: 50px;
	background-position: center;
}
.main_topic.integrated.middle .map {
	display: none;
}
.main_topic.integrated.middle .address .tulle_tip_hover {
    display: none !important;
}
/*중 e*/
/*소 s*/
.main_topic.integrated.small {
	display: flex;
	padding: 10px 0;
	height: calc(100% - 42px);
	flex-direction: column;
	/* margin: 10px 0; */
	/* height: calc(100% - 20px - 18px - 26px); */
	gap: 5px;
}
.main_topic.integrated.small select {
    height: calc(50% - 2.5px);
    border-radius: 10px;
    font-size: 13px;
    font-weight: 500;
    background: #fff url(./image/new/select.png) no-repeat 92% 50%;
    color: #696969;
    background-size: 10px;
    max-height: 35px;
}
.main_topic.integrated.small .caution {
    height: calc(75% - 2.5px);
    display: flex;
    margin: 0;
    border-radius: 10px;
}
.main_topic.integrated.small .caution .address {
	display: flex;
    align-content: center;
    justify-content: center;
}
.main_topic.integrated.small .caution .address.blue_back {
	margin: 0;
	height: 100%;
	position: relative;
	background: url(./image/new/all_shelter/shelter_back1.png) no-repeat;
	background-size: cover;
	width: 100%;
	border-radius: 10px;
	/* padding: 10px; */
	box-sizing: border-box;
}
.main_topic.integrated.small .caution .address.orange_back {
	margin: 0;
	height: 100%;
	position: relative;
	background: url(./image/new/all_shelter/shelter_back2.png) no-repeat;
	background-size: cover;
	width: 100%;
	border-radius: 10px;
	/* padding: 10px; */
	box-sizing: border-box;
}
.main_topic.integrated.small .caution .address .txt {
	display: flex;
	flex-direction: column-reverse;
	gap: 5px;
	align-items: center;
	height: 100%;
	justify-content: center;
	color: #69aef2;
	/* display: none; */
	width: 100%;
}
.main_topic.integrated.small .caution .address .txt .title {
	display: none;
}
.main_topic.integrated.small .caution .address .middle_txt {
	width: 100%;
}
.main_topic.integrated.small .caution .address .middle_txt div {
	display: none;
	color: #fff;
	word-wrap: break-word;
	/* display: flow-root; */
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	width: 95%;
	padding: 0 5px;
	/* display: flex;
    justify-content: center;
    align-items: center; */
}
.main_topic.integrated.small .caution .address .middle_txt div:first-child {
	display: block;
	font-weight: 600;
	white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.main_topic.integrated.small .map {
	display: none;
}
.main_topic.integrated.small .caution .address .tulle_tip_hover {
	display: none !important;
	position: absolute;
	background: #767676;
	height: 18px;
	white-space: nowrap;/** 한줄로 보이기 위해서 **/
	font-size: 10px;
	top: 60%;
	border-radius: 5px;
	justify-content: center;
	align-items: center;
	padding: 0 15px;
}
.main_topic.integrated.small .caution .address .tulle_tip_hover::after{
	display: block;
    position: absolute;
    left: 50%;
    content: '';
    transform: rotate(135deg) translate(0px, 5px);
    border-bottom: 10px solid #767676;
    border-left: 0px solid transparent;
    border-right: 10px solid transparent;
    top: 0px;
}
.main_topic.integrated.small .caution .address:hover .tulle_tip_hover {
	display: flex !important;
}
/*소 e*/
/*통합대피소 e*/




/*전기차 · 수소차 충전소 s*/
.main_topic.charging {
	display: none;
} 
/*대 s*/
.main_topic.charging.big {
	display: block;
}
.main_topic.charging.big select {
	display: none;
}
.main_topic.charging.big ul {
	
	display: flex;		
	align-content: center;		
	justify-content: center;		
	background: #F4F4F4;	
	border-radius: 50px;		
	height: 40px;		
	width: 100%;		
	padding: 5px;		
	box-sizing: border-box;
}
.main_topic.charging.big ul li {
	/* height: 40px; */
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 15px;
	font-weight: 500;
	/* background: #fff; */
	border-radius: 50px;
}
.main_topic.charging.big ul li.on {
	
background: #fff;
}
.main_topic.charging.big .caution{
	display: flex;
	flex-direction: column;
	height: calc(100% - 50px);
	gap: 10px;
	margin-top: 10px;
} 
.main_topic.charging.big .caution .address.on{
	display: flex;
}
.main_topic.charging.big .caution .address{
	margin: 0;
	height: calc(65% - 10px);
	position: relative;
	width: 100%;
	border-radius: 10px;
	padding: 26px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column-reverse;
	gap: 15px;
	justify-content: space-between;
	display: none;
}

.main_topic.charging.big .caution .address .txt {
	
	margin: 0;
		
	display: flex;
		
	/* flex-direction: column; */
		
	height: 25%;
		
	align-items: center;
		
	justify-content: center;
		
	/* margin-bottom: 10px; */
}
.main_topic.charging.big .caution .address .title {
	margin: 0;
	background: #b4d1fb;
	height: 30px;
	padding: 0 15px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	border-radius: 10px;
	font-weight: 500;
	line-height: 30px;
}
.main_topic.charging.big .caution .address .middle_txt {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
	color: #696969;
	align-items: center;
}
.main_topic.charging.big .caution .address .middle_txt div {
	margin: 0;
	font-size: 15px;
}
.main_topic.charging.big .caution .address .middle_txt div:first-child {
	font-size: 20px;
	font-weight: 500;
}
.main_topic.charging.big .caution .address.electricity > .img {
	background: url(./image/new/electric/car_1.png) no-repeat;
	width: 80%;
	height: 65%;
	background-size: contain;
	position: relative;
	/* bottom: 0; */
	right: 0;
	background-position: center;
	display: flex;
	justify-content: center;
}
.main_topic.charging.big .caution .address.hydrogen > .img {
	background: url(./image/new/electric/car_2.png) no-repeat;
	width: 80%;
	height: 65%;
	background-size: contain;
	position: relative;
	/* bottom: 0; */
	right: 0;
	background-position: center;
	display: flex;
	justify-content: center;
}
.main_topic.charging.big .caution .address .img .tulle_tip{
	
	position: absolute;
		
	width: 80px;
		
	height: 80px;
		
	border-radius: 50px;
		
	display: flex;
		
	justify-content: center;
		
	align-items: center;
		
	left: 0;
		
	top: 50%;
		
	transform: translate(-50%, -50%);
		
	font-size: 15px;
		
	font-weight: 500;
		
	flex-direction: column;
}
.main_topic.charging.big .caution .address .img .tulle_tip span{
	
margin: 0;
}
.main_topic.charging.big .caution .address .img .tulle_tip.green_back::after {
	display: block;
	position: absolute;
	right: 0px;
	content: '';
	transform: rotate(224deg);
	border-bottom: 20px solid #6cd700;
	border-left: 0px solid transparent;
	border-right: 20px solid transparent;
	left: calc(100% - 17%);
}
.main_topic.charging.big .map {
	height: 35%;
	width: 100%;
	background: #f7f7f7;
	border-radius: 10px;
	position: relative;
}
.main_topic.charging.big .map .icon{
}
.main_topic.charging.big .map button {
	width: 28px;
	height: 28px;
	/* background-size: contain !important; */
	background-color: #fff !important;
	border: 1px solid #d9d9d9;
	box-sizing: border-box;
	position: absolute;
	right: 26px;
	background-size: 50% !important;
	cursor: pointer;
}

.main_topic.charging.big .map .enlargement {
	background: url(./image/new/max.png) no-repeat 50%;
	top: 26px;
}
.main_topic.charging.big .map .enlargement:hover{
	background: url(./image/new/max_hover.png) no-repeat 50%;
	border: 1px solid #69aef2;
}
.main_topic.charging.big .map .plus{
	background: url(./image/new/plus.png) no-repeat 50%;
	bottom: 53px;
}
.main_topic.charging.big .map .minus{
	background: url(./image/new/min.png) no-repeat 50%;
	bottom: 26px;
}
/*대 e*
/*중 s*/
.main_topic.charging.middle {
	display: block;
	padding: 10px 0;
}
.main_topic.charging.middle ul {
	
display: flex;
	
align-content: center;
	
justify-content: center;
	
background: #F4F4F4;
	
border-radius: 50px;
	
height: 35px;
	
width: 100%;
	
padding: 5px;
	
box-sizing: border-box;
}
.main_topic.charging.middle ul li {
	/* height: 40px; */
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 15px;
	font-weight: 500;
	/* background: #fff; */
	border-radius: 50px;
}
.main_topic.charging.middle select {
	display: none;
}
.main_topic.charging.middle ul li.on {
	
background: #fff;
}
.main_topic.charging.middle .caution{
	display: flex;
	flex-direction: column;
	height: calc(100% - 45px);
	gap: 10px;
	margin-top: 10px;
} 

.main_topic.charging.middle .caution .address {
	display: none;
	margin: 0;
	height: 100%;
	position: relative;
	/* background: url(./image/new/all_shelter/shelter_back1.png) no-repeat !important; */
	background-size: cover !important;
	width: 100%;
	border-radius: 10px;
	/* padding: 15px; */
	box-sizing: border-box;
	/* background: linear-gradient(to bottom, #C3E1FF, #EDF6FF) !important; */
	gap: 10px;
}
.main_topic.charging.middle .caution .address.on {
	display: flex;
	flex-direction: column-reverse;
}
.main_topic.charging.middle .caution .address .txt {
	display: flex;
	height: 30%;
	width: 100%;
	justify-content: center;
	gap: 6px;
	flex-direction: column;
}
.main_topic.charging.middle .caution .address .title {

	display: none;
}
.main_topic.charging.middle .caution .address .middle_txt {
	width: 100%;
	/* margin: 0; */
	display: flex;
	/* align-items: flex-start; */
	gap: 6px;
	margin: 0;
	text-align: left;
	flex-direction: column;
}
.main_topic.charging.middle .caution .address .middle_txt div {
	margin: 0;
	font-size: 14px;
	width: 100%;
}
.main_topic.charging.middle .caution .address .middle_txt div:first-child {
	font-weight: 600;
}
.main_topic.charging.middle .caution .address .middle_txt div:last-child {
	/* display: none; */
}
.main_topic.charging.middle .caution .address.electricity > .img {
	background: #eaffd7;
	width: 100%;
	height: calc(70% - 10px);
	border-radius: 10px;
	display: flex;
	align-items: center;
	position: relative;
}
.main_topic.charging.middle .caution .address.hydrogen > .img {
	background: #f1f7ff;
	width: 100%;
	height: calc(70% - 10px);
	border-radius: 10px;
	display: flex;
	align-items: center;
	position: relative;
}
.main_topic.charging.middle .caution .address.electricity > .img > .img {

	background: url(./image/new/electric/car_1.png) no-repeat;
    width: 80%;
    height: 65%;
    background-size: contain;
    position: relative;
    /* bottom: 0; */
    right: 0;
    background-position: center;
    display: flex;
    justify-content: center;
}
.main_topic.charging.middle .caution .address.hydrogen > .img > .img {

	background: url(./image/new/electric/car_2.png) no-repeat;
    width: 80%;
    height: 65%;
    background-size: contain;
    position: relative;
    /* bottom: 0; */
    right: 0;
    background-position: center;
    display: flex;
    justify-content: center;
}
.main_topic.charging.middle .caution .address .tulle_tip {
	position: absolute;
	height: 30px;
	padding: 0 15px;
	border-radius: 10px;
	display: flex;
	align-items: center;
	right: 15px;
	bottom: 15px;
}
.main_topic.charging.middle .map {
	display: none;
}
/*중 e*/
/*소 s*/
.main_topic.charging.small {
	display: flex;
	padding: 10px 0;
	height: calc(100% - 42px);
	flex-direction: column;
	/* margin: 10px 0; */
	/* height: calc(100% - 20px - 18px - 26px); */
	gap: 5px;
}
.main_topic.charging.small select {
	display: block;
    height: calc(50% - 2.5px);
    border-radius: 10px;
    font-size: 13px;
    font-weight: 500;
    background: #fff url(./image/new/select.png) no-repeat 92% 50%;
    color: #696969;
    background-size: 10px;
}
.main_topic.charging.small ul {
	display: none;
}
.main_topic.charging.small .caution {
    height: calc(50% - 2.5px);
    display: flex;
    margin: 0;
    background: #7fd218;
    border-radius: 10px;
}
.main_topic.charging.small .caution .address {
	margin: 0;
	height: 100%;
	position: relative;
	/* background: url(./image/new/shelter/shelter_back.png) no-repeat; */
	background-size: cover;
	width: 100%;
	border-radius: 10px;
	/* padding: 10px; */
	box-sizing: border-box;
	display: none;
}
.main_topic.charging.small .caution .address.on {
	display: flex;
}
.main_topic.charging.small .caution .address .txt {
	display: flex;
	flex-direction: column-reverse;
	gap: 5px;
	align-items: center;
	height: 100%;
	justify-content: center;
	color: #69aef2;
	/* display: none; */
	width: 100%;
	/* border-radius: 10px; */
}
.main_topic.charging.small .caution .address .img {
	 display: none;
}
.main_topic.charging.small .caution .address .txt .title {
	display: none;
}
.main_topic.charging.small .caution .address .middle_txt div {
	/* display: none; */
	color: #fff;
	word-wrap: break-word;
	display: flow-root;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	width: 75px;
}
.main_topic.charging.small .caution .address .middle_txt div:first-child {
	display: block;
	font-weight: 600;
	display: none;
}
.main_topic.charging.small .map {
	display: none;
}
/*소 e*/
/*전기차 · 수소차 충전소  e*/


/*물차 제원 s*/
.main_topic.water_truck {
	display: none;
}
.grid-stack-item-content.water_img {
	background: url(./image/new/water_car/water_img.png) no-repeat;
	width: 100%;
	/* height: 100%; */
	background-size: contain;
	background-position-y: bottom;
	box-sizing: border-box;
}
 
/*대 s*/
.main_topic.water_truck.big {
	display: block;
} 
.main_topic.water_truck.big .caution {
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* background: url('./image/new/drought/droughtback_1.png') no-repeat 100% 50%; */
	background-size: cover;
	border-radius: 10px;
}
.main_topic.water_truck.big .img {
	background: url('./image/new/water_car/ton_5.png') no-repeat 100% 50%;
	width: 45%;
	height: 40%;
	background-size: contain;
	background-position: center;
}
.main_topic.water_truck.big .txt {
	font-size: 22px;
	margin-top: 30px;
	line-height: 1.4;
	/* font-weight: 500; */
	margin-bottom: 60px;
}
.main_topic.water_truck.big .txt div:first-child {
	font-weight: 500;
}
.main_topic.water_truck.big .txt span {	
	font-weight: 600;
}
.main_topic.water_truck.big .caution .adjustment {
	display: none;
}
/*대 e*/
/*중 s*/
.main_topic.water_truck.middle {
	display: block;
	padding: 10px 0;
} 
.main_topic.water_truck.middle .caution {
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* background: url('./image/new/drought/droughtback_1.png') no-repeat 100% 50%; */
	background-size: cover;
	border-radius: 10px;
}
.main_topic.water_truck.middle .img {
	background: url('./image/new/water_car/ton_5.png') no-repeat 100% 50%;
	width: 50%;
	height: 55%;
	background-size: contain;
	background-position: center;
}
.main_topic.water_truck.middle .middle_txt {
	display: none;
}
.main_topic.water_truck.middle .txt {
	font-size: 15px;
	margin-top: 10px;
	line-height: 1.4;
	font-weight: 500;
}
.main_topic.water_truck.middle .txt span {	
	font-weight: 600;
}
.main_topic.water_truck.middle .caution .adjustment {
	display: none;
}
/*중 e*/
/*소 s*/
.main_topic.water_truck.small {
	display: block;
	padding: 10px 0;
	height: calc(100% - 45px);
} 
.main_topic.water_truck.small .caution {
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-evenly;
	background: none;
	background-size: cover;
	border-radius: 10px;
	align-items: center;
	/* background: #f6faff; */
	gap: 5px;
}
.main_topic.water_truck.small .img {
	/* background: url('./image/new/drought/drought_1.png') no-repeat 100% 50%; */
	/* width: 28%; */
	/* height: 55%; */
	/* background-size: contain; */
	/* background-position: center; */
	/* margin: 0; */
	display: none;
}
.main_topic.water_truck.small .txt {
	/* display: none; */
	width: 100%;
	height: calc(50% - 2.5px);
	border: 1px solid #D9D9D9;
	border-radius: 10px;
	display: flex;
	align-items: center;
}
.main_topic.water_truck.small .txt .border {
	/* height: 100%; */
	/* border: 1px solid #D9D9D9; */
	/* width: 100%; */
	/* border-radius: 5px; */
}
.main_topic.water_truck.small .txt .none {
	display: none;
}
.main_topic.water_truck.small .txt span {	
	font-weight: 600;
}
.main_topic.water_truck.small .caution .adjustment {
	margin: 0;
	/* margin-left: 5px; */
	/* font-size: 16px; */
	/* font-weight: 600; */
	height: calc(50% - 2.5px);
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 10px;
	font-size: 13px;
	font-weight: 500;
	position: initial;
	left: 50%;
	transform: none;
	position: relative;
	left: 0;
	cursor: pointer;
	background: #6eb2f3;
	color: #fff !important;
	gap: 5px;
}
.main_topic.water_truck.small .caution .adjustment span {
	margin: 0;
	display: flex;
	gap: 5px;
}
/*소 e*/
/*물차 제원 e*/

/*국립공원탐방로 s*/
.main_topic.national_park {
	display: none;
} 
/*대 s*/
.main_topic.national_park.big {
	display: block;
	height: calc(100% - 42px);
	padding-bottom: 0;
}
.main_topic.national_park.big select {
    border-radius: 10px;
    background: #fff url(./image/new/select.png) no-repeat 98% 50%;
    cursor: pointer;
    height: 40px;
    font-weight: 500;
    color: #696969;
    background-size: 12px;
}
.main_topic.national_park.big .caution{
	display: flex;
	flex-direction: column;
	height: calc(100% - 50px);
	gap: 10px;
	margin-top: 10px;
} 
.main_topic.national_park.big .caution .address{
	margin: 0;
	height: calc(40% - 10px);
	position: relative;
	width: 100%;
	border-radius: 10px;
	padding: 26px;
	box-sizing: border-box;
	background: #F5F5F5;
}
.main_topic.national_park.big .caution .address .txt {
	
	margin: 0;		
	display: flex;		
	flex-direction: column;		
	justify-content: space-between;		
	height: 100%;	
	align-items: flex-start;
}
.main_topic.national_park.big .caution .address .title {
	margin: 0;
	/* background: #b4d1fb; */
	/* height: 30px; */
	/* padding: 0 15px; */
	display: flex;
	color: #fff;
	border-radius: 10px;
	font-weight: 500;
	line-height: 30px;
	flex-direction: column;
	align-items: flex-start;
}

.main_topic.national_park.big .caution .address .title .blue {
	font-size: 14px;
	margin: 0;
}
.main_topic.national_park.big .caution .address .title div {
	font-size: 22px;
	color: #696969;
}
.main_topic.national_park.big .caution .address .img_txt {
	margin: 0;
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	gap: 10px;
	color: #696969;
	width: 100%;
	height: 40px;
}
.main_topic.national_park.big .caution .address .img_txt li {
	margin: 0;
	font-size: 13px;
	width: 33.33%;
	background: #fff;
	border-radius: 10px;
	height: 100%;
	display: flex;
	align-items: center;
	/* margin: 0; */
	gap: 5px;
	justify-content: flex-start;
	padding: 0 8px;
}
.main_topic.national_park.big .caution .address .img_txt li div {
	margin: 0;
}
.main_topic.national_park.big .caution .address .img_txt li div:nth-child(1) {
	height: 80%;
}
.main_topic.national_park.big .caution .address .img_txt li div:nth-child(2) {
	color: #D9D9D9;
}
.main_topic.national_park.big .caution .address .img_txt li .clock {
	background: url('./image/new/park/time.png') no-repeat;
	background-size: contain;
	width: 15%;
	height: 100%;
	background-position: center;
}
.main_topic.national_park.big .caution .address .img_txt li .distance {
	background: url('./image/new/park/distance.png') no-repeat;
	background-size: contain;
	width: 15%;
	height: 100%;
	background-position: center;
}
.main_topic.national_park.big .caution .address .img_txt li .level {
	background: url('./image/new/park/difficulty.png') no-repeat;
	background-size: contain;
	width: 15%;
	height: 100%;
	background-position: center;
}
.main_topic.national_park.big .trail {
	height: 60%;
	width: 100%;
	/* background: #f7f7f7; */
	border-radius: 10px;
	position: relative;
	border: 1px solid #F5F5F5;
	display: flex;
	justify-content: center;
}
.main_topic.national_park.big .map_popup {
	justify-content: space-between;
	gap: 10px;
	position: absolute;
	bottom: 15px;
	width: calc(100% - 52px);
}
.main_topic.national_park.big .map_popup li {
	background: #696969;
	color: #fff;
	font-weight: 300;
	width: calc(33.33%);
	border-radius: 10px;
	height: 40px;
	display: flex;
}

/*대 e*
/*중 s*/
.main_topic.national_park.middle {
	display: block;
	padding-top: 10px;
	height: calc(100% - 40px) !important;
	padding-bottom: 0 !important;
}
.main_topic.national_park.middle select {
    border-radius: 10px;
    background: #fff url('./image/new/select.png') no-repeat 96% 50%;
    cursor: pointer;
    height: 35px;
    font-weight: 500;
    color: #696969;
    background-size: 12px;
}
.main_topic.national_park.middle .caution{
	display: flex;
	flex-direction: column;
	height: calc(100% - 47px);
	gap: 10px;
	margin-top: 10px;
} 
.main_topic.national_park.middle .caution .address{
	margin: 0;
	height: 100%;
	position: relative;
	width: 100%;
	border-radius: 10px;
	padding: 10px;
	box-sizing: border-box;
	background: #F5F5F5;
}
.main_topic.national_park.middle .caution .address .txt {
	
	margin: 0;		
	display: flex;		
	flex-direction: column;		
	justify-content: space-between;		
	height: 100%;	
	align-items: flex-start;
}
.main_topic.national_park.middle .caution .address .title {
	display: none;
}

.main_topic.national_park.middle .caution .address .title .blue {
	display: none;
}
.main_topic.national_park.middle .caution .address .title div {
	display: none;
}
.main_topic.national_park.middle .caution .address .img_txt {
	margin: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	color: #696969;
	width: 100%;
	height: 100%;
}
.main_topic.national_park.middle .caution .address .img_txt li {
	margin: 0;
	font-size: 13px;
	width: 100%;
	background: #fff;
	border-radius: 10px;
	height: 100%;
	display: flex;
	align-items: center;
	/* margin: 0; */
	gap: 5px;
	justify-content: flex-start;
	padding: 0 8px;
	box-sizing: border-box;
}
.main_topic.national_park.middle .caution .address .img_txt li div {
	margin: 0;
}
.main_topic.national_park.middle .caution .address .img_txt li div:nth-child(2) {
	color: #D9D9D9;
}
.main_topic.national_park.middle .caution .address .img_txt li .clock {
	background: url('./image/new/park/time.png') no-repeat;
	background-size: contain;
	width: 10%;
	height: 100%;
	background-position: center;
}
.main_topic.national_park.middle .caution .address .img_txt li .distance {
	background: url('./image/new/park/distance.png') no-repeat;
	background-size: contain;
	width: 10%;
	height: 100%;
	background-position: center;
}
.main_topic.national_park.middle .caution .address .img_txt li .level {
	background: url('./image/new/park/difficulty.png') no-repeat;
	background-size: contain;
	width: 10%;
	height: 100%;
	background-position: center;
}
.main_topic.national_park.middle .trail {
	/* display: none; */
	margin: 0;
}
.main_topic.national_park.middle .map_popup {
	
justify-content: space-between;
	
gap: 5px;
}
.main_topic.national_park.middle .map_popup li {
	background: #696969;
	color: #fff;
	font-weight: 300;
	width: 33.33%;
}
/*중 e*/
/*소 s*/

/*소 e*/
/*국립공원탐방로 e*/

/*황사 모델예측 s*/

.main_topic.yellow_dust {
	display: none;
} 
/*대 s*/
.main_topic.yellow_dust.big {
	display: block;
	font-size: initial;
} 
.main_topic.yellow_dust.big .caution {
	height: calc(100% - 50px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* margin-bottom: 20px; */
	/* background: url('./image/new/temperature/back1.png') no-repeat; */
	width: 100%;
	background-size: contain;
	/* margin-top: 10px; */
	border-radius: 10px;
	gap: 20px;
	margin-bottom: 10px;
}

.main_topic.yellow_dust.big .img {

	width: 100%;
	
	height: 100%;
	
	background-size: contain;
	
	background-position: center;
	
	color: #fff;
	
	font-size: 50px;
	
	font-weight: 600;
	
	display: flex;
	
	justify-content: center;
	
	align-items: center;
	
	border-radius: 10px;
	
	border: 1px solid #f4f4f4;
}

.main_topic.yellow_dust.big .range {
	height: 40px;
	display: flex;
	align-content: center;
	align-items: center;
	width: 100%;
}
.main_topic.yellow_dust.big .range .bar {
	width: calc(100% - 45px);
	background: #F4F4F4;
	height: 6px;
	position: relative;
	margin: 0;
	margin-left: 10px;
	border-radius: 10px;
}
.main_topic.yellow_dust.big .range .button.on {
	height: 35px;
	width: 35px;
	background: url(./image/new/button_off.png) no-repeat;
	background-size: contain;
	margin: 0;
	/* display: flex; */
}
.main_topic.yellow_dust.big .range .button {
	height: 35px;
	width: 35px;
	background: url(./image/new/button_on.png) no-repeat;
	background-size: contain;
	margin: 0;
	/* display: flex; */
}
.main_topic.yellow_dust.big .range .bar .rod {
	width: 30%;
	background: #6eb2f3;
	height: 6px;
	position: absolute;
	left: 0;
	border-radius: 10px;
}
.main_topic.yellow_dust.big .range .bar .reproduction {
    width: 18px;
    height: 18px;
    position: absolute;
    background: #6eb2f3;
    background-size: contain;
    top: -6px;
    left: calc(30% - 15px);
    border-radius: 10px;
}


/*대 e*/


/*중 s*/
.main_topic.yellow_dust.middle {
	display: block;
	padding: 10px 0;
} 
.main_topic.yellow_dust.middle .caution {
	height: calc(100% - 35px);
		margin-bottom: 5px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* margin-bottom: 20px; */
	/* background: url('./image/new/temperature/back1.png') no-repeat; */
	width: 100%;
	background-size: contain;
	/* margin-top: 10px; */
	border-radius: 10px;
	gap: 20px;
	
}

.main_topic.yellow_dust.middle .img {

	width: 100%;
	
	height: 100%;
	
	background-size: contain;
	
	background-position: center;
	
	color: #fff;
	
	font-size: 50px;
	
	font-weight: 600;
	
	display: flex;
	
	justify-content: center;
	
	align-items: center;
	
	border-radius: 10px;
	
	border: 1px solid #f4f4f4;
}

.main_topic.yellow_dust.middle .range {
	height: 30px;
	display: flex;
	align-content: center;
	align-items: center;
	width: 100%;
}
.main_topic.yellow_dust.middle .range .bar {
	width: calc(100% - 45px);
	background: #F4F4F4;
	height: 6px;
	position: relative;
	margin: 0;
	margin-left: 10px;
	border-radius: 10px;
}
.main_topic.yellow_dust.middle .range .button.on {
	height: 25px;
	width: 25px;
	background: url(./image/new/button_off.png) no-repeat;
	background-size: contain;
	margin: 0;
	/* display: flex; */
}
.main_topic.yellow_dust.middle .range .button {
	height: 25px;
	width: 25px;
	background: url(./image/new/button_on.png) no-repeat;
	background-size: contain;
	margin: 0;
	/* display: flex; */
}
.main_topic.yellow_dust.middle .range .bar .rod {
	width: 30%;
	background: #6eb2f3;
	height: 6px;
	position: absolute;
	left: 0;
	border-radius: 10px;
}
.main_topic.yellow_dust.middle .range .bar .reproduction {
    width: 18px;
    height: 18px;
    position: absolute;
    background: #6eb2f3;
    background-size: contain;
    top: -6px;
    left: calc(30% - 15px);
    border-radius: 10px;
}
/*중 e*/

/*소 s*/

/*소 e*/

/*sliderBar s*/
.main_topic.yellow_dust .range .slider-container .back-bar{
	width: calc(100% - 10px);
    background: #F4F4F4;
    height: 6px;
    position: relative;
    margin: 0;
    margin-left: 10px;
    border-radius: 10px;
}
.main_topic.yellow_dust .range .slider-container .back-bar .selected-bar{
	background: rgb(110, 178, 243);
    height: 6px;
    position: absolute;
    left: 0px;
    border-radius: 10px;
}
.main_topic.yellow_dust .range .slider-container .back-bar .pointer {
	width: 18px;
    height: 18px;
    position: absolute;
    background: 0% 0% / contain rgb(110, 178, 243);
    top: -6px;
    border-radius: 10px;
    opacity: 1;
    z-index: 2;
    box-sizing: border-box;
    cursor: pointer;
    margin-left: -5px;
}
.main_topic.yellow_dust .range .slider-container .scale{
	top: 30px;
    position: relative;
    margin-left: 5%;
}
.main_topic.yellow_dust .range .slider-container .scale ins{
	font-size: 0.6rem;
    text-decoration: none;
    position: absolute;
    left: 0;
    top: 5px;
    color: #69AEF2;
    line-height: 1;
    width: 110px;
}
.main_topic.yellow_dust .range .slider-container .scale span{
	position: absolute;
    height: 5px;
    border-left: 0px solid #999;
    font-size: 0;
}
 /*sliderBar e*/
 
/*황사 모델예측 e*/



/*황사 위성영상 s*/

.main_topic.satellite {
	display: none;
} 
/*대 s*/
.main_topic.satellite.big {
	display: block;
	font-size: initial;
} 
.main_topic.satellite.big .caution {
	height: calc(100% - 50px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* margin-bottom: 20px; */
	/* background: url('./image/new/temperature/back1.png') no-repeat; */
	width: 100%;
	background-size: contain;
	/* margin-top: 10px; */
	border-radius: 10px;
	gap: 20px;
	margin-bottom: 10px;
}

.main_topic.satellite.big .img {

	width: 100%;
	
	height: 100%;
	
	background-size: contain;
	
	background-position: center;
	
	color: #fff;
	
	font-size: 50px;
	
	font-weight: 600;
	
	display: flex;
	
	justify-content: center;
	
	align-items: center;
	
	border-radius: 10px;
	
	border: 1px solid #f4f4f4;
}

.main_topic.satellite.big .range {
	height: 40px;
	display: flex;
	align-content: center;
	align-items: center;
	width: 100%;
}
.main_topic.satellite.big .range .bar {
	width: calc(100% - 45px);
	background: #F4F4F4;
	height: 6px;
	position: relative;
	margin: 0;
	margin-left: 10px;
	border-radius: 10px;
}
.main_topic.satellite.big .range .button.on {
	height: 35px;
	width: 35px;
	background: url(./image/new/button_off.png) no-repeat;
	background-size: contain;
	margin: 0;
	/* display: flex; */
}
.main_topic.satellite.big .range .button {
	height: 35px;
	width: 35px;
	background: url(./image/new/button_on.png) no-repeat;
	background-size: contain;
	margin: 0;
	/* display: flex; */
}
.main_topic.satellite.big .range .bar .rod {
	width: 30%;
	background: #6eb2f3;
	height: 6px;
	position: absolute;
	left: 0;
	border-radius: 10px;
}
.main_topic.satellite.big .range .bar .reproduction {
    width: 18px;
    height: 18px;
    position: absolute;
    background: #6eb2f3;
    background-size: contain;
    top: -6px;
    left: calc(30% - 15px);
    border-radius: 10px;
}


/*대 e*/


/*중 s*/
.main_topic.satellite.middle {
	display: block;
	padding: 10px 0;
} 
.main_topic.satellite.middle .caution {
	height: calc(100% - 35px);
		margin-bottom: 5px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* margin-bottom: 20px; */
	/* background: url('./image/new/temperature/back1.png') no-repeat; */
	width: 100%;
	background-size: contain;
	/* margin-top: 10px; */
	border-radius: 10px;
	gap: 20px;
	
}

.main_topic.satellite.middle .img {

	width: 100%;
	
	height: 100%;
	
	background-size: contain;
	
	background-position: center;
	
	color: #fff;
	
	font-size: 50px;
	
	font-weight: 600;
	
	display: flex;
	
	justify-content: center;
	
	align-items: center;
	
	border-radius: 10px;
	
	border: 1px solid #f4f4f4;
}

.main_topic.satellite.middle .range {
	height: 30px;
	display: flex;
	align-content: center;
	align-items: center;
	width: 100%;
}
.main_topic.satellite.middle .range .bar {
	width: calc(100% - 45px);
	background: #F4F4F4;
	height: 6px;
	position: relative;
	margin: 0;
	margin-left: 10px;
	border-radius: 10px;
}
.main_topic.satellite.middle .range .button.on {
	height: 25px;
	width: 25px;
	background: url(./image/new/button_off.png) no-repeat;
	background-size: contain;
	margin: 0;
	/* display: flex; */
}
.main_topic.satellite.middle .range .button {
	height: 25px;
	width: 25px;
	background: url(./image/new/button_on.png) no-repeat;
	background-size: contain;
	margin: 0;
	/* display: flex; */
}
.main_topic.satellite.middle .range .bar .rod {
	width: 30%;
	background: #6eb2f3;
	height: 6px;
	position: absolute;
	left: 0;
	border-radius: 10px;
}
.main_topic.satellite.middle .range .bar .reproduction {
    width: 18px;
    height: 18px;
    position: absolute;
    background: #6eb2f3;
    background-size: contain;
    top: -6px;
    left: calc(30% - 15px);
    border-radius: 10px;
}
/*중 e*/

/*소 s*/

/*소 e*/
 
/*황사 위성영상 e*/



/*표준유역 강수량 s*/

.main_topic.standard_basin {
	display: none;
} 
/*대 s*/
.main_topic.standard_basin.big {
	display: flex;
	font-size: initial;
	flex-wrap: wrap;
	gap: 0 5px;
} 
.main_topic.standard_basin.big .select {
	display: flex;
	gap: 5px;
	/* margin: 0; */
	width: 100%;
}
.main_topic.standard_basin.big select {
    border-radius: 10px;
    background: #fff url(./image/new/select.png) no-repeat 98% 50%;
    cursor: pointer;
    height: 40px;
    font-weight: 500;
    color: #696969;
    background-size: 12px;
    width: calc(50% - 2.5px);
}
.main_topic.standard_basin.big .caution {
	height: calc(100% - 50px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* margin-bottom: 20px; */
	/* background: url('./image/new/temperature/back1.png') no-repeat; */
	width: 100%;
	background-size: contain;
	margin-top: 10px;
	border-radius: 10px;
	gap: 20px;
	/* margin-bottom: 10px; */
}

.main_topic.standard_basin.big .img {

	width: 100%;
	
	height: 100%;
	
	background-size: contain;
	
	background-position: center;
	
	color: #fff;
	
	font-size: 50px;
	
	font-weight: 600;
	
	display: flex;
	
	justify-content: center;
	
	align-items: center;
	
	border-radius: 10px;
	
	border: 1px solid #f4f4f4;
}

.main_topic.standard_basin.big .range {
	height: 40px;
	display: flex;
	align-content: center;
	align-items: center;
	width: 100%;
	position: relative;
	flex-direction: column;
	justify-content: flex-end;
	display: none;
}
.main_topic.standard_basin.big .range .bar {
	width: 100%;
	background: url(./image/new/bar.png) no-repeat;
	height: 10px;
	position: relative;
	margin: 0;
	/* margin-left: 10px; */
	border-radius: 10px;
	background-size: contain;
	background-position: center;
	display: flex;
	align-items: flex-end;
}
.main_topic.standard_basin.big .range .button.on {
	height: 35px;
	width: 35px;
	background: url(./image/new/button_off.png) no-repeat;
	background-size: contain;
	margin: 0;
	/* display: flex; */
}
.main_topic.standard_basin.big .range .button {
	height: 35px;
	width: 35px;
	background: url(./image/new/button_on.png) no-repeat;
	background-size: contain;
	margin: 0;
	/* display: flex; */
	position: absolute;
	bottom: 76px;
	left: 26px;
	cursor: pointer;
}
.main_topic.standard_basin.big .range .big {
	display: flex;
}
.main_topic.standard_basin.big .range .middle {
	display: none;
}
.main_topic.standard_basin.big .range ul {
	display: flex;
	font-size: 13px;
	width: 100%;
	height: 25px;
}
.main_topic.standard_basin.big .range ul li {
   width: 16.66%;
}


/*대 e*/


/*중 s*/
.main_topic.standard_basin.middle {
	display: flex;
	padding: 10px 0;
	flex-wrap: wrap;
	position: relative;
	gap: 0px 5px;
	height: calc(100% - 35px) !important;
} 
.main_topic.standard_basin.middle .select {
	width: 100%;
	display: flex;
	gap: 5px;
}
.main_topic.standard_basin.middle select {
    height: 35px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 500;
    background: #fff url(./image/new/select.png) no-repeat 96% 50%;
    color: #696969;
    background-size: 12px;
    width: calc(50% - 2.5px);
}
.main_topic.standard_basin.middle .caution {
	height: calc(100% - 45px);
	margin-bottom: 5px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin-bottom: initial;
	/* background: url('./image/new/temperature/back1.png') no-repeat; */
	/* 	width: calc(100% - 50px); */
	width: 100%;
	background-size: contain;
	margin-top: 10px;
	border-radius: 10px;
	gap: 20px;
	margin-left: 0;
	margin-right: 0;
}

.main_topic.standard_basin.middle .img {

width: 100%;

height: 100%;

background-size: contain;

background-position: center;

color: #fff;

font-size: 50px;

font-weight: 600;

display: flex;

justify-content: center;

align-items: center;

border-radius: 10px;

border: 1px solid #f4f4f4;
}

.main_topic.standard_basin.middle .range {
	height: calc(100% - 45px);
	display: flex;
	align-content: center;
	align-items: center;
	width: 40px;
	/* position: relative; */
	margin-top: 10px;
	margin-right: 0;
	margin-left: 10px;
	flex-direction: row-reverse;
	gap: 5px;
	justify-content: flex-end;
	/* display: none; */
}
.main_topic.standard_basin.middle .range .bar {
	width: 4px;
	background: url(./image/new/bar_on.png) no-repeat;
	height: 100%;
	position: relative;
	margin: 0;
	/* margin-left: 10px; */
	border-radius: 10px;
	/* margin-left: 5px; */
	background-size: cover;
	display: flex;
	background-position: center;
}
.main_topic.standard_basin.middle .range .button.on {
	height: 25px;
	width: 25px;
	background: url(./image/new/button_off.png) no-repeat;
	background-size: contain;
	margin: 0;
	/* display: flex; */
}
.main_topic.standard_basin.middle .range .button {
	height: 25px !important;
	width: 25px !important;
	background: url(./image/new/button_on.png) no-repeat;
	background-size: contain;
	margin: 0;
	/* display: flex; */
	position: absolute;
	left: 10px;
	bottom: 20px;
}
.main_topic.standard_basin.middle .range ul {
	display: none;
}
.main_topic.standard_basin.middle .range .bar .reproduction {
    width: 18px;
    height: 18px;
    position: absolute;
    background: #6eb2f3;
    background-size: contain;
    top: -6px;
    left: calc(30% - 15px);
    border-radius: 10px;
}
.main_topic.standard_basin.middle .range .big {
	display: none;
}
.main_topic.standard_basin.middle .range .middle {
	display: flex;
	flex-direction: column;
	width: 30px;
	margin: 0;
	height: 100%;
	justify-content: space-between;
	font-size: 12px;
}
/*중 e*/

/*소 s*/

/*소 e*/
 
/*표준유역 강수량 e*/


/*생태관광 코스 추천 s*/

.main_topic.ecology {
	display: none;
} 
/*대 s*/
.main_topic.ecology.big {
	display: block;
	font-size: initial;
} 
.main_topic.ecology.big .txt {
	/* border: 1px solid #D9D9D9; */
	height: 40px;
	width: 100%;
	background: #f9f9f9;
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 0 15px;
	gap: 10px;
	box-sizing: border-box;
	font-size: 15px;
	align-content: center;
}
.main_topic.ecology.big .txt span {
	background: url(./image/new/sightseeing.png) no-repeat;
	width: 25px;
	height: 25px;
	margin: 0;
	background-size: contain;
}
.main_topic.ecology.big .caution {
	height: calc(100% - 50px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* margin-bottom: 20px; */
	/* background: url('./image/new/temperature/back1.png') no-repeat; */
	width: 100%;
	background-size: contain;
	margin-top: 10px;
	border-radius: 10px;
	/* gap: 20px; */
	margin-bottom: initial;
}
.main_topic.ecology.big .swiper_ecology {
	width: 100%;
	height: 100%;
}
.main_topic.ecology.big .swiper_ecology.swiper {
}
.main_topic.ecology.big .swiper_ecology .swiper-wrapper > div {
  display:flex;
  justify-content:center;
  align-items:center;
  border-radius: 10px;
}
.main_topic.ecology.big .swiper_ecology .swiper-wrapper > div .text {
	position: absolute;
	bottom: 0;
	height: 95px;
	width: 100%;
	background: #0000008c;
	border-radius: 0 0 10px 10px;
	padding: 15px;
	box-sizing: border-box;
	font-size: 14px;
	text-align: left;
	display: flex;
	flex-direction: column;
	letter-spacing: 0;
	/* gap: 5px; */
	/* outline: 1px solid black; */
	/* display: block; */
	color: #fff;
	font-weight: 100;
}
.main_topic.ecology.big .swiper_ecology .swiper-wrapper > div .text div:nth-child(2) {
        /* margin:100px; */
        /* outline: 1px solid black; */
        display: block;
        /* color: black; */
        /* width: 630px; */
        /* font-size: 20px; */
        font-weight: bolder !important;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal;
        line-height: 1.4;
        text-align: left;
        word-wrap: break-word;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        font-weight: 100 !important;
}
.main_topic.ecology.big .swiper_ecology .swiper-wrapper > div .text .title {
	font-size: 16px;
	margin: 0;
	margin-bottom: 10px;
}
.main_topic.ecology.big .swiper_ecology .swiper-wrapper > .slide-1 {
  background-color:#D3DEDC;
}

.main_topic.ecology.big .swiper_ecology .swiper-wrapper > .slide-2 {
  background-color:#92A9BD;
  
}
.main_topic.ecology.big .swiper_ecology .swiper-wrapper > .slide-3 {
  background-color:#7C99AC;
  
}
.main_topic.ecology.big .swiper_ecology .swiper-wrapper > .slide-4 {
  background-color:#D3DEDC;
  
}
.main_topic.ecology.big .swiper_ecology .swiper-wrapper > .slide-5 {
  background-color:#A3E4DB;
  
}
.main_topic.ecology.big .img {

	width: 100%;
	
	height: 100%;
	
	background-size: contain;
	
	background-position: center;
	
	color: #fff;
	
	font-size: 50px;
	
	font-weight: 600;
	
	display: flex;
	
	justify-content: center;
	
	align-items: center;
	
	border-radius: 10px;
	
	border: 1px solid #f4f4f4;
}

.main_topic.ecology.big .range {
	height: 40px;
	display: flex;
	align-content: center;
	align-items: center;
	width: 100%;
	position: relative;
	flex-direction: column;
	justify-content: flex-end;
}
.main_topic.ecology.big .range .bar {
	width: 100%;
	background: url(./image/new/bar.png) no-repeat;
	height: 10px;
	position: relative;
	margin: 0;
	/* margin-left: 10px; */
	border-radius: 10px;
	background-size: contain;
	background-position: center;
	display: flex;
	align-items: flex-end;
}
.main_topic.ecology.big .range .button.on {
	height: 35px;
	width: 35px;
	background: url(./image/new/button_off.png) no-repeat;
	background-size: contain;
	margin: 0;
	/* display: flex; */
}
.main_topic.ecology.big .range .button {
	height: 35px;
	width: 35px;
	background: url(./image/new/button_on.png) no-repeat;
	background-size: contain;
	margin: 0;
	/* display: flex; */
	position: absolute;
	bottom: 76px;
	left: 26px;
	cursor: pointer;
}
.main_topic.ecology.big .range .big {
	display: flex;
}
.main_topic.ecology.big .range .middle {
	display: none;
}
.main_topic.ecology.big .range ul {
	display: flex;
	font-size: 13px;
	width: 100%;
	height: 25px;
}
.main_topic.ecology.big .range ul li {
   width: 16.66%;
}

.main_topic.ecology.big .swiper-button-next {
	background: #fff;
	width: 50px;
	height: 50px;
	border-radius: 50px;
	box-shadow: 0px 4px 8px 0px #a4c3e063;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	/* margin-left: 2px; */
	right: 5px;
	top: calc(50% - -25px);
}
.main_topic.ecology.big .swiper-button-prev {
	background: #fff;
	width: 50px;
	height: 50px;
	border-radius: 50px;
	box-shadow: 0px 4px 8px 0px #a4c3e063;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	left: 5px;
	top: calc(50% - -25px);
}
.main_topic.ecology.big .swiper-button-next:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-left: 4px;
} 
.main_topic.ecology.big .swiper-button-prev:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-right: 4px;
}
/*대 e*/


/*중 s*/
.main_topic.ecology.middle {
	display: block;
	font-size: initial;
	padding: 10px 0;
} 
.main_topic.ecology.middle .txt {
	/* border: 1px solid #D9D9D9; */
	height: 35px;
	width: 100%;
	background: #f9f9f9;
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 0 10px;
	gap: 8px;
	box-sizing: border-box;
	font-size: 14px;
	align-content: center;
}
.main_topic.ecology.middle .txt span {
	background: url(./image/new/sightseeing.png) no-repeat;
	width: 20px;
	height: 20px;
	margin: 0;
	background-size: contain;
}
.main_topic.ecology.middle .caution {
	height: calc(100% - 45px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* margin-bottom: 20px; */
	/* background: url('./image/new/temperature/back1.png') no-repeat; */
	width: 100%;
	background-size: contain;
	margin-top: 10px;
	border-radius: 10px;
	/* gap: 20px; */
	margin-bottom: initial;
}
.main_topic.ecology.middle .swiper_ecology {
	width: 100%;
	height: 100%;
}
.main_topic.ecology.middle .swiper_ecology.swiper {
}
.main_topic.ecology.middle .swiper_ecology .swiper-wrapper > div {
  display:flex;
  justify-content:center;
  align-items:center;
  font-size:7rem;
  letter-spacing:-10px;
  color:gray;
  border-radius: 10px;
}
.main_topic.ecology.middle .swiper_ecology .swiper-wrapper > div .text {
	position: absolute;
	bottom: 0;
	height: auto;
	width: 100%;
	background: #0000008c;
	border-radius: 0 0 10px 10px;
	padding: 10px;
	box-sizing: border-box;
	font-size: 12px;
	text-align: left;
	display: flex;
	flex-direction: column;
	letter-spacing: 0;
	/* gap: 5px; */
	/* outline: 1px solid black; */
	/* display: block; */
	color: #fff;
	font-weight: 100;
}
.main_topic.ecology.middle .swiper_ecology .swiper-wrapper > div .text div:nth-child(2) {
        /* margin:100px; */
        /* outline: 1px solid black; */
        display: block;
        /* color: black; */
        /* width: 630px; */
        /* font-size: 20px; */
        font-weight: bolder !important;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal;
        line-height: 1.2;
        text-align: left;
        word-wrap: break-word;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        font-weight: 100 !important;
        display: none;
}
.main_topic.ecology.middle .swiper_ecology .swiper-wrapper > div .text .title {
	font-size: 15px;
	margin: 0;
	margin-bottom: 0;
}
.main_topic.ecology.middle .swiper_ecology .swiper-wrapper > .slide-1 {
  background-color:#D3DEDC;
}

.main_topic.ecology.middle .swiper_ecology .swiper-wrapper > .slide-2 {
  background-color:#92A9BD;
  
}
.main_topic.ecology.middle .swiper_ecology .swiper-wrapper > .slide-3 {
  background-color:#7C99AC;
  
}
.main_topic.ecology.middle .swiper_ecology .swiper-wrapper > .slide-4 {
  background-color:#D3DEDC;
  
}
.main_topic.ecology.middle .swiper_ecology .swiper-wrapper > .slide-5 {
  background-color:#A3E4DB;
  
}
.main_topic.ecology.middle .img {

	width: 100%;
	
	height: 100%;
	
	background-size: contain;
	
	background-position: center;
	
	color: #fff;
	
	font-size: 50px;
	
	font-weight: 600;
	
	display: flex;
	
	justify-content: center;
	
	align-items: center;
	
	border-radius: 10px;
	
	border: 1px solid #f4f4f4;
}

.main_topic.ecology.middle .range {
	height: 40px;
	display: flex;
	align-content: center;
	align-items: center;
	width: 100%;
	position: relative;
	flex-direction: column;
	justify-content: flex-end;
}
.main_topic.ecology.middle .range .bar {
	width: 100%;
	background: url(./image/new/bar.png) no-repeat;
	height: 10px;
	position: relative;
	margin: 0;
	/* margin-left: 10px; */
	border-radius: 10px;
	background-size: contain;
	background-position: center;
	display: flex;
	align-items: flex-end;
}
.main_topic.ecology.middle .range .button.on {
	height: 35px;
	width: 35px;
	background: url(./image/new/button_off.png) no-repeat;
	background-size: contain;
	margin: 0;
	/* display: flex; */
}
.main_topic.ecology.middle .range .button {
	height: 35px;
	width: 35px;
	background: url(./image/new/button_on.png) no-repeat;
	background-size: contain;
	margin: 0;
	/* display: flex; */
	position: absolute;
	bottom: 76px;
	left: 26px;
	cursor: pointer;
}
.main_topic.ecology.middle .range .big {
	display: flex;
}
.main_topic.ecology.middle .range .middle {
	display: none;
}
.main_topic.ecology.middle .range ul {
	display: flex;
	font-size: 13px;
	width: 100%;
	height: 25px;
}
.main_topic.ecology.middle .range ul li {
   width: 16.66%;
}

.main_topic.ecology.middle .swiper-button-next {
	background: #fff;
	width: 40px;
	height: 40px;
	border-radius: 50px;
	box-shadow: 0px 4px 8px 0px #a4c3e063;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	/* margin-left: 2px; */
	right: 5px;
	top: calc(50% - -30px);
}
.main_topic.ecology.middle .swiper-button-next svg,
.main_topic.ecology.middle .swiper-button-prev svg {
	display: none;
}
.main_topic.ecology.middle .swiper-button-prev {
	background: #fff;
	width: 40px;
	height: 40px;
	border-radius: 50px;
	box-shadow: 0px 4px 8px 0px #a4c3e063;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	left: 5px;
	top: calc(50% - -30px);
}
.main_topic.ecology.middle .swiper-button-next:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-left: 4px;
} 
.main_topic.ecology.middle .swiper-button-prev:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-right: 4px;
}
/*중 e*/

/*소 s*/

/*소 e*/
 
/*생태관광 코스 추천 e*/




/*코리아둘레길 추천 s*/
.grid-stack-item-content.on {
	background: #ebefff;
}
.main_topic.dulle_gil {
	display: none;
} 
/*대 s*/
.main_topic.dulle_gil.big {
	display: block;
	font-size: initial;
} 

.main_topic.dulle_gil.big .txt span {
	background: url(./image/new/sightseeing.png) no-repeat;
	width: 25px;
	height: 25px;
	margin: 0;
	background-size: contain;
}
.main_topic.dulle_gil.big .caution {
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* margin-bottom: 20px; */
	/* background: url('./image/new/temperature/back1.png') no-repeat; */
	width: 100%;
	background-size: contain;
	/* margin-top: 10px; */
	border-radius: 20px;
	/* gap: 20px; */
	margin-bottom: initial;
	background: #fff;
}
.main_topic.dulle_gil.big .swiper_ecology {
	width: 100%;
	height: 100%;
}
.main_topic.dulle_gil.big .swiper_ecology.swiper {
}
.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper > div {
  display:flex;
  justify-content:center;
  align-items:center;
  border-radius: 10px;
  flex-direction: column;
  /* padding: 10px; */
  box-sizing: border-box;
  gap: 30px;
  padding: 26px;
}
.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper > div .text {
	/* position: absolute; */
	/* bottom: 0; */
	height: 50%;
	width: 100%;
	/* background: #0000008c; */
	border-radius: 0 0 10px 10px;
	/* padding: 15px; */
	box-sizing: border-box;
	font-size: 14px;
	text-align: left;
	display: flex;
	letter-spacing: 0;
	gap: 20px;
	/* outline: 1px solid black; */
	/* display: block; */
	color: #fff;
	font-weight: 100;
	align-items: center;
	justify-content: center;
	/* margin-bottom: 10%; */
	/* padding-bottom: 15px; */
	flex-direction: column;
}
.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper > div .distance {
	/* position: absolute; */
	/* bottom: 0; */
	/* height: 35%; */
	width: 65%;
	/* background: #0000008c; */
	border-radius: 0 0 10px 10px;
	/* padding: 15px; */
	box-sizing: border-box;
	font-size: 14px;
	text-align: left;
	display: flex;
	flex-direction: column;
	letter-spacing: 0;
	gap: 10px;
	/* outline: 1px solid black; */
	/* display: block; */
	color: #fff;
	font-weight: 100;
	align-items: flex-start;
	justify-content: center;
	align-content: flex-start;
	/* gap: 5px; */
	/* margin-top: 5%; */
	/* padding-top: 15px; */
}
.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper > div .distance > div {
	width: 100%;
	display: flex;
	/* gap: 5px; */
	align-items: center;
}
.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper > div .distance > div .img{

width: 26px;

height: 26px;

margin: 0;

background-size: contain !important;

margin-right: 10px;
}
.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper > div .distance > div span {
	margin: 0;
	color: #ACACAC;
}
.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper > div .distance > div .txt {
	margin: 0;
	/* margin-right: 20px; */
	width: 65px;
	color: #696969;
	font-weight: 500;
}
.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper > div .distance > div:nth-child(1) .img{
	background: url('./image/new/pin_img.png') no-repeat;

}
.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper > div .distance > div:nth-child(2) .img{
	background: url('./image/new/pin_img.png') no-repeat;

}
.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper > div .distance > div:nth-child(3) .img{
	background: url('./image/new/course_img.png') no-repeat;

}
.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper > div .distance > div:nth-child(4) .img{
	background: url('./image/new/length_img.png') no-repeat;

}
.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper > div .text .img {
       background: url('./image/new/dulle_gil1.png') no-repeat;
       width: 60%;
       height: 100%;
       background-size: contain;
       background-position: center;
       /* display: flex; */
}
.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper > div .text div:nth-child(3) {
        /* margin:100px; */
        /* outline: 1px solid black; */
        display: block;
        /* color: black; */
        /* width: 630px; */
        font-size: 16px;
        font-weight: bolder !important;
        white-space: normal;
        text-align: left;
        font-weight: 100 !important;
        display: flex;
        flex-direction: column;
        color: #707070;
        font-weight: 300 !important;
        gap: 5px;
}
.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper > div .text .title {
	font-size: 16px;
	margin: 0;
	/* margin-bottom: 10px; */
	height: 30px;
	/* width: 120px; */
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 5px;
	padding: 0 15px;
	line-height: 30px;
	font-weight: 300;
}
.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper > .slide-1 {
 
}

.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper > .slide-2 {
 
  
}
.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper > .slide-3 {
 
  
}


.main_topic.dulle_gil.big .range {
	height: 40px;
	display: flex;
	align-content: center;
	align-items: center;
	width: 100%;
	position: relative;
	flex-direction: column;
	justify-content: flex-end;
}
.main_topic.dulle_gil.big .range .bar {
	width: 100%;
	background: url(./image/new/bar.png) no-repeat;
	height: 10px;
	position: relative;
	margin: 0;
	/* margin-left: 10px; */
	border-radius: 10px;
	background-size: contain;
	background-position: center;
	display: flex;
	align-items: flex-end;
}
.main_topic.dulle_gil.big .range .button.on {
	height: 35px;
	width: 35px;
	background: url(./image/new/button_off.png) no-repeat;
	background-size: contain;
	margin: 0;
	/* display: flex; */
}
.main_topic.dulle_gil.big .range .button {
	height: 35px;
	width: 35px;
	background: url(./image/new/button_on.png) no-repeat;
	background-size: contain;
	margin: 0;
	/* display: flex; */
	position: absolute;
	bottom: 76px;
	left: 26px;
	cursor: pointer;
}
.main_topic.dulle_gil.big .range .big {
	display: flex;
}
.main_topic.dulle_gil.big .range .middle {
	display: none;
}
.main_topic.dulle_gil.big .range ul {
	display: flex;
	font-size: 13px;
	width: 100%;
	height: 25px;
}
.main_topic.dulle_gil.big .range ul li {
   width: 16.66%;
}

.main_topic.dulle_gil.big .swiper-button-next {
	background: #fff;
	width: 50px;
	height: 50px;
	border-radius: 50px;
	box-shadow: 0px 4px 8px 0px #a4c3e063;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	/* margin-left: 2px; */
	right: 5px;
	top: calc(50% - -25px);
}
.main_topic.dulle_gil.big .swiper-button-prev {
	background: #fff;
	width: 50px;
	height: 50px;
	border-radius: 50px;
	box-shadow: 0px 4px 8px 0px #a4c3e063;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	left: 5px;
	top: calc(50% - -25px);
}
.main_topic.dulle_gil.big .swiper-button-next:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-left: 4px;
} 
.main_topic.dulle_gil.big .swiper-button-prev:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-right: 4px;
}
/*대 e*/


/*중 s*/
.main_topic.dulle_gil.middle {
	display: block;
	font-size: initial;
	padding: 10px 0;
} 

.main_topic.dulle_gil.middle .txt span {
	background: url(./image/new/sightseeing.png) no-repeat;
	width: 25px;
	height: 25px;
	margin: 0;
	background-size: contain;
}
.main_topic.dulle_gil.middle .caution {
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* margin-bottom: 20px; */
	/* background: url('./image/new/temperature/back1.png') no-repeat; */
	width: 100%;
	background-size: contain;
	/* margin-top: 10px; */
	border-radius: 20px;
	/* gap: 20px; */
	margin-bottom: initial;
	background: #fff;
}
.main_topic.dulle_gil.middle .swiper_ecology {
	width: 100%;
	height: 100%;
}
.main_topic.dulle_gil.middle .swiper_ecology.swiper {
}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div {
  display:flex;
  justify-content:center;
  align-items:center;
  border-radius: 10px;
  flex-direction: column;
  padding: 15px;
  box-sizing: border-box;
}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div .text {
	/* position: absolute; */
	/* bottom: 0; */
	height: 100%;
	width: 100%;
	/* background: #0000008c; */
	border-radius: 0 0 10px 10px;
	/* padding: 15px; */
	box-sizing: border-box;
	font-size: 14px;
	text-align: left;
	display: flex;
	flex-direction: column;
	letter-spacing: 0;
	/* gap: 20px; */
	/* outline: 1px solid black; */
	/* display: block; */
	color: #fff;
	font-weight: 100;
	align-items: center;
	justify-content: center;
	/* margin-bottom: 10%; */
	border-radius: 50px;
}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div .text span {
	display: flex;
}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div .text span:last-child {
	
word-wrap: break-word;
	
display: flow-root;
	
overflow: hidden;
	
text-overflow: ellipsis;
	
white-space: nowrap;
	
width: 100%;
	
text-align: center;
}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div .distance {
	/* position: absolute; */
	/* bottom: 0; */
	height: 50%;
	width: 100%;
	/* background: #0000008c; */
	border-radius: 0 0 10px 10px;
	/* padding: 15px; */
	box-sizing: border-box;
	font-size: 14px;
	text-align: left;
	display: flex;
	flex-direction: column;
	letter-spacing: 0;
	gap: 10px;
	/* outline: 1px solid black; */
	/* display: block; */
	color: #fff;
	font-weight: 100;
	align-items: flex-start;
	justify-content: center;
	align-content: flex-start;
	/* gap: 5px; */
	/* margin-top: 5%; */
	display: none;
}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div .distance > div {
	width: 100%;
	display: flex;
	/* gap: 5px; */
	align-items: center;
}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div .distance > div .img{

width: 26px;

height: 26px;

margin: 0;

background-size: contain !important;

margin-right: 10px;
}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div .distance > div span {
	margin: 0;
	color: #ACACAC;
}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div .distance > div .txt {
	margin: 0;
	/* margin-right: 20px; */
	width: 65px;
	color: #696969;
	font-weight: 500;
}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div .distance > div:nth-child(1) .img{
	background: url('./image/new/pin_img.png') no-repeat;

}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div .distance > div:nth-child(2) .img{
	background: url('./image/new/pin_img.png') no-repeat;

}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div .distance > div:nth-child(3) .img{
	background: url('./image/new/course_img.png') no-repeat;

}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div .distance > div:nth-child(4) .img{
	background: url('./image/new/length_img.png') no-repeat;

}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div .text .img {
       background: url('./image/new/dulle_gil1.png') no-repeat;
       width: 15%;
       height: 34%;
       background-size: contain;
       background-position: center;
       position: absolute;
       left: 10%;
       top: 15px;
}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div .text div:nth-child(3) {
        /* display: block; */
        font-size: 14px;
        display: flex;
        flex-direction: column;
        color: #707070;
        font-weight: 300 !important;
        gap: 8px;
        height: 60%;
        align-items: center;
        justify-content: center;
        word-wrap: break-word;
        /* display: -webkit-box; */
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal;
}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div .text .title {
	font-size: 16px;
	margin: 0;
	/* margin-bottom: 10px; */
	height: 40%;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 5px;
	padding: 0 15px;
	/* line-height: 30px; */
	border-radius: 50px;
	box-sizing: border-box;
	color: #696969 !important;
	font-weight: 300;
}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div .text .title > span {
	position: absolute;
	width: 20px;
	height: 38%;
	display: flex;
	align-items: center;
	align-content: center;
	right: 10%;
}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div .text .title > span::after {
    content: '';
    width: 15px; /* 사이즈 */
    height: 15px; /* 사이즈 */
    border-top: 1px solid #FFAA00; /* 선 두께 */
    border-right: 1px solid #FFAA00; /* 선 두께 */
    display: inline-block;
    transform: rotate(45deg); /* 각도 */
    position: absolute;
    /* top: 0px; */ /* 기본 0px 값으로 해주세요 */
    right: 6px; /* 기본 0px 값으로 해주세요 */
}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > .slide-1 {
 
}

.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > .slide-2 {
 
  
}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > .slide-3 {
 
  
}


.main_topic.dulle_gil.middle .swiper-button-next {
	background: #fff;
	width: 40px;
	height: 40px;
	border-radius: 50px;
	box-shadow: 0px 4px 8px 0px #a4c3e063;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	/* margin-left: 2px; */
	right: 5px;
	top: calc(50% - -10px);
}
.main_topic.dulle_gil.middle .swiper-button-next svg,
.main_topic.dulle_gil.middle .swiper-button-prev svg
 {
	display:none;
}
.main_topic.dulle_gil.middle .swiper-button-prev {
	background: #fff;
	width: 40px;
	height: 40px;
	border-radius: 50px;
	box-shadow: 0px 4px 8px 0px #a4c3e063;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	left: 5px;
	top: calc(50% - -10px);
}
.main_topic.dulle_gil.middle .swiper-button-next:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-left: 4px;
} 
.main_topic.dulle_gil.middle .swiper-button-prev:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-right: 4px;
}
/*중 e*/

/*소 s*/

/*소 e*/
 
/*생태관광 코스 추천 e*/





/*다중이용시설실내공기질 s*/
.main_topic.air_quality {
	display: none;
} 
/*대 s*/
.main_topic.air_quality.big {
	display: block;
} 
.main_topic.air_quality.big select {
	border-radius: 10px;
	background: #fff url('./image/new/select.png') no-repeat 98% 50%;
	cursor: pointer;
	height: 40px;
	font-weight: 500;
	color: #696969;
	background-size: 12px;
} 

.main_topic.air_quality.big .select {
	display: flex;
}
.main_topic.air_quality.big .select select {
	width: 100%;
}
.main_topic.air_quality.big .select select:last-child {
	display: none;
}
.main_topic.air_quality.big .caution {
	height: calc(100% - 50px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	border-radius: 10px;
	gap: 10px;
	margin-top: 10px;
}

.main_topic.air_quality.big .caution .img_data{
	height: calc(45% - 10px);
	display: flex;
	width: 100%;
	/* gap: 10%; */
	justify-content: center;
	flex-direction: row;
}

.main_topic.air_quality.big .caution .img_data .img {
	width: 50%;
	display: flex;
	height: 100%;
	background: url(./image/new/airquality/recuperate.png) no-repeat;
	background-size: contain;
	background-position-x: right;
}
.main_topic.air_quality.big .caution .img_data .select {
	width: 46%;
	display: flex;
	height: 100%;
	align-items: flex-start;
	flex-direction: column;
	justify-content: center;
	gap: 10px;
}
.main_topic.air_quality.big .caution .img_data .img li {
	width: calc(25% - 25px);
	background-size: 65% !important;
	border-radius: 100px;
	/* background: #F9F9F9; */
	background-position: center !important;
	box-sizing: border-box;
	border: 4px solid #F9F9F9;
	height: fit-content;
}
.main_topic.air_quality.big .caution .img_data .img li:after {
	display:block;
	content:'';
	padding-bottom: 100%;
}
.main_topic.air_quality.big .caution .img_data .img li.on {
	border: 4px solid #78b7f4;
}
.main_topic.air_quality.big .caution .img_data .img .water1 {
	background: #F9F9F9 url('./image/new/supply/supply_1.png') no-repeat;
}
.main_topic.air_quality.big .caution .img_data .img .water2 {
	background: #F9F9F9 url('./image/new/supply/supply_2.png') no-repeat;
}
.main_topic.air_quality.big .caution .img_data .img .water3 {
	background: #F9F9F9 url('./image/new/supply/supply_3.png') no-repeat;
}
.main_topic.air_quality.big .caution .img_data .img .water4 {
	background: #F9F9F9 url('./image/new/supply/supply_4.png') no-repeat;
}
.main_topic.air_quality.big .caution .img_data .img li.line {
	
	width: 50px;		
	display: flex;	
	justify-content: center;		
	border: none;		
	background: url(./image/new/supply/jum.png) no-repeat;		
	height: 90%;		
	background-size: 80% !important;
}
.main_topic.air_quality.big .caution .img_data .txt {
	width: 100%;
	display: flex;
	font-size: 40px;
	font-weight: 400;
}
.main_topic.air_quality.big .caution .img_data select {
	width: 60%;
	background: #fff url('./image/new/select.png') no-repeat 96% 50%;
	background-size: 12px;
	display: block;
}
.main_topic.air_quality.big .caution .img_data .txt li {
	
	width: calc(25% - 25px);		
	word-wrap: break-word;		
	display: flow-root;		
	overflow: hidden;		
	text-overflow: ellipsis;		
	white-space: nowrap;
}
.main_topic.air_quality.big .caution .img_data .txt li.blue {
	font-weight: 400;
}
.main_topic.air_quality.big .caution .img_data .txt li.arrow {
	
	width: 50px;		
	display: flex;		
	justify-content: center;
}
.main_topic.air_quality.big .caution .data{
	height: 55%;
	width: 100%;
	/* background: #F8FBFF; */
	border-radius: 10px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 10%;
	font-weight: 400;
}
.main_topic.air_quality.big .caution .data .title {
	font-size: 20px;
}
.main_topic.air_quality.big .caution .data ul {
	display: flex;
	gap: 30px;
	width: 100%;
	height: 50%;
}
.main_topic.air_quality.big .caution .data ul.on {
	width: 95%;
	gap: 10px;
}
.main_topic.air_quality.big .caution .data ul li.blue {
	position: relative;
	width: 100%;
	background-color: #fff;
	border-radius: 20px;
	box-shadow: 0px 4px 8px 0px #a4c3e063;
	height: 100%;
}
.main_topic.air_quality.big .caution .data ul li.yellow {
	position: relative;
	width: 50%;
	background-color: #fff;
	border-radius: 20px;
	box-shadow: 0px 4px 8px 0px #ffcc5947;
	height: 100%;
}
.main_topic.air_quality.big .caution .data ul > li::after {
  display: block;
  /* content: ""; */
  /* padding-bottom: 100%; */
}
.main_topic.air_quality.big .caution .data ul > li > div {
  width: 100%;
  height: 100%;
  position: absolute;
  display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
  font-size: 20px;
  padding: 5px 15px;
  box-sizing: border-box;
  line-height: 1.2;
}
.main_topic.air_quality.big .caution .data ul.on > li:nth-child(2) > div > div:nth-child(1) {
  width: 58px;
  border-bottom: none;
}
.main_topic.air_quality.big .caution .data ul.on > li > div {
  font-size: 18px;
  align-items: center;
}
.main_topic.air_quality.big .caution .data .swiper-wrapper {
	
}
.main_topic.air_quality.big .caution .data .swiper-slide {
	
display: flex;
	
flex-direction: column;
	
justify-content: center;
	
gap: 20px;
	
padding: 0 8%;
	
box-sizing: border-box;
}
.main_topic.air_quality.big .caution .data ul > li > div > div {
	width: 100%;
	height: 50%;
	display: flex;
	margin: 0;
	justify-content: center;
	align-items: center;
	border-top: 1px solid #D9D9D9;
}
.main_topic.air_quality.big .caution .data ul > li > div > div:nth-child(1) {
	border: none;
}
.main_topic.air_quality.big .caution .data ul > li > div > div span {
    margin: 0;
    margin-left: 5px;
}
.main_topic.air_quality.big .caution .data ul > li > div .blue {
	/* height: 50%; */
	/* border-bottom: 1px solid #D9D9D9; */
}

.main_topic.air_quality.big .swiper-button-next {
	background: #fff;
	width: 50px;
	height: 50px;
	border-radius: 50px;
	box-shadow: 0px 4px 8px 0px #a4c3e063;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	/* margin-left: 2px; */
	right: 5px;
	top: calc(70% - 20px);
}
.main_topic.air_quality.big .swiper-button-prev {
	background: #fff;
	width: 50px;
	height: 50px;
	border-radius: 50px;
	box-shadow: 0px 4px 8px 0px #a4c3e063;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	left: 5px;
	top: calc(70% - 20px);
}
.main_topic.air_quality.big .swiper-button-next:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-left: 4px;
} 
.main_topic.air_quality.big .swiper-button-prev:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-right: 4px;
}
/*대 e*/
/*중 s*/
.main_topic.air_quality.middle {
	display: block;
	padding: 10px 0;
} 
.main_topic.air_quality.middle .caution {
	height: calc(100% - 45px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	border-radius: 10px;
	gap: 10px;
	margin-top: 10px;
}

.main_topic.air_quality.middle .caution .img_data{
	display: flex;
	width: 100%;
	flex-direction: column;
	justify-content: center;
	height: 30%;
	gap: 0;
	display: none;
}
.main_topic.air_quality.middle .caution .img_data .img {
	width: 100%;
	display: flex;
	height: fit-content;
}
.main_topic.air_quality.middle .caution .img_data .img li {
	background-size: 65% !important;
	border-radius: 100px;
	/* background: #F9F9F9; */
	background-position: center !important;
	box-sizing: border-box;
	border: 4px solid #F9F9F9;
	height: fit-content;
	width: calc(25% - 3.5%);
}
.main_topic.air_quality.middle .caution .img_data .img li:after {
	display:block;
	content:'';
	padding-bottom: 100%;
}
.main_topic.air_quality.middle .caution .img_data .img li.on {
	border: 4px solid #78b7f4;
}
.main_topic.air_quality.middle .caution .img_data .img .water1 {
	background: #F9F9F9 url('./image/new/supply/supply_1.png') no-repeat;
}
.main_topic.air_quality.middle .caution .img_data .img .water2 {
	background: #F9F9F9 url('./image/new/supply/supply_2.png') no-repeat;
}
.main_topic.air_quality.middle .caution .img_data .img .water3 {
	background: #F9F9F9 url('./image/new/supply/supply_3.png') no-repeat;
}
.main_topic.air_quality.middle .caution .img_data .img .water4 {
	background: #F9F9F9 url('./image/new/supply/supply_4.png') no-repeat;
}
.main_topic.air_quality.middle .caution .img_data .img li.line {
	display: none;
}
.main_topic.air_quality.middle .caution .img_data .txt {
	display: none;
}

.main_topic.air_quality.middle .caution .data{
	height: 100%;
	width: 100%;
	/* background: #F8FBFF; */
	border-radius: 10px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 10%;
	font-weight: 400;
}
.main_topic.air_quality.middle .caution .data .title {
	font-size: 15px;
}
.main_topic.air_quality.middle .caution .data ul {
	display: flex;
	gap: 10px;
	width: 85%;
	height: 55%;
}
.main_topic.air_quality.middle .caution .data ul.on {
	width: 95%;
	gap: 5px;
}
.main_topic.air_quality.middle .caution .data ul li.blue {
	position: relative;
	width: 50%;
	background-color: #fff;
	border-radius: 20px;
	box-shadow: 0px 4px 8px 0px #a4c3e063;
}
.main_topic.air_quality.middle .caution .data ul li.yellow {
	position: relative;
	width: 50%;
	background-color: #fff;
	border-radius: 20px;
	box-shadow: 0px 4px 8px 0px #ffc33d4a;
}
.main_topic.air_quality.middle .caution .data ul > li::after {
  display: block;
  /* content: ""; */
  /* padding-bottom: 100%; */
}
.main_topic.air_quality.middle .caution .data ul > li > div {
  width: 100%;
  height: 100%;
  position: absolute;
  display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
  font-size: 15px;
  padding: 5px 15px;
  box-sizing: border-box;
}
.main_topic.air_quality.middle .caution .data ul.on > li:nth-child(2) > div > div:nth-child(1) {
	width: 35px;
	border-bottom: none;
	line-height: 1.2;
}
.main_topic.air_quality.middle .caution .data ul.on > li > div > div {
	height: 50%;
}
.main_topic.air_quality.middle .caution .data ul.on > li > div {
	font-size: 12px;
	padding: 5px;
	align-items: center;
}
.main_topic.air_quality.middle .caution .data .swiper-wrapper {
	
}
.main_topic.air_quality.middle .select {
	display: flex;
	gap: 5px;
}
.main_topic.air_quality.middle select {
    height: 35px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 500;
    background: #fff url(./image/new/select.png) no-repeat 96% 50%;
    color: #696969;
    background-size: 12px;
}
.main_topic.air_quality.middle .caution .data .swiper-slide {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 10px;
}
.main_topic.air_quality.middle .caution .data ul > li > div > div {
	width: 100%;
	height: 50%;
	display: flex;
	margin: 0;
	justify-content: center;
	font-size: 15px;
	align-items: center;
}
.main_topic.air_quality.middle .caution .data ul > li > div > div span {
	margin:0;
	margin-left: 5px;
}
.main_topic.air_quality.middle .caution .data ul > li > div > div.yellow {
	font-size: 13px;
	line-height: 1.2em;
}
.main_topic.air_quality.middle .caution .data ul > .yellow> div {
	padding: 5px;
}
.main_topic.air_quality.middle .swiper-button-next {
	background: #fff;
	width: 35px;
	height: 35px;
	border-radius: 50px;
	box-shadow: 0px 4px 8px 0px #a4c3e063;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	/* margin-left: 2px; */
	right: 10px;
	top: calc(70% - 20px);
}
.main_topic.air_quality.middle .swiper-button-prev {
	background: #fff;
	width: 35px;
	height: 35px;
	border-radius: 50px;
	box-shadow: 0px 4px 8px 0px #a4c3e063;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	left: 10px;
	top: calc(70% - 20px);
}
.main_topic.air_quality.middle .swiper-button-prev {
		width: 40px;
		height: 40px;
		top: calc(70% - 40px);
	}
	.main_topic.air_quality.middle .swiper-button-prev:after {
		font-size: 15px;
	}
	.main_topic.air_quality.middle .swiper-button-next {
		width: 40px;
		height: 40px;
		top: calc(70% - 40px);
	}
	.main_topic.air_quality.middle .swiper-button-next:after {
		font-size: 15px;
	}
.main_topic.air_quality.middle .swiper-button-next:after {
	font-size: 18px;
	display: flex;
	color: #D9D9D9;
	margin-left: 4px;
} 
.main_topic.air_quality.middle .swiper-button-prev:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-right: 4px;
}
/*중 e*/
/*다중이용시설실내공기질 e*/

/*긴급재난문자 s*/
.main_topic.emergency {
	display: none;
} 
/*대 s*/
.main_topic.emergency.big {
	display: block;
	height: calc(100% - 42px - 26px);
} 
.main_topic.emergency.big .caution {
	height: 100%;
	width: 100%;
	display: flex;
	flex-direction: row;
	gap: 10px;
	position: relative;
}
.main_topic.emergency.big .caution .information{
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	background: #f4f4ff;
	border-radius: 10px;
	align-items: center;
	width: 75%;
	padding: 26px;
	box-sizing: border-box;
	gap: 15px;
	overflow: hidden;
	text-overflow: ellipsis;
}
.main_topic.emergency.big .caution .information .img_information {
	height: calc(100% - 100px);
	display: flex;
	flex-direction: column;
	gap: 26px;
	justify-content: center;
	width: 100%;
}
.main_topic.emergency.big .caution .information .img_information .txt {
	display: flex;
	flex-direction: column;
	/* gap: 10px; */
	font-weight: 500;
	font-size: 16px;
	width: 90%;
	line-height: 1.8em;
}
.main_topic.emergency.big .caution .information .img{
	/* height: 100%; */
	width: 50%;
	background: #fff url(./image/new/emergency/downpour/rain.png) no-repeat;
	background-size: 120%;
	border-radius: 208px;
	/* display: flex; */
	/* justify-content: center; */
	/* align-items: center; */
	/* align-content: center; */
	position: relative;
	background-position: center;
}
.main_topic.emergency.big .caution .information .img::after {
    display: block;
    content: "";
    padding-bottom: 100%;
}
.main_topic.emergency.big .caution .information > .time {
	margin: 0;
	display: flex;
	justify-content: flex-start;
	width: 100%;
	height: 30px;
	align-items: center;
	word-wrap: break-word;
	/* display: flow-root; */
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.main_topic.emergency.big .caution .information > .time span {
	margin: 0;
	padding: 0 15px;
	height: 100%;
	display: flex;
	align-items: center;
	border-radius: 10px;
	margin-right: 10px;
	width: max-content;
	font-size: 14px;
}
.main_topic.emergency.big .caution .information > .time span:last-child {
	/* margin: 0; */
	/* padding: 0; */
}
.main_topic.emergency.big .caution .information .button{
	display: flex;
	width: 100%;
	gap: 10px;
	height: 40px;
	align-items: center;
	justify-content: center;
}
.main_topic.emergency.big .caution .information .button li {
	width: 100%;
	height: 100%;
	/* display: flex; */
	/* justify-content: center; */
	/* align-items: center; */
	/* align-content: center; */
	/* border-radius: 10px; */
}
.main_topic.emergency.big .caution .information .button a {
	/* width: 50%; */
	margin: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
	border-radius: 10px;
	height: 100%;
	cursor: pointer;
}
.main_topic.emergency.big .caution > .txt {

	width: 25%;
}
.main_topic.emergency.big .txt ul {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.main_topic.emergency.big .txt ul li{
	width: 100%;
	height: 33.33%;
	background: #f5f5f5;
	border-radius: 10px;
	display: flex;
	flex-direction: column;
	padding: 26px;
	box-sizing: border-box;
	gap: 20px;
	font-size: 13px;
}
.main_topic.emergency.big .txt ul li .time {
	
margin: 0;
	
text-align: left;
	
display: flex;
	
gap: 5px;
	
flex-direction: column;
	
align-content: flex-start;
}
.main_topic.emergency.big .txt ul li .time div{
	margin: 0;
	word-wrap: break-word;
	display: flow-root;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.main_topic.emergency.big .txt ul li .text {
	
margin: 0;
	
text-align: left;
	
overflow: auto;
	
/* text-overflow: ellipsis; */
	
/* display: -webkit-box; */
	
/* -webkit-line-clamp: 4; */
	
/* -webkit-box-orient: vertical; */
	
/* height: 100%; */
	
line-height: 1.4em;
}
.main_topic.emergency.big .txt ul li .text::after {
  /* content: '...'; */
  /* position: absolute; */
  bottom: 0;
  right: 0;
  /* background-color: whitesmoke; */ /* 배경과 맞춰야 함 */
  /* padding-left: 0px; */ /* 점점점이 잘리지 않게 패딩 */
  /* display: flex; */
  /* justify-content: center; */
  /* width: 18px; */
}
/*대 e*/
/*중 s*/
.main_topic.emergency.middle {
		padding: 10px 0; 
	display: block;
	}
.main_topic.emergency.middle .caution {
	height: 100%;
	width: 100%;
	display: flex;
	flex-direction: row;
	gap: 10px;
	position: relative;
}
.main_topic.emergency.middle .caution .information{
	height: 100%;
	display: flex;
	flex-direction: column;
	background: #f4f4ff;
	border-radius: 10px;
	align-items: center;
	width: 75%;
	box-sizing: border-box;
	overflow: hidden;
	text-overflow: ellipsis;
	padding: 15px;
	gap: 10px;
	width: 100%;
	height: calc(100% - 45px);
	position: relative;
	}
	.main_topic.emergency.middle .caution > .txt {
		display: none;
	}

	.main_topic.emergency.middle .caution .information > .time {
		font-size: 14px;
		margin: 0;
		display: flex;
		justify-content: flex-start;
		width: 100%;
		height: 30px;
		align-items: center;
		word-wrap: break-word;
		/* display: flow-root; */
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		word-wrap: break-word;
		/* display: flow-root; */
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		word-break: break-all;
	}
	.main_topic.emergency.middle .caution .information > .time span {
		margin-right: 5px;
		margin: 0;
		padding: 0 15px;
		height: 100%;
		display: flex;
		align-items: center;
		border-radius: 10px;
		margin-right: 10px;
		width: max-content;
		font-size: 14px;
	}
.main_topic.emergency.middle .caution .information .button {
	align-items: center;
	justify-content: center;
	display: flex;
	height: 35px;
	font-size: 15px;
	gap: 10px;
	position: fixed;
	bottom: 62px;
	width: calc(100% - 52px);
}
	.main_topic.emergency.middle .txt ul li {
		padding: 10px;
		gap: 10px;
	}
	.main_topic.emergency.middle .txt ul li .time {
		font-size: 12px;
	}
.main_topic.emergency.middle .caution .information .button li {
	width: 100%;
	height: 100%;
	/* display: flex; */
	/* justify-content: center; */
	/* align-items: center; */
	/* align-content: center; */
	/* border-radius: 10px; */
}
.main_topic.emergency.middle .caution .information .button a {
	/* width: 50%; */
	margin: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
	border-radius: 10px;
	height: 100%;
	cursor: pointer;
}
.main_topic.emergency.middle .caution .information .img {
	width: 20%;
	display: none;
}
	.main_topic.emergency.middle .caution .information .img_information {
		gap: 5px;
		height: calc(100% - 35px);
		display: flex;
		align-items: flex-start;
		overflow: hidden;
		/* word-wrap: break-word; */
		/* display: flow-root; */
		/* overflow: hidden; */
		/* text-overflow: ellipsis; */
		/* white-space: nowrap; */
		width: 100%;
	}
	.main_topic.emergency.middle .caution .information .img_information .txt {
		font-size: 14px;
		gap: 4px;
		line-height: 1.6em;
		width: 100%;
		text-align: left;
		flex-direction: row;
		/* margin-right: 5px; */
		display: inline-block;
		height: calc(100% - 100px);
		():
		hidden;
		display: inline-block;
		align-items: center;
	}
		.main_topic.emergency.middle .caution .information .img_information .txt .title {
		margin: 0;
		display: inline-block;
		margin-right: 5px;
	}
	.main_topic.emergency.middle .caution .information .img_information .txt div:last-child {

width: 100%;

overflow: hidden;

-webkit-box-orient: vertical;

-webkit-line-clamp: 3;

word-break: break-all;

display: inline;

height: calc(100% - 40px);

}
/*중 e*/
/*긴급재난문자 e*/

/*환경이슈 s*/
.envr-issue {
	
height: calc(100% - 42px - 35px);
}
.envr-issue .swiper_envr {
	height: 100%;
	border: 1px solid #E6E6E6;
	border-radius: 10px;
	box-sizing: border-box;
}
.envr-issue .swiper_envr .swiper-slide {
	padding: 20px;
	box-sizing: border-box;
}
.envr-issue .swiper_envr .swiper-slide .main_topic {
	padding: 15px 0 !important;
	height: calc(100% - 2px);
}
.main_topic.envr-issue .swiper-pagination {
	
left: 26px;
	
bottom: 26px;
	
width: auto;
	
height: 40px;
	
color: #696969;
}
.main_topic.envr-issue .swiper-button-next {
	background: #fff;
	width: 40px;
	height: 40px;
	border-radius: 50px;
	box-shadow: 0px 4px 8px 0px #9e9e9e63;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	/* margin-left: 2px; */
	right: 26px;
	top: initial;
	bottom: 26px;
}
.main_topic.envr-issue .swiper-button-prev {
	background: #fff;
	width: 40px;
	height: 40px;
	border-radius: 50px;
	box-shadow: 0px 4px 8px 0px #9e9e9e63;
	display: flex;
	align-content: center;
	justify-content: center;
	align-items: center;
	right: 76px;
	top: inherit;
	bottom: 26px;
	left: initial;
}
.main_topic.envr-issue .swiper-button-next:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-left: 4px;
} 
.main_topic.envr-issue .swiper-button-prev:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-right: 4px;
}
/*환경이슈 e*/


/* 꽃가루 농도 s */
.green-bg {
	background-color:#E7F7F3;
}
.blue-bg {
	background-color:#E6F2FE;
}
.yellow-bg {
	background-color:#FFF8DD;
}
.orange-bg {
	background-color:#FFF8DD;
}
.red-bg {
	background-color:#FFF2ED;
}
.green-txt {
	color: #11AB85;
}
.blue-txt {
	color: #047EF0;
}
.yellow-txt {
	color: #B58926;
}
.orange-txt {
	color: #FC7A46;
}
.red-txt {
	color: #EF454E;
}

.main_topic.pollenRiskIdx  {
	display:flex;
	flex-direction: column;
	justify-content: space-between;
	height: calc(100% - 42px);
	padding: 26px 0 0;
}


.main_topic.pollenRiskIdx.big .pollen-step-list {
	display: flex;
	margin: 0;
	overflow: auto;
	gap: 10px;
	box-sizing: border-box;
	flex: .6 0 auto;
	padding-bottom: 8px;
}


.main_topic.pollenRiskIdx  ul {
	display: flex;
	align-content: center;
	justify-content: center;
	background: #F4F4F4;
	border-radius: 50px;
	height: 35px;
	width: 100%;
	padding: 5px;
	box-sizing: border-box;
}

.main_topic.pollenRiskIdx ul li {
	/* height: 40px; */
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 15px;
	font-weight: 500;
	/* background: #fff; */
	border-radius: 50px;
}

.main_topic.pollenRiskIdx .top {
    margin: 0;
}
.main_topic.pollenRiskIdx  ul.two-tab {
	padding: 0;
	border-bottom: 1px solid #dedede;
	border-radius: 0;
	margin-bottom: 16px;
	background:none;
}


.main_topic.pollenRiskIdx  ul.two-tab li.on {
	border-bottom: 1.5px solid #000;
	border-radius: 0;
	background:none;
}

.main_topic.pollenRiskIdx  ul.two-tab li.on a {
	color: #000;
}

.main_topic.pollenRiskIdx  select {
	display: none;
}

.main_topic.pollenRiskIdx  ul li.on {
	background: #fff;
}

.main_topic.pollenRiskIdx .pollen-step {
    display: flex;
    align-items: center;
    gap: 14px;
    justify-content: center;
    padding: 20px 0;
    border-radius: 8px;
    margin: 16px 0 0;
}

.main_topic.pollenRiskIdx .pollen-step p {
	font-size:24px;
	font-weight:800;
	margin:0;
}

.main_topic.pollenRiskIdx .pollen-step img {
	width:4.2rem;
	margin:0;
}

.main_topic.pollenRiskIdx .pollen-txt {
    padding-top: 16px;
}

.main_topic.pollenRiskIdx .pollen-txt p  {
	font-size: 14px;
	font-weight: 500;
	color: #464C53;
	text-align: left;
}

.main_topic.pollenRiskIdx.big .pollen-step-list .list-box {
	flex: 1 0 auto;
	border-radius: 8px;
	box-sizing: border-box;
	overflow: hidden;
	max-width: 260px;
}

.main_topic.pollenRiskIdx .pollen-step-list {
	display: none;
}

.main_topic.pollenRiskIdx .pollen-step-list .list-box.border-green {
	border: 1px solid #11AB85;
}

.main_topic.pollenRiskIdx .pollen-step-list .list-box.border-blue {
	border: 1px solid #047EF0;
}

.main_topic.pollenRiskIdx .pollen-step-list .list-box.border-yellow {
	border: 1px solid #B58926;
}

.main_topic.pollenRiskIdx .pollen-step-list .list-box.border-red {
	border: 1px solid #EF454E;
}

.main_topic.pollenRiskIdx .pollen-step-header {
	display: flex;
	gap: 6px;
	align-items: center;
	padding: 8px 16px;
}

.main_topic.pollenRiskIdx .pollen-step-header p {
	margin: 0;
	font-size: 14px;
	font-weight: 600;
}

.main_topic.pollenRiskIdx .pollen-step-header img {
	margin: 0;
	width: 32px;
}

.main_topic.pollenRiskIdx .pollen-step-txt-box {
	padding: 16px 20px;
	box-sizing: border-box;
}

.main_topic.pollenRiskIdx .pollen-step-txt-box p {
	display: flex;
	gap: 10px;
	text-align: left;
}

.main_topic.pollenRiskIdx .pollen-step-txt-box p .dot {
	width: 6px;
	height: 6px;
	border-radius: 100%;
	background: #828282;
	display: block;
	margin: 12px 0 0 0;
	flex: 0 0 6px;
}

/* 꽃가루 농도 e */


/* 자전거 둘레길 */
.main_topic.bicycle-road.small select {
    border-radius: 10px;
    background: #fff url('./image/new/select.png') no-repeat 96% 50%;
    cursor: pointer;
    height: 35px;
    font-weight: 500;
    color: #696969;
    background-size: 12px;
}
.main_topic.bicycle-road select {
    border-radius: 10px;
    background: #fff url(./image/new/select.png) no-repeat 96% 50%;
    cursor: pointer;
    height: 35px;
    font-weight: 500;
    color: #696969;
    background-size: 12px;
}

.main_topic.bicycle-road {
	height: calc(100% - 42px);
	padding: 26px 0 0;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.main_topic.bicycle-road .trail-info {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin: 0;
	flex: 1;
    border-bottom: 1px solid #ddd;
}

.main_topic.bicycle-road .trail-info .trail-icon {
	display: flex;
	margin: 0;
	gap: 8px;
	align-items: center;
}

.main_topic.bicycle-road .trail-info .trail-icon img {
	margin: 0;
	display:none;
}

.main_topic.bicycle-road .trail-info .trail-icon span {
	margin: 0;
	font-size: 14px;
	font-weight: 500;
	color: #000;
}

.main_topic.bicycle-road .trail-info .trail-route {
	text-align: left;
	margin: 0;
	line-height: 1.5;
}

.main_topic.bicycle-road  .trail-box {
	gap: 10px;
	display: flex;
	flex-direction: column;
	margin: 0;
	flex: 1;
}

.main_topic.bicycle-road  .trail-map {
	height: 100%;
	width: 100%;
	flex: 1;
	border-radius: 8px;
	border: 1px solid #ddd;
	display:none;
}

.main_topic.bicycle-road .trail-stats {
	margin: 0;
	display: flex;
	gap: 10px;
	height: 100%;
}

.main_topic.bicycle-road .trail-stats .stat-item {
	height: 100%;
	display: flex;
	align-items: flex-start;
	flex-direction: column;
	justify-content: center;
	margin: 0;
	flex: 1;
	gap: 6px;
	border-left: 1px solid #ddd;
	padding-left: 12px;
}

.main_topic.bicycle-road .trail-stats .stat-item:first-child {
	border-left: none;
	padding-left: 0;
}

.main_topic.bicycle-road .trail-stats .stat-item .stat-value.step-txt {
	padding: 2px 8px;
	border-radius: 50px;
	font-weight: 500;
}
.main_topic.bicycle-road .trail-stats .stat-item .stat-value {
	margin: 0;
}
.main_topic.bicycle-road .stat-item .stat-label {
	font-size: 14px;
	margin: 0;
}
.main_topic.bicycle-road .stat-item .stat-box {
    margin: 0;
    min-height: 40px;
}
.main_topic.bicycle-road .trail {
	    margin: 0;
}

.main_topic.bicycle-road .trail ul {
	gap: 5px;
	width: 100%;
}

.main_topic.bicycle-road .trail .map_popup .modal_btn {
	color: #fff;
	background: #696969;
	font-weight: 300;
	width: 50%;
}

.main_topic.bicycle-road.middle {
	height: calc(100% - 42px) !important;
	padding: 10px 0 0 !important;
}

.main_topic.bicycle-road.big .trail-info .trail-icon img {
	display: block;
}

.main_topic.bicycle-road.big .trail-map {
	display: block;
}

.main_topic.bicycle-road.big .trail-info {
	border-bottom: none;
	flex: initial;
}

.main_topic.bicycle-road.big .trail-stats {
	height: fit-content;
}

.main_topic.bicycle-road.big .trail-stats .stat-item {
	margin: 0 auto;
	flex: 1;
	padding: 10px;
	border-radius: 8px;
	border: 1px solid #ddd;
	display: flex;
	flex-direction: column;
	gap: 8px;
	height: fit-content;
}
.main_topic.bicycle-road.big .stat-item  .stat-value {
	margin:0 auto;
}
.main_topic.bicycle-road.big .stat-item .stat-label {
	margin: 0 auto;
}

.main_topic.bicycle-road.small {
	padding: 10px 0 0 !important;
    height: calc(100% - 10px) !important;
}


.main_topic.bicycle-road.small .trail-box {
	    flex: .5;
}
/* 자전거 둘레길 */




/*  폐기물 수거함 s*/
.main_topic.wasteBox  ul.two-tab {
	padding: 0;
	border-bottom: 1px solid #dedede;
	border-radius: 0;
	margin-bottom: 16px;
	background:none;
}

.main_topic.wasteBox {
	
display: flex;
	
flex-direction: column;
} 

.main_topic.wasteBox  .top {
    margin: 0;
}
.main_topic.wasteBox  ul {
	display: flex;
	align-content: center;
	justify-content: center;
	background: #F4F4F4;
	border-radius: 50px;
	height: 35px;
	width: 100%;
	padding: 5px;
	box-sizing: border-box;
}

.main_topic.wasteBox ul li {
	/* height: 40px; */
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 15px;
	font-weight: 500;
	/* background: #fff; */
	border-radius: 50px;
}

.main_topic.wasteBox  ul.two-tab li.on {
	border-bottom: 1.5px solid #000;
	border-radius: 0;
	background:none;
}

.main_topic.wasteBox  ul.two-tab li.on a {
	color: #000;
}

.main_topic.wasteBox .container-box {
	height: fit-content;
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin: -0;
	height: 100%;
}

.main_topic.wasteBox .container-box .container-middle {
	margin: 0;
	/* flex: 1 0 auto; */
}

.main_topic.wasteBox .container-box .container-middle .wasteBox-infor {
	background: #F3F5F7;
	border-radius: 8px;
	display: flex;
	align-items: center;
	gap: 8px;
	justify-content: center;
	height: 100%;
}

.main_topic.wasteBox.big .container-box .container-middle .wasteBox-infor {
    flex-direction: column;
    padding: 20px;
    height: revert-layer;
}

.main_topic.wasteBox.big .container-box .container-middle .wasteBox-infor img {
	max-width: 890px;
}

.main_topic.wasteBox .container-box .container-middle .wasteBox-infor img
	{
	margin: 0;
	max-width: 56px;
	width: fit-content;
}

.main_topic.wasteBox .container-box .container-middle .wasteBox-infor p
	{
	margin: 0;
	font-size: 16px;
	font-weight: 500;
	color: #000;
}

.main_topic.wasteBox .container-box .bottom {
	margin: 0;
	flex: 1 0 auto;
}

.main_topic.wasteBox .container-box .bottom .info-list {
	padding: 0;
	background: none;
	display: flex;
	flex-direction: column;
	gap: 14px;
	height: auto;
}

.main_topic.wasteBox .container-box .bottom .info-list li span {
	margin:0;
}

.main_topic.wasteBox .container-box .bottom .info-list li span.wasteBox-right {
	max-width:15rem;
	text-align:right;
}

.main_topic.wasteBox .container-box .bottom .info-list li {
	background: none;
	justify-content: space-between;
}

.main_topic.wasteBox .container-box .bottom .info-list li

.main_topic.wasteBox .container-box .bottom .info-list li span.label {
	margin: 0;
	color: #000;
}

.main_topic.wasteBox .container-box .bottom .info-list li span.value {
	margin: 0;
}

.main_topic.wasteBox.small .container-box .bottom .info-list li span.label {
	display:none;
}

/*  폐기물 수거함 e*/







