@charset "UTF-8";

/* .logo-text {
	    color: #fff !important; 
} */

.noise .noise-instrument .left-01-img p {
	font-size: clamp(10px, 0.8vw, 15px);
}

.noise .noise-infor .noise-legend table tbody tr td .wifi-img-01 {
	background: url('./image/noise/mini-noise-01.png') 25%/contain no-repeat;
}

.noise .noise-infor .noise-legend table tbody tr td .wifi-img-02 {
	background: url('./image/noise/mini-noise-02.png') 25%/contain no-repeat;
}

.noise .noise-infor .noise-legend table tbody tr td .wifi-img-03 {
	background: url('./image/noise/mini-noise-03.png') 25%/contain no-repeat;
}

.noise .noise-infor .noise-legend table tbody tr td .wifi-img-04 {
	background: url('./image/noise/mini-noise-04.png') 25%/contain no-repeat;
}

.noise .noise-infor .noise-legend table tbody tr td .wifi-img-05 {
	background: url('./image/noise/mini-noise-05.png') 25%/contain no-repeat;
}

.noise .noise-infor .noise-legend table tbody tr td .wifi-img-06 {
	background: url('./image/noise/mini-noise-06.png') 25%/contain no-repeat;
}

.noise .noise-infor .noise-legend table tbody tr td .wifi-img-07 {
	background: url('./image/noise/mini-noise-07.png') 25%/contain no-repeat;
}

.noise .noise-infor .noise-legend table tbody tr td p {
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 9.5px;
    width: clamp(60px, 5vw, 80px);
    text-align: left;
}

.noise .noise-infor .noise-area .t-txt {
    margin-left: 11px;
    display: none;
}

.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div .text .img {
	width: 15%;
	height: 34%;
	position: absolute;
	left: 10%;
	top: 15px;
}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div .text .img {
	width: 15%;
	height: 34%;
	position: absolute;
	left: 10%;
	top: 15px;
}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div:nth-child(1) .text .img {
	background: url('./image/new/dulle_gil1.png') no-repeat;
	background-size: contain;
	background-position: center;
}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper .section .text .img {
	background: url('./image/new/dulle_gil2.png') no-repeat;
	background-size: contain;
	background-position: center;
}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div:nth-child(3) .text .img {
	background: url('./image/new/dulle_gil3.png') no-repeat;
	background-size: contain;
	background-position: center;
}
.main_topic.dulle_gil.middle .swiper_ecology .swiper-wrapper > div:nth-child(4) .text .img {
	background: url('./image/new/dulle_gil4.png') no-repeat;
	background-size: contain;
	background-position: center;
}

.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper > div .text .img {
	width: 60%;
	height: 100%;	
	/* display: flex; */
}
.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper > div:nth-child(1) .text .img {
	background: url('./image/new/dulle_gil1.png') no-repeat;
	background-size: contain;
	background-position: center;
}
.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper .section .text .img {
	background: url('./image/new/dulle_gil2.png') no-repeat;
	background-size: contain;
	background-position: center;
}
.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper > div:nth-child(3) .text .img {
	background: url('./image/new/dulle_gil3.png') no-repeat;
	background-size: contain;
	background-position: center;
}
.main_topic.dulle_gil.big .swiper_ecology .swiper-wrapper > div:nth-child(4) .text .img {
	background: url('./image/new/dulle_gil4.png') no-repeat;
	background-size: contain;
	background-position: center;
}

/* 생태관광 코스 추천 s */
.main_topic.ecology.big .swiper_ecology .swiper-wrapper > div .text div:nth-child(1) {
        /* 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: 3;
        -webkit-box-orient: vertical;
        font-weight: 100 !important;
}
.main_topic.ecology.middle .swiper_ecology .swiper-wrapper > div .text div:nth-child(1) {
        /* 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: 1;
        -webkit-box-orient: vertical;
        font-weight: 100 !important;
}
/* 생태관광 코스 추천 e */

/*황사 모델예측 s*/

.main_topic.yellow_dust.middle .caution {
	height: calc(100% - 5px);
}

.main_topic.yellow_dust.big .caution {
	height: calc(100% - 15px);
}

/*황사 모델예측 e*/

/*황사 위성영상 s*/

.main_topic.satellite.middle .caution {
	height: calc(100% - 5px);
}
.main_topic.satellite.big .caution {
	height: calc(100% - 15px);
}
 /*sliderBar s*/
.main_topic.satellite .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.satellite .range .slider-container .back-bar .selected-bar{
	background: rgb(110, 178, 243);
    height: 6px;
    position: absolute;
    left: 0px;
    border-radius: 10px;
}
.main_topic.satellite .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.satellite .range .slider-container .scale{
	top: 30px;
    position: relative;
    margin-left: 5%;
}
.main_topic.satellite .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.satellite .range .slider-container .scale span{
	position: absolute;
    height: 5px;
    border-left: 0px solid #999;
    font-size: 0;
}
 /*sliderBar e*/
 
/*황사 위성영상 e*/

.dam_popup .dams_i p {
    top: 50%;
    left: 50%;
    position: absolute;
    display: block;
    width: auto;
    font-size: 12px;
    font-weight: 500;
    color: #333;
}
.dam_popup .dams_i p::before {
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-right: 2px;
    vertical-align: middle;
    box-sizing: border-box;    
}

.main_topic.temperature.middle .caution {
	align-items: center;
}

/* 다중이용시설 실내공기질 s */
.main_topic.air_quality.middle .caution .data ul > li > div > div span {
	/* display: none; */
}
.main_topic.air_quality.big .caution .data.yellow_pastel2 li {
	color: #FFC136;
}
.main_topic.air_quality.big .caution .data.yellow_pastel2 li div div:first-child {
	color: #FFC136;
}
.main_topic.air_quality.big .caution .data.blue_pastel2 li {
	color: #6EB2F3;
}
.main_topic.air_quality.big .caution .data.blue_pastel2 li div div:first-child {
	color: #6EB2F3;
}
.main_topic.air_quality.middle .caution .data.yellow_pastel2 .title {
	color: #FFC136;
}
.main_topic.air_quality.middle .caution .data.blue_pastel2 .title {
	color: #6EB2F3;
}
.main_topic.air_quality .caution .data li div div:last-child {
	color: #707070;
}
.main_topic.air_quality.big .caution .img_data .txt {
	font-size: 35px !important;
}
/* 소s */
.main_topic.air_quality.small {
	display: block;
	padding: 10px 0;
} 
.main_topic.air_quality.small .caution {
	height: calc(100% - 27px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	border-radius: 10px;
	gap: 10px;
	margin-top: 10px;
}

.main_topic.air_quality.small .caution .img_data{
	display: flex;
	width: 100%;
	flex-direction: column;
	justify-content: center;
	height: 30%;
	gap: 0;
	display: none;
}
.main_topic.air_quality.small .caution .img_data .img {
	width: 100%;
	display: flex;
	height: fit-content;
}
.main_topic.air_quality.small .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.small .caution .img_data .img li:after {
	display:block;
	content:'';
	padding-bottom: 100%;
}
.main_topic.air_quality.small .caution .img_data .img li.on {
	border: 4px solid #78b7f4;
}
.main_topic.air_quality.small .caution .img_data .img .water1 {
	background: #F9F9F9 url('./image/new/supply/supply_1.png') no-repeat;
}
.main_topic.air_quality.small .caution .img_data .img .water2 {
	background: #F9F9F9 url('./image/new/supply/supply_2.png') no-repeat;
}
.main_topic.air_quality.small .caution .img_data .img .water3 {
	background: #F9F9F9 url('./image/new/supply/supply_3.png') no-repeat;
}
.main_topic.air_quality.small .caution .img_data .img .water4 {
	background: #F9F9F9 url('./image/new/supply/supply_4.png') no-repeat;
}
.main_topic.air_quality.small .caution .img_data .img li.line {
	display: none;
}
.main_topic.air_quality.small .caution .img_data .txt {
	display: none;
}

.main_topic.air_quality.small .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.small .caution .data .title {
	font-size: 13px;
}
.main_topic.air_quality.small .caution .data ul {
	display: flex;
	gap: 10px;
	width: 85%;
	height: 55%;
}
.main_topic.air_quality.small .caution .data ul.on {
	width: 95%;
	gap: 5px;
}
.main_topic.air_quality.small .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.small .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.small .caution .data ul > li::after {
	display: block;
	/* content: ""; */
	/* padding-bottom: 100%; */
}
.main_topic.air_quality.small .caution .data ul > li > div {
	width: 100%;
	height: 100%;
	position: absolute;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	font-size: 12px;
	padding: 5px 15px;
	box-sizing: border-box;
}
.main_topic.air_quality.small .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.small .caution .data ul.on > li > div > div {
	height: 50%;
}
.main_topic.air_quality.small .caution .data ul.on > li > div {
	font-size: 12px;
	padding: 5px;
	align-items: center;
}
.main_topic.air_quality.small .caution .data .swiper-wrapper {
	
}
.main_topic.air_quality.small .select {
	display: flex;
	gap: 5px;
}
.main_topic.air_quality.small 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.small .caution .data .swiper-slide {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 10px;
}
.main_topic.air_quality.small .caution .data ul > li > div > div {
	width: 100%;
	height: 50%;
	display: flex;
	margin: 0;
	justify-content: center;
	font-size: 12px;
	align-items: center;
}
.main_topic.air_quality.small .caution .data ul > li > div > div span {
	margin:0;
	margin-left: 5px;
}
.main_topic.air_quality.small .caution .data ul > li > div > div {
	font-size: 12px;
	line-height: 1.2em;
}
.main_topic.air_quality.small .caution .data ul li > div {
	padding: 5px;
}
.main_topic.air_quality.small .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.small .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.small .swiper-button-prev {
	width: 40px;
	height: 40px;
	top: calc(70% - 40px);
}
.main_topic.air_quality.small .swiper-button-prev:after {
	font-size: 12px;
}
.main_topic.air_quality.small .swiper-button-next {
	width: 40px;
	height: 40px;
	top: calc(70% - 40px);
}
.main_topic.air_quality.small .swiper-button-next:after {
	font-size: 12px;
}
.main_topic.air_quality.small .swiper-button-next:after {
	font-size: 18px;
	display: flex;
	color: #D9D9D9;
	margin-left: 4px;
} 
.main_topic.air_quality.small .swiper-button-prev:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-right: 4px;
}
.main_topic.air_quality.small .caution .data.yellow_pastel2 .title {
    color: #FFC136;
}
.main_topic.air_quality.small .caution .data.blue_pastel2 .title {
	color: #6EB2F3;
}
.main_topic.air_quality.small {
    height: calc(100% - 42px - -9px);
    width: 100%;
    padding: 26px 0;
    box-sizing: border-box;
}
/* 소e */
/* 다중이용시설 실내공기질 e */

/* 다중이용시설 실내공기질 modal s */
.modal .air_quality_popup .map .right > button.off {
    position: absolute;
    height: 20px;
    width: 40px;
    left: -30px;
    top: 50%;
    transform: translate(-0%, -50%);
    border-radius: 0px 0px 5px 5px;
    background: #fff url(./image/new/select.png) no-repeat 50% 50%;
    transform: rotate(90deg);
    background-size: 12px;
    z-index: 10;
    overflow: visible;
    display: block;
}
/* 다중이용시설 실내공기질 modal e */


/*전기차 · 수소차 충전소  s*/
.main_topic.charging.small .caution .address .middle_txt div {
	display: none;
}
.main_topic.charging.small .caution .address .middle_txt div:first-child {
	display: block;
}
.main_topic.charging.big .caution .address .img .tulle_tip.blue_back::after {
	display: block;
	position: absolute;
	right: 0px;
	content: '';
	transform: rotate(224deg);
	border-bottom: 20px solid #6EB2F3;
	border-left: 0px solid transparent;
	border-right: 20px solid transparent;
	left: calc(100% - 17%);
}
.modal .charging_popup .map .popup .text > .addr .icon {
	background: url('./image/new/icon_map2.png') no-repeat 50% 50%;
	width: 15px;
	height: 15px;
	background-size:contain;
}
.modal .charging_popup .map .popup .text .address .point {
	float: left;
}
.modal .charging_popup .map .popup .text .address .update_date {
	display: flex;
    float: left;
    align-items: center;
    margin-left: 11px;
    height: 30px;
    font-size: 12px;
}
.modal .charging_popup .map .popup .text > .address {
	height: 73px;
    overflow-y: scroll;
}
.modal .charging_popup .map .popup .text .addr {
	flex-direction: row;
    gap: 10px;
}
.modal .charging_popup .map .popup .text > .person .hydrogen_person {
	background: url('./image/new/p_2.png') no-repeat 50% 50% !important;
	background-size: contain !important;
}
.modal .charging_popup .map .popup .text > .home .hydrogen_home {
	background: url('./image/new/money_2.png') no-repeat 50% 50% !important;
	background-size: contain !important;
}
.modal .charging_popup .map .popup .text > .addr .hydrogen_addr {
	background: url('./image/new/icon_map.png') no-repeat 50% 50% !important;
	background-size: contain !important;
}
.main_topic.charging.small .caution .address .tulle_tip_hover {
	display: none;
	position: absolute;
	background: #767676;
	white-space: nowrap;
	font-size: 10px;
	top: 60%;
	border-radius: 5px;
	justify-content: center;
	align-items: center;
	padding: 3px 15px;
	color: white;
}
.main_topic.charging.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.charging.small .caution .address:hover .tulle_tip_hover {
	display: flex !important;
}
.main_topic.charging.big .caution .address .img .tulle_tip.blue_back2::after {
	display: block;
	position: absolute;
	right: 0px;
	content: '';
	transform: rotate(224deg);
	border-bottom: 20px solid #69AEF2;
	border-left: 0px solid transparent;
	border-right: 20px solid transparent;
	left: calc(100% - 17%);
}
.main_topic.charging.big .caution .address .img .tulle_tip.purple_back::after {
	display: block;
	position: absolute;
	right: 0px;
	content: '';
	transform: rotate(224deg);
	border-bottom: 20px solid #54248E;
	border-left: 0px solid transparent;
	border-right: 20px solid transparent;
	left: calc(100% - 17%);
}
.main_topic.charging.big .caution .address .img .tulle_tip.red_back::after {
	display: block;
	position: absolute;
	right: 0px;
	content: '';
	transform: rotate(224deg);
	border-bottom: 20px solid #FD481C;
	border-left: 0px solid transparent;
	border-right: 20px solid transparent;
	left: calc(100% - 17%);
}
.main_topic.charging.big .caution .address .img .tulle_tip.gray_back::after {
	display: block;
	position: absolute;
	right: 0px;
	content: '';
	transform: rotate(224deg);
	border-bottom: 20px solid #AEBCC4;
	border-left: 0px solid transparent;
	border-right: 20px solid transparent;
	left: calc(100% - 17%);
}
.main_topic.charging.big .caution .address .img .tulle_tip.orange_back3::after {
	display: block;
	position: absolute;
	right: 0px;
	content: '';
	transform: rotate(224deg);
	border-bottom: 20px solid #FF850C;
	border-left: 0px solid transparent;
	border-right: 20px solid transparent;
	left: calc(100% - 17%);
}
/*전기차 · 수소차 충전소  e*/

/* 국립공원탐방로 위젯 s */
/*소 s*/
.main_topic.national_park.small {
	display: block;
	padding-top: 10px;
	height: calc(100% - 40px);
	padding-bottom: 0;
}
.main_topic.national_park.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.national_park.small .caution{
	display: flex;
	flex-direction: column;
	height: calc(100% - 47px);
	gap: 10px;
	margin-top: 10px;
} 
.main_topic.national_park.small .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.small .caution .address .txt {
	margin: 0;		
	display: flex;		
	flex-direction: column;		
	justify-content: space-between;		
	height: 100%;	
	align-items: flex-start;
}
.main_topic.national_park.small .caution .address .title {
	display: none;
}

.main_topic.national_park.small .caution .address .title .blue {
	display: none;
}
.main_topic.national_park.small .caution .address .title div {
	display: none;
}
.main_topic.national_park.small .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.small .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.small .caution .address .img_txt li div {
	margin: 0;
}
.main_topic.national_park.small .caution .address .img_txt li div:nth-child(2) {
	color: #D9D9D9;
}
.main_topic.national_park.small .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.small .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.small .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.small .trail {
	/* display: none; */
	margin: 0;
}
.main_topic.national_park.small .map_popup {
	justify-content: space-between;
	gap: 5px;
}
.main_topic.national_park.small .map_popup li {
	background: #696969;
	color: #fff;
	font-weight: 300;
	width: 33.33%;
}
.main_topic.national_park.small .trail > img {
    display: none;
}
/*소 e*/
.main_topic.national_park.middle .trail > img {
	display: none;
}
.main_topic.national_park.middle {
	height: calc(100% - 42px) !important;
}
.main_topic.national_park.small {
	height: calc(100% - 10px) !important;
}
/* 국립공원탐방로 위젯 e */
/* 국립공원탐방로 modal s */
.modal .national_park_popup .map .trail {
	background: #ffffffe3 !important;
	z-index: 1;
}
.modal .national_park_popup .map .trail ul li:last-child {
	width: calc(38% - 5px);
}
.modal .national_park_popup .map .trail ul li .green_line {
    background: url(./image/new/park/legend_6_.png) no-repeat 50% 50%;
    background-size: contain;
}
.modal .national_park_popup .map .trail ul li .red_line {
    background: url(./image/new/park/legend_7_.png) no-repeat 50% 50%;
    background-size: contain;
}

.modal .national_park_popup_off .section{
	display: block;
	overflow: scroll;
}
.modal .national_park_popup_off .section .img{
	height: auto !important;
}
.modal .national_park_popup_off .section .img_box {
	flex-wrap: wrap;
    justify-content: flex-start;
}
.modal .national_park_popup_off .section .img_box li {
	flex: 1 1 calc(25% - 10px);
    max-width: calc(25% - 10px);
    margin: 0;
}
.modal .national_park_popup_off .scroll {
	overflow-x: hidden !important;
}

/* 국립공원탐방로 modal e */

/** 구 위젯 **/
.main_topic2 {
	height: calc(100% - 42px - 26px) !important;
	width: 100%;
	padding: 26px 0 !important;
	box-sizing: border-box;
}
/** 구 위젯 **/

/** 수질정보 **/
.w-q-container {
    height: 100%;
    padding-bottom: 22px;
    box-sizing: border-box;
    margin: 0 2px;
}
/** 수질정보 **/

/** 댐보정보 s **/
.content-07.group-waterLevelDamBo {
    height: calc(100% - 68px);
}

.group-waterLevelDamBo[class*='resize'] {
    /* height: calc(100% - 81px) !important; */
    padding: 12px 0;
    /* padding-top: 10px; */
}

.content-07>.chart .dam-content .selectDam {
	display:block;
    width: 34%;
    border-radius: 8px;
    height: 22px;
    background: #fff url(./image/select_arrow.png) 89% 50%/8px no-repeat;
    color: #707070;
    margin: 5px 22px 12px;
}
.content-07>.chart .dam-content .selectBo {
	display:block;
    width: 34%;
    border-radius: 8px;
    height: 22px;
    background: #fff url(./image/select_arrow.png) 89% 50%/8px no-repeat;
    color: #707070;
    margin: 5px 22px 12px;
}
.content-07>.dambo {
	width: 100%;
	height: 100% !important;
	box-sizing: border-box;
	height: 100%;
	position: relative;
	padding: 10px 0;
	display: flex;
	gap: 10px;
}
/** 댐보정보 e **/

.modal.w_100 .waterworks_popup td {
    font-size: 0.9em;
}

.modal.w_100 .waterworks_popup ul li:hover {
    cursor: pointer;
    color: orange;
}

.modal .dulle_gil_popup .section .img_box li {
    height: 100% !important;
}


/* 생태관광 코스 추천 > 모달 s */
.modal .ecology_popup > .map ul {
	background: #ffffff;
	border-radius: 50px;
	display: flex;
	width: fit-content;
	position: absolute;
	height: 70px;
	width: 155px;
	align-items: center;
	justify-content: center;
	align-content: center;
	padding: 10px;
	box-sizing: border-box;
	gap: 10px;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}
.modal .ecology_popup > .map ul .img {
	background: url('./image/weather/weather_icon-07.png') no-repeat;
	background-size:contain;
	width: 45px;
	height: 45px;
	border-right: 1px solid #E7E7E7;
	padding-right: 10px;
}
.modal .ecology_popup > .map ul li {
	width: calc(100% - 45px);
	font-size: 13px;
	display: flex;
	flex-direction: column;
	font-weight: 600;
}
.modal .ecology_popup > .map ul li span {
	margin: 0;
	font-size: 11px;
	margin-top: 5px;
	font-weight: 300;
}

.modal .ecology_popup .map .right.on .scroll .information .box.on {
	border: 1px solid #69AEF2;
	box-shadow: 2px 2px 6px 1px #51515147;
}

/* 생태관광 코스 추천 > 모달 e */

/* 초미세먼지 > 모달 s */
.main_topic.dust.small .caution .tulle_tip_hover {
    display: none;
    position: absolute;
    background: #767676;
    height: 18px;
    white-space: nowrap;
    font-size: 10px;
    top: 112px;
    border-radius: 5px;
    justify-content: center;
    align-items: center;
    padding: 0 15px;
    color: white;
}
.main_topic.dust.small .caution .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.dust.middle .caution .tulle_tip_hover {
	display: none;
}
.main_topic.dust.big .caution .tulle_tip_hover {
	display: none;
}
.main_topic.dust.small .caution:hover .tulle_tip_hover {
	display: flex;
}
.modal_popup .dust_popup .section .video div.txt{
	margin: 30px;
	margin-top: 40px;
    text-align: center;
    text-wrap: revert-layer;
    line-height: 35px;
    word-break: keep-all;
}

.modal_popup .dust_popup .section .video div.txt strong{
	float: left;
}

.modal_popup .dust_popup .section .video div.txtFix{
	margin: 30px;
    margin-right: 20px;
    text-align: left;
    line-height: 25px;
    word-break: break-word;
    font-size: small;
}
.title_header .baseTime {
	display: none;
}

.modal_popup .dust_popup table{
    border-left: 1px solid #d7d7d7;
    border-right: 1px solid #d7d7d7;
}
/* 초미세먼지 > 모달 e */

/* 통합대피소 > 위젯 s */
.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;
}
@media  (min-width: 371px) and (max-width: 480px) {
	.main_topic.integrated.middle {
		padding: 10px 0;
	}
	.main_topic.integrated.middle select {
        height: 35px;
        background: #fff url(./image/new/select.png) no-repeat 96% 50%;
        background-size: 12px;
    }
	.main_topic.integrated.middle .caution .address {
		padding: 10px;
		height: 100%;
	}
	.main_topic.integrated.middle .caution .address .middle_txt {
        gap: 10px;
    }
	.main_topic.integrated.middle .caution .address .middle_txt div:first-child {
        font-size: 14px !important;
        /* margin-top: clamp(15px, 3vw, 30px); */
        gap: clamp(4px, 1.5vw, 8px);
    }
	.main_topic.integrated.middle .caution .address .middle_txt div {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        font-size: 12px;
        /* margin-top: clamp(15px, 3vw, 30px); */
        gap: clamp(4px, 1.5vw, 8px);
    }
	.main_topic.integrated.middle .caution .address .img {
		background-position-x: calc(100% - 6px);
		background-position-y: calc(100% - 4px);
		background-size: 80%;
	}
	.main_topic.integrated.middle .caution .address .img {
	    width: 50% !important;
	    height: 95% !important;
	    background-size: contain !important;
	    position: absolute;
	    bottom: 0;
	    right: 0;
	    background-position: center;
	    background-position-x: calc(100% - 20px);
	    background-position-y: calc(100% - 10px);
	    border: none !important;
	}
	.main_topic.integrated.middle .caution .address #shelterImg {
	    background-size: contain !important;
	}
	.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;
	    line-height: 30px;
	}
	.main_topic.integrated.middle .caution .address .middle_txt {
		bottom: 40px;
	}
	.main_topic.integrated.middle .map {
		display: none;
	}
}
@media screen and (min-width: 1050px) and (max-width: 1280px) {
    .main_topic.integrated.middle .caution .address {
        padding: 15px !important;
    }
    .main_topic.integrated.middle .caution .address .txt {
        display: flex;
        flex-direction: column;
        align-items: baseline;
        justify-content: flex-start;
        height: 100%;
        width: 100%;
    }
    .main_topic.integrated.middle .caution .address .middle_txt {
        width: calc(100% - 30px);
        display: flex;
        height: initial;
        box-sizing: border-box;
        left: 15px;
    }
    .main_topic.integrated.middle .caution .address .middle_txt div:last-child {
        display: block;
    }
}
/* 통합대피소 > 위젯 e */
/* 톻합대피소 > 모달 s */
.modal .integrated_popup .map {
	height: calc(100% - 50px) !important;
}
/* 톻합대피소 > 모달 e */

/* 댐정보 > 위젯 s */
.main_topic.dam_information.small {
	padding: 10px 0;
    margin: 0;
    height: calc(100% - 42px);
}
.main_topic.dam_information.small .caution .img_box {
	display: flex;
    align-content: center;
    justify-content: center;
    margin: 0;
    height: 100%;
    position: relative;
}
.main_topic.dam_information.small .caution .img_box .water_level {
	width: 100%;
}
.main_topic.dam_information.middle .img_box .tulle_tip_hover {
	display: none;
}
.main_topic.dam_information.big .img_box .tulle_tip_hover {
	display: none;
}
.main_topic.dam_information.small .img_box  .tulle_tip_hover {
	display: none;
	position: absolute;
	background: #767676;
	height: 18px !important;
	white-space: nowrap;/** 한줄로 보이기 위해서 **/
	font-size: 10px;
	border-radius: 5px !important;
	padding: 0 15px;
	color: #fff;
	justify-content: center;
	align-items: center;
	top: 60%;
}
.main_topic.dam_information.small .img_box .tulle_tip_hover::after{
	display: flex;
    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: 0;
}
.main_topic.dam_information.small .img_box:hover .tulle_tip_hover {
	display: flex;
}
/* 댐정보 > 위젯 e */

/* 물차제원 > 위젯 s */
#waterTonSmall {
	text-overflow: ellipsis;
    white-space: nowrap;
    width: 75px;
    overflow: hidden;
    font-weight: 600;
}
.water_truck.small .caution .tulle_tip_hover {
	display: none;
	position: absolute;
	background: #767676;
	white-space: nowrap;
	font-size: 10px;
	top: 60%;
	border-radius: 5px;
	justify-content: center;
	align-items: center;
	padding: 3px 15px;
	color: white;
}
.water_truck.small .caution .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;
}
.water_truck.small .caution .adjustment:hover + .tulle_tip_hover {
	display: flex !important;
}
.main_topic.water_truck.big .txt #waterTon .none{
    font-weight: 500;
}
.main_topic.water_truck .txt #waterTon .none{
    cursor: pointer;
}
/* 물차제원 > 위젯 e */

/* 가믐정보 > 위젯 s */
.main_topic.drought.small {
	height: calc(100% - 45px) !important;
}
/* 가믐정보 > 위젯 e */

/* 모바일 위젯 s */
.main_topic.mobile_height {
	/* height: 100% !important; */
}
/* 모바일 위젯 e */

/* 표준유역강수량 > 위젯 s */
.main_topic.standard_basin.big .range {
	display: flex;
}
/* 표준유역강수량 > 위젯 e */


.modal .emergency_popup .section > ul > li pre {
	white-space: pre-line;
}

.modal .emergency_popup .section .information .box .button button:hover {
	cursor: pointer;
}

.generation_popup button {
	cursor: pointer;	
}

.modal .emergency_popup .section > ul.img_box li > div {
	width: 20%;
}

.modal .emergency_popup .section > ul.img_box li > div .img {
	display: flex;
    justify-content: center;	
}

.grid-stack .grid-stack-nested {
	min-height: 680px !important;
    margin: 0 auto;
    left: 50%;
}

.grid-stack-nested > .grid-stack-item > .grid-stack-item-content:hover {
	-webkit-transition: none;
	transition: none;
    -webkit-transform: none;
    transform: none;
    -ms-transform: unset;
    box-shadow: unset;
}

.grid-stack-item > .grid-stack-item-content .title_header .tab > button:not(.on):hover {
	cursor: pointer;
	transition: all .3s ease;
    transform: translateY(-5px);
    -ms-transform: translateY(-5px);
    box-shadow: 5px rgba(0, 0, 0, .08);
}

.dulle_gil_popup button:hover {
	cursor: pointer; 
}

.dulle_gil_popup ul.img_box li:hover {
	cursor: pointer; 
}

.dulle_gil_popup .section .orange_back2 > span {
	background: #fff url(./image/new/dulle_gil1.png) no-repeat 50% 50% !important;
    background-size: 70% !important;
}

.dulle_gil_popup .section .blue_back > span {
	background: #fff url(./image/new/dulle_gil2.png) no-repeat 50% 50% !important;
    background-size: 70% !important;
}

.dulle_gil_popup .section .orange_back > span {
	background: #fff url(./image/new/dulle_gil3.png) no-repeat 50% 50% !important;
    background-size: 70% !important;
}

.dulle_gil_popup .section .green_back2 > span {
	background: #fff url(./image/new/dulle_gil4.png) no-repeat 50% 50% !important;
    background-size: 70% !important;
}


/*환경 이슈 관련 컨펌 팝업 s*/
.issuerelated_popup {
	display: none;
	width: 100%;
	height: 100%;
	top: 0;
	border-radius: 0;
}
.issuerelated_popup.on {
	display: block;
}
.issuerelated_popup .popup {
	width: 500px;
	height: 300px;
	background: #fff;
	border-radius: 15px;
	z-index: 100;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	box-shadow: 1px 1px 8px 1px #00000029;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-content: center;
	align-items: center;
	padding: 20px;
	box-sizing: border-box;
	gap: 20px;
}
.issuerelated_popup .popup .img {
	background: #fff url(./image/new/addition.png) no-repeat 50%;
	width: 100%;
	height: 40%;
	background-size: contain;
	/* margin-bottom: 20px; */
}
.issuerelated_popup .popup .txt {	
	font-size: 18px;
	margin-bottom: 30px;
}
.issuerelated_popup .popup .button {
	width: 100%;
	height: 40px;
	display: flex;
	gap: 10px;
}
.issuerelated_popup .popup .button button{
	width: 50%;
	height: 100%;	
	border-radius: 10px;
	background: #696969;
	color: #fff;
	font-size: 15px;
}
.issuerelated_popup button:hover {
	cursor: pointer; 
}
/*환경 이슈 관련 컨펌 팝업 e*/

/*배출원별 폐기물 통계 s*/
.main_topic.wasteStats {
	display: none;
}
/*대 s*/
.main_topic.waste_stats.big {
	display: block;
}
.main_topic.waste_stats.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.waste_stats.big .caution{
	height: 100%;
	margin-top: 10px;
} 
.main_topic.waste_stats.big .caution .waste-stats-container{
	margin: 0;
	height: 100%;
	position: relative;
	width: 100%;
	border-radius: 10px;
	padding: 10px;
	box-sizing: border-box;
	border: 1px solid #ddd;
}
.main_topic.waste_stats.big .caution .waste-stats-container .waste-stats-div {
	margin: 0;		
	width: 100%;
	height: 100%;
}
.main_topic.waste_stats.big .address .tulle_tip_hover {
    display: none !important;
}
/*대 e*/
/*중 s*/
.main_topic.waste_stats.middle {
	display: block;
	padding: 10px 0;
}
.main_topic.waste_stats.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.waste_stats.middle .caution{
	height: 100%;
	margin-top: 10px;
}
.main_topic.waste_stats.middle .caution .waste-stats-container {
	margin: 0;
	height: 100%;
	position: relative;
	width: 100%;
	border-radius: 10px;
	padding: 10px;
	box-sizing: border-box;
	border: 1px solid #ddd;
}
.main_topic.waste_stats.middle .caution .waste-stats-container .waste-stats-div {
	height: 100%;
	width: 100%;
}
.main_topic.waste_stats.middle .address .tulle_tip_hover {
    display: none !important;
}
/*중 e*/
/*배출원별 폐기물 통계 e*/

/*사용자 의견 제공 s*/
.change-sun .change_button_color{
	background: #FFC136;
}

.change-cloudy .change_button_color{
	background: #C0D2EF;
}

.change-rain .change_button_color{
	background: #B6B6ED;
}

.change-snow .change_button_color{
	background: #8EDCE4;
}
.m_l_15{
   	margin-left: 15px;
}
.opinion_gray_button{
	background: #9E9E9E;
    color: white;
}
.opinion_border_button{
	border: 1px solid #707070;
    color: #707070;
    background: white;
}
/*대 s*/
.main_topic.user_opinion.big {
	display: block;
	height: 80% !important;
}
.main_topic.user_opinion.big .user_opinion_search{
  	display: flex;
    justify-content: space-between;
    padding: 5px 5px 0;
}
.main_topic.user_opinion.big .user_opinion_search .search_left{
  	margin: 0;
    display: flex;
    width: 65%;
    flex-wrap: wrap;
}
.main_topic.user_opinion.big .user_opinion_search .search_left div{
  	display: flex;
    align-items: center;
    padding-bottom: 15px;
    position: relative;
    margin: 0;
}
.main_topic.user_opinion.big .user_opinion_search .search_left div:first-child{
  	width: 30%;
}
.main_topic.user_opinion.big .user_opinion_search .search_left div:last-child{
  	margin-left: 10px;
  	width: 60%;
}
.main_topic.user_opinion.big .user_opinion_search .search_left 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;
    font-size: 14px;
}
.main_topic.user_opinion.big .user_opinion_search .search_left input{
    padding: 0 45px 0 20px;
    border-radius: 10px;
    background: #fff;
    border: 1px solid #E9EBEE;
}
.main_topic.user_opinion.big .user_opinion_search .search_right{
  	margin: 0;
}
.main_topic.user_opinion.big .user_opinion_search .search_right ul{
  	display: flex;
    width: 100%;
    padding-bottom: 15px;
}
.main_topic.user_opinion.big .user_opinion_search .search_right ul li{
  	width: 96px;
  	height: 40px;
    min-width: 40px;
    text-align: center;
    border-radius: 20px;
    line-height: 40px;
    cursor: pointer;
    font-weight: 500;
}
.main_topic.user_opinion.big .user_opinion_search .search_right ul li:last-child{
  	margin-left: 8px;
    background: #9E9E9E;
    color: white;
}
.main_topic.user_opinion.big .caution{
	height: 90%;
	margin-top: 10px;
	margin-bottom: 10px;
} 
.main_topic.user_opinion.big .caution .user_opinion_table{
    box-sizing: border-box;
    overflow: auto;
    height: 100%;
}
.main_topic.user_opinion.big .caution .user_opinion_table table{
   	width: 100%;
    margin: 0;	
}
.main_topic.user_opinion.big .caution .user_opinion_table table thead{
    /* height: 40px; */
    height:	50px;
    background: #F5F5F5;
}
.main_topic.user_opinion.big .caution .user_opinion_table table tbody tr{
   	cursor: pointer;
}
.main_topic.user_opinion.big .caution .user_opinion_table table tbody tr td{
   	color: #707070;
    border-top: 1px solid #E9EBEE;
    border-bottom: 1px solid #E9EBEE;
    overflow: hidden;
   /*  height: 35px; */
    height: 50px;
}
.user_opinion.big.user_opinion_paging {
    margin-bottom: 28px;
}
.user_opinion.big.user_opinion_paging .number{
    font-size: 18px;
}
.user_opinion.big.user_opinion_button {
    display: flex;
    justify-content: center;
}
.user_opinion.big.user_opinion_button {
    display: flex;
    justify-content: center;
}
.user_opinion.big.user_opinion_button .modal_btn {
    margin: 0;
    height: 45px;
    /* background: #ececec; */
    border-radius: 30px;
    width: 96px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
}
.user_opinion.big.user_opinion_button .modal_btn:last-child {
    background: #9E9E9E;
    color: white;
    margin-left: 10px;
}
.opinion_page.big {
    height: 90%;
    margin-bottom: 10px;
    margin-top: 20px;
}
.opinion_page.big .detail{
    height: calc(100% - 83px);
    overflow-y: auto;
    overflow-x: hidden;
    padding: 0 15px;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 41px;
}
.opinion_page.big .detail .detail_table{
    display: table;
    width: 100%;
}
.opinion_page.big .detail .detail_table .detail_border{
   	text-align: center;
    border-top: 1px solid #ddd;
    height: 45px;
    position: relative;
}
.opinion_page.big .detail .detail_table .detail_border .point_color{
   	width: 25%;
    border-right: 1px solid #ddd;
    box-sizing: border-box;
    padding: 0px 8px;
    line-height: 45px;
    position: relative;
    font-size: 15px;
    font-weight: 500;
    height: 40px;
}
.opinion_page.big .detail .detail_table .detail_border .opinion_input{
   	box-sizing: border-box;
    padding: 0px 8px;
    line-height: 45px;
    position: relative;
    font-size: 18px;
    font-weight: 400;
    height: 45px;
    width: 75%;
}
.opinion_page.big .detail .detail_table .detail_border .opinion_input input{
   	cursor: pointer;
    font-weight: 300;
    outline: 0;
    border: 1px solid #ddd;
    width: 100%;
    padding: 0 8px;
    height: 35px;
    border-radius: 5px;
    box-sizing: border-box;
    line-height: 35px;
    margin: 0;
    font-size: 15px;
    vertical-align: 1px;
    background: #fff;
}
.opinion_page.big .detail .detail_table .detail_border .opinion_input select{
   	border-radius: 5px;
    background: #fff url(./image/new/select.png) no-repeat 98% 50%;
    cursor: pointer;
    color: #696969;
    font-size: 15px;
    font-weight: 300;
}
.opinion_page.big .detail .detail_table .detail_border .opinion_file{
   	box-sizing: border-box;
    padding: 0px 8px;
    line-height: 45px;
    position: relative;
    font-size: 18px;
    font-weight: 400;
    height: 45px;
    width: 75%;
}
.opinion_page.big .detail .detail_table .detail_border .opinion_file input{
   	cursor: pointer;
    font-weight: 300;
    outline: 0;
    border: 1px solid #ddd;
    width: 70%;
    padding: 0 8px;
    height: 35px;
    border-radius: 5px;
    box-sizing: border-box;
    line-height: 35px;
    margin: 0;
    font-size: 15px;
    vertical-align: 1px;
    background: #fff;
    margin-top: 5px;
}
.opinion_page.big .detail .detail_table .detail_border .opinion_file input[name="uploadFile"]{
   	position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    border: 0;
    margin-top: 5px;
}
.opinion_page.big .detail .detail_table .detail_border .opinion_file .button{
    width: 14%;
    height: 35px;
    text-align: center;
    border-radius: 15px;
    line-height: 35px;
    cursor: pointer;
    font-size: 13px;
    margin-top: 5px;
}
.opinion_page.big .btn{
   	display: flex;
    margin-top: 20px;
    width: calc(100%);
}
.opinion_page.big .btn div{
   	width: calc(100% / 3 - 10px);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
    height: 45px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 20px;
}
.opinion_page.big .detail .registration{
   	height: 29%;
}
.opinion_page.big .detail .registration .title_header{
   	margin-top: 26px;
    margin-bottom: 13px;
}
.opinion_page.big .detail .registration_button{
   	width: 10%;
    height: 30px;
    text-align: center;
    border-radius: 15px;
    line-height: 30px;
    cursor: pointer;
    font-size: 13px;
    margin-top: 14px;
    margin-bottom: 5px;
}
.opinion_page.big .detail .registration .reply_header{
   	margin-top: 0;
   	margin-bottom: 13px;
}
.opinion_page.big .detail .registration .reply_header .header_box{
   	display: flex;
    justify-content: space-between;
    margin: 0;
    align-items: center;
}
.opinion_page.big .detail .registration .reply_header .header_box .title{
   	margin: 0;
    color: #696969;
    font-family: 'NanumSquare';
    font-weight: 500;
    font-size: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    word-break: break-all;
}
.opinion_page.big .detail .registration .reply_border{
   	text-align: center;
    border-top: 1px solid #ddd;
    height: 40px;
    position: relative;
    border-bottom: 1px solid #ddd;
}
.opinion_page.big .detail .registration .reply_border .rgtr_id{
   	width: 30%;
    border-right: 1px solid #ddd;
    box-sizing: border-box;
    padding: 0px 8px;
    line-height: 40px;
    position: relative;
    font-size: 15px;
    font-weight: 500;
    margin-bottom: 5px;
}
.opinion_page.big .detail .registration .reply_border .creat_de{
   	padding: 0px 8px;
    line-height: 40px;
    position: relative;
    font-size: 15px;
    font-weight: 500;
}
.opinion_page.big .detail .registration .reply_border .reply_button{
	background: url('./image/address_btn.png') no-repeat right;
	width: 15px;
	height: 18px;
	background-size: contain;
	margin: 10px;
	cursor: pointer;
}
/*대 e*/
/*중 s*/
.main_topic.user_opinion.middle {
	display: block;
	height: 72% !important;
}
.main_topic.user_opinion.middle .user_opinion_search{
  	display: flex;
    justify-content: space-between;
    padding: 5px 5px 0;
    height: 15%;
}
.main_topic.user_opinion.middle .user_opinion_search .search_left{
  	margin: 0;
    display: flex;
    width: auto;
    flex-wrap: wrap;
}
.main_topic.user_opinion.middle .user_opinion_search .search_left div{
  	display: flex;
    align-items: center;
    padding-bottom: 15px;
    position: relative;
    margin: 0;
}
.main_topic.user_opinion.middle .user_opinion_search .search_left div:first-child{
  	width: 30%;
}
.main_topic.user_opinion.middle .user_opinion_search .search_left div:last-child{
  	margin-left: 10px;
  	width: 60%;
}
.main_topic.user_opinion.middle .user_opinion_search .search_left 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;
    font-size: 14px;
}
.main_topic.user_opinion.middle .user_opinion_search .search_left input{
    padding: 0 45px 0 20px;
    border-radius: 10px;
    background: #fff;
    border: 1px solid #E9EBEE;
}
.main_topic.user_opinion.middle .user_opinion_search .search_right{
  	margin: 0;
}
.main_topic.user_opinion.middle .user_opinion_search .search_right ul{
  	display: flex;
    width: 100%;
    padding-bottom: 15px;
}
.main_topic.user_opinion.middle .user_opinion_search .search_right ul li{
  	width: 60px;
  	height: 40px;
    text-align: center;
    border-radius: 20px;
    line-height: 40px;
    cursor: pointer;
    font-weight: 500;
}
.main_topic.user_opinion.middle .user_opinion_search .search_right ul li:last-child{
  	margin-left: 3px;
    background: #9E9E9E;
    color: white;
}
.main_topic.user_opinion.middle .caution{
	height: 90%;
	margin-top: 10px;
	margin-bottom: 10px;
} 
.main_topic.user_opinion.middle .caution .user_opinion_table{
    box-sizing: border-box;
    overflow: auto;
    height: 90%;
}
.main_topic.user_opinion.middle .caution .user_opinion_table table{
   	width: 100%;
    margin: 0;	
}
.main_topic.user_opinion.middle .caution .user_opinion_table table thead{
    height: 40px;
    background: #F5F5F5;
}
.main_topic.user_opinion.middle .caution .user_opinion_table table tbody tr{
   	cursor: pointer;
}
.main_topic.user_opinion.middle .caution .user_opinion_table table tbody tr td{
   	color: #707070;
    border-top: 1px solid #E9EBEE;
    border-bottom: 1px solid #E9EBEE;
    overflow: hidden;
    height: 35px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.user_opinion.middle.user_opinion_paging {
    margin-bottom: 3px;
}
.user_opinion.middle.user_opinion_paging .number{
    font-size: 15px;
}
.user_opinion.middle.user_opinion_button {
    display: flex;
    justify-content: center;
}
.user_opinion.middle.user_opinion_button {
    display: flex;
    justify-content: center;
}
.user_opinion.middle.user_opinion_button .modal_btn {
    margin: 0;
    height: 38px;
    /* background: #ececec; */
    border-radius: 30px;
    width: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
}
.user_opinion.middle.user_opinion_button .modal_btn:last-child {
    background: #9E9E9E;
    color: white;
    margin-left: 10px;
}
.opinion_page.middle {
    height: 90%;
    margin-bottom: 10px;
    margin-top: 20px;
}
.opinion_page.middle .detail{
    height: calc(100% - 83px);
    overflow-y: auto;
    overflow-x: hidden;
    padding: 0 15px;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: 41px;
}
.opinion_page.middle .detail .detail_table{
    display: table;
    width: 100%;
}
.opinion_page.middle .detail .detail_table .detail_border{
   	text-align: center;
    border-top: 1px solid #ddd;
    height: 37px;
    position: relative;
}
.opinion_page.middle .detail .detail_table .detail_border .point_color{
   	width: 25%;
    border-right: 1px solid #ddd;
    box-sizing: border-box;
    padding: 0px 8px;
    line-height: 32px;
    position: relative;
    font-size: 13px;
    font-weight: 500;
    height: 32px;
}
.opinion_page.middle .detail .detail_table .detail_border .opinion_input{
   	box-sizing: border-box;
    padding: 0px 8px;
    line-height: 37px;
    position: relative;
    font-size: 13px;
    font-weight: 400;
    height: 37px;
    width: 75%;
}
.opinion_page.middle .detail .detail_table .detail_border .opinion_input input{
   	cursor: pointer;
    font-weight: 300;
    outline: 0;
    border: 1px solid #ddd;
    width: 100%;
    padding: 0 8px;
    height: 27px;
    border-radius: 5px;
    box-sizing: border-box;
    line-height: 27px;
    margin: 0;
    font-size: 13px;
    vertical-align: 1px;
    background: #fff;
}
.opinion_page.middle .detail .detail_table .detail_border .opinion_input select{
   	border-radius: 5px;
    background: #fff url(./image/new/select.png) no-repeat 98% 50%;
    cursor: pointer;
    color: #696969;
    font-size: 13px;
    font-weight: 300;
    height: 27px;
}
.opinion_page.middle .detail .detail_table .detail_border .opinion_file{
   	box-sizing: border-box;
    padding: 0px 8px;
    line-height: 37px;
    position: relative;
    font-size: 13px;
    font-weight: 400;
    height: 37px;
    width: 75%;
}
.opinion_page.middle .detail .detail_table .detail_border .opinion_file input{
   	cursor: pointer;
    font-weight: 300;
    outline: 0;
    border: 1px solid #ddd;
    width: 61%;
    padding: 0 8px;
    height: 27px;
    border-radius: 5px;
    box-sizing: border-box;
    line-height: 27px;
    margin: 0;
    font-size: 13px;
    vertical-align: 1px;
    background: #fff;
    margin-top: 5px;
}
.opinion_page.middle .detail .detail_table .detail_border .opinion_file input[name="uploadFile"]{
   	position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    border: 0;
    margin-top: 5px;
}
.opinion_page.middle .detail .detail_table .detail_border .opinion_file .button{
    width: 18%;
    height: 27px;
    text-align: center;
    border-radius: 15px;
    line-height: 27px;
    cursor: pointer;
    font-size: 13px;
    margin-top: 5px;
}
.opinion_page.middle .btn{
   	display: flex;
    margin-top: 20px;
    width: calc(78%);
}
.opinion_page.middle .btn div{
   	width: calc(100% / 3 - 10px);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
    height: 34px;
    font-size: 13px;
    cursor: pointer;
    border-radius: 20px;
}
.opinion_page.middle .detail .registration{
   	height: 49%;
}
.opinion_page.middle .detail .registration .title_header{
   	margin-top: 13px;
    margin-bottom: 13px;
}
.opinion_page.middle .detail .registration .title_header .header_box .title{
   	margin: 0;
    color: #696969;
    font-family: 'NanumSquare';
    font-weight: 400;
    font-size: 15px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    word-break: break-all;
}
.opinion_page.middle .detail .registration_button{
   	width: 15%;
    height: 30px;
    text-align: center;
    border-radius: 15px;
    line-height: 30px;
    cursor: pointer;
    font-size: 13px;
    margin-top: 7px;
    margin-bottom: 5px;
}
.opinion_page.middle .detail .registration .reply_header{
   	margin-top: 0;
   	margin-bottom: 13px;
}
.opinion_page.middle .detail .registration .reply_header .header_box{
   	display: flex;
    justify-content: space-between;
    margin: 0;
    align-items: center;
}
.opinion_page.middle .detail .registration .reply_header .header_box .title{
   	margin: 0;
    color: #696969;
    font-family: 'NanumSquare';
    font-weight: 400;
    font-size: 15px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    word-break: break-all;
}
.opinion_page.middle .detail .registration .reply_border{
   	text-align: center;
    border-top: 1px solid #ddd;
    height: 37px;
    position: relative;
    border-bottom: 1px solid #ddd;
    margin-bottom: 5px;
}
.opinion_page.middle .detail .registration .reply_border .rgtr_id{
   	width: 34%;
    border-right: 1px solid #ddd;
    box-sizing: border-box;
    padding: 0px 8px;
    line-height: 32px;
    position: relative;
    font-size: 13px;
    font-weight: 500;
    height: 32px;
}
.opinion_page.middle .detail .registration .reply_border .creat_de{
   	padding: 0px 8px;
    line-height: 34px;
    position: relative;
    font-size: 13px;
    font-weight: 500;
}
.opinion_page.middle .detail .registration .reply_border .reply_button{
	background: url('./image/address_btn.png') no-repeat right;
	width: 15px;
	height: 18px;
	background-size: contain;
	margin: 10px;
	cursor: pointer;
}
/*중 e*/
.reply_popup {
	display: none;
    background: #fff;
    min-width: 140px;
    padding: 10px 10px;
    border-radius: 13px;
    z-index: 10;
    position: absolute;
    box-shadow: 0px 0px 12px 4px #0000000f;
}
.reply_popup.on{
	display: block;
}

.reply_popup .button {
    display: flex;
    gap: 10px;
    height: 33px;
}
.reply_popup .button button{
    width: 100%;
    border-radius: 5px;
    font-size: 14px;
    cursor: pointer;
}
.reply_popup .button .delete_reply{
    background: #9E9E9E;
    color: white;
}
/*사용자 의견 제공 e*/

.modal .temperature_popup .information .normal {
	background: url(./image/new/temperature/child/fine.png) no-repeat;
	width: 100%;
	height: calc(100% - 200px);
	background-size: contain;
	background-position: center;
	position: absolute;
	display: flex;
	margin-top: 40px;
	left: 50%;
	transform: translate(-50%, 0%);
	z-index: 1;
}

.announcement .flow-text {
	display: flex;
	flex: 0 0 auto;
	white-space: nowrap;
	overflow: hidden;
	transition: 0.3s;
	font-size: 1.2rem;
	font-weight:bold;
}
.announcement .flow-text:hover {
	color: #000;
}
.announcement .flow-text:hover .flow-wrap {
	animation-play-state: paused;
	cursor: pointer;
}
.announcement .flow-wrap {
	animation: textLoop 20s linear infinite;
	padding-right: 10vw;
    margin-right: 0;
}

@keyframes textLoop {
    0% {
      -webkit-transform: translate3d(100%, 0, 0);
      transform: translate3d(100%, 0, 0);
    }
    100% {
      -webkit-transform: translate3d(-100%, 0, 0);
      transform: translate3d(-100%, 0, 0);
    }
}

.dulle_gil_popup .section li:nth-child(2) div:nth-child(3) {
	height: auto;
	flex-direction: column;
    border-top: 1px solid #D9D9D9;
    box-sizing: border-box;
    margin: 0 26px;
    padding-top: 12px;
}

.dulle_gil_popup .section li:nth-child(2) div:nth-child(3) > div {
	display: flex;
	flex-direction: row;    
	position: absolute;
	font-weight: bold;
}

.dulle_gil_popup .section li:nth-child(2) div:nth-child(3) > div > img {
	width: 22px;
	object-fit: cover;
}

.dulle_gil_popup .section li:nth-child(2) div:nth-child(3) > div > span {
	align-self: center;
}
.am5-layer-30 {
	display:none;
}
/* 이미지 위젯 s */
.main_topic.content-issue.middle{
    height: calc(100% - 5px) !important;
    padding: 26px 0 !important;
}
/* 이미지 위젯 e */

/* 관리자 초기화면 템플릿 s */
#tmplatTitle {
	width: 88%;
}
#setWidgetTmplat {
	height: 40px;
    width: 10%;
    text-align: center;
    border-radius: 20px;
    line-height: 40px;
    cursor: pointer;
    background: #FFC136;
    color: #fff;
}
/* 관리자 초기화면 템플릿 e */



@media  (min-width: 300px) and (max-width: 370px) {

	/*우리동네 상수도정보 s*/
	.main_topic.waterworks.big .caution .img_data {
		height: 25%;
		gap: 0;
		display: contents;
	}
	.main_topic.waterworks.big .caution .data ul > li > div {
        font-size: 13px; 
        white-space: pre;
	}
	.main_topic.waterworks.big .caution .data ul.on > li > div > div {
        font-size: 11px;
        white-space: pre-wrap;
        width: 30px;
	}
	.main_topic.waterworks.big .caution .data ul.on > li > div > div:nth-child(2) {
		white-space: nowrap;
	}
    .main_topic.waterworks.big .caution .data ul.on > li:nth-child(2) > div > div {
        font-size: 11px;
        white-space: pre-wrap;
        width: 40px !important;    
    }
    .main_topic.waterworks.big .caution .data ul.on {
        /* width: 95%; */
        gap: 5px;
    	height: 60%;
    }
    .main_topic.waterworks.big .caution .data .swiper-slide {
        gap: 5px;
    }
	/*우리동네 상수도정보 e*/
}

@media (min-width: 371px) and (max-width: 480px) {
	/*우리동네 상수도정보 s*/
    .main_topic.waterworks.big .caution .data ul > li > div {
        font-size: 13px !important;
        padding: 6px;
    }
    .main_topic.waterworks.big .caution .data ul.on > li:nth-child(2) > div > div {
        width: 49px !important;    
    }
    /*우리동네 상수도정보 e*/
}

@media screen and (min-width: 481px) and (max-width: 540px) {
    .main_topic.waterworks.big .caution .data ul > li > div {
		font-size: clamp(.8rem, 10vw, .5rem) !important;
        padding: 8px;    
    }
}
@media screen and (min-width: 541px) and (max-width: 599px) {
    .main_topic.waterworks.big .caution .data ul > li > div {
		font-size: clamp(1rem, 10vw, .5rem) !important;
        padding: 8px;    
    }
}