@charset "UTF-8";
:focus {
    outline: 3px solid #aaa;
}
 
:focus:not(:focus-visible) {
    outline: 0;
}
/* header s */
header {
	top: 30px;
	display: flex;
	/* max-width: 1430px; */
	margin: 0 100px;
	left: calc(50% - 100px);
	transform: translate(-50%, 0px);
	justify-content: center;
	border-radius: 50px;
	align-content: center;
	height: 64px;
	position: relative;
	box-shadow: none !important;
	z-index: -20;
}

header .nav-bar-one {
	display: flex;
	border-radius: 50px;
	width: 100%;
	box-shadow: none;
	height: 64px;
	justify-content: space-between;
}

header .nav-bar-one .logo {
/* 	width: 226px; */
	margin: 0;
	/* cursor: pointer; */
	display: flex;
	align-items: center;
	box-sizing: border-box;
}
header .nav-bar-one .logo a {
	border-right: 1px solid #ddd;
	padding: 0 40px;
	box-sizing: border-box;
}
/* .nav-bar-one .nav-map-btn {
	width: 140px;
} */
.nav-bar-one .nav-map-btn  {
	display:flex;
	align-items: center;
	border-radius: 50px;
	height: 64px;
	margin: 0;
}
.change-sun .nav-bar-one .nav-map-btn.on > a {
	background: #ffc136;
	color: #fff;
}
.change-cloudy .nav-bar-one .nav-map-btn.on > a {
	background: #b3d5f4;
	color: #fff;
}
.change-rain .nav-bar-one .nav-map-btn.on > a {
	background: #cacafe;
	color: #fff;
}
.change-snow .nav-bar-one .nav-map-btn.on > a {
	background: #94dfe6;
	color: #fff;
}
.nav-bar-one .nav-map-btn > a {
	display:flex;
	align-items: center;
	background: #F9F9F9;
	border-radius: 50px;
	margin: 0 8px 0 0;
	padding: 0 5px;
}
.nav-bar-one .nav-map-btn.on .left_txt.c1 {
	color: #fff !important;
}
.nav-bar-one .nav-map-btn .left_txt {
	margin: 0 10px 0 0px;
}
.nav-bar-one .nav-map-btn .icon-00 {
	margin: 0;
}
.weather {
	width: 50px;
	height: 50px;
	margin: 0;
}
header .nav-bar-one .logo .logo-box {
    /* height: 62px; */
    display: flex;
    justify-content: center;
}


header .nav-bar-one .logo .logo-box .logo-text {
    transition: .3s;
    /* height: 64px; */
    font-size: 20px;
    margin: 0;
    /* line-height: 64px; */
    text-align: center;
    font-family: "Pretendard GOV";
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    color:#707070;
}

header .nav-bar-one .logo .logo-box strong {
    font-size: 20px;
    margin: 0;
}
.change-sun header .nav-bar-one .logo .logo-box strong {
	color:#E7AF22;
}
.change-cloudy header .nav-bar-one>.logo .logo-box strong {
	color:#8FC8FF;
}
.change-rain header .nav-bar-one .logo .logo-box strong {
	color:#7B82C8;
}
.change-snow header .nav-bar-one .logo .logo-box strong {
	color:#03C4C4;
}


header .nav-bar-one .information {
/* 	right: 0; */
	right: -77px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}

header .nav-bar-one .information .mypage {
	cursor: pointer;
	font-weight: 600;
	text-decoration: underline;
}
/* header e */

/* navigation-bar s */
.left-memu {
	display: flex;
	gap: clamp(10px, 1.5vw, 30px);
	/* margin-right: clamp(10px, 1.5vw, 30px); */
	margin: 0;
	flex-direction: column;
}
.nav-map-btn.on p {
	color: #2C2C2C;
	font-weight: 800;
	transition: .2s;
}
.navigation-bar {
	display: flex;
	justify-content: center;
	position: fixed;
	/* transform: translateX(-50%); */
	margin: 0;
	width: 80px;
	left: 0;
	right: 0;
	height: auto;
	z-index: -20;
	height: 100%;
	top: 0;
	/* border-radius: 0 20px 20px 0; */
	align-items: center;
}
.navigation-bar .weather_img {
	background: url(./image/weather/weather_icon-01.png) no-repeat;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 80%;
	background-position: center;
	position: absolute;
	top: 20px;
	left: 16px;
	/* display: none; */
}
/* .navigation-bar.on {
	width: 200px;
} */
.navigation-bar .nav-bor-two {
	transition: .3s;
	margin: 0;
	width: 80px;
	display: flex;
	position: absolute;
	left: 0;
	border-radius: 0 30px 30px 0;
	/* height: calc(100%  - 120px); */
	/* justify-content: center; */
	flex-direction: column;
	align-items: center;
	gap: 15px;
}
.navigation-bar .nav-bor-two .map-btn {
	display: none;
}
.navigation-bar.on .nav-bor-two {
	width: 100%;
}
.nav-map-btn {
	position: initial;
	/* transition: .3s; */
/* 	width: 50px; */
	margin: 0;
}

.navigation-bar .nav-bor-two>ul {
	transition: .3s;
	display: flex;
	margin: 0;
	position: relative;
	gap: clamp(10px, 1.5vw, 30px);
	/* justify-content: center; */
}


.tablet-map-btn {
	display: none !important;
}

.tablet-nav-all {
	display: none;
}

.nav-map-btn .icon-00, .nav-map-btn .icon-10 {
	border-radius: 41px;

	height: 50px;
	cursor: pointer;
	box-sizing: border-box;

}

/*.change-cloudy .nav-map-btn .icon-00:hover {
	background: #fff url(./image/map-open-blue.png) 50%/clamp(1.75rem, 2.5vw, 2.35rem)
		no-repeat;
	border: 2px solid #fff;
}*/

.change-cloudy .nav-map-btn.on .icon-00 {
	background: #b3d5f4 url(./image/map-open.png) no-repeat;
	border: 2px solid #b3d5f4;
	border-radius: 100px;
	height: 50px;
	width: 50px;
	background-size: 50%;
	background-position: center;
}

/*.change-sun .nav-map-btn .icon-00:hover {
	background: #fff url(./image/map-open-orange.png) 50%/clamp(1.75rem, 2.5vw, 2.35rem)
		no-repeat;
	border: 2px solid #fff;
}*/

.change-sun .nav-map-btn.on .icon-00 {
	background: #ffc136 url(./image/map-open.png) no-repeat;
	border-radius: 100px;
	height: 50px;
	width: 50px;
	background-size: 50%;
	background-position: center;
}

/*.change-rain .nav-map-btn>.icon-00:hover {
	background: #fff url(./image/map-open-purple.png) 50%/clamp(1.75rem, 2.5vw, 2.35rem)
		no-repeat;
	border: 2px solid #fff;
}*/

.change-rain  .nav-map-btn.on .icon-00 {
	background: #cacafe url(./image/map-open.png) no-repeat;
	/* border: 2px solid #fff; */
	border-radius: 100px;
	height: 50px;
	width: 50px;
	background-size: 50%;
	background-position: center;
}

/*.change-snow .nav-map-btn .icon-00:hover {
	background: #fff url(./image/map-open-mint.png) 50%/clamp(1.75rem, 2.5vw, 2.35rem)
		no-repeat;
	border: 2px solid #fff;
}*/

.change-snow  .nav-map-btn.on .icon-00 {
	background: #94dfe6 url(./image/map-open.png) no-repeat;
	/* border: 2px solid #0bc6c6; */
	border-radius: 100px;
	height: 50px;
	width: 50px;
	background-size: 50%;
	background-position: center;
}

/*.change-sun .nav-map-btn .icon-10:hover*/
.change-sun .nav-map-btn.on .icon-10
	{
	background: #fff url(./image/admin-manager.png) 50%/clamp(1.75rem, 2.5vw, 2.35rem)
		no-repeat;
	border: 2px solid #fff;
}

.change-sun .nav-map-btn .icon-10 {
	background: url(./image/admin-manager.png) no-repeat;
	/* border: 2px solid #ffd576; */
	background-position: center;
	background-size: contain;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 60%;
	background-position: center;
}

/*.change-cloudy .nav-map-btn .icon-10:hover*/
.change-cloudy .nav-map-btn.on .icon-10
	{
	background: #fff url(./image/admin-manager-02.png) 50%/clamp(1.75rem, 2.5vw, 2.35rem)
		no-repeat;
	border: 2px solid #fff;
}

.change-cloudy .nav-map-btn .icon-10 {
	background: url(./image/admin-manager-02.png) no-repeat;
	/* border: 2px solid #B3D5F4; */
	background-position: center;
	background-size: contain;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 60%;
	background-position: center;
}

/* .change-rain .nav-map-btn .icon-10:hover,  */
.change-rain .nav-map-btn.on .icon-10
	{
	background: #fff url(./image/admin-manager-03.png) 50%/clamp(1.75rem, 2.5vw, 2.35rem)
		no-repeat;
	border: 2px solid #fff;
}

.change-rain .nav-map-btn .icon-10 {
	background: url(./image/admin-manager-03.png) no-repeat;
	/* border: 2px solid #cecefc; */
	/* border: 2px solid #B3D5F4; */
	background-position: center;
	background-size: contain;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 60%;
	background-position: center;
}

/*.change-snow .nav-map-btn .icon-10:hover*/
.change-snow .nav-map-btn.on .icon-10
	{
	background: #fff url(./image/admin-manager-04.png) 50%/clamp(1.75rem, 2.5vw, 2.35rem)
		no-repeat;
	border: 2px solid #fff;
		
}

.change-snow .nav-map-btn .icon-10 {
	background: url(./image/admin-manager-04.png) no-repeat;
	/* border: 2px solid #6cced7; */
	background-position: center;
	background-size: contain;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 60%;
	background-position: center;
}

.map-service-popup {
	display: none;
}
.nav-bar-one  .map-service-popup {top: 90px !important;right: 0 !important;left: inherit !important;}
.map-service-popup.on {
	display: block;
	width: 384px;
	background: #fff;
	border-radius: 40px;
	cursor: auto;
	box-shadow: 0 4px 18px #7a7a7a47;
	box-sizing: border-box;
	position: absolute !important;
	opacity: 1;
	/* top: 0; */
	/* left: -100px; */
	z-index: 9999999999;
	/* transform: translateX(50%); */
	top: calc(50% - -12px);
	right: 240px;
	/* height: 550px; */
}

.map-service-popup .nav-service-map ul {
	display: flex;
	border-bottom: 1px solid #EEEEEE;
}

.map-service-popup .nav-service-map ul li {
	height: 50px;
	display: flex;
	font-size: 14px;
	align-items: center;
	cursor: pointer;
	transition: .3s;
	font-weight: 400;
}

.map-service-popup .nav-service-map {
	position: relative;
}

.change-cloudy .map-service-popup>.nav-service-map ul li.on {
	transition: .3s;
	border-bottom: 3px solid #70B6F4;
}
.change-cloudy .map-service-popup>.nav-service-map ul li.on a {
	color: #70B6F4;
}
.change-sun .map-service-popup>.nav-service-map ul li.on {
	transition: .3s;
	border-bottom: 3px solid #FFC136;
}
.change-sun .map-service-popup>.nav-service-map ul li.on a {
	color: #fbae04;
}
.change-rain .map-service-popup>.nav-service-map ul li.on {
	transition: .3s;
	border-bottom: 3px solid #CACAFE;
}
.change-rain .map-service-popup>.nav-service-map ul li.on a {
	color: #9b9bf7;
}
.change-snow .map-service-popup>.nav-service-map ul li.on {
	transition: .3s;
	border-bottom: 3px solid #94DFE6;
}
.change-snow .map-service-popup>.nav-service-map ul li.on a {
	color: #62c4ce;
} 
.content.on {
	display: block;
	opacity: 1;
	transition: .3s;
}

.content {
	opacity: 0;
	transition: .3s;
	z-index: -1;
	display: none;
}

.content>.map-box-open {
	display: flex;
	flex-direction: column;
	padding: 0 20px;
	margin: 32px 0 0 0;
}

.content>.map-box-open>p {
	font-size: 15px;
	margin: 0;
	font-weight: 500;
}

.content>.map-box-open>.map-service {
	font-size: 14px;
	margin: 20px 0 36px 0;
	height: 178px;
	width: 100%;
	position: relative;
 	/* cursor: pointer; */
	border-radius: 16px;
}
.content>.map-box-open>.map-service.img-01 {
	background: url('./image/main/bg_map_01.png') 50% 57%/190% no-repeat;
}
.content>.map-box-open>.map-service.img-02 {
	background: url('./image/main/bg_map_02.png') 50% 50%/150% no-repeat;
}
.content>.map-box-open>.map-service.img-03 {
	background: url('./image/main/bg_map_03.png') 50% 56%/160% no-repeat;
}
.content>.map-box-open>.map-service.img-04 {
	background: url('./image/main/bg_map_04.png') 50% 50%/180% no-repeat;
}

.content>.map-box-open>.map-service>p {
	position: absolute;
	top: 18px;
	left: 9px;
	padding: 6px 14px;
	border-radius: 7px;
	text-transform: uppercase;
	color: #fff;
}

.change-cloudy .content>.map-box-open>.map-service>p {
	background: #9BCCF8;
}

.change-sun .content>.map-box-open>.map-service>p {
	background: #FFC136;
}

.change-rain .content>.map-box-open>.map-service>p {
	background: #CACAFE;
}

.change-snow .content>.map-box-open>.map-service>p {
	background: #94DFE6;
}

.content>.map-box-text {
	display: flex;
	flex-direction: column;
	padding: 28px 20px 28px;
	border-top: 1px solid #EEEEEE;
}

.content>.map-box-text>p {
	font-size: 15px;
	font-weight: 500;
	margin: 0;
}

.content>.map-box-text>.map-box-text-group {
	font-size: 14px;
	margin: 20px 0 0 0;
}

.content>.map-box-text>.map-box-text-group>ul {
	width: 100%;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	gap: 16px;
}

.content>.map-box-text>.map-box-text-group>ul>li {
	text-align: left;
	margin: 0;
	cursor: pointer;
	color: #8C8C8C;
	transition: .3s;
}

.change-cloudy .content>.map-box-text>.map-box-text-group>ul>li:hover {
	color: #70B6F4;
}

.change-sun .content>.map-box-text>.map-box-text-group>ul>li:hover {
	color: #fbae04;
}

.change-rain .content>.map-box-text>.map-box-text-group>ul>li:hover {
	color: #9b9bf7;
}

.change-snow .content>.map-box-text>.map-box-text-group>ul>li:hover {
	color: #62c4ce;
}

.map-service-more {
	padding: 10px 0 10px;
	border-top: 1px solid #EEEEEE;
}

.map-service-more>button {
	width: 100%;
	background: inherit;
	cursor: pointer;
	color: #B4B4B4;
	height: 46px;
}

.change-sun .nav-map-btn .icon-00 {
	background: url(./image/map-open-orange.png) no-repeat;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 50%;
	background-position: center;
}

.change-cloudy .nav-map-btn .icon-00 {
	background: url(./image/map-open-blue.png)no-repeat;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 50%;
	background-position: center;
}

.change-rain .nav-map-btn .icon-00 {
	background: url(./image/map-open-purple.png) no-repeat;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 50%;
	background-position: center;
}

.change-snow .nav-map-btn .icon-00 {
	background: url(./image/map-open-mint.png) no-repeat;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 50%;
	background-position: center;
}

.nav-map-btn p {
	margin-top: 9px;
	font-weight: 500;
	color: #707070;
	font-size: 13px;
	transition: .2s;
	text-align: center;
}

.navigation-bar .nav-bor-two.mb-size-nav {
	display: none;
}

.navigation-bar .nav-bor-two div {
	cursor: pointer;
	/* display: flex; */
	align-items: center;
	flex-direction: column;
	/* transition: .4s; */
	position: relative;
	/* width: 100%; */
	/* height: 100%; */
	/* overflow: auto; */
}
.btn-push a {
	/* position: relative; */
}
.btn-push a:hover .left_txt {
	display: block;
}
.navigation-bar.on .nav-bor-two .btn-push  {
	display: flex;
	flex-direction: row;
	width: 100%;
	padding: 0 15px;
	box-sizing: border-box;
}
.navigation-bar.on .nav-bor-two .btn-push a {
	display: flex;
	align-items: center;
	margin: 0;
	gap: 10px;
}
.navigation-bar .nav-bor-two div.on p {
	color: #2C2C2C;
	font-weight: 800;
	transition: .2s;
}

.navigation-bar .nav-bor-two div .allicon, .navigation-bar .nav-bor-two div:hover .allicon
	{
	border-radius: 41px;
	transition: ease-in-out .2s;
	height: 32px;
	cursor: pointer;
	width: 70px;
	box-sizing: border-box;
	margin: 0;
}

/* icon - 01 */
.change-cloudy .navigation-bar .nav-bor-two div .icon-01 {
	background: url(./image/plus-blue.png) no-repeat;
	/* border: 2px solid #ffffff69; */
	background-position: center;
	background-size: 70%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	/* background-size: 50%; */
	background-position: center;
}

.change-sun .navigation-bar .nav-bor-two div .icon-01 {
	background: url('./image/plus-orange.png') no-repeat;
	background-position: center;
	background-size: 70%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	/* background-size: 50%; */
	background-position: center;
}

.change-rain .navigation-bar .nav-bor-two div .icon-01 {
	background: url('./image/plus-purple.png') no-repeat;
	background-position: center;
	background-size: 70%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	/* background-size: 50%; */
	background-position: center;
}

.change-snow .navigation-bar .nav-bor-two div .icon-01 {
	background: url('./image/plus-mint.png') no-repeat;
	background-position: center;
	background-size: 70%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	/* background-size: 50%; */
	background-position: center;
}

/*.change-cloudy .navigation-bar .nav-bor-two div:hover .icon-01 {
	background: #B3D5F4 url('./image/plus-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-sun .navigation-bar .nav-bor-two div:hover .icon-01 {
	background: #FFC136 url('./image/plus-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-rain .navigation-bar .nav-bor-two div:hover .icon-01 {
	background: #CACAFE url('./image/plus-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-snow .navigation-bar .nav-bor-two div:hover .icon-01 {
	background: #94DFE6 url('./image/plus-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

.change-cloudy .navigation-bar .nav-bor-two div.on .icon-01 {
	background: #b3d5f4 url(./image/plus-active.png) no-repeat;
	/* border: 1.5px solid #B3D5F4; */
	/* box-shadow: inset 0 5px 9px #B3D5F436; */
	border-radius: 50px;
	background-size: 70%;
	background-position: center;
}

.change-sun .navigation-bar .nav-bor-two div.on .icon-01 {
	background: #FFC136 url(./image/plus-active.png) no-repeat;
    border-radius: 50px;
	background-size: 70%;
	background-position: center;
}

.change-rain .navigation-bar .nav-bor-two div.on .icon-01 {
	background: #CACAFE url(./image/plus-active.png) no-repeat;
    border-radius: 50px;
	background-size: 70%;
	background-position: center;
}

.change-snow .navigation-bar .nav-bor-two div.on .icon-01 {
	background: #94dfe6 url(./image/plus-active.png) no-repeat;
	border-radius: 50px;
	background-size: 70%;
	background-position: center;
}

/* icon - 02 */
.change-cloudy .navigation-bar .nav-bor-two div .icon-02 {
	background: url('./image/move-blue.png')no-repeat;
	/* border: 2px solid #ffffff69; */
	background-position: center;
	background-size: 55%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 65%;
	background-position: center;
}

.change-sun .navigation-bar .nav-bor-two div .icon-02 {
	background: url('./image/move-orange.png') no-repeat;
	background-position: center;
	background-size: 55%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 65%;
	background-position: center;
}

.change-rain .navigation-bar .nav-bor-two div .icon-02 {
	background: url('./image/move-purple.png') no-repeat;
	background-position: center;
	background-size: 55%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 65%;
	background-position: center;
}

.change-snow .navigation-bar .nav-bor-two div .icon-02 {
	background: url('./image/move-mint.png') no-repeat;
	background-position: center;
	background-size: 55%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 65%;
	background-position: center;
}

/*.change-cloudy .navigation-bar .nav-bor-two div:hover .icon-02 {
	background: #B3D5F4 url('./image/move-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-sun .navigation-bar .nav-bor-two div:hover .icon-02 {
	background: #FFC136 url('./image/move-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-rain .navigation-bar .nav-bor-two div:hover .icon-02 {
	background: #CACAFE url('./image/move-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-snow .navigation-bar .nav-bor-two div:hover .icon-02 {
	background: #94DFE6 url('./image/move-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/


.change-cloudy .navigation-bar .nav-bor-two div .icon-20 {
	background: url('./image/Trash-cloudy.png')no-repeat;
	/* border: 2px solid #ffffff69; */
	background-position: center;
	background-size: 55%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 65%;
	background-position: center;
}

.change-sun .navigation-bar .nav-bor-two div .icon-20 {
	background: url('./image/Trash-sun.png') no-repeat;
	background-position: center;
	background-size: 55%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 65%;
	background-position: center;
}

.change-rain .navigation-bar .nav-bor-two div .icon-20 {
	background: url('./image/Trash-rain.png') no-repeat;
	background-position: center;
	background-size: 55%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 65%;
	background-position: center;
}

.change-snow .navigation-bar .nav-bor-two div .icon-20 {
	background: url('./image/Trash-snow.png') no-repeat;
	background-position: center;
	background-size: 55%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 65%;
	background-position: center;
}


.change-cloudy .navigation-bar .nav-bor-two div.on .icon-02 {
	background: #b3d5f4 url(./image/move-active.png) no-repeat;
	/* border: 1.5px solid #B3D5F4; */
	/* box-shadow: inset 0 5px 9px #B3D5F436; */
	background-size: 65%;
	background-position: center;
	border-radius: 50px;
}

.change-sun .navigation-bar .nav-bor-two div.on .icon-02 {
	background: #ffc136 url(./image/move-active.png) no-repeat;
   background-size: 65%;
	background-position: center;
	border-radius: 50px;
}

.change-rain .navigation-bar .nav-bor-two div.on .icon-02 {
	background: #cacafe url(./image/move-active.png) no-repeat;
     background-size: 65%;
	background-position: center;
	border-radius: 50px;
}

.change-snow .navigation-bar .nav-bor-two div.on .icon-02 {
	background: #94DFE6 url(./image/move-active.png) no-repeat;
    background-size: 65%;
	background-position: center;
	border-radius: 50px;
}

/* icon - 03*/
.change-cloudy .navigation-bar .nav-bor-two div .icon-03 {
	background: url('./image/map-blue.png') no-repeat;
	/* border: 2px solid #ffffff69; */
	background-position: center;
	background-size: 50%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 65%;
	background-position: center;
}

.change-sun .navigation-bar .nav-bor-two div .icon-03 {
	background: url('./image/map-orange.png') no-repeat;
	background-position: center;
	background-size: 50%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 65%;
	background-position: center;
}

.change-rain .navigation-bar .nav-bor-two div .icon-03 {
	background: url('./image/map-purple.png') no-repeat;
	background-position: center;
	background-size: 50%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 65%;
	background-position: center;
}

.change-snow .navigation-bar .nav-bor-two div .icon-03 {
	background: url('./image/map-mint.png') no-repeat;
	background-position: center;
	background-size: 50%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 65%;
	background-position: center;
}

/*.change-cloudy .navigation-bar .nav-bor-two div:hover .icon-03 {
	background: #B3D5F4 url('./image/map-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-sun .navigation-bar .nav-bor-two div:hover .icon-03 {
	background: #FFC136 url('./image/map-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-rain .navigation-bar .nav-bor-two div:hover .icon-03 {
	background: #CACAFE url('./image/map-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-snow .navigation-bar .nav-bor-two div:hover .icon-03 {
	background: #94DFE6 url('./image/map-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

.change-cloudy .navigation-bar .nav-bor-two div.on .icon-03 {
	background: #b3d5f4 url(./image/map-active.png) no-repeat;
	/* border: 1.5px solid #B3D5F4; */
	/* box-shadow: inset 0 5px 9px #B3D5F436; */
	background-size: 65%;
	background-position: center;
	border-radius: 50px;
}

.change-sun .navigation-bar .nav-bor-two div.on .icon-03 {
	background: #ffc136 url('./image/map-active.png') no-repeat;
	background-size: 65%;
	background-position: center;
	border-radius: 50px;
}

.change-rain .navigation-bar .nav-bor-two div.on .icon-03 {
	    background: #cacafe url(./image/map-active.png) no-repeat;
    background-size: 65%;
	background-position: center;
	border-radius: 50px;
}

.change-snow .navigation-bar .nav-bor-two div.on .icon-03 {
	background: #94dfe6 url('./image/map-active.png')	no-repeat;
	background-size: 65%;
	background-position: center;
	border-radius: 50px;
}

/* icon - 04*/
.change-cloudy .navigation-bar .nav-bor-two div .icon-04 {
	background: url('./image/reset-blue.png') no-repeat;
	/* border: 2px solid #ffffff69; */
	background-position: center;
	background-size: 54%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 65%;
	background-position: center;
}

.change-sun .navigation-bar .nav-bor-two div .icon-04 {
	background: url('./image/reset-orange.png') no-repeat;
	background-position: center;
	background-size: 54%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 65%;
	background-position: center;
}

.change-rain .navigation-bar .nav-bor-two div .icon-04 {
	background: url('./image/reset-purple.png') no-repeat;
	background-position: center;
	background-size: 54%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 65%;
	background-position: center;
}

.change-snow .navigation-bar .nav-bor-two div .icon-04 {
	background: url('./image/reset-mint.png') no-repeat;
	background-position: center;
	background-size: 54%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 65%;
	background-position: center;
}

/*.change-cloudy .navigation-bar .nav-bor-two div:hover .icon-04 {
	background: #B3D5F4 url('./image/reset-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-sun .navigation-bar .nav-bor-two div:hover .icon-04 {
	background: #FFC136 url('./image/reset-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-rain .navigation-bar .nav-bor-two div:hover .icon-04 {
	background: #CACAFE url('./image/reset-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-snow .navigation-bar .nav-bor-two div:hover .icon-04 {
	background: #94DFE6 url('./image/reset-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/* icon - 05*/
.change-cloudy .navigation-bar .nav-bor-two div .icon-05 {
	background: url('./image/save.png') no-repeat;
	/* border: 2px solid #ffffff69; */
	background-position: center;
	background-size: 50%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 60%;
	background-position: center;
}

.change-sun .navigation-bar .nav-bor-two div .icon-05 {
	background: url('./image/save-orange.png') no-repeat;
	/* border: 2px solid #ffffff69; */
	background-position: center;
	background-size: 50%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 60%;
	background-position: center;
}

.change-rain .navigation-bar .nav-bor-two div .icon-05 {
	background: url('./image/save-purple.png') no-repeat;
	/* border: 2px solid #ffffff69; */
	background-position: center;
	background-size: 50%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 60%;
	background-position: center;
}

.change-snow .navigation-bar .nav-bor-two div .icon-05 {
	background: url('./image/save-mint.png') no-repeat;
	/* border: 2px solid #ffffff69; */
	background-position: center;
	background-size: 50%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 60%;
	background-position: center;
}

/*.change-cloudy .navigation-bar .nav-bor-two div:hover .icon-05 {
	background: #B3D5F4 url('./image/save-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-sun .navigation-bar .nav-bor-two div:hover .icon-05 {
	background: #FFC136 url('./image/save-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-rain .navigation-bar .nav-bor-two div:hover .icon-05 {
	background: #CACAFE url('./image/save-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-snow .navigation-bar .nav-bor-two div:hover .icon-05 {
	background: #94DFE6 url('./image/save-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/* icon - 06*/
.change-cloudy .navigation-bar .nav-bor-two div .icon-06 {
	background: url('./image/align-blue.png') no-repeat;
	/* border: 2px solid #ffffff69; */
	background-position: center;
	background-size: 50%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 60%;
	background-position: center;
}

.change-sun .navigation-bar .nav-bor-two div .icon-06 {
	background: url('./image/align-orange.png') no-repeat;
	/* border: 2px solid #ffffff69; */
	background-position: center;
	background-size: 50%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 60%;
	background-position: center;
}

.change-rain .navigation-bar .nav-bor-two div .icon-06 {
	background: url('./image/align-purple.png') no-repeat;
	/* border: 2px solid #ffffff69; */
	background-position: center;
	background-size: 50%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 60%;
	background-position: center;
}

.change-snow .navigation-bar .nav-bor-two div .icon-06 {
	background: url('./image/align-mint.png') no-repeat;
	/* border: 2px solid #ffffff69; */
	background-position: center;
	background-size: 50%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 60%;
	background-position: center;
}

/*.change-cloudy .navigation-bar .nav-bor-two div:hover .icon-06 {
	background: #B3D5F4 url('./image/align-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-sun .navigation-bar .nav-bor-two div:hover .icon-06 {
	background: #FFC136 url('./image/align-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-rain .navigation-bar .nav-bor-two div:hover .icon-06 {
	background: #CACAFE url('./image/align-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-snow .navigation-bar .nav-bor-two div:hover .icon-06 {
	background: #94DFE6 url('./image/align-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/* icon - 07*/
.change-cloudy .navigation-bar .nav-bor-two div .icon-07 {
	background: url('./image/help-blue.png') no-repeat;
	/* border: 2px solid #ffffff69; */
	background-position: center;
	background-size: 50%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 60%;
	background-position: center;
}

.change-sun .navigation-bar .nav-bor-two div .icon-07 {
	background: url('./image/help-orange.png') no-repeat;
	/* border: 2px solid #ffffff69; */
	background-position: center;
	background-size: 50%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 60%;
	background-position: center;
}

.change-rain .navigation-bar .nav-bor-two div .icon-07 {
	background: url('./image/help-purple.png') no-repeat;
	/* border: 2px solid #ffffff69; */
	background-position: center;
	background-size: 50%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 60%;
	background-position: center;
}

.change-snow .navigation-bar .nav-bor-two div .icon-07 {
	background: url('./image/help-mint.png') no-repeat;
	/* border: 2px solid #ffffff69; */
	background-position: center;
	background-size: 50%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 60%;
	background-position: center;
}

/*.change-cloudy .navigation-bar .nav-bor-two div:hover .icon-07 {
	background: #B3D5F4 url('./image/help-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-sun .navigation-bar .nav-bor-two div:hover .icon-07 {
	background: #FFC136 url('./image/help-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-rain .navigation-bar .nav-bor-two div:hover .icon-07 {
	background: #CACAFE url('./image/help-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-snow .navigation-bar .nav-bor-two div:hover .icon-07 {
	background: #94DFE6 url('./image/help-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

.change-cloudy .navigation-bar .nav-bor-two div.on .icon-07 {
	background: #B3D5F4 url('./image/help-active.png') no-repeat;
	border-radius: 50px;
	background-size: 60%;
	background-position: center;
}

.change-sun .navigation-bar .nav-bor-two div.on .icon-07 {
	background: #FFC136 url('./image/help-active.png') no-repeat;
	border-radius: 50px;
	background-size: 60%;
	background-position: center;
}

.change-rain .navigation-bar .nav-bor-two div.on .icon-07 {
	background: #CACAFE url('./image/help-active.png') no-repeat;
	border-radius: 50px;
	background-size: 60%;
	background-position: center;
}

.change-snow .navigation-bar .nav-bor-two div.on .icon-07 {
	background: #94DFE6 url('./image/help-active.png') no-repeat;
	border-radius: 50px;
	background-size: 60%;
	background-position: center;
}

.navigation-bar .nav-bor-two div p {
	margin-top: 9px;
	font-weight: 500;
	color: #707070;
	font-size: 13px;
	transition: .2s;
	text-align: center;
}


/* icon - 08 */
.change-cloudy .navigation-bar .nav-bor-two div .icon-08 {
	background: url('./image/template_blue.png')no-repeat;
	/* border: 2px solid #ffffff69; */
	background-position: center;
	background-size: 55%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 65%;
	background-position: center;
}

.change-sun .navigation-bar .nav-bor-two div .icon-08 {
	background: url('./image/template_orange.png') no-repeat;
	background-position: center;
	background-size: 55%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 65%;
	background-position: center;
}

.change-rain .navigation-bar .nav-bor-two div .icon-08 {
	background: url('./image/template_purple.png') no-repeat;
	background-position: center;
	background-size: 55%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 65%;
	background-position: center;
}

.change-snow .navigation-bar .nav-bor-two div .icon-08 {
	background: url('./image/template_mint.png') no-repeat;
	background-position: center;
	background-size: 55%;
	border-radius: 0;
	height: 50px;
	width: 50px;
	background-size: 65%;
	background-position: center;
}

/*.change-cloudy .navigation-bar .nav-bor-two div:hover .icon-08 {
	background: #B3D5F4 url('./image/move-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-sun .navigation-bar .nav-bor-two div:hover .icon-08 {
	background: #FFC136 url('./image/move-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-rain .navigation-bar .nav-bor-two div:hover .icon-08 {
	background: #CACAFE url('./image/move-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

/*.change-snow .navigation-bar .nav-bor-two div:hover .icon-08 {
	background: #94DFE6 url('./image/move-active.png') 50%/clamp(1.8rem, 2.5vw, 2.3rem)
		no-repeat;
	border: 2px solid #ffffff69;
}*/

.change-cloudy .navigation-bar .nav-bor-two div.on .icon-08 {
	background: #b3d5f4 url(./image/template_active.png) no-repeat;
	/* border: 1.5px solid #B3D5F4; */
	/* box-shadow: inset 0 5px 9px #B3D5F436; */
	background-size: 65%;
	background-position: center;
	border-radius: 50px;
}

.change-sun .navigation-bar .nav-bor-two div.on .icon-08 {
	background: #ffc136 url(./image/template_active.png) no-repeat;
   background-size: 65%;
	background-position: center;
	border-radius: 50px;
}

.change-rain .navigation-bar .nav-bor-two div.on .icon-08 {
	background: #cacafe url(./image/template_active.png) no-repeat;
     background-size: 65%;
	background-position: center;
	border-radius: 50px;
}

.change-snow .navigation-bar .nav-bor-two div.on .icon-08 {
	background: #94DFE6 url(./image/template_active.png) no-repeat;
    background-size: 65%;
	background-position: center;
	border-radius: 50px;
}
/* navigation-bar e */

/* 위젯 추가 팝업 s */
.load-popup {
	padding: 15px;
    background-color: #fff;
    position: fixed;
    transform: translate(-50%, -50%);
    top: 50%;
    z-index: 9999;
    left: 50%;
    box-shadow: 0 3px 6px #00000021;
    display: none;
    align-items: center;
    gap: 20px;
    border-radius: 50px;
    font-weight: 600;
}
.load-popup.on {
    display: flex;
}
.load-popup .close {
    right: 0;
    top: 0;
    width: 32px;
    height: 32px;
    position: relative;
}
.load-popup .close::before {
	top:26%;
}
.load-popup .close::after {
	top:26%;
}
/* 위젯 추가 팝업 e */

/* grid s */
/* grid [공통] - body */
.grid>.grid-box-item {
	width: 100%;
}
/* grid [공통] - header */
.header {
	width: 100%;
	height: 68px;
	z-index: 999;
	margin-bottom: 20px;
	position: relative;
}

.header>.title {
	margin: 0;
	padding: 9px 20px;
	background-color: #707070;
	border-radius: 20px;
	color: #fff;
	font-size: 18px;
	top: 22px;
	font-weight: 600;
	line-height: 1.4;
	position: absolute;
	left: 22px;
	cursor: pointer;
}
.header>.title>a {
	color: #fff;
}

.header>.drag-box {
	height: 100%;
	width: calc(100% - 68px);
	margin: 0;
	/* padding: 22px 0 0 22px; */
	cursor: pointer;
	display: flex;
	box-sizing: border-box;
	align-items: center;
}

.header>.drag-box>p.gray {
	color: #707070;
	background-color: #E9EBEE;
	width: 124px;
	display: flex;
	padding: 0 13px;
	justify-content: center;
}

.header>.drag-box>p>.news-img {
	background: url('./image/news-icon-box.png') 50%/30px no-repeat;
	height: 40px;
	width: 30px;
	display: block;
	margin: 0;
}

.header>.drag-box>.title {
	margin: 0;
	padding: 0 11px;
	height: 42px;
	box-sizing: border-box;
	background-color: #707070;
	border-radius: 20px;
	color: #fff;
	font-size: clamp(.9rem, 1vw, 1rem);
	font-weight: 500;
	line-height: 42px;
	/* position: absolute; */
	/* min-width: 130px; */
}

.header>.drag-box>.title-yellow {
	margin: 0;
	padding: 0 20px;
	background-color: #fff;
	border-radius: 20px;
	color: #FFC136;
	font-size: clamp(.9rem, 1vw, 1rem);
	top: 22px;
	font-weight: 600;
	line-height: 42px;
	position: absolute;
	left: 22px;
	box-sizing: border-box;
	height: 42px;
}

.header>.drag-box>.title-blue {
	margin: 0;
	padding: 0 20px 0 20px;
	border-radius: 20px;
	color: #5E778F;
	font-size: 18px;
	top: 22px;
	font-weight: 600;
	line-height: 1.6;
	position: absolute;
	left: 22px;
}

/* 오늘의 날씨 부분 s */
.grid>.grid-box-item>.grid-item-content::after {
	dispaly: block;
	content: '';
	clear: both;
}

.grid>.grid-box-item>.grid-item-content>.content-01, .grid>.grid-box-item>.grid-item-content>.content-02,
	.grid>.grid-box-item>.grid-item-content>.content-03, .grid>.grid-box-item>.grid-item-content>.content-04,
	.grid>.grid-box-item>.grid-item-content>.content-07 {
	position: relative;
	border-radius: 40px;
	background-color: #fff;
	min-height: 356px;
	height: 356px;
	min-width: 510px;
	backdrop-filter: brightness(116%) blur(80px);
	width: 100%;
	background-color: #ffffff00;
}
/* height값 조정 */
.grid>.grid-box-item>.grid-item-content>.content-05-h-100 {
	position: relative;
	border-radius: 40px;
	background-color: #FFC136;
	height: 169px;
	min-width: 510px;
	width: 100%;
}

.grid>.grid-box-item>.grid-item-content>.content-06-h-100 {
	position: relative;
	height: 100%;
	border-radius: 40px;
	height: 169px;
	background: linear-gradient(#FFF, 65%, #E3F2FF);
	min-width: 510px;
	width: 100%;
}

.grid>.grid-box-item>.grid-item-content>.content-08-h-700 {
	position: relative;
	border-radius: 40px;
	background-color: #fff;
	height: 731px;
	min-height: 731px;
	min-width: 355px;
	backdrop-filter: brightness(116%) blur(80px);
	width: 100%;
	background-color: #ffffff00;
}

.content-01 {
	height: 100%;
	height: calc(100% - 88px);
	padding-bottom: 22px;
	box-sizing: border-box;
}

.content-01>.box-01 {
	height: calc(100% - 88px);
	padding-bottom: 22px;
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	padding: 0;
	display: flex;
	flex-direction: column;
}

.content-01>.box-01::after {
	dispaly: block;
	content: '';
	clear: both;
}

.content-01>.box-01>.box-left {
	width: 100%;
	height: 50%;
	/* min-width: 204px; */
	/* width: 100%; */
	/* padding: 0 22px 0 22px; */
	box-sizing: border-box;
}

.content-01>.box-01>.box-left>.left {
	/* width: 50%; */
	height: 100%;
	/* min-width: 200px; */
	/* max-height: 200px; */
	/* padding: 0 22px; */
	display: flex;
}
.content-01.middle>.box-01>.box-left>.left {

display: flex;

flex-direction: row-reverse;
}
.content-01.middle .temperature {
	margin: 0;
	/* text-align: left; */
	font-size: 50px;
}
.content-01.middle .box-01 .box-left .left .title .highest_lowest {
	flex-direction: column;
	margin-top: 15px;
	gap: 6px;
}
.content-01.small .box-01 .box-left .left .title .highest_lowest {
	display: none;
}
.content-01.small>.box-01>.box-left>.left {

display: flex;

flex-direction: row-reverse;
}
.content-01.small .temperature {
	margin: 0;
	/* text-align: left; */
	font-size: 50px;
}
.content-01.small .box-01 .box-left .left .title .highest_lowest div{
	padding: 0 !important;
	text-align: center !important;
	width: 100% !important;
	border: none !important;
	font-size: 14px !important;
}
.content-01.middle .box-01 .box-left .left .title .highest_lowest div{
	padding: 0 !important;
	text-align: center !important;
	width: 100% !important;
	border: none !important;
	font-size: 14px !important;
}
.content-01>.box-01>.box-left:before {
	/* content: ''; */
	right: 50%;
	top: 22px;
	width: 1px;
	height: 88%;
	background-color: #D9D9D9;
	position: absolute;
}

.content-01 .box-01 .box-left .left .title {
	height: 100%;
	width: 50%;
	/* margin-bottom: 8px; */
	transition: .3s cubic-bezier(.5, .01, .46, 1.32);
	display: flex;
}

.content-01 .box-01 .box-left .left .title.weather-01 {
	background: url('./image/weather/weather_icon-01.png') 50%/contain
		no-repeat;
}

.content-01 .box-01 .box-left .left .title.weather-02 {
	background: url('./image/weather/weather_icon-02.png') 50%/contain
		no-repeat;
}

.content-01 .box-01 .box-left .left .title.weather-03 {
	background: url('./image/weather/weather_icon-03.png') 50%/contain
		no-repeat;
}

.content-01 .box-01 .box-left .left .title.weather-04 {
	background: url('./image/weather/weather_icon-04.png') 50%/contain
		no-repeat;
}

.content-01 .box-01 .box-left .left .title.weather-05 {
	background: url('./image/weather/weather_icon-05.png') 50%/contain
		no-repeat;
}

.content-01 .box-01 .box-left .left .title.weather-06 {
	background: url('./image/weather/weather_icon-06.png') 50%/contain
		no-repeat;
}

.content-01 .box-01 .box-left .left .title.weather-07 {
	background: url('./image/weather/weather_icon-07.png') 50%/contain
		no-repeat;
}

.content-01 .box-01 .box-left .left .title.weather-08 {
	background: url('./image/weather/weather_icon-08.png') 50%/contain
		no-repeat;
}

.content-01 .box-01 .box-left .left .title.weather-09 {
	background: url('./image/weather/weather_icon-09.png') 50%/contain
		no-repeat;
}

.content-01 .box-01 .box-left .left .title.weather-10 {
	background: url('./image/weather/weather_icon-10.png') 50%/contain
		no-repeat;
}

.content-01 .box-01 .box-left .left .title.weather-11 {
	background: url('./image/weather/weather_icon-11.png') 50%/contain
		no-repeat;
}

.content-01 .box-01 .box-left .left .title.weather-12 {
	background: url('./image/weather/weather_icon-12.png') 50%/contain
		no-repeat;
}

.content-01 .box-01 .box-left .left .title.weather-13 {
	background: url('./image/weather/weather_icon-13.png') 50%/contain
		no-repeat;
}

.content-01 .box-01 .box-left .left .title.weather-14 {
	background: url('./image/weather/weather_icon-14.png') 50%/contain
		no-repeat;
}

.content-01 .box-01 .box-left .left .title.weather-15 {
	background: url('./image/weather/weather_icon-15.png') 50%/contain
		no-repeat;
}

.location_gps {
	height: 42px;
	line-height: 20px;
	/* font-size: clamp(14px, .8vw, 16px); */
	font-size: clamp(10px, .6vw, 16px);
	font-weight: 800;
	margin: 0 0 0 14px;
	display: flex;
	align-items: center;
}

.location_gps .img {
	width: 20px;
	height: 20px;
	margin-right: 8px;
}

.change-sun .location_gps .img {
	background: url('./image/location_gps_1.png') 50%/contain no-repeat;
}

.change-cloudy .location_gps .img {
	background: url('./image/location_gps_2.png') 50%/contain no-repeat;
}

.change-rain .location_gps .img {
	background: url('./image/location_gps_3.png') 50%/contain no-repeat;
}

.change-snow .location_gps .img {
	background: url('./image/location_gps_4.png') 50%/contain no-repeat;
}

.custom_select {
	background: #C5C6C8;
	border-radius: 5px;
	width: 114px;
	height: 32px;
	display: flex;
	align-items: center;
	font-weight: 800;
	border: none;
	text-align: center;
	cursor: pointer;
	font-size: 14px;
	color: #fff;
	margin: 0px 0 0 16px;
	justify-content: center;
}

.today-txt {
	margin: 0;
    text-align: right;
    flex: 50px;
    font-size: 12px;
    color: #B4B4B4;
}

.custom_select select {
	width: 100%;
	background: #F4F4F4 url('./image/select_arrow.png') no-repeat 94% 50%;
	border-radius: 30px;
	height: 45px;
	display: flex;
	align-items: center;
	font-weight: 800;
	cursor: pointer;
	padding: 0 22px;
	box-sizing: border-box;
	border: none;
}

.custom_select>div:first-child {
	text-align: left;
	margin-left: 0;
}

.custom_select>div:last-child {
	margin-right: 0;
}

.custom_select>.img {
	background: url('./image/select_arrow.png') 50%/contain no-repeat;
	width: 12px;
	height: 9px;
}
.content-01>.box-01>.box-left>.left>.btn-300, .content-08-h-700>.pollution>.btn-300
	{
	background: #F4F4F4;
	cursor: pointer;
	max-width: 312px;
	border-radius: 50px;
	height: 40px;
	min-width: 250px;
}

.pollution>.pollution-title .t-txt {
	/* margin-right:22px; */
	display: none;
}

.content-01>.box-01>.box-right {
	width: 100%;
	height: 50%;
	/* min-width: 204px; */
	/* max-height: 200px; */
	box-sizing: border-box;
	/* width: 100%; */
	/* padding: 0 22px 0 22px; */
	/* border-left: 1px solid #ddd; */
	padding-bottom: 22px;
}
.content-01.middle>.box-01>.box-right {
	display:none;
}
.content-01.middle>.box-01>.box-left {
	height: 100%;
}
.content-01.small>.box-01>.box-right {
	display:none;
}
.content-01.small>.box-01>.box-left {
	height: 100%;
}
.content-01>.box-01>.box-right>.right {
	width: 100%;
	height: 100%;
	box-sizing: border-box;
}

.content-01>.box-01>.box-right>.right>.title {
	font-weight: 800;
	color: #BCBCBC;
	text-align: center;
	position: relative;
	font-size: 50px;
	height: 50%;
	transform: translate(0, 0%);
	/* padding: 16px; */
	box-sizing: border-box;
}


.content-01 .box-01 .box-left .left .title .group {
	display: flex;
	flex-direction: column;
	height: 100%;
	justify-content: center;
	margin: 0;
	width: 100%;
}

.content-01 .box-01 .box-left .left .title .highest_lowest {/* 	font-size: clamp(.9rem, 1vw, 1.1rem); 240722 *//* font-size: clamp(.9rem, 1vw, 2.1rem); */width: 100%;/* height: 10%; *//* line-height: 30px; */display: flex;justify-content: center;align-items: center;/* 	margin-top: 15px; 240722  */margin-top: 30px;}

.content-01 .box-01 .box-left .left .title .highest_lowest>div:first-child
	{
	/* width: 50%; */
	color: #FFC136;
	border-right: 1px solid #E9EBEE;
	box-sizing: border-box;
	text-align: right;
	padding-right: 10px;
	font-size: 15px;
	margin: 0;
}

.content-01 .box-01 .box-left .left .title .highest_lowest>div:last-child
	{
	width: 50%;
	color: #C1D8F1;
	box-sizing: border-box;
	text-align: left;
	padding-left: 10px;
	font-size: 15px;
	margin: 0;
}

.temperature {
	/* position: absolute; */
	/* bottom: 0; */
	/* right: 0; */
	/* left: 0; */
	/* top: 16%; */
	/* height: calc(100% - 30px); */
	/* font-size: clamp(.9rem, 1vw, 1.1rem); */
	font-size: 60px;
	color: #BCBCBC;
	font-weight: 500;
}

.content-01>.box-01>.box-right>.right>.weather-list {
	width: 100%;
	height: 100%;
	/* position: absolute; */
	/* bottom: 0; */
	/*padding: 0 30px;*/
	box-sizing: border-box;
	position: relative;
}

.content-01>.box-01>.box-right>.right>.weather-list>.weather-img {
	background: url('./image/water-img.png') no-repeat 50%;
	background-size: contain;
	background-color: #fff;
	height: 100%;
	width: 100%;
	box-sizing: border-box;
	/* margin: 0 16px; */
	padding: 10px;
	box-sizing: border-box;
	z-index: -1;
}

.weather-left {
	width: 33px;
	background: url('./image/weather-left.png') no-repeat 50%;
	height: 31px;
	position: absolute;
	left: 0px;
	z-index: 1000;
	top: calc(50% - 15px);
	box-shadow: 1px 1px 5px 1px #00000021;
	border-radius: 50%;
	cursor: pointer;
}

.weather-right {
	background: url('./image/weather-right.png') no-repeat 50%;
	position: absolute;
	width: 33px;
	height: 31px;
	position: absolute;
	right: 0px;
	z-index: 1000;
	top: calc(50% - 15px);
	box-shadow: 1px 1px 5px 1px #00000021;
	border-radius: 50%;
	cursor: pointer;
}
/* 
.content-01>.box-01>.box-right>.right>.weather-list>ul {
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-end;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>li
	{
	font-size: 13px;
	font-weight: 600;
	color: #313131;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-01,
	.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-02,
	.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-03,
	.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-04,
	.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-05,
	.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-06,
	.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-07,
	.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-08
	{
	width: 1px;
	background-color: #e9ebec;
	position: relative;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-01:before,
	.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-02:before,
	.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-03:before,
	.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-04:before,
	.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-05:before,
	.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-06:before,
	.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-07:before,
	.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-08:before
	{
	content: '';
	background-color: #ddd;
	width: 5px;
	height: 5px;
	left: -2px;
	border-radius: 10px;
	position: absolute;
	z-index: 1;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-01
	{
	height: 32px;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-02
	{
	height: 33px;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-03
	{
	height: 36px;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-04
	{
	height: 40px;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-05
	{
	height: 36px;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-06
	{
	height: 34px;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-07
	{
	height: 32px;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-08
	{
	height: 30px;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-01:after,
	.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-02:after,
	.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-03:after,
	.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-04:after,
	.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-05:after,
	.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-06:after,
	.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-07:after
	{
	content: '';
	background-color: #e2e8f7;
	width: 45px;
	height: 2px;
	border-radius: 10px;
	position: absolute;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-01:after
	{
	transform: rotate(358deg);
	top: 1%;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-02:after
	{
	transform: rotate(357deg);
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-03:after
	{
	transform: rotate(355deg);
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-04:after
	{
	transform: rotate(5deg);
	top: 9%;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-05:after
	{
	transform: rotate(2deg);
	top: 7%;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-06:after
	{
	transform: rotate(2deg);
	top: 7%;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>.chart-07:after
	{
	transform: rotate(2deg);
	top: 7%;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>li>p
	{
	color: #c9c9c9;
	font-weight: 300;
	font-size: 12px;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>li.img-01
	{
	background: url('./image/rain.png') no-repeat 50%;
	background-size: 30px;
	height: 30px;
	width: 30px;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>li.img-02
	{
	background: url('./image/dark.png') no-repeat 50%;
	background-size: 30px;
	height: 30px;
	width: 30px;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>li.img-03
	{
	background: url('./image/after.png') no-repeat 50%;
	background-size: 30px;
	height: 30px;
	width: 30px;
}

.content-01>.box-01>.box-right>.right>.weather-list>ul>li>.list-box>ul>li.img-04
	{
	background: url('./image/night.png') no-repeat 50%;
	background-size: 30px;
	height: 30px;
	width: 30px;
} */
/* 오늘의 날씨 부분 e */



/* 오늘의 날씨 부분 s 240722 */

.grid-stack-item-content > div[class^=content].resize_new{
	display: none;	
}

.header.resize_new .location_gps {
	display: none;	
}

/* 오늘의 날씨 부분 e 240722 */

/* 재활용 실적 s */
.content-02 {
	height: calc(100% - 88px);
}

.content-02>.progress-box {
	height: 100%;
	padding: 0 22px;
}

.content-02>.progress-box>.progress {
	position: relative;
	height: 64%;
}

.content-02>.progress-box>.progress>.bg-img {
	background: url('./image/recycle.png') no-repeat 50%;
	background-size: contain;
	height: 100%;
	width: 100%;
}

.content-02>.progress-box>.progress>.bg-img::before {
	width: 119px;
	content: '';
	right: 50%;
	bottom: -10px;
	height: 2px;
	position: absolute;
	background-color: #E0E0E0;
	transform: translateX(50%);
}

.content-02>.progress-box>.text-02 {
	width: 100%;
	height: 36%;
	position: relative;
}

.content-02>.progress-box>.text-02>p {
	font-size: 40px;
	font-weight: 800;
	color: #2C2C2C;
	position: absolute;
	text-align: center;
	left: 0;
	right: 0;
	top: 20px;
}
/* 재활용 실적 e */

/* 뉴스 이미지 s */
/* 이미지 공지사항 임시, 개발 후 원복 필요 */
.content-03 {
	height: 100%;
	/*height:116%;*/
}



.content-03>.bg-img-02 {
    /* background: url(./image/news.jpg) 50% / 50% no-repeat; */
    background: 50% / 100% no-repeat;
    /* background-size: cover; */
    height: 64%;
    width: 100%;
    border-bottom-left-radius: 40px;
    border-bottom-right-radius: 40px;
}

.content-03>.text-03 {
	width: 100%;
	height: 108px;
	box-sizing: border-box;
	padding: 0 22px;
	cursor: pointer;
}

.content-03>.text-03>p {
	font-size: clamp(14px, 1vw, 16px);
	font-weight: 300;
	text-align: left;
	color: #2C2C2C;
	line-height: 22px;
	padding-bottom: 20px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.content-03>.text-03>span {
	display: block;
	text-align: left;
	font-size: clamp(12px, 1vw, 14px);
	color: #C7C7C7;
}

.content-issue {
	/* position: absolute; */
	top: 0;
	width: 100%;
	height: calc(100% - 18px) !important;
	z-index: -1;
	padding-bottom: 0 !important;
	border-radius: 10px;
}
.swiper_issue {
	height: 100%;
	width: 100%;
	border-radius: 10px;
}
.main_topic.content-issue.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.content-issue.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.content-issue.big .swiper-button-next:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-left: 4px;
} 
.main_topic.content-issue.big .swiper-button-prev:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-right: 4px;
}
.main_topic.content-issue.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% - -20px);
}
.main_topic.content-issue.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% - -20px);
}
.main_topic.content-issue.middle .swiper-button-next:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-left: 4px;
} 
.main_topic.content-issue.middle .swiper-button-prev:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-right: 4px;
}

.main_topic.content-issue.small .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% - -20px);
}
.main_topic.content-issue.small .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% - -20px);
}
.main_topic.content-issue.small .swiper-button-next:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-left: 4px;
} 
.main_topic.content-issue.small .swiper-button-prev:after {
	font-size: 24px;
	display: flex;
	color: #D9D9D9;
	margin-right: 4px;
}
.content-issue>.bg-img-01 {
	background: url('./image/20231120091913.png') 50%/50% no-repeat;
	background-size: contain;
	height: 100%;
	width: 100%;
	border-bottom-left-radius: 40px;
	border-bottom-right-radius: 40px;
}

/* 뉴스 이미지 e */

/* 내 북마크 s */
.content-04 {
	height: calc(100% - 88px);
	box-sizing: border-box;
	padding-bottom: 22px;
}

.content-04>.table-04 {
	box-sizing: border-box;
	width: 100%;
	height: 100%;
}

.content-04>.table-04>.table-list {
	height: 100%;
}

.content-04>.table-04>.table-list>ul {
	width: 100%;
	box-sizing: border-box;
	height: calc(100% - 46px);
	padding: 0 22px;
	overflow: auto;
}

.content-04>.table-04>.table-list>ul>li {
	vertical-align: middle;
	width: 100%;
	cursor: pointer;
	box-sizing: border-box;
	border-top: 0px solid #D9D9D9;
	border-bottom: 1px solid #D9D9D9;
}

.content-04>.table-04>.table-list>ul>li:first-child {
	border-top: 1px solid #D9D9D9;
}

.content-04>.table-04>.table-list>ul>li>p {
	width: 90%;
	overflow: hidden;
	margin: 0;
	line-height: 2.7;
	vertical-align: middle;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: clamp(14px, 1vw, 16px);
	font-weight: 500;
	color: #2C2C2C;
}
/* 내 북마크 e */

/* 긴급경보공지 s */
.content-05-h-100 {
	background-color: #FFC136;
	height: 100%;
	position: absolute;
	width: 100%;
	top: 0;
	z-index: -1;
	left: 0px;
	border-radius: 20px;
}

.content-05-h-100>.notice {
	position: absolute;
	padding: 0 22px;
	height: 100%;
	box-sizing: border-box;
	width: 100%;
}

.content-05-h-100>.notice>.notice-box {
	height: calc(100% - 88px);
	position: relative;
}

.content-05-h-100>.notice>.notice-box>.box-04 {
	width: 100%;
    position: relative;
    bottom: 0;
    height: calc(100% - 22px);
    margin: 88px 0 22px;
    gap: 16px;
    display: flex;
    overflow: auto;
    flex-direction: column;
}

.content-05-h-100>.notice>.notice-box>.box-05 {
    width: 100%;
    position: relative;
    bottom: 0;
    height: calc(100% - 49px);
    margin: 88px 0 0;
    gap: 30px;
    display: flex;
    overflow: auto;
}

.content-05-h-100>.notice>.notice-box>.box-05>.emergency-map {
	width: 50%;
	margin: 0;
	border-radius: 30px;
	height: 100%;
	box-sizing: border-box;
}

.content-05-h-100.resize>.notice>.notice-box>.box-05>.emergency-map {
	display:none;
}

/* 기상특보 부분 s 240722 */
/* .content-05-h-100.resize>.notice>.notice-box>.box-05>.emergency-txt {
	width: 100%;
}*/
.content-05-h-100.resize>.notice>.notice-box>.box-05>.emergency-txt {
	display:none;
}
.content-05-h-100.resize>.notice>.notice-box>.btn-more>a {
	font-size: 15px;
}
/* 기상특보 부분 e 240722 */
.content-05-h-100>.notice>.notice-box>.box-05>.emergency-map img {
	width:100%;
	height: calc(100% - 4px);
}

.content-05-h-100.group-specialReport>.notice>.notice-box>.btn-more {
	
}
.content-05-h-100>.notice>.notice-box>.btn-more>a {
	color: #fff;
}

.content-05-h-100>.notice>.notice-box>.box-05>.emergency-txt {
	margin: 0;
	color: #fff;
	font-weight: 500;
	font-size: 16px;
	width: 50%;
	display: flex;
	flex-direction: column;
	gap: 10px;
	height: 100%;
	overflow-y: auto;
}
.content-05-h-100>.notice>.notice-box>.box-05>.emergency-txt p {
	margin:0;
	text-align: left;
	letter-spacing: 1px;
	line-height: 1.3;
}
.content-05-h-100>.notice>.notice-box>.box-04>ul {
	width: 100%;
    position: relative;
    bottom: 0;
    display: flex;
    flex-direction: row;
    gap: 16px;    
    cursor: pointer;    
    border-radius: 12px;
    transition: .3s;
}
.content-05-h-100>.notice>.notice-box>.box-04>ul:hover {
	background: #ffa31d8f;
}


.content-05-h-100>.notice>.notice-box>.box-04>ul>li {
	min-height: 60px;
	height: 100%;
}

.content-05-h-100>.notice>.notice-box>.box-04>ul>li:first-child {
	width: calc(100% - 86%);
	position: relative;
	background: #4E4E4E;
	border-radius: 10px;
	display: flex;
    justify-content: center;
    align-items: center;
}

.content-05-h-100>.notice>.notice-box>.box-04>ul>li:nth-child(2) {
	width: calc(100% - 28%);
	position: relative;
}

.content-05-h-100>.notice>.notice-box>.box-04>ul>li:nth-child(2)>p {
	text-align: left;
	font-weight: 500;
	margin: 8px 0 10px 18px;
}

.content-05-h-100>.notice>.notice-box>.box-04>ul>li:nth-child(2)>span {
	margin-left: 18px;
	position: absolute;
}

.content-05-h-100>.notice>.notice-box>.box-04>ul>li:nth-child(3) {
	width: calc(100% - 86%);
	position: relative;
}

.content-05-h-100>.notice>.notice-box>.box-04>ul>li>p {
	text-align: center;
}

.content-05-h-100>.notice>.notice-box>.box-04>ul>li>span {
	font-size: .7vw;
}

.content-05-h-100>.notice>.notice-box>.box-04>ul>li>span {
	font-size: 15px;
	font-weight: 500;
	color: #2C2C2C;
	text-align: left;
	display: block;
}
/* 긴급경보공지 e */

/* 우리동네 수돗물 수질 s */
.content-06-h-100 {
	height: 100%;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: -1;
	background: linear-gradient(0deg, #E3F2FF, 20%, #FFFFFF);
}

.water {
	width: 100%;
	height: 100%;
}

.content-06-h-100>.water>.water-list {
	width: 100%;
	height: 100%;
}

.content-06-h-100>.water>.water-list>ul {
	display: flex;
	width: 100%;
	height: 89%;
	align-items: flex-end;
	padding-left: 42px;
	box-sizing: border-box;
	margin: 0;
}

.content-06-h-100>.water>.water-list>ul>li {
	width: 100%;
}

.content-06-h-100>.water>.water-list>ul>li:first-child {
	margin: 0;
}

.content-06-h-100>.water>.water-list>ul>li>.water-box {
	height: 100%;
}

.content-06-h-100>.water>.water-list>ul>li>.water-box>ul {
	display: flex;
	flex-direction: column;
}

.content-06-h-100>.water>.water-list>ul>li>.water-box>ul>li {
	display: flex;
	margin: 0;
	position: relative;
	flex-direction: column;
	align-items: flex-start;
}

.content-06-h-100>.water>.water-list>ul>li>.water-box>ul>li>.img-water {
	background: url('./image/water.png') no-repeat 100%;
	background-size: 100%;
	height: 42px;
	width: 28px;
	margin: 0;
	z-index: 1;
	margin-bottom: 6px;
}

.content-06-h-100>.water>.water-list>ul>li>.water-box>ul>li:first-child:after
	{
	content: '';
	width: calc(100% - 3px);
	background-color: #62A5E9;
	height: 3px;
	position: absolute;
	top: 50%;
	left: 3px;
	box-sizing: border-box;
}

.content-06-h-100>.water>.water-list>ul>li>.water-box>ul>li>span {
	font-size: .6vw;
	font-weight: 500;
	margin: 0;
}

.content-06-h-100>.water>.water-list>ul>li>.water-box>ul>li>strong {
	font-size: .6vw;
	font-weight: 500;
	margin: 0;
}
/* 우리동네 수돗물 수질 e */

/* 녹지 면적율 s */
.content-07, .drought, .noise {
	
	height: calc(100% - 70px) !important;
	/* padding-bottom: 22px; */
	box-sizing: border-box;
	width: 100%;
}
.noxiousWild {
	height: calc(100% - 118px);
}
.blue.t-txt {
	margin-right:22px;
	display: none;
}
.content-07.group-waterLevelDamBo {
	height: calc(100% - 98px);
}
.content-07>.chart {
	width: 100%;
	height: 100% !important;
	/* padding: 0px 22px 0 22px; */
	box-sizing: border-box;
	height: 100%;
	position: relative;
	/* padding: 10px 0; */
	display: flex;
	gap: 10px;
}
.content-07.middle>.chart {
	width: 100%;
	height: calc(100% - 24px) !important;
	/* padding: 0px 22px 0 22px; */
	box-sizing: border-box;
	height: 100%;
	position: relative;
	padding: 10px 0;
	display: flex;
	gap: 10px;
	flex-direction: row;
}
.content-07.small>.chart {
	width: 100%;
	height: calc(100% - 24px) !important;
	/* padding: 0px 22px 0 22px; */
	box-sizing: border-box;
	height: 100%;
	position: relative;
	padding: 10px 0;
	display: flex;
	gap: 10px;
	flex-direction: row;
}
.content-07 .green-content {
	height: calc(100% - 8px);
}

.content-07 .green-content .top-box {
	background: url(./image/greenery-map.png) 50%/contain no-repeat;
	height: calc(50% - 12px);
	box-sizing: border-box;
	margin: 0 22px 12px;
}

.content-07 .green-content .green-infor-box {
	padding: 0 22px;
}

.content-07 .green-content .green-infor-box .infor-h1 {
	display: flex;
	flex-wrap: wrap;
}

.content-07 .green-content .green-infor-box .infor-h1 p {
	font-weight: 500;
	margin: 0;
	color: #707070;
	display: flex;
	align-items: center;
	height: 20px;
}

.content-07 .green-content .green-infor-box .infor-h1 p:nth-child(2) {
	color: #C7C7C7;
	font-size: 12px;
	margin-left: 8px;
}

.content-07 .green-content .green-infor-box .infor-legend {
	margin-top: 12px;
}

.content-07 .green-content .green-infor-box .infor-legend ul {
	display: grid;
	width: 100%;
	grid-template-columns: repeat(4, minmax(80px, 1fr));
}

.content-07 .green-content .green-infor-box .infor-legend ul li {
	display: flex;
	width: 100%;
	margin: 0;
	align-items: center;
}

.content-07 .green-content .green-infor-box .infor-legend ul li span {
	width: 12px;
	display: block;
	border-radius: 10px;
	height: 12px;
	margin: 0;
}

.content-07 .green-content .green-infor-box .infor-legend ul li .stage-01
	{
	background: #41125C;
}

.content-07 .green-content .green-infor-box .infor-legend ul li .stage-02
	{
	background: #414C86;
}

.content-07 .green-content .green-infor-box .infor-legend ul li .stage-03
	{
	background: #ECE551;
}

.content-07 .green-content .green-infor-box .infor-legend ul li .stage-04
	{
	background: #80CA6B;
}

.content-07 .green-content .green-infor-box .infor-legend ul li p {
	margin: 0 0 0 6px;
	font-weight: 500;
	color: #707070;
}

.content-07 .green-content .magnifier-map {
	height: calc(50% - 81px);
	margin: 14px 22px 0;
	border-radius: 24px;
	border: 3px solid #E4FC9D;
	box-sizing: border-box;
	position: relative;
}

.content-07 .green-content .magnifier-map .mag-map {
	background: url(./image/greenery-more-map.png) 50%/contain no-repeat;
	height: 100%;
	border-radius: 24px;
}

.content-07 .green-content .btn-more {
	width: 100%;
	padding: 0;
	height: 24px;
	display: flex;
	align-items: flex-end;
	justify-content: center;
}

/* 수위 정보  s */
.content-07>.chart>.left-box-40 {
	width: calc(40% - 15px);
	height: 100%;
	/* padding-right: 14px; */
	border-right: 1px solid #D9D9D9;
}

.content-07>.chart>.right-box-60 {
	width: calc(60% - 15px);
	padding-left: 14px;
	height: 100%;
}

.content-07>.chart>.left-box-40 .h1 {
	font-weight: 600;
	font-size: clamp(16px, 1vw, 20px);
	height: 24px;
	line-height: 24px;
	display: none;
}
.content-07>.chart>.left-box-40 .t-txt {
	display:none;
}
.content-07>.chart>.left-box-40 .left-h1-box {
	margin-left: 10px;
	color: #fff;
	border-radius: 10px;
	/* width: 66px; */
	height: 30px;
	line-height: 30px;
	font-weight: 600;
	font-size: 14px;
	margin: 0;
	padding: 0 15px;
	font-weight: 500;
}

.content-07>.chart .h-g-color {
	background: #01801F;
}

.content-07>.chart .h-y-color {
	background: #FFC136;
}

.content-07>.chart .h-r-color {
	background: #F15700;
}

.content-07>.chart .h-p-color {
	background: #6A6AF9;
}

.content-07>.chart>.right-box-60>.list-content {
	height: calc(100% - 46px);
}

.content-07>.chart>.right-box-60>.list-content ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	grid-gap: 6px 0;
    height: calc(100% - 30px);
}

.content-07>.chart>.right-box-60>.list-content ul li {
	width: calc(50% - 3px);
	margin: 0;
	cursor: pointer;
}

.content-07>.chart>.right-box-60>.list-content ul li a {
	height: 100%;
}

.content-07>.chart>.right-box-60 .btn-more-box {
	margin-top: 12px;
	height: 28px;
	display: flex;
	align-items: center;
}

.content-07>.chart>.right-box-60>.list-content ul li>button {
	height: 100%;
	padding: 0;
	width: 100%;
}

.content-07>.chart .level-container {
	height: calc(100% - 38px);
	margin-top: 38px;
	box-sizing: border-box;
}

.content-07>.chart .level-container .left-content {
	height: 100%;
	width: calc(100% - 80px);
	position: relative;
}

.content-07>.chart .level-container .left-content .level-top {
	height: 100%;
	background: url(./image/water-level-01.png) 50% 80%/ contain no-repeat;
	position: absolute;
	width: 100%;
}

.content-07>.chart .level-container .left-content .water-bottom {
	height: 22%;
	background: url(./image/water-level-02.png) 50%/cover no-repeat;
	width: 100%;
	position: absolute;
	bottom: 0;
}

.content-07>.chart .level-container .right-content {
	height: 100%;
	width: 80px;
	display: flex;
}

.content-07>.chart .level-container .right-content .level-numerical-bar
	{
	height: 100%;
	width: calc(50% - 12px);
}

.content-07>.chart .level-container .right-content .level-numerical-bar ul
	{
	height: 100%;
	display: block;
	position: relative;
	width: 100%;
}

.content-07>.chart .level-container .right-content .level-numerical-bar ul li
	{
	font-weight: 500;
	position: relative;
}

.content-07>.chart .level-container .right-content .level-numerical-bar ul li:before
	{
	content: "";
	position: absolute;
	width: 9px;
	top: 50%;
	height: 1px;
	left: -13px;
	background: #C5C6C8;
}

.content-07>.chart .level-container .right-content .level-numerical-bar ul li
	{
	line-height: 0px;
	position: absolute;
	right: 0;
}

.content-07>.chart .level-container .right-content .level-numerical-bar ul li.h-y-color
	{
	bottom: 10%;
	color: #FFC136;
	background: none;
}

.content-07>.chart .level-container .right-content .level-numerical-bar ul li.h-g-color
	{
	bottom: 20%;
	color: #01801F;
	background: none;
}

.content-07>.chart .level-container .right-content .level-numerical-bar ul li.h-r-color
	{
	bottom: 30%;
	color: #F15700;
	background: none;
}

.content-07>.chart .level-container .right-content .level-numerical-bar ul li.h-p-color
	{
	bottom: 40%;
	color: #6A6AF9;
	background: none;
}

/* .content-07>.chart .level-container .right-content .level-numerical-bar ul li:nth-child(2)
	{
	color: #F15700;
}

.content-07>.chart .level-container .right-content .level-numerical-bar ul li:nth-child(3)
	{
	color: #FFC136;
}

.content-07>.chart .level-container .right-content .level-numerical-bar ul li:nth-child(4)
	{
	color: #01801F;
}

.content-07>.chart .level-container .right-content .level-numerical-bar ul li:nth-child(5)
	{
	color: #97D2FF;
}
 */
.content-07>.chart .list-content .btn-more-box {
	width: 100% !important;
}

.content-07>.chart .location-box.yellow {
	border: 2px solid #FFC136;
}

.content-07>.chart .location-box.green {
	border: 2px solid #01801F;
}

.content-07>.chart .location-box.purple {
	border: 2px solid #6A6AF9;
}

.content-07>.chart .location-box.red {
	border: 2px solid #F15700;
}

.content-07>.chart .level-container p {
	text-align: left;
	height: 20px;
	display: flex;
	font-size:12px;
	align-items: flex-end;
	font-weight: 500;
	color: #C5C6C8;
	display: none !important;
}

.content-07>.chart .level-container .level-text-box {
	height: auto;
	color: #fff;
	left: 0;
	display: inline-block;
	right: 0;
/* 	bottom: 16px; 240722*/
	bottom: 8px;
	position: absolute;
	text-align: center;
	font-size: clamp(12px, .8vw, 16px);
}

.content-07>.chart>.right-box-60 .location-box p.fl {
/* 	height: 18px; 240722 */
	height: 22px;
	line-height: 18px;
	font-size: clamp(12px, 1vw, 16px);
	font-weight: 600;
}

.content-07>.chart>.right-box-60 .location-box p.fr {
	font-size: 11px;
	width: 35px;
	height: 18px;
	border-radius: 12px;
	color: #fff;
	font-weight: 600;
	line-height: 18px;
}

/* 댐 정보s */
.content-07>.chart>.left-box {
	width: 50%;
	height: 100%;
	/* margin-right: 10px; */
	margin: 0;
}

.content-07>.chart>.right-box {
	width: calc(50% - 11px);
}

.content-07>.chart .location-box {
	padding: 12px 12px;
	box-sizing: border-box;
	border-radius: 13px;
	height: 100%;
}

.content-07>.chart .location-box>.location-infor-text {
	height: calc(100% - 30px);
	padding-top: 10px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
}

.content-07>.chart .location-box>.location-infor-text p {
/* 	font-size: 13px; 240722*/
	font-size: 15px;
	color: #707070;
	margin: 0px 0 4px 0;
	text-align: left;
	font-weight: 500;
}

.content-07>.chart .location-box>.location-infor-text p:nth-child(2) {
/* 	font-size: 12px; 240722 */
	font-size: 15px;
	color: #C5C6C8;
	text-align: left;
}

.content-07>.chart .dam-content {
	height: 100%;
	background: #EBF5FF;
	display: block;
	box-sizing: border-box;
	padding: 10px;
	border-radius: 10px;
	/* box-shadow: 0 6px 10px #00000017; */
}

.header .selectDamBo {
	display:none;
}

.content-07>.chart .dam-content .dam-box {
	height: calc(100% - 40px);
}

.content-07>.chart .dam-content select {
	width: 100%;
	border-radius: 8px;
	height: 22px;
	background: #fff url(./image/select_arrow.png) 89% 50%/8px no-repeat;
	/* margin: 0; */
	color: #707070;
	display: none;
}

.content-07>.chart .dam-content .dam-box .damimg {
	width: 65%;
	height: calc(100% - 168px);
}

.content-07>.chart .dam-content .dam-box .damvalue33 {
	background: url(./image/dam/barrage_01.png) 50%/contain no-repeat;
}

.content-07>.chart .dam-content .dam-box .damvalue66 {
	background: url(./image/dam/barrage_01_2.png) 50%/contain no-repeat;
}

.content-07>.chart .dam-content .dam-box .damvalue100 {
	background: url(./image/dam/barrage_01_3.png) 50%/contain no-repeat;
}

.content-07>.chart .dam-content .dam-box .weirvalue33 {
	background: url(./image/dam/barrage_02.png) 50%/contain no-repeat;
}

.content-07>.chart .dam-content .dam-box .weirvalue66 {
	background: url(./image/dam/barrage_02_2.png) 50%/contain no-repeat;
}

.content-07>.chart .dam-content .dam-box .current {
	width: 100%;
	position: relative;
}

.content-07>.chart .dam-content .dam-box .current .now-level {
	font-size: 13px;
	width: auto;
	font-weight: 500;
	height: auto;
	color: #707070;
	font-size: 14px;
	padding: 12px 0 5px;
	margin: 0;
	box-sizing: border-box;
}

.content-07>.chart .dam-content .dam-box .current .now-water-data {
	height: auto;
}

.content-07>.chart .dam-content .dam-box .current .now-water-data p {
		
}

.content-07>.chart .dam-content .dam-box .weirvalue100 {
	background: url(./image/dam/barrage_02_3.png) 50%/contain no-repeat;
}

.content-07>.chart .dam-content .dam-box p {
	position: relative;
	height: 16px;
	width: 100%;
	margin-bottom: 16px;
}

.content-07>.chart .dam-content .dam-box p>span {
	font-weight: 500;
	font-size: 22px;
}

.content-07>.chart .dam-content .dam-box p .r-color {
	color: #FD481C;
}

.content-07>.chart .dam-content .dam-box p .b-color {
	color: #97D2FF;
}

.content-07>.chart .dam-content .dam-box p .y-color {
	color: #FFC136;
}

.content-07>.chart .dam-content .dam-box .current-text {
	font-size: 12px;
	width: 100%;
	position: relative;
}

.content-07>.chart .dam-content .dam-box .current-text .current-01 {
	position: absolute;
	left: 0;
	width: 46px;
}

.content-07>.chart .dam-content .dam-box .current-text .current-02 {
	position: absolute;
	right: 41%;
	width: 46px;
}

.content-07>.chart .dam-content .dam-box .current-text .current-03 {
	position: absolute;
	right: 0;
	width: 57px;
}
.t-txt.dam-txt  {
	line-height:30px;
	margin-right:22px;
	display: none;
}
.water-legend {
	box-sizing: border-box;
	padding-top: 14px;
}

.water-legend ul {
	display: flex;
	margin: 0;
	height: 16px;
	justify-content: center;
}

.water-legend ul li:first-child {
	padding: 0 6px 0 0;
}

.water-legend ul li:last-child {
	border-right: 0;
}

.water-legend ul li {
	padding: 0 6px 0 6px;
	display: flex;
	color: #C5C6C8;
	font-size: clamp(13px, 1.5vw, 14px);
	align-items: center;
	border-right: 1px solid #C5C6C8;
	font-weight: 500;
	font-size: 11px;
	margin: 0;
}

.water-legend ul li .img {
	background: url(./image/group-water-level.png) no-repeat;
	margin-right: 1px;
}

.content-07>.chart .dam-content .dam-box .water-legend ul li .img-01 {
	background-position: 0 1px;
	width: 13px;
	margin-bottom: 0;
	height: 15px;
	background-size: 130px;
}

.content-07>.chart .dam-content .dam-box .water-legend ul li .img-02 {
	background-position: -60px 1px;
	width: 13px;
	margin-bottom: 0;
	height: 15px;
	background-size: 130px;
}

.content-07>.chart .dam-content .dam-box .water-legend ul li .img-03 {
	background-position: -121px 1px;
	width: 13px;
	margin-bottom: 0;
	height: 15px;
	background-size: 130px;
}

button.water-more { /* 임시로 주석처리 함. - 최한결 */
	/* margin: 0; */
	/* padding: 0; */
	width: 120px;
	right: 0;
	left: 0;
	position: absolute;
	bottom: -48px;
	background: initial;
}
/* 댐 정보 e */

/* 수위 정보 e */
.table {
	width: 100%;
	text-align: center;
	height: 100%;
}

.table th {
	background: #ccc;
}

.table td, .table th {
	border-top: 1px solid #D2D2D2;
}

/* 대기오염 정보 s */
.content-08-h-700 {
	height: calc(100% - 88px);
	padding-bottom: 22px;
	box-sizing: border-box;
}

.content-08-h-700>.pollution {
	box-sizing: border-box;
	height: 100%;
}

.content-08-h-700>.pollution>ul {
	height: 100%;
}

.content-08-h-700>.pollution>ul>li:nth-child(1) {
	height: calc(100% - 150px);
	/* padding: 0 22px 0 22px; */
	/* margin-bottom: 20px; */
}

.content-08-h-700>.pollution>ul>li:nth-child(2) {
	height: 84px;
	padding: 0 22px 0 22px;
}

.content-08-h-700>.pollution>ul>li:nth-child(3),
.content-08-h-700>.pollution>ul>li:nth-child(4)  {
	line-height: 46px;
	padding: 0 22px 0 22px;
	box-sizing: border-box;
	text-align: right;
	margin-top: 10px;
	height: 30px;
	background-color: inherit;
}

.content-08-h-700>.pollution>ul>li .weather {
	/* background: #707070; */
	/* color: #fff; */
	display: inline-block;
	width: 100%;
}

.content-08-h-700>.pollution>ul>li .record {
	font-weight: 500;
	font-size: 15px;
	display: none;
}

.content-08-h-700>.pollution>ul>li .record>.fl.good>div,
	.content-08-h-700>.pollution>ul>li .record>.fl.commonly>div,
	.content-08-h-700>.pollution>ul>li .record>.fl.bad>div,
	.content-08-h-700>.pollution>ul>li .record>.fl.verybad>div {
	font-size: clamp(12px, .7vw, 16px);
}

.content-08-h-700>.pollution>ul>li .record.on {
	display: block;
}

.content-08-h-700>.pollution>ul>li .record>div:nth-child(1) {
	width: calc(25% - 8px);
	color: #97D2FF;
	border-top: 2px solid #97D2FF;
	padding-top: 10px;

	/* font-size: 15px; */
}

.content-08-h-700>.pollution>ul>li .record>div:nth-child(2) {
	width: calc(25% - 7.5px);
	color: #0CDC35;
	border-top: 2px solid #0CDC35;
	padding-top: 10px;
	margin-left: 10px;
}

.content-08-h-700>.pollution>ul>li .record>div:nth-child(3) {
	width: calc(25% - 7.5px);
	color: #FFA300;
	border-top: 2px solid #FFA300;
	padding-top: 10px;
	margin-left: 10px;
}

.content-08-h-700>.pollution>ul>li .record>div:nth-child(4) {
	width: calc(25% - 7.5px);
	color: #FD481C;
	border-top: 2px solid #FD481C;
	padding-top: 10px;
	margin-left: 10px;
}

.content-08-h-700>.pollution>ul>li .weather>a {
	display: inline-block;
	background: #E9EBEE;
	color: #707070;
	font-size: clamp(12px, 1vw, 14px);
	border-radius: 30px;
	height: 35px;
	line-height: 35px;
	width: clamp(88px, 6vw, 110px);
	text-align: center;
	font-weight: 500;
	transition: .3s;
	cursor: pointer;
}

.content-08-h-700>.pollution>ul>li .weather>a.on {
	background: #707070;
	color: #fff;
}

.content-08-h-700>.pollution>ul>li>.pollution-box {
	height: 100%;
	display: block;
	width: 100%;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul {
	/* width: calc(100% - 44px); */
	height: 100%;
	/* margin-bottom: 8px; */
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li {
	height: 100%;
	text-align: center;
	background-color: #FAFAFA;
	position: relative;
	border-radius: 14px;
	width: calc(33.3333% - 5.4px);
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li>.box>span>div {
	font-size: 20px;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li:nth-child(1)>.box.one>span>div:nth-child(2)
	{
	color: #97D2FF;
	font-size: 16px;
	margin-top: 4px;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li:nth-child(2)>.box.one>span>div:nth-child(2)
	{
	color: #97D2FF;
	font-size: 16px;
	margin-top: 4px;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li:nth-child(3)>.box.one>span>div:nth-child(2)
	{
	color: #97D2FF;
	font-size: 16px;
	margin-top: 4px;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li:nth-child(1)>.box.two>span>div:nth-child(2)
	{
	color: #0CDC35;
	font-size: 16px;
	margin-top: 4px;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li:nth-child(2)>.box.two>span>div:nth-child(2)
	{
	color: #0CDC35;
	font-size: 16px;
	margin-top: 4px;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li:nth-child(3)>.box.two>span>div:nth-child(2)
	{
	color: #0CDC35;
	font-size: 16px;
	margin-top: 4px;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li:nth-child(1)>.box.three>span>div:nth-child(2)
	{
	color: #FFA300;
	font-size: 16px;
	margin-top: 4px;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li:nth-child(2)>.box.three>span>div:nth-child(2)
	{
	color: #FFA300;
	font-size: 16px;
	margin-top: 4px;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li:nth-child(3)>.box.three>span>div:nth-child(2)
	{
	color: #FFA300;
	font-size: 16px;
	margin-top: 4px;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li:nth-child(1)>.box.four>span>div:nth-child(2)
	{
	color: #FD481C;
	font-size: 16px;
	margin-top: 4px;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li:nth-child(2)>.box.four>span>div:nth-child(2)
	{
	color: #FD481C;
	font-size: 16px;
	margin-top: 4px;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li:nth-child(3)>.box.four>span>div:nth-child(2)
	{
	color: #FD481C;
	font-size: 16px;
	margin-top: 4px;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li:nth-child(2) {
	margin-left: 8px;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li:nth-child(3) {
	margin-left: 8px;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li>.box {
	height: 100%;
	background-color: #FAFAFA;
	position: relative;
	border-radius: 14px;
	padding: 15px;
	box-sizing: border-box;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li>.box>.pol-img-01
	{
	background: url(./image/not-data.png) no-repeat 50%;
	background-size: contain;
	width: calc(100% - 40px);
	height: 36%;
	position: absolute;
	left: 35px;
	top: 50%;
	transform: translateY(-50%);
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li>.box.one>.pol-img-01
	{
	background: url(./image/expression/expression1.png) no-repeat 50%;
	background-size: contain;
	width: calc(100% - 40px);
	/* margin: 0; */
	/* right: 0; */
	height: 36%;
	/* z-index: 1; */
	/* border-radius: 13px; */
	position: absolute;
	left: 20px;
	top: 50%;
	transform: translateY(-50%);
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li>.box.two>.pol-img-01
	{
	background: url(./image/expression/expression2.png) no-repeat 50%;
	background-size: contain;
	width: calc(100% - 40px);
	margin: 0;
	right: 0;
	height: 36%;
	z-index: 1;
	border-radius: 13px;
	position: absolute;
	left: 20px;
	top: 50%;
	transform: translateY(-50%);
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li>.box.three>.pol-img-01
	{
	background: url(./image/expression/expression3.png) no-repeat 50%;
	background-size: contain;
	width: calc(100% - 40px);
	margin: 0;
	right: 0;
	height: 36%;
	z-index: 1;
	border-radius: 13px;
	position: absolute;
	left: 20px;
	top: 50%;
	transform: translateY(-50%);
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li>.box.four>.pol-img-01
	{
	background: url('./image/expression/expression4.png') no-repeat 50%;
	background-size: contain;
	width: calc(100% - 16px);
	margin: 0;
	right: 0;
	height: 36%;
	z-index: 1;
	border-radius: 13px;
	position: absolute;
	left: 6%;
	top: 50%;
	transform: translateY(-50%);
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li>.box>p {
	font-size: 18px;
	font-weight: 700;
	color: #707070;
	position: absolute;
	left: 0;
	right: 0;
	top: 30px;
	height: 32px;
	z-index: 10;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li>.box>p::before {
	content: '';
	/* background-color: #D0D0D0; */
	width: 90%;
	position: absolute;
	height: 1px;
	left: 5%;
	right: 0;
	top: 91%;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li>.box>span {
	color: #707070;
	font-weight: 500;
	font-size: clamp(.9rem, 1vw, 1rem);
	left: 0;
	display: block;
	bottom: 20px;
	right: 0;
	position: absolute;
	z-index: 100;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li>.box>span>div {
	height: 25px;
	line-height: 25px;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li>.box.one>.pol-img-02
	{
	content: '';
	background-size: cover;
	opacity: 35%;
	width: 100%;
	height: 78%;
	left: 0;
	z-index: 2;
	bottom: 0;
	position: absolute;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li>.box.two>.pol-img-02
	{
	content: '';
	background-size: cover;
	opacity: 35%;
	width: 100%;
	height: 78%;
	z-index: 2;
	bottom: 0;
	left: 0;
	position: absolute;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li>.box.three>.pol-img-02
	{
	content: '';
	background-size: cover;
	opacity: 35%;
	width: 100%;
	height: 78%;
	left: 0;
	z-index: 2;
	bottom: 0;
	position: absolute;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li>.box.four>.pol-img-02
	{
	content: '';
	background-size: cover;
	opacity: 35%;
	width: 100%;
	height: 78%;
	left: 0;
	z-index: 2;
	bottom: 0;
	position: absolute;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li>.box.one::after
	{
	content: '';
	/* 	background: url('./image/expression/expression2_2.png') no-repeat 50%; */
	background-size: cover;
	width: 100%;
	height: -webkit-fill-available;
	left: 14%;
	top: 14%;
	z-index: 1;
	top: 0;
	border-radius: 13px;
	position: absolute;
	left: 0;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li>.box.two::after
	{
	content: '';
	background: url('./image/expression/expression2_2.png') no-repeat 50%;
	/* 	background: url('./image/expression/expression3_2.png') no-repeat 50%; */
	background-size: cover;
	width: 100%;
	height: -webkit-fill-available;
	left: 14%;
	top: 14%;
	z-index: 1;
	top: 0;
	border-radius: 13px;
	position: absolute;
	left: 0;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li>.box.three::after
	{
	content: '';
	background: url('./image/expression/expression3_2.png') no-repeat 50%;
	/* 	background: url('./image/expression/expression4_2.png') no-repeat 50%; */
	background-size: cover;
	width: 100%;
	height: -webkit-fill-available;
	left: 14%;
	top: 14%;
	z-index: 1;
	top: 0;
	border-radius: 13px;
	position: absolute;
	left: 0;
}

.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li>.box.four::after
	{
	content: '';
	background: url('./image/expression/expression4_2.png') no-repeat 50%;
	/* 	background: url('./image/expression/expression4_2.png') no-repeat 50%; */
	background-size: cover;
	width: 100%;
	height: -webkit-fill-available;
	left: 14%;
	top: 14%;
	z-index: 1;
	top: 0;
	border-radius: 13px;
	position: absolute;
	left: 0;
}
/* 대기오염 정보 e */

/* 기상가뭄예경보  s*/
.drag-t-txt {
	    line-height: 30px;
	    margin: 0 0 0 9px;
	    display: none;
}
.drought-all {
	height: 100%;
	/* padding: 0 22px; */
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 10px 10px;
}
.drought.middle .drought-all>.drought-play {
	display: none;
}
.drought.small .drought-all>.drought-play {
	display: none;
}
 .drought-all>.drought-play {
	
	width: calc(50% - 5px);
	height: calc(100% - 45px);
	margin: 0;
	display: flex;
}

.drought-all>.drought-play>.drought-box {
	height: 100%;
	position: relative;
	margin: 0;
	width: 100%;
}

.drought-all>.drought-play>.drought-box>.drought-map {
	height: 100%;
	/* 	background: url('./image/korea.png') 50%/ contain no-repeat; */
	width: 100%;
	border-radius: 10px;
	box-sizing: border-box;
	border: 1px solid #E6E6E6;
}

.drought-all>.drought-play>.drought-box>.drought-map img {
	margin-top: 15px;
	max-width: 100%;
	max-height: calc(100% - 60px);
	height: 100%;
}

.drought-legend {
	margin-top: 10px;
	width: 100%;
}

.drought-legend ul {
	display: flex;
	justify-content: center;
}

.drought-legend ul li {
	margin: 0 14px 0 0;
	color: #707070;
	font-weight: 500;
	display: flex;
	align-items: center;
}

.drought-legend ul li:last-child {
	margin: 0;
}

.drought-legend ul li span {
	width: 12px;
	height: 12px;
	display: block;
	margin-right: 5px;
	border-radius: 20px;
}

.drought-legend ul li p {
	font-size: clamp(12px, 1vw, 14px);
}
.drought.middle .drought-all>.drought-table {
	width: 100%;
}
.drought.small .drought-all>.drought-table {
	width: 100%;
}
.drought-all>.drought-table {
	width: calc(50% - 5px);
	/* margin-left: 8px; */
	/* height: calc(100% - 45px); */
	height: 100%;
	overflow: auto;
	margin: 0;
	display: flex;
}

.drought-list {
	/* overflow-y: hidden; */
	display: flex;
	width: 100%;
	gap: 10px;
	height: 35px;
	/* overflow-x: auto; */
}
.drought.big .drought-list select{
	display: none !important;
}
.drought.middle .drought-list select{
	/* display: block !important; */
}
.drought.middle .drought-list ul{
	display: none !important;
}
.drought.small .drought-list ul{
	display: none !important;
}
.drought-list ul {
	display: flex;
	/* width: 350px; */
	/* margin: 0 0 10px 0; */
	justify-content: flex-start;
	gap: 5px;
	margin: 0;
	height: auto;
}

.drought-list ul li {
	display: inline-block;
	background: #f4f4f4;
	color: #696969;
	/* font-size: clamp(12px, .5vw, 14px); */
	border-radius: 30px;
	height: 35px;
	line-height: 35px;
	width: clamp(88px, 6vw, 100px);
	text-align: center;
	font-weight: 500;
	cursor: pointer;
	transition: .3s;
	margin: 0;
}
.drought-list ul li a{
	color: #696969;
}
.drought-list ul li.on a{
	color: #fff;
}
.drought-list ul li.on {
	background: #707070;
	color: #fff;
}

.drought-all>.drought-table table {
	height: 100%;
	width: 100%;
}

.drought-all>.drought-table table thead tr {
	height: 35px;
	background: #f4f4f4;
	width: 100%;
	font-weight: 300;
}

.drought-all>.drought-table table tbody tr {
	height: 25%;
	border-bottom: 1px solid #E6E6E6;
}

.drought-all>.drought-table table tbody tr td:first-child {
	text-align: center;
	line-height: 20px;
	border-right: 1px solid #E6E6E6;
}

.drought-all>.drought-table table tbody tr td:nth-child(n+2) {
	padding: 10px;
	/* width: 80%; */
}

.drought-all>.drought-table table tbody tr td {
	font-size: 12px;
	color: #707070;
	text-align: left;
	/* border-bottom: 1px solid #E6E6E6; */
	box-sizing: border-box;
}

.drought-all>.drought-table table tbody tr td span {
	width: 12px;
	height: 12px;
	display: block;
	border-radius: 20px;
	margin-bottom: 4px;
}
/* 기상가뭄예경보  e*/

/* 유해야생동물  / 피해작물 s*/
.noxiousWild .left-box {
	width: calc(53% - 38px);
	height: calc(100% - 50px);
	padding-right: 16px;
	padding-left: 22px;
}

.noxiousWild .left-box .noxious-box {
/* 	background: url('./image/noxious-01.png') 50%/contain no-repeat; */
	height: 100%;
}

.noxiousWild .left-box .noxious-02-box {
/* 	background: url('./image/noxious-02.png') 50%/contain no-repeat; */
	height: 100%;
}

.noxiousWild .right-box {
	height: calc(100% - 50px);
	width: 47%;
	box-sizing: border-box;
	padding: 0 22px 0 16px;
	border-left: 1px solid #ddd;
}

.noxiousWild .right-box .noxious-list {
	height: 100%;
}

.noxiousWild .right-box .noxious-list ul {
	height: 100%;
	display: flex;
	width: calc(50% - 10px);
	flex-direction: column;
}

.noxiousWild .right-box .noxious-list ul li {
	display: flex;
	margin: 0;
	align-items: center;
	flex-basis: 60px;
}

.noxiousWild .right-box .noxious-list ul li .list-01-img {
	background: #C1D8F1 url('./image/noxious/animal_04.png') 50%/contain
		no-repeat;
}

.noxiousWild .right-box .noxious-list ul li .list-02-img {
	background: #C1D8F1 url('./image/noxious/animal_02.png') 50%/contain
		no-repeat;
}

.noxiousWild .right-box .noxious-list ul li .list-03-img {
	background: #C1D8F1 url('./image/noxious/animal_01.png') 50%/contain
		no-repeat;
}

.noxiousWild .right-box .noxious-list ul li .list-04-img {
	background: #C1D8F1 url('./image/noxious/animal_05.png') 50%/contain
		no-repeat;
}

.noxiousWild .right-box .noxious-list ul li .list-05-img {
	background: #C1D8F1 url('./image/noxious/animal_03.png') 50%/contain
		no-repeat;
}
.noxiousWild .right-box .noxious-list ul li .list-06-img {
	background: #C1D8F1 url('./image/noxious/animal_06.png') 50%/contain
		no-repeat;
}
.noxiousWild .right-box .noxious-list ul li .list-07-img {
	background: #C1D8F1 url('./image/noxious/animal_07.png') 50%/contain
		no-repeat;
}
.noxiousWild .right-box .noxious-list ul li .list-08-img {
	background: #C1D8F1 url('./image/noxious/animal_08.png') 50%/contain
		no-repeat;
}

.noxiousWild .right-box .noxious-list ul li .list-two-01-img {
	background: #E4FC9D url('./image/noxious/farm_01.png') 50%/contain
		no-repeat;
}

.noxiousWild .right-box .noxious-list ul li .list-two-02-img {
	background: #E4FC9D url('./image/noxious/farm_03.png') 50%/contain
		no-repeat;
}

.noxiousWild .right-box .noxious-list ul li .list-two-03-img {
	background: #E4FC9D url('./image/noxious/farm_05.png') 50%/contain
		no-repeat;
}

.noxiousWild .right-box .noxious-list ul li .list-two-04-img {
	background: #E4FC9D url('./image/noxious/farm_02.png') 50%/contain
		no-repeat;
}

.noxiousWild .right-box .noxious-list ul li .list-two-05-img {
	background: #E4FC9D url('./image/noxious/farm_04.png') 50%/contain
		no-repeat;
}

.noxiousWild .right-box .noxious-list ul li .list-two-06-img {
	background: #E4FC9D url('./image/noxious/farm_06.png') 50%/contain
		no-repeat;
}

.noxiousWild .right-box .noxious-list ul li .list-two-07-img {
	background: #E4FC9D url('./image/noxious/farm_07.png') 50%/contain
		no-repeat;
}

.noxiousWild .right-box .noxious-list ul li .nox-bg-b {
	height: clamp(30px, 2vw, 36px);
	width: clamp(30px, 2vw, 36px);
	margin: 0;
	border-radius: 30px;
}





.noxiousWild .right-box .noxious-list ul li .list-01-infor {
	margin: 0;
	padding-left: 4px;
}

.noxiousWild .right-box .noxious-list ul li .list-01-infor strong {
	width: 100%;
	display: block;
	font-size: clamp(14px, .9vw, 16px);
	text-align: left;
	color: #707070;
}

.noxiousWild .right-box .noxious-list ul li .list-01-infor p {
	color: #707070;
	padding-top: 2px;
	font-size: clamp(12px, .6vw, 14px);
}

.noxiousWild .noxious-infor {
	display: flex;
	align-items: center;
	width: 100%;
	box-sizing: border-box;
	padding: 0 22px;
	justify-content: flex-end;
}

.noxiousWild .noxious-infor .blue {
	margin: 0;
	font-size: 13px;
	color: #69AEF2;
}

.noxiousWild .noxious-infor .btn-more {
	margin: 0;
	padding: 0;
	height: 30px;
}
/* 유해야생동물  / 피해작물 e*/

/* 소음  측정 s*/
.noise .noise-instrument {
	position: absolute;
	height: calc(80% - 88px);
	width: 100%;
	padding: 0 22px;
	box-sizing: border-box;
}

.noise .noise-instrument .left-01-img {
	background: url(./image/noise/left-noise-box-02.png) 50%/80% no-repeat;
	width: 50%;
	height: 100%;
	top: -50px;
	display: grid;
	grid-template-columns: 1fr 1fr .25fr 1fr 1fr;
	margin: 0;
	position: absolute;
	z-index: -1;
	align-items: center;
	justify-content: center;
}

.noise .noise-instrument .left-02-img {
	background: url(./image/noise/left-noise-box-01.png) 50%/80% no-repeat;
	width: 50%;
	height: 100%;
	top: -50px;
	display: grid;
	grid-template-columns: 1fr 1fr .65fr 1fr 1fr;
	margin: 0;
	position: absolute;
	z-index: -1;
	align-items: center;
	justify-content: center;
}

.noise .noise-instrument .left-03-img {
	width: clamp(45%, 0.9vw, 50%);
    /* height: calc(100% + 50px); */
    height: 90%;
    top: -42px;
    margin: 0;
    position: absolute;
    z-index: -1;
    right: 10%;
}

.noise .noise-instrument .left-03-img .air-noise-01 {
	background: url(./image/noise/top-noise-01.png) 50%/contain no-repeat;
	height: 40%;
}

.noise .noise-instrument .left-03-img .air-noise-02 {
	background: url(./image/noise/air-noise-02.png) 50%/contain no-repeat;
	height: 60%;
	display: grid;
	grid-template-rows: 1fr 1fr 1fr;
	grid-template-columns: .6fr 1fr .6fr;
}

.noise .noise-instrument .left-03-img p {
	font-size: clamp(30px, 1vw, 40px);
	font-weight: 900;
	grid-column: 2;
	width: 100%;
	color: #fff;
	grid-row: 3;
	display: flex;
	justify-content: center;
	align-items: center;
}

.noise .noise-instrument .left-01-img p {
	font-size: clamp(20px, 1vw, 30px);
	font-weight: 900;
	margin: 0;
	grid-column: 2;
}

.noise .noise-instrument .left-02-img p {
	font-size: clamp(20px, 1vw, 30px);
	font-weight: 900;
	margin: 0;
	grid-column: 2;
}

.noise .noise-instrument .right-01-img {
    background: url(./image/noise/track-noise-01.png) 50%/contain no-repeat;
    width: clamp(calc(50% - 70px), 0.9vw, calc(50% - 20px));
    height: 100%;
    position: absolute;
    right: 58px;
    top: -50px;
    z-index: -1;
}

.noise .noise-infor {
	width: 50%;
	margin: 0;
	padding-left: 22px;
	height: 100%;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	margin: 0;
	justify-content: space-between;
}

.noise .noise-infor .noise-area {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	margin: 0;
	gap: 10px;
}

.noise .noise-infor .re-noise-num {
	display:none;
}

.noise .noise-infor .air-noise-b-box {
	flex-basis: 140px;
    z-index: 10;
    display: flex;
    align-items: flex-end;
    width: 100%;
}

.noise .noise-infor .noise-area .noise-h1 {
	background: #97D2FF;
    color: #fff;
    padding: 2px 12px;
    border-radius: 12px;
    display: inline-block;
    box-sizing: border-box;
    font-weight: 500;
}

.noise .noise-infor .noise-area .t-txt {
	margin-left:12px;
}

.noise .noise-infor .noise-area p {
	text-align: left;
	margin: 0;
	line-height: 22px;
	font-weight: 500;
}

.noise .noise-infor .noise-legend {
	margin: 0;
	width: 100%;
	height: 40%;
}

.noise .noise-infor .noise-legend table {
	width: 100%;
	height: 100%;
}

.noise .noise-infor .noise-legend table thead {
	height: 30px;
	background: #E9EBEE;
}

.noise .noise-infor .noise-legend table thead tr th .tip {
	width: 18px;
	height: 18px;
	background: #C5C6C8;
	border-radius: 20px;
	color: #fff;
	font-size: 11px;
	line-height: 18px;
	margin: 0 4px 0 6px;
}

.noise .noise-infor .noise-legend table thead tr th p {
	height: 18px;
	line-height: 18px;
	font-size: 13px;
	font-weight: 400;
}

.noise .noise-infor .noise-legend table tbody tr {
	background: #fff;
}

.noise .noise-infor .noise-legend table tbody tr td {
	border-bottom: 1px solid #D9D9D9;
	border-top: 1px solid #D9D9D9;
}

.noise .noise-infor .noise-legend table tbody tr td span {
	width: 24px;
	height: 12px;
	display: block;
	margin: 0 6px 0 8px;
}

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

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

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

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

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

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

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

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

.noise-btn {
    padding: 0;
    position: absolute;
    right: 22px;
    bottom: 22px;
    width: 120px;
    text-align: right;
    height: 30px;
}


.noiseair-btn {
	padding: 0;
    width: 100%;
    text-align: left;
    height: 30px;
    z-index: 10;
    margin-bottom: 10px;
}

/* 수질 정보 s */
.w-q-container {
	height: calc(100% - 88px);
	padding-bottom: 22px;
	box-sizing: border-box;
	margin: 0 22px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.w-q-container .top-box {
	height: calc(60% - 18px);
	box-sizing: border-box;
	/* padding: 0 0 16px; */
	width: 100%;
}

.w-q-container .top-box .w-q-box {
	height: 100%;
	width: 30%;
	box-sizing: border-box;
	padding: 0 0 0 12px;
}

.w-q-container .top-box .box-01 {
	background: url('./image/waterquality/water-kind-01.png') 50%/contain
		no-repeat;
	width: 30%;
	box-sizing: border-box;
	padding: 0 12px 0 0;
}

.w-q-container .top-box .box-02 {
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 40%;
	box-sizing: border-box;
	padding: 0 12px;
	border-left: 1px solid #ddd;
	border-right: 1px solid #ddd;
}

.w-q-container .top-box .box-02 .w-q-name {
	font-size: clamp(16px, 1vw, 20px);
	color: #707070;
	font-weight: 500;
	text-align: left;
	margin: 0;
	height: 20%;
	display: flex;
	align-items: center;
}
.w-q-container .top-box .w-q-data-txt {
	display:none;
}
.w-q-container .top-box .box-02 .w-q-value {
	display: flex;
	align-items: center;
	margin: 0;
	height: 60%;
	width: 100%;
}

.w-q-container .top-box .box-02 .w-q-value ul:first-child {
	margin: 0;
}

.w-q-container .top-box .box-02 .w-q-value ul:first-child li {
	color: #C1D8F1;
	font-size: clamp(20px, 1vw, 10px);
	font-weight: 300;
}

.w-q-container .top-box .box-02 .w-q-value ul:nth-child(2) {
	margin: 0;
	width: 100%;
	line-height: 22px;
}

.w-q-container .top-box .box-02 .w-q-value ul:nth-child(2) li {
	color: #707070;
	font-size: clamp(12px, 1vw, 20px);
	font-weight: 800;
	line-height: 26px;
	width: 100%;
	display: flex;
	align-items: center;
}

.w-q-container .top-box .box-02 .w-q-value ul:nth-child(2) li p {
	color: #fff;
	background: #C5C6C8;
	height: 18px;
	width: 18px;
	display: block;
	line-height: 18px;
	border-radius: 10px;
	font-size: 11px;
	font-weight: 700;
	margin: 0 0 0 4px;
	cursor: pointer;
	position: relative;
}
.w-q-container .top-box .box-02 .w-q-value ul:nth-child(2) li  .w-q-tooltip {
	display:none;
	}

.w-q-container .top-box .box-02 .w-q-value ul:nth-child(2) li  p:hover .w-q-tooltip {
	display:block;
    position: absolute;
    top: -114px;
    color: #707070;
    left: -108px;
    letter-spacing: .25px;
    line-height: 21px;
    border-radius: 21px;
    font-weight: 400;
    width: 210px;
    background: #fff;
    cursor: auto;
    padding: 12px;
    box-shadow: 0 3px 6px #bdbdbd6e;
    text-align: left;
}

.w-q-container .top-box .box-02 .w-q-value ul:nth-child(2) li  p:hover .w-q-tooltip::before
	{
	border-bottom: 12px solid transparent;
	border-top: 12px solid #ffffff;
	border-left: 12px solid transparent;
	border-right: 12px solid transparent;
	content:"";
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	right: 0;
	width: 0px;
	bottom: -24px;
}

.w-q-container .top-box .box-02 .w-q-value ul:nth-child(2) li:nth-child(2)
	{
	color: #C1D8F1;
	text-align: left;
	font-weight: 600;
}

.w-q-container .top-box .box-03 ul {
	display: flex;
	flex-direction: column;
	align-content: space-between;
	height: 100%;
	justify-content: space-between;
}

.w-q-container .top-box .box-03 ul li:first-child {
	justify-content: flex-end;
	color: #69AEF2;
}

.w-q-container .top-box .box-03 ul li {
	height: 100%;
	display: flex;
	font-size: 13px;
	box-sizing: border-box;
	width: 100%;
	border-bottom: 1px solid #D9D9D9;
	justify-content: space-between;
	align-items: center;
}

.w-q-container .top-box .box-03 ul li p {
	margin: 0;
	font-weight: 500;
	color: #707070;
}

.w-q-container .top-box .box-03 ul li p:first-child {
	color: #69AEF2;
}

.w-q-container .t-txt {    
	height: 30px;
    line-height: 30px;
}
/* 수질 정보 e */

/* 야생동물 질병 검사 결과 s */
.wild-content {
	height: calc(100% - 30px) !important;
}

.chart .wild-select {
	display:none;
}
.wild-content p, .wild-content .decision {
	margin: 0;
	line-height: 22px;
	font-weight: 500;
	grid-row: 3;
}
.wild-content .wild-img:hover .wild-txt-blue, 
.wild-content .wild-img:hover .wild-txt-red {
	transform:translateY(-3px);
	transition: .3s;
}

.wild-content .wild-txt-blue {
	color: #589cd0;
	font-size: 12px;
    line-height: 16px;
}

.wild-content .wild-txt-red {
	color: #8e5347;
	font-weight: 900;
	font-size: 16px;
    line-height: 16px;
}
/* .group-wildAnimals.resize1 .wild-content .wild-img {
	height: calc(100% - 62px);
}
.group-wildAnimals.resize2 .wild-content .wild-img {
	height: calc(100% - 62px);
} */
.wild-content .wild-img {
    height: calc(100% - 83px);
	width: calc(100% - 40px);
	display: grid;
	margin: 0 20px 0;
/* 	cursor: pointer; */
	margin-top: 8px;
    grid-template-rows: 1fr 4fr 1.6fr .2fr;
}
.wild-content .w-s-txt {
	height: 52px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.wild-content .wild-img.pig {
/* 	background: url(./image/pig-img.png); */
	background: url(./image/pig-img-02.png);
	background-position: 50%;
	background-repeat: no-repeat;
	background-size: contain;
	transition: .3s;
}

.wild-content .wild-img.bird {
	background: url(./image/bird-icon.png);
	background-position: 50%;
	background-repeat: no-repeat;
	background-size: contain;
}

.wild-content .wild-informaiton {
	height: calc(50% - 36px);
	margin: 10px 0;
	display:none;
}
/* .group-wildAnimals.resize1 .wild-content .wild-informaiton {
	display:none;
}
.group-wildAnimals.resize2 .wild-content .wild-informaiton {
	display:none;
} */
.wild-content .wild-informaiton .wild-date {
	font-size: 12px;
	font-weight: 300;
	text-align: left;
	color: #C5C6C8;
}

.wild-content .wild-informaiton strong {
	width: 100%;
	display: block;
	line-height: 18px;
	text-align: left;
	margin-bottom: 8px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.wild-content .wild-informaiton ul {
	height: 100%;
	overflow: auto;
	display: flex;
	flex-direction: column;
	width: 100%;
	justify-content: space-between;
}

.wild-content .wild-informaiton ul li {
	font-size: 13px;
	cursor: pointer;
	text-align: left;
	height: calc(100% / 5);
	border-top: 1px solid #D9D9D9;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	display: flex;
	margin: 0;
	align-items: center;
}
.wild-content .wild-informaiton ul li.on {
	font-weight: 600;
}
.wild-content .wild-informaiton ul li:hover {
	background:#f7f7f7;
	transition:.3s;
}
.wild-content .wild-informaiton ul li:last-child {
	border-bottom: 1px solid #D9D9D9;
	
}

.wild-content .wild-informaiton ul li span {
	font-size: 12px;
	font-weight: 300;
	text-align: left;
	color: #C5C6C8;
	margin: 0 0 0 10px;
}
/* 야생동물 질병 검사 결과 e */
.w-q-container .bottom-box {
	height: 50%;
}

.w-q-container .bottom-box .w-q-table {
	height: 100%;
}


.w-q-container .bottom-box .w-q-table table thead tr {
	height: 38px;
}

.w-q-container .bottom-box .w-q-table table thead tr th {
	font-size: clamp(11px, .9vw, 10px);
    background: #e9ebee;
}

.w-q-container .bottom-box .w-q-table table tbody tr td {
	border-bottom: 1px solid #D9D9D9;
	border-top: 1px solid #D9D9D9;
	font-weight: 500;
	font-size: clamp(10px, .85vw, 12px);
	text-align: center;
	position: relative;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.w-q-container .bottom-box .w-q-table table tbody tr td.gray-box {
	width: 20%;
}

.w-q-container .bottom-box .w-q-table table tbody tr td p {
	display: flex;
	align-items: center;
	justify-content: center;
}

.w-q-container .bottom-box .w-q-table table tbody tr td p:nth-child(2) {
	width: 13px;
	position: absolute;
	height: 18px;
	top: 0;
	bottom: 0;
	left: 48px;
	right: 0;
	height: 100%;
}

.w-q-container .bottom-box .w-q-table table tbody tr td p span {
	width: 13px;
	height: 19px;
	margin: 0 0 0 3px;
}

.w-q-container .bottom-box .w-q-table table tbody tr td .img-01 {
	background: url('./image/waterquality/water-kind-01.png') 50%/contain
		no-repeat;
}

.w-q-container .bottom-box .w-q-table table tbody tr td .img-02 {
	background: url('./image/waterquality/water-kind-02.png') 50%/contain
		no-repeat;
}

.w-q-container .bottom-box .w-q-table table tbody tr td .img-03 {
	background: url('./image/waterquality/water-kind-03.png') 50%/contain
		no-repeat;
}

.w-q-container .bottom-box .w-q-table table tbody tr td .img-04 {
	background: url('./image/waterquality/water-kind-04.png') 50%/contain
		no-repeat;
}

.w-q-container .bottom-box .w-q-table table tbody tr td .img-05 {
	background: url('./image/waterquality/water-kind-05.png') 50%/contain
		no-repeat;
}

.w-q-container .bottom-box .w-q-table table tbody tr td .img-06 {
	background: url('./image/waterquality/water-kind-06.png') 50%/contain
		no-repeat;
}

.w-q-container .bottom-box .w-q-table table tbody tr td .img-07 {
	background: url('./image/waterquality/water-kind-07.png') 50%/contain
		no-repeat;
}

/* 공간정보서비스 / 공간정보 공유포털 위젯 s */
.l-t-e-all {
	display: flex;
	flex-direction: column;
	gap: 14px;
	position: relative;
    z-index: 20;
}
.l-t-e-all-bg {
	height: 100%;
	/* position: absolute; */
	/* top: 0; */
	width: 100%;
	/* border: 1.5px solid #d6e4ff; */
	/* border-radius: 40px; */
	box-sizing: border-box;
	/* box-shadow: inset 0 9px 18px #6d8ecb1a; */
	display: none;
}

.l-t-e-all .silder-box {
	height: calc(100% - 43px);
	margin: 0;
	position: relative;
	padding: 0 23px;
}

.l-t-e-all .silder-box .img-01 {
	background: url('./image/01.png') 50%/cover;
	height: 100%;
	border-radius: 30px;
	transition: .4s cubic-bezier(0.5, 0.01, 0.26, 1.14);
}

.l-t-e-all .silder-box .img-02 {
	background: url('./image/02.png') 50%/cover;
	height: 100%;
	border-radius: 30px;
	transition: .4s cubic-bezier(0.5, 0.01, 0.26, 1.14);
}
.l-t-e-all .silder-box .slider-num {
	position: absolute;
    bottom: 25px;
    left: 52px;
    z-index:10;
}
.l-t-e-all .silder-box .slider-num {
	color: #fff;
    letter-spacing: 6px;
    font-weight: 700;
    font-size: 12px;
}

.l-t-e-all .silder-box a {
	position: absolute;
	right: 42px;
	bottom: 22px;
	color: #4A4A4A;
	font-weight: 600;
	backdrop-filter: brightness(156%) blur(8px);
	padding: 10px 20px;
    z-index:10;
	border-radius: 50px;
}

.l-t-e-all .select-01 {
	box-sizing: border-box;
	position: relative;
	width: calc(100% - 44px);
	height: 43px;
	background-size: 20px;
	cursor: pointer;
	background: #F6F6F6;
	position: relative;
	border-radius: 50px;
}

.l-t-e-all .select-01:before {
	content: '';
    position: absolute;
    right: 26px;
    top: 50%;
    transform: translateY(-50%);
    width: 11px;
    height: 9px;
    background: url(./image/arrow_b.png) 0 0 no-repeat;
    background-size: 11px 9px;
    transition: .3s;
}
.l-t-e-all .select-01.on:before {
	transform: rotate(180deg);
    top: 40%;
}

.l-t-e-all .select-01 .label {
	display: flex;
	align-items: center;
	width: inherit;
	height: inherit;
	border: 0 none;
	padding-left: 15px;
	font-weight: 400;
	cursor: pointer;
	color: #707070;
}

.l-t-e-all .select-01 ul {
	position: absolute;
	top: 56px;
	border-top-right-radius: 22px;
    border-top-left-radius: 22px;
	width: 100%;
	list-style-type: none;
	box-sizing: border-box;
	overflow: hidden;
	max-height: 0;
	box-shadow: 0 3px 16px #30383c24;
	z-index: 10;
	transition: .5s cubic-bezier(.5, .01, 0, 1.18);
}

.l-t-e-all .select-01 ul.on {
	max-height: 120px;
	overflow: auto;
}

.l-t-e-all .select-01 ul li {
	font-weight: 400;
	font-size: 14px;
	padding: 0 30px;
	line-height: 40px;
	height: 40px;
	box-sizing: border-box;
	transition: .3s;
	text-align: left;
	background-color: #f6f6f6;
}

.l-t-e-all .select-01 ul li a {
	color: #707070;
}
/* 공간정보서비스 / 공간정보 공유포털 위젯 e */

/* 토지이용규제  s */
.e-L-container {
	height: calc(100% - 88px);
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	gap: 23px;
}

.e-L-container .e-l-img {
	background: url(./image/img-map-p.png) 50%/contain no-repeat;
	margin: 0;
	flex: .9;
}

.e-L-container .e-l-txt {
	width: calc(100% - 80px);
}

.e-L-container .e-l-txt strong {
	display: block;
	font-size: 16px;
	text-align: left;
	margin-bottom: 12px;
}

.e-L-container .e-l-txt span {
	text-align: left;
	font-size: 15px;
	display: block;
}
.e-L-container .btn-more {
	text-align: left;
    margin-left: 40px;
}

/* 토지이용규제  e */

/* 보드 추가 팝업창 */
.pop-up-plus.on {
	display: block;
}

.pop-up-plus {
	display: none;
	background-color: #ffffff;
	backdrop-filter: brightness(136%) blur(16px);
	width: 320px;
	border-radius: 30px;
	cursor: default;
	position: absolute !important;
	z-index: 999;
	left: 110px;
	/* transform: translate(-50%, -50%); */
	top: calc(100% - 332px - -115px);
	box-shadow: 2px 2px 7px 0px #0000001c;
}

.pop-up-plus>.plus-content {
	padding: 0 12px 0 20px;
	height: 540px;
	overflow-y: auto;
	overflow-x: hidden;
	margin-bottom: 36px;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.pop-up-plus>.plus-content>.row {
	display: flex;
	flex-direction: column;
	margin: 0;
	width: 276px;
}
.pop-up-plus>.plus-content>.row:last-child {
	margin-bottom: 12px;
}

.pop-up-plus .plus-content .row .row-list ul .toggleBoard.on {
	transition: .2s;
	border: 1px solid #8eb6dd;
	background: #8eb6dd;
	box-shadow: 2px 2px 7px 0px #00000033;
}

.pop-up-plus .plus-content .row p {
	margin: 0 0 14px;
	font-size: 14px;
	font-weight: 500;
	color: #2C2C2C;
}

.pop-up-plus>.plus-content>.row>.row-list {
	width: 100%;
	flex: 1 0 auto;
}

.pop-up-plus>.plus-content>.row>.row-list>ul {
	display: flex;
	gap: 11%;
}

.pop-up-plus .plus-content .row .row-list ul li {
	color: #fff;
	border: none;
	margin: 0;
	border-radius: 17px;
	cursor: pointer;
}
.pop-up-plus .plus-content .row .row-list ul li .grid-stack-item-content {
	padding: 0 !important;
}
.pop-up-plus .plus-content .row .row-list ul li.bg {
	border: 1px solid #e0e0e0;
	background: #fff;
}

.pop-up-plus .plus-content .row .row-list ul li span {
	text-align: center;
	display: block;
	width: 70px;
	font-size: 12px;
	color: #222;
	margin-top: 12px;
}

.pop-up-plus .plus-content .row .row-list ul li p {
	text-align: center;
	display: block;
	font-size: 12px;
	margin: 2px 0 0 0;
	color: #B4B4B4;
	line-height: 22px;
}

.pop-up-plus .plus-content .row .row-list ul li span.black {
	color: #2C2C2C;
}

.pop-up-plus>.plus-content>.row>.row-list>ul>.toggleBoard.on>span {
	color: #ffffff;
	font-weight: 500;
	/* border-bottom: 1px solid #8eb6dd; */
	display: table;
}

.pop-up-plus .plus-content .row .row-list ul li .board-img {
	box-shadow: none;
}

.pop-up-plus .plus-content .row .row-list ul li .widget-img {
	width: 72px;
	height: 74px;
	box-shadow: 0 1px 6px #7a808238;
	border-radius: 20px;
	transition: .3s;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-01 {
	cursor: pointer;
	background: url(./image/widget/widget-01-icon.png) 50%/52px no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-01:active,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-01:hover,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-01.on {
	background: #69AEF2 url(./image/widget/widget-01-icon-a.png) 50%/50px
		no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-02 {
	cursor: pointer;
	background: url(./image/widget/widget-02-icon.png) 50%/52px no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-02:active,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-02:hover,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-02.on {
	background: #69AEF2 url(./image/widget/widget-02-icon-a.png) 50%/50px
		no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-03 {
	cursor: pointer;
	background: url(./image/widget/widget-03-icon.png) 50%/52px no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-03:active,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-03:hover,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-03.on {
	background: #69AEF2 url(./image/widget/widget-03-icon-a.png) 50%/50px
		no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-04 {
	cursor: pointer;
	background: url(./image/widget/widget-04-icon.png) 50%/52px no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-04:active,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-04:hover,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-04.on {
	background: #69AEF2 url(./image/widget/widget-04-icon-a.png) 50%/50px
		no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-05 {
	cursor: pointer;
	background: url(./image/widget/widget-06-icon.png) 50%/52px no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-05:active,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-05:hover,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-05.on {
	background: #69AEF2 url(./image/widget/widget-06-icon-a.png) 50%/50px
		no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-06 {
	cursor: pointer;
	background: url(./image/widget/widget-05-icon.png) 50%/52px no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-06:active,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-06:hover,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-06.on {
	background: #69AEF2 url(./image/widget/widget-05-icon-a.png) 50%/50px
		no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-07 {
	cursor: pointer;
	background: url(./image/widget/widget-10-icon.png) 50%/52px no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-07:active,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-07:hover,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-07.on {
	background: #69AEF2 url(./image/widget/widget-10-icon-a.png) 50%/50px
		no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-08 {
	cursor: pointer;
	background: url(./image/widget/widget-13-icon.png) 50%/52px no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-08:active,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-08:hover,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-08.on {
	background: #69AEF2 url(./image/widget/widget-13-icon-a.png) 50%/50px
		no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-09 {
	cursor: pointer;
	background: url(./image/widget/widget-11-icon.png) 50%/52px no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-09:active,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-09:hover,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-09.on {
	background: #69AEF2 url(./image/widget/widget-11-icon-a.png) 50%/50px
		no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-10 {
	cursor: pointer;
	background: url(./image/widget/widget-12-icon.png) 50%/52px no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-10:active,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-10:hover,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-10.on {
	background: #69AEF2 url(./image/widget/widget-12-icon-a.png) 50%/50px
		no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-11 {
	cursor: pointer;
	background: url(./image/widget/widget-08-icon.png) 50%/52px no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-11:active,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-11:hover,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-11.on {
	background: #69AEF2 url(./image/widget/widget-08-icon-a.png) 50%/50px
		no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-12 {
	cursor: pointer;
	background: url(./image/widget/widget-07-icon.png) 50%/52px no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-12:active,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-12:hover,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-12.on {
	background: #69AEF2 url(./image/widget/widget-07-icon-a.png) 50%/50px
		no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-13 {
	cursor: pointer;
	background: url(./image/widget/widget-14-icon.png) 50%/52px no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-13:active,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-13:hover,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-13.on {
	background: #69AEF2 url(./image/widget/widget-14-icon-a.png) 50%/50px
		no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-14 {
	cursor: pointer;
	background: url(./image/widget/widget-15-icon.png) 50%/52px no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-14:active,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-14:hover,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-14.on {
	background: #69AEF2 url(./image/widget/widget-15-icon-a.png) 50%/50px
		no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-15 {
	cursor: pointer;
	background: url(./image/widget/widget-09-icon.png) 50%/52px no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-15:active,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-15:hover,
	.pop-up-plus .plus-content .row .row-list ul li .box-img-15.on {
	background: #69AEF2 url(./image/widget/widget-09-icon-a.png) 50%/50px
		no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-16 {
	cursor: pointer;
	background: url(./image/widget/site-img-box-01.png) 50%/50px no-repeat;
}
.pop-up-plus .plus-content .row .row-list ul li .box-img-16:active,
.pop-up-plus .plus-content .row .row-list ul li .box-img-16:hover,
.pop-up-plus .plus-content .row .row-list ul li .box-img-16.on {
	cursor: pointer;
	background: #69AEF2 url(./image/widget/site-img-box-01.png) 50%/38px no-repeat;
}
.pop-up-plus .plus-content .row .row-list ul li .box-img-17 {
	cursor: pointer;
	background: url(./image/widget/widget-16-icon.png) 50%/40px no-repeat;
}
.pop-up-plus .plus-content .row .row-list ul li .box-img-17:active,
.pop-up-plus .plus-content .row .row-list ul li .box-img-17:hover,
.pop-up-plus .plus-content .row .row-list ul li .box-img-17.on {
	cursor: pointer;
	background: #69AEF2 url(./image/widget/widget-16-icon-a.png) 50%/38px no-repeat;
}

.pop-up-plus .plus-content .row .row-list ul li .box-img-18 {
	cursor: pointer;
	background: url(./image/widget/widget-17-icon.png) 50%/40px no-repeat;
}
.pop-up-plus .plus-content .row .row-list ul li .box-img-18:active,
.pop-up-plus .plus-content .row .row-list ul li .box-img-18:hover,
.pop-up-plus .plus-content .row .row-list ul li .box-img-18.on {
	cursor: pointer;
	background: #69AEF2 url(./image/widget/widget-17-icon-a.png) 50%/38px no-repeat;
}



/* .pop-up-plus .plus-content .row .row-list ul li .box-img-10 {
	cursor: pointer;
	background: url(./image/logo-k-100.png) no-repeat 50%;
    background-size: 100%;
    width: 50%;
    margin: 20px auto;
    height: 50%;
    border-radius: 8px;
}
.pop-up-plus .plus-content .row .row-list ul li .box-img-11 {
	cursor: pointer;
	background: url(./image/logo-k-200.png) no-repeat 50%;
    background-size: 100%;
    width: 50%;
    margin: 20px auto;
    height: 50%;
    border-radius: 13px;
} */
.pop-address {
	position: absolute !important;
	display: none;
	width: 500px;
	height: auto;
	z-index: 999;
	background: #fff;
	top: 50%;
	box-shadow: 2px 2px 7px 0px #0000001c;
	left: 100px;
	/* transform: translate(0, -50%); */
	border-radius: 30px;
	padding-bottom: 20px;
	top: calc(50% - 75px);
	left: 115px;
}

.pop-address .header {
	display: flex;
	align-items: center;
	padding-left: 22px;
	padding-top: 18px;
	border-bottom: 1px solid #ddd;
	width: calc(100% - 22px);
	height: calc(78px - 18px);
}

.pop-address .tab-box {
	font-size: 16px;
	margin: 0;
	padding: 0px 16px;
	height: 100%;
	display: flex;
	align-items: center;
	box-sizing: border-box;
}

.pop-address .tab-box.active {
	font-weight: 600;
	color: #444444;
	border-bottom: 2px solid;
}

.pop-address.on {
	display: block;
}

.list-address {
	padding: 22px 22px 0;
	height: 100%;
	display: none;
}

.list-address.add-list-box {
	padding: 0 22px;
}

.list-address.on {
	display: block;
}

.list-address>.table-address {
	height: 100%;
}

.list-address>.table-address>ul {
	height: 100%;
}

.list-address>.table-address>ul>li {
	overflow: hidden;
	padding: 10px 20px;
	text-overflow: ellipsis;
	font-weight: 300;
	box-sizing: border-box;
	white-space: nowrap;
	color: #2C2C2C;
	border-top: 1px solid #D9D9D9;
	font-size: 15px;
	cursor: pointer;
}

.list-address>.table-address>ul>li:last-child {
	border-bottom: 1px solid #D9D9D9;
}

.number {
	margin-top: 12px;
	display: table;
	height: 100%;
	font-size: 14px;
}

.number>li {
	/*     height: 24px; */
	/*     width: 20px; */
	padding: 2px 6px;
	text-align: center;
	line-height: 24px;
	color: #bdbdbd;
	cursor: pointer;
}

.number>li.fl.on {
	color: #000;
	font-weight: 500;
}

.gpsicon {
	cursor: pointer;
	background: #e4e4e4 url(./image/gpsicon.png) no-repeat 50%;
	background-size: auto;
	width: 30px;
	height: 30px;
	border-radius: 25px;
	position: absolute;
	left: 12px;
	top: 5px;
	cursor: pointer;
}

.search {
	padding: 0 22px;
}

.search>li:first-child {
	margin-bottom: 8px;
	position: relative;
	width: calc(50% - 4px);
}

.search>li:first-child input {
	padding: 0 0 0 55px;
}

.search>.text {
	position: relative;
	width: calc(50% - 4px);
	margin-left: 8px;
}
.back>.help {
	position: absolute !important;
	max-width: 800px;
	/* min-height: 500px; */
	background: #fff;
	left: 50%;
	top: 50%;
	border-radius: 30px;
	transform: translate(-50%, -50%);
	width: 80%;
	height: 80%;
	padding: 20px;
	box-sizing: border-box;
}
.back>.help .header_box {
	width: 100%;
	height: 45px;
	display: flex;
	flex-direction: row;
	align-content: center;
	align-items: center;
	position: relative;
	padding-bottom: 20px;
}
.back>.help .header_box .close{
	top: 0;
	right: 0;
}
.back .pre {
	height: calc(100% - 75px);
	overflow: auto;
	/* padding: 0 22px; */
	/* border-top: 1px solid #ddd; */
	width: 100%;
	font-family: 'NanumSquare';
}
.back .pre .main_back{
	
background: #f0f0f0;
	
border-radius: 10px;
	
padding: 20px;
	
box-sizing: border-box;
	
/* margin-bottom: 20px; */
}
.back .area {
	display: flex;
	width: 100%;
	border-bottom: 1px solid #ddd;
	flex-direction: row !important;
	align-items: flex-start !important;
	flex-wrap: wrap;
}
.back .area > .img {
	width: 100px;
	height: 140px;
	margin: 0;
}

.back .area:nth-child(2) > .img {
	background:  url(./image/plus-blue.png) no-repeat 50%;
	background-size: 35%;
}
.back .area:nth-child(3) > .img {
	background: url('./image/move-blue.png')no-repeat 50%;
	background-size: 35%;
}
.back .area:nth-child(4) > .img {
	background:  url('./image/map-blue.png') no-repeat 50%;
	background-size: 35%;
}
.back .area:nth-child(5) > .img {background: url('./image/reset-blue.png') no-repeat 50%;background-size: 35%;}
.back .area:nth-child(6) > .img {
	background:  url('./image/align-blue.png') no-repeat 50%;
	background-size: 35%;
}
.back .area:nth-child(7) > .img {
	background:  url('./image/help-blue.png') no-repeat 50%;
	background-size: 35%;
}
.back .area:nth-child(8) > .img {
	background: url('./image/save.png') no-repeat 50%;
	background-size: 35%;
}
.back .area:nth-child(9) > .img {
	background:url('./image/template_blue.png')no-repeat 50%;
	background-size: 35%;
}
.back .pre .text {
	
width: calc(100% - 100px);
	
height: 140px;
	
display: flex;
	
justify-content: center;
	
align-content: flex-start;
	
align-items: flex-start;
	
gap: 10px;
}
.back .pre .txt {
	font-size: 16px;
	font-weight: 500;
	margin-bottom: 12px;
	/* padding-top: 30px; */
	/* border-top: 1px solid #ddd; */
	/* 	padding-left: 8px; */
	margin: 0;
	/* width: calc(100% - 100px); */
	display: flex;
	align-items: flex-start;
}
.back .pre pre {
	width: 100%;
	margin: 0;
	display: flex;
	height: initial;
}
.back .pre>.txt.last {
	border-top: none;
	padding-top: 0;
}

.back .pre>.margin {
	padding: 0 8px 40px;
	display: block;
	text-decoration: underline;
	color: #218FF2;
	cursor: pointer;
}

.back .pre>.pre-img {
	background: url(./image/pre-img.png) no-repeat 50%;
	background-size: cover;
	width: 744px;
	height: 118px;
	margin-bottom: 12px;
	border-radius: 12px;
}

/* 다른지역보기 팝업 s */
.custom_select_popup {
	position: fixed;
	display: none;
	width: 500px;
	height: auto;
	z-index: 9999999999;
	background: #fff;
	top: 50%;
	box-shadow: 2px 2px 7px 0px #0000001c;
	left: 50%;
	transform: translate(-50%, -50%);
	border-radius: 30px;
	padding-bottom: 22px;
}

.custom_select_popup.on {
	display: block;
}
/* 다른지역보기 팝업 e */

/* 운영관리 s*/
.operation-popup.on,
.notice-popup.on,
.back.on,
.template-popup.on,
.template-change-popup.on {
	display: block;
	opacity: 1;
	/* transform: translateY(0); */
	z-index: 99999999;
	position: fixed !important;
	width: 100vw;
	height: 100vh;
	background: #0000002e;
	left: 0;
	top: 10px;
}

.operation-popup,
.notice-popup,
.back,
.template-popup,
.template-change-popup {
	display: none;
	top: 0;
	left: 0;
	position: fixed;
	height: 100%;
	width: 100%;
	background: #00000059;
	/* transition: all 0.4s cubic-bezier(0.25, 0.1, 0.08, 1.01); */
	opacity: 0;
	transform: translateY(-10px);
	z-index: -9999;
}
.back {

}
.back::before {
	/* content: ""; */
	position: absolute;
	top: -50vw;
	left: -50vw;
	z-index: -1;
	display: block;
	width: 100%;
	/* height: 100%; */
	/* background-color: #00000059; */
	/* margin-top: 80px; */
	/* overflow: hidden; */
}
.op-container {
	width: calc(100% - 67px);
	min-width: 800px;
	min-height: 800px;
	z-index: 99999999;
	height: calc(100% - 243px);
	position: fixed;
	top: 051%;
	transform: translatey(-50%);
	left: 0;
	background-color: #ffffffdb;
	backdrop-filter: brightness(116%) blur(5px);
	opacity: 1;
	right: 0;
	border: 1px solid #E9EBEE;
	border-radius: 18px;
	display: flex;
}

.op-container .op-menu {
	width: 30%;
	margin: 0;
	min-width: 220px;
	max-width: 302px;
}

.op-container .op-menu ul {
	display: flex;
	flex-direction: column;
	padding: 22px 30px 30px 30px;
	box-sizing: border-box;
}

.op-container .op-menu ul li {
	height: 72px;
	line-height: 72px;
	color: #707070;
	width: 100%;
	margin: 0 0 12px 0;
	border-radius: 20px;
	cursor: pointer;
	transition: .3s;
	text-align: center;
}

.change-sun .op-container .op-menu ul li.on {
	color: #fff;
	background-color: #FFC136;
}

.change-sun .op-container .op-menu ul li:hover {
	background-color: #ffc1363d;
	color: #707070;
}

.change-cloudy .op-container .op-menu ul li.on {
	color: #fff;
	background-color: #C0D2EF;
}

.change-cloudy .op-container .op-menu ul li:hover {
	background-color: #c0d2ef1c;
	color: #707070;
}

.change-rain .op-container .op-menu ul li.on {
	color: #fff;
	background-color: #B6B6ED;
}

.change-rain .op-container .op-menu ul li:hover {
	background-color: #b6b6ed1f;
	color: #707070;
}

.change-snow .op-container .op-menu ul li.on {
	color: #fff;
	background-color: #8EDCE4;
}

.change-snow .op-container .op-menu ul li:hover {
	background-color: #8edce42b;
	color: #707070;
}

.op-container .op-box-01, .op-container .op-box-02, .op-container .op-box-03,
	.op-container .op-box-04 {
	display: none;
}

.op-container .op-box-01.on, .op-container .op-box-02.on, .op-container .op-box-03.on,
	.op-container .op-box-04.on {
	display: block;
}

.op-container .op-information {
	background: #fff;
	width: 100%;
	border-left: 1px solid #E9EBEE;
	margin: 0;
	border-bottom-right-radius: 18px;
	border-top-right-radius: 18px;
}

.op-container .op-information .header {
	position: relative;
	height: 43px;
	margin-top: 22px;
	display: flex;
	padding: 0 22px;
	box-sizing: border-box;
	align-items: center;
}

.op-container .op-information .header .title {
	position: initial;
	box-sizing: border-box;
	font-size: 14px;
}

.op-container .op-information .header li.tab {
	margin: 0 0 0 15px;
	font-weight: 500;
	color: #C5C6C8;
	padding: 0 0 0 15px;
	border-left: 1px solid #C5C6C8;
}

.op-container .op-information .header li.tab.active {
	color: #707070;
}

.op-container .op-information .header .close {
	top: 0;
	right: 22px;
	
}

.op-information .op-main .main-nav {
	display: flex;
	justify-content: space-between;
	margin: 0 22px 22px;
	padding: 15px 20px 0;
	border-radius: 25px;
	border: 1px solid #E9EBEE;
}

.op-information .op-main.authority-detail.on, .op-information .op-main.layer-detail.on,
	.op-information .op-main.main-all-box.on, .op-main.notice-01.on, .op-main.notice-02.on, 
	.op-main.notice-03.on, .op-main.notice-04.on {
	display: block;
}

.op-information .op-main.authority-detail, .op-information .op-main.layer-detail,
	.op-information .op-main.main-all-box, .op-main.notice-01, .op-main.notice-02,
	.op-main.notice-03, .op-main.notice-04 {
	display: none;
}

.op-information .op-main .main-nav .bar-left {
	margin: 0;
	display: flex;
	width: 80%;
	flex-wrap: wrap;
}

.op-information .op-main .main-nav .bar-left .nav {
	display: flex;
	align-items: center;
	padding-bottom: 15px;
	position: relative;
	margin: 0;
}
.op-information .op-main .main-nav .bar-left .nav label {
	cursor: pointer;
}

.op-information .op-main .main-nav .bar-left .nav .switch-toggle {
	height: 40px;
}

.op-information .op-main .main-nav .bar-left .nav .switch-toggle .bg {
	height: 87%;
	left: 2px;
	top: 2.6px;
}

.op-information .op-main .main-nav .bar-left .nav select {
	width: 160px;
	background: #fff url('./image/arrow_b.png') 90% 50%/16px no-repeat;
	font-weight: 300;
}

.op-information .op-main .main-nav .bar-left .nav input {
	width: 160px;
}
.op-information .op-main .main-nav .bar-left .nav input[type="date"] {
	width: auto;
    padding: 0 10px 0 8px;
    box-sizing: border-box;
}
.op-information .op-main .main-nav .bar-left .nav input[type="checkbox"] {
	width: 20px;
    padding: 0;
    margin-left: 6px;
}
.nav input {
	padding: 0 45px 0 20px;
	border-radius: 5px;
	background: #fff;
	border: 1px solid #E9EBEE;
}

.nav p {
	text-align: center;
	width: 50px;
}

.nav.p-80 p {
	width: 80px;
}
.nav.p-120 p {
	width: 120px;
}
.op-information .op-main .main-nav .bar-left .nav .btn-search {
	right: 0;
	top: 0;
	width: 48px;
}
.op-information .op-main .main-nav .bar-right {
	margin: 0;
}

.op-information .op-main .main-nav .bar-right ul {
	display: flex;
	width: 100%;
	padding-bottom: 15px;
}

.change-sun .btn-surf {
	background: #FFC136;
}

.change-cloudy .btn-surf {
	background: #C0D2EF;
}

.change-rain .btn-surf {
	background: #B6B6ED;
}

.change-snow .btn-surf {
	background: #8EDCE4;
}

.op-information .op-main {
	height: calc(100% - 86px);
}

.op-information .op-main .main-text-h1 {
	color: #FFC136;
	font-weight: 500;
	font-size: 18px;
	padding: 0 12px;
	position: relative;
	margin: 0 22px 12px;
}

.op-information .op-main .main-text-h1:before {
	content: "";
	width: 10px;
	height: 10px;
	position: absolute;
	background: #FFC136;
	border-radius: 10px;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}

.op-information .op-main .main-content {
	width: calc(100% - 44px);
	box-sizing: border-box;
	margin: 0 22px 0;
	overflow: auto;
	container-name: div-container;
	container-type: inline-size;
	height: calc(78% - 80px);
}

.op-information .op-main .main-content .main-h1 strong {
	color:#FD481C;
}

.op-information .op-main .main-content table, .op-table table {
	width: 100%;
	margin: 0;
}

.op-information .op-main .main-content table thead {
	height: 56px;
	background: #F5F5F5;
}

.op-information .op-main .main-content table tbody tr th {
	background: #F5F5F5;
	
}
.op-information .op-main.notice-02 .main-content table tbody tr {
	background:initial !important;
	cursor: auto;
}
.change-sun .op-information .op-main .main-content table tbody tr:hover,
	.change-sun .op-table table tbody tr:hover {
	background: #fddd9424;
	transition: .3s;
}

.change-sun .op-information .op-main .main-content.hover-none table tbody tr:hover,
	.change-cloudy .op-information .op-main .main-content.hover-none table tbody tr:hover,
	.change-rain .op-information .op-main .main-content.hover-none table tbody tr:hover,
	.change-snow .op-information .op-main .main-content.hover-none table tbody tr:hover
	{
	background: initial;
	transition: .3s;
}

.change-cloudy .op-information .op-main .main-content table tbody tr:hover,
	.change-cloudy .op-table table tbody tr:hover {
	background: #c0d2ef1c;
	transition: .3s;
}

.change-rain .op-information .op-main .main-content table tbody tr:hover,
	.change-rain .op-table table tbody tr:hover {
	background: #b6b6ed1a;
	transition: .3s;
}

.change-snow .op-information .op-main .main-content table tbody tr:hover,
	.change-snow .op-table table tbody tr:hover {
	background: #8edce414;
	transition: .3s;
}

.op-information .op-main .main-content table tbody tr, .op-table table tbody tr
	{
	cursor: pointer;
}
.op-information .op-main .main-content table tbody tr td {
	height: 48px;
}
.op-information .op-main .main-content.hover-none table tbody tr td {
	border-right: 1px solid #E9EBEE;
}

.op-information .op-main .main-content table tbody tr td, .op-table table tbody tr td
	{
	text-align: center;
	vertical-align: middle;
	border-top: 1px solid #E9EBEE;
	border-bottom: 1px solid #E9EBEE;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.op-information .op-main .main-content table tbody tr td, .op-table table tbody tr td a {
	color:#707070;
}

.op-information .op-main .main-content table tbody tr td.f-left {
	text-align: left;
}
.op-table table tbody tr td p {
    margin: 0 10px 0 0;
    font-size: 11px;
    padding: 4px 10px;
    color: #fff;
    background: #A3C4FF;
    border-radius: 15px;
}

.op-information .op-bottom {
	position: relative;
	padding-top: 12px;
}

.op-information .op-bottom .number {
	margin-top: 6px;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
}

.op-information .op-bottom .btn-right ul {
	display: flex;
}

/* 운영관리 e*/

/* 공지사항  s */
.notice-popup .op-container .op-information {
	border-radius: 18px;
}

.notice-popup .op-container .op-information .op-main .main-content .web-edit  {
	height: calc(65% - 30px);
    width: 100%;
    margin-top: 22px;
    box-sizing: border-box;
}
.notice-popup .op-container .op-information .op-main .main-content .web-usertxt {
	height: calc(76% - 80px);
    width: 100%;
    margin-top: 22px;
    box-sizing: border-box;
	
}
.notice-popup .op-container .op-information .op-main .main-content .web-usertxt p {
	line-height:30px;
}
.notice-popup .op-container .op-information .op-main .main-content .web-usertxt ul {
	display: block;
	list-style-type: disc;
	margin-block-start: 1em;
	margin-block-end: 1em;
	margin-inline-start: 0px;
	margin-inline-end: 0px;
	padding-inline-start: 40px;
}
.notice-popup .op-container .op-information .op-main .main-content .web-usertxt ol {
	display: block;
	list-style-type: decimal;
	margin-block-start: 1em;
	margin-block-end: 1em;
	margin-inline-start: 0px;
	margin-inline-end: 0px;
	padding-inline-start: 40px;
}
.notice-popup .op-container .op-information .op-main .main-content .web-usertxt li {
	display: list-item;
  	text-align: -webkit-match-parent;
}
.notice-popup .op-container .op-information .op-main, .main-nav .bar-left {
	gap:20px;
}

.notice-popup .op-information .op-main .main-content table.notice-user tbody tr td {
    text-align: left;
}
.notice-popup .op-information table tbody tr td.left {
	text-align: right;
}
.notice-popup .op-information .op-main .main-content table.notice-user tbody tr td p {
    margin-left: 16px;
}
.notice-popup .op-container .op-information .op-main.notice-02 .main-content table tbody tr:hover {
	background:initial !important;
}

.op-information .op-main .main-content table tbody tr td input {
	background: inherit;
    border: 1px solid #E9EBEE;
    width: calc(100% - 16px);
    margin-left: 16px;
}
.notice-popup .op-information .op-main .main-content table tbody tr td input[type="checkbox"],
.op-information .op-main .main-content table tbody tr td input[type="checkbox"] {
	width:20px;
	margin-left: 0;
}
.op-information .op-main .main-content table tbody tr td input[type="radio"] {
	width:20px;
	margin-left: 0;
}
.notice-popup .op-information .op-main.notice-02 .main-content {
	height: calc(100% - 80px);
}
/* 사용자관리 사용자상세정보 s */

/* 운영관리 - 사용자 정보 - 공용-팝업 s*/
.op-popup .header>.title {
	font-size: 16px;
	position: relative;
	color: #69AEF2;
	width: calc(100% - 70px);
	cursor: pointer;
	font-weight: 500;
	margin-bottom: 0;
	left: 15px;
	top: 15px;
	height: 32px;
	line-height: 32px;
	padding: 0;
	background-color: inherit;
}

.op-popup .header>.close {
	right: 15px;
	top: 15px;
	width: 32px;
	height: 32px;
}

.op-popup .close::before, .op-popup .close-100::before {
	left: 48%;
	top: 24%;
}

.op-popup .close::after, .op-popup .close-100::after {
	left: 48%;
	top: 24%;
}

.op-popup .header {
	margin-bottom: 10px;
	height: 50px;
}

.op-popup .detail-mian {
	margin: 0 15px;
}

.op-popup {
	position: absolute;
	z-index: 999999999;
	top: 50%;
	transform: translate(-50%, -50%);
	left: 50%;
	background: #fff;
	border-radius: 18px;
	box-shadow: 0px 6px 20px #00000017;
}

.w-400 {
	width: 408px;
}

.w-500 {
	width: 500px;
}
/* 운영관리 - 사용자 정보 - 공용-팝업 e*/

/* 사용자상세정보-팝업 s*/
.operation-detail {
	display: none;
}

.operation-detail.on {
	display: block;
}

.op-popup .detail-mian ul {
	display: flex;
	margin-bottom: 8px;
	width: 100%;
	justify-content: space-between;
}

.op-popup .detail-mian ul:last-child {
	margin-bottom: 0;
}

.op-popup .detail-mian ul textarea {
	height: 160px;
}

.op-popup .detail-mian ul li {
	position: relative;
	margin: 0;
	width: calc(100% - 108px);
}

.op-popup .detail-mian ul li .switch-toggle {
	margin: 0;
}

.op-popup .detail-mian ul li:first-child {
	border-radius: 5px;
	width: 100px;
	margin: 0;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
}

.op-popup .detail-mian ul li input {
	height: 35px;
}

.op-popup .detail-mian ul li .btn-search {
	height: 35px;
	top: 0px;
	right: 5px;
}

.op-popup .detail-mian ul li input::placeholder {
	color: #C5C6C8;
}

.op-popup .detail-mian ul li.name {
	background: #C5C6C8;
	color: #fff;
}

.op-popup .detail-mian ul li.name-02 {
	background: #E9EBEE;
}

.op-popup .cotnent-bottom {
	margin: 18px 0 22px;
}

.op-popup .cotnent-bottom ul {
	display: flex;
	box-sizing: border-box;
	padding: 0 15px;
	justify-content: center;
}

.op-popup .cotnent-bottom ul li {
	text-align: center;
	height: 40px;
	line-height: 40px;
	color: #fff;
	margin: 0 0 0 5px;
	border-radius: 20px;
}

.op-popup .cotnent-bottom ul li:first-child {
	margin: 0;
}

/* 사용자상세정보-팝업 e*/

/* 사용자그룹정보-팝업 s*/
.operation-group {
	display: none;
}

.operation-group.on {
	display: block;
}

.operation-group .op-search {
	position: relative;
}

.operation-group .op-search .group-100 {
	background: #fff;
	border: 1px solid #E9EBEE;
	height: 32px;
}

.operation-group .op-search .btn-search {
	width: 32px;
	height: 32px;
	background-size: 34px;
	top: 0;
}

.operation-group .op-table {
	padding-top: 12px;
}

.operation-group .op-table table thead tr {
	height: 36px;
	background: #f5f5f5;
}

.operation-group .op-table table tbody tr {
	height: 36px;
}

.operation-group .number-box {
	margin-bottom: 22px;
}

.operation-group .detail-mian .number-box .number {
	margin-top: 12px;
	display: table;
	height: 100%;
	font-size: 14px;
}

.operation-group .detail-mian .number-box .number:first-child {
	border-radius: initial;
	width: initial;
	box-sizing: initial;
	text-align: initial;
	line-height: 24px;
}

.operation-group .detail-mian .number-box .number>li {
	height: 24px;
	width: initial;
	padding: 2px 6px;
	text-align: center;
	line-height: 24px;
	color: #bdbdbd;
	margin-right: 0;
	cursor: pointer;
}

.operation-group .detail-mian .number-box .number>li.on {
	color: #000;
}
/* 사용자그룹정보-팝업 e */

/* 팝업상세정보-팝업 s */
.operation-pop {
	display: none;
}

.operation-pop.on {
	display: block;
}

.op-popup .detail-mian ul.nav .date-box {
	display: flex;
	justify-content: space-between;
	position: relative;
}

.op-popup .detail-mian ul.nav .date-box input {
	width: calc(50% - 6px);
	padding: 0 8px 0 4px;
	font-size: 11px;
}

.op-popup .detail-mian ul.nav .date-box input:first-child:before {
	content: "";
	width: 4px;
	height: 1px;
	background: #707070;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
}
/* 팝업상세정보-팝업 e */

/* 팝업 등록-팝업 s */
.operation-userpop {
	display: none;
}

.operation-userpop.on {
	display: block;
}
/* 팝업 등록-팝업 e */


/* 긴급경보공지 팝업 s */
.new-notice-popup.on {
	display:block;
}
.new-notice-popup {
	display:none;
	width: 100%;
    height: 100vh;
    position: fixed;
    background: #0000007a;
    z-index: 99999999;
}

.new-notice-popup .wrap {
	max-width: 1000px;
	margin: 0;
	position: relative;
	background: #fff;
	border-radius: 40px;
	transform: translate(-50%, -50%);
	left: 50%;
	top: 50%;
	min-width: 600px;
}

.new-notice-popup .new-no-container {
	box-sizing: border-box;
	margin: 0 22px;
	padding: 0 0 22px;
}

.new-notice-popup .new-no-container p {
	margin-bottom: 14px;
}

.new-notice-popup .new-no-container table {
	width: 100%;
}

.new-notice-popup .new-no-container table thead {
	background: #E9EBEE;
}

.new-notice-popup .new-no-container table thead tr th {
	border: 1px solid #d9d9d9;
	padding: 8px;
	font-size: 14px;
	font-weight: 400;
}

.new-notice-popup .new-no-container table tbody tr td {
	height: 40px;
	vertical-align: middle;
	text-align: center;
    border: 1px solid #d9d9d9;
	font-size: clamp(12px, .5vw, 14px);
}
/* 긴급경보공지 팝업 e */

/* 로그인 s */
/* .log-wrap {
	background: #F6F8FA;
	height: 100vh;
	width: 100%;
	min-height: 500px;
}

.wrap-container {
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.m-login {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 34px;
	margin: 0;
}

.m-login>.logo>.logo-box {
	display: flex;
	cursor: pointer;
	align-items: center;
	gap: 12px;
	justify-content: center;
}

.m-login>.logo>.logo-box>.logo-img {
	background: url('./image/logo.png') 50%/contain no-repeat;
	height: 36px;
	width: 36px;
	margin: 0;
}

.m-login>.logo>.logo-box>.logo-text {
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: "Pretendard GOV";
}
.m-login>.logo>.logo-box>.logo-text p {
    font-size: clamp(18px, 2.5vw, 22px);
    margin: 0;
    text-align: center;
    font-family: "Pretendard GOV";
    font-weight: 600;
    color: #707070;
    width: auto;
}
.m-login>.logo>.logo-box>.logo-text strong {
    color: #69AEF2;
    font-size: clamp(24px, 3.7vw, 28px);
    margin: 0;
}
.login-fields {
	display: flex;
	flex-direction: column;
	gap: 16px;
	width: clamp(80%, 30vw, 100%);
	background: #fff;
	border-radius: 18px;
	box-sizing: border-box;
	padding: clamp(26px, 3vw, 50px) clamp(26px, 3vw, 56px);
}

.login-fields input[type="text"],
.login-fields input[type="password"] {
	background: #fff;
	border: 1px solid #E9EBEE;
	border-radius: 5px;
	transition: .3s;
	height: 44px;
}

.login-fields input[type="text"]::placeholder {
	font-size: 13px;
	font-weight: 400;
}

.login-fields input[type="text"]:active {
	border: 1px solid #69AEF2;
}

.login-fields input[type="text"]:hover {
	box-shadow: 0 0 6px #69aef221;
}

.login-fields input.fields-id.on,
.login-fields input.fields-password.on {
	border: 1px solid #69AEF2;
	box-shadow: 0 0 6px #69aef221;
}

.login-fields .id-check {
	cursor: pointer;
	margin: 0;
	font-size: 13px;
}

.login-fields .id-check label {
	cursor: pointer;
}

.login-fields button {
	background: #69AEF2;
	width: 100%;
	border-radius: 5px;
	color: #fff;
	margin-top: 12px;
	height: 46px;
	cursor: pointer;
	transition:.3s;
}

.login-fields button:hover {
	background: #4496e7;
}

.log-wrap .wrap-container .address {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: clamp(40px, 3vw, 70px);
	padding: 0 22px;
	gap: 12px;
}

.log-wrap .wrap-container .address .add-logo {
	background: url(./image/footer-add-img.png) 50%/contain no-repeat;
    height: 28px;
    width: 90px;
    margin: 0;
}

.log-wrap .wrap-container .address .add-logo:before {
	content: "";
    position: absolute;
    background: #C5C6C8;
    height: 14px;
    width: 1px;
    top: 50%;
    transform: translateY(-50%);
    right: -5px;
}

.log-wrap .wrap-container .address p {
	font-size: clamp(11px, 2vw, 12px);
    color: #707070;
    line-height: 17px;
} */
/* 리사이징 css */
.grid-stack-item-content .header.resize :where(.custom_select){
	display:none;
}
.content-01.resize :where(.box-left, .weather-list) {
	display:none;
}
.content-08-h-700.resize :where(.pol-img-01, .pollution>ul>li:nth-child(2), .pollution>ul>li:nth-child(3)) {
	display:none;
}
.content-08-h-700.resize>.pollution>ul>li>.pollution-box>ul>li>.box.two::after,
.content-08-h-700.resize>.pollution>ul>li>.pollution-box>ul>li>.box.one::after,
.content-08-h-700>.pollution>ul>li>.pollution-box>ul>li>.box.three::after{
	display:none;
} 
.drought.resize :where(.drought-play) {
	display:none;
}
.w-q-container.resize :where(.top-box .box-01, .top-box .w-q-box, .btn-more, .bottom-box) {
	display:none;
}
/* .group-waterLevelDamBo.resize :where(.right-box, .water-more) { */
/* 	display:none !important; */
/* } */
.group-waterLevelDamBo.resize1 :where(.right-box) {
	display:none !important;
}
.group-waterLevelDamBo.resize2 :where(.left-box) {
	display:none !important;
}

/* 댐/보 정보 부분 s 240722 */
/* .group-waterLevelDamBo.resize1 :where(.right-box, .water-more, .damimg) {
	display:none !important;
} */
.group-waterLevelDamBo.resize_new2 :where(.left-box, .water-more, .right-box) {
	display:none !important;
}
.header-waterLevelDamBo.resize_new2 :where(.location_gps, .selectDamBo, .baseTime) {
	display:none !important;
}
/* 댐/보 정보 부분 e 240722 */

.header[class*='resize']>.selectDamBo {
	display:block;
    width: 24%;
    border-radius: 8px;
    height: 22px;
    background: #fff url(./image/select_arrow.png) 89% 50%/8px no-repeat;
    color: #707070;
    margin: 5px 22px 12px;
}
.group-locationLevel.resize :where(.right-box-60) {
	display:none;
}
.noxiousWild.resize :where(.left-box, .noxious-infor),
.dtaYear.resize {
	display:none;
}
.group-wildAnimals.resize1 :where(.right-box, .btn-more) {
	display:none;
}
.group-wildAnimals.resize2 :where(.left-box, .btn-more) {
	display:none;
}
.noise.resize :where(.noise-instrument, .noise-btn, .noiseair-btn, .air-noise-b-box, .noise-legend) {
	display:none !important;
}
.content-01.resize>.box-01>.box-right {
	border: none;
    padding: 0;
    width: 100%;
}
.content-01.resize>.box-01>.box-right>.right>.title {
	height: 100%;
}
.content-01.resize>.box-01>.box-right>.right>.title .group {
	gap: 5%;
}
.content-08-h-700.resize>.pollution>ul>li>.pollution-box>ul>li>.box>p {
	/* 대기오염 위젯 수정 20240722 */
	/* width: 30%; */
	width: 32%;
    margin: 0;
    font-size: clamp(14px, 1vw, 16px);
    position: initial;
    line-height: 32px;
}
.content-08-h-700.resize>.pollution>ul>li>.pollution-box>ul>li>.box>span>div {
    font-size: clamp(15px, .4vw, 16px);
    font-weight: 600;
}
.content-08-h-700.resize>.pollution>ul>li>.pollution-box>ul {
	display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.content-08-h-700.resize>.pollution>ul>li>.pollution-box>ul>li {
	width: 100%;
    height: 31%;
    margin-left: 0;
}
.content-08-h-700.resize>.pollution>ul>li>.pollution-box>ul>li>.box {
	display: flex;
    justify-content: space-between;
    align-items: center;
}
.content-08-h-700.resize>.pollution>ul>li>.pollution-box>ul>li>.box>span {
	display: flex;
    position: initial;
    width: 50%;
    margin: 0;
}
.content-08-h-700.resize>.pollution>ul>li:nth-child(1) {
	height: 100%;
}
.drought.resize .drought-all>.drought-table {
	width: 100%;
    margin: 0;
}
.w-q-container.resize .top-box {
	height: 100%;
    padding: 0;
}
.w-q-container.resize .top-box .box-02 {
	border: none;
    width: 100%;
    gap: 14px;
    height:calc(100% - 16px);
}
.w-q-container.resize .top-box .box-02 .w-q-name {
	justify-content: center;
	height: 10%;
}
.w-q-container.resize .top-box .w-q-data-txt {
	display:block;
}
.w-q-container.resize .top-box .box-02 .w-q-value {
	justify-content: center;
	gap: 18px;
	position: relative;
	height: 90%;
}
.w-q-container.resize .top-box .box-02 .w-q-value ul:first-child {
	width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
}
.w-q-container.resize .top-box .box-02 .w-q-value ul:first-child:after {
	content: "";
    display: block;
    height: 100%;
    width: 1px;
    background: #ebebeb;
    position: absolute;
    left: 50%;
}
.group-locationLevel.resize>.chart .level-container {
	height: calc(100% - 38px);
}
.group-locationLevel.resize>.chart>.left-box-40 .t-txt {
	display:block;
}
.w-q-container.resize .top-box .box-02 .w-q-value ul:nth-child(2) {
	display: flex;
    align-items: center;
    flex-direction: column;
    HEIGHT: 100%;
    justify-content: center;
}
.w-q-container .top-box .box-02 .w-q-value ul:nth-child(2) li {
	justify-content: center;
}
.group-locationLevel.resize >.chart>.left-box-40 {
	width: 100%;
    border: none;
}
.content-07[class*='resize']>.chart .dam-content .dam-box .damimg {
	height: calc(100% - 128px);
}
.group-waterLevelDamBo[class*='resize'] {
	height: calc(100% - 110px);
}
.group-waterLevelDamBo[class*='resize'] >.chart .dam-content {
	margin: 0;
	width: 100%;
	height: 100%;
	/* display: flex; */
	align-items: center;
}
/* .group-waterLevelDamBo.resize >.chart .left-box.dam-content .selecttwoDam { */
/* 	display: block; */
/* } */
/* .group-waterLevelDamBo.resize >.chart .left-box.dam-content .selettwoBo { */
/* 	display: block; */
/*     margin-left: 12px; */
/* } */
.noxiousWild.resize .right-box {
	width: 100%;
    height: calc(100% - 22px);
    border: none;
    padding: 0 22px;
}
.noxiousWild.resize .right-box .noxious-list ul li {
	flex-basis: 25%;
}
.group-wildAnimals.resize1>.chart>.left-box {
	width: 100%;
	margin-top: 32px;
}
.group-wildAnimals.resize2>.chart>.right-box {
	width: 100%;
	margin-top: 32px;
}
.group-wildAnimals[class*='resize']>.chart>.wild-select {
	width: 50%;
    border-radius: 8px;
    height: 22px;
    background: #fff url(./image/select_arrow.png) 89% 50%/8px no-repeat;
    color: #707070;
    position: absolute;
    left: 0px;
    top: 0;
    display:block;
}
/* .group-wildAnimals.resize .wild-content {
	height: 100% !important;
} */
.noise.resize .noise-infor {
	width: 100%;
    padding: 0 22px;
}
.noise.resize .noise-infor .re-noise-num {
	display: block;
    font-size: clamp(20px, 1vw, 40px);
    height: 40px;
    padding: 0 16px;
    background: #e7f5ff;
    line-height: 40px;
    border-radius: 10px;
    color: #97d2ff;
    font-weight: 600;
    margin: 0;
}

/* 설문조사 s */
.survey-popup.on {
	display:block;
}
.survey-popup {
	width: 100%;
	display:none;
	height: 100%;
	position: absolute;
}

.survey-popup .survey-wrap {
/* 	width: 590px; */
/* 	height: 840px; */
	background: #fff;
	top: 32px;
/* 	left: 32px; */
	left: 40%;
	position: absolute;
	border-radius: 41px;
	z-index: 999;
	box-shadow: 0 3px 46px #0000002e;
}

.survey-popup .survey-wrap .s-img-box {
	/* height: calc(100% - 176px); */
	margin-bottom: 20px;
}

.survey-popup .survey-wrap .s-img-box .img {
	height: 100%;
	position: relative;
}
.survey-popup .survey-wrap .s-img-box .img img {
	width:100%;
	height:100%;
}
.survey-popup .survey-wrap .s-img-box .img .period {
	
position: absolute;
	
/* bottom: 194px; */
	
/* left: 220px; */
	bottom: 243px;
    left: 260px;
}
.survey-popup .survey-wrap .s-img-box .img .period li{
	
/* font-size: 18px; */
	
font-family: 'Pretendard GOV';
	
/* line-height: 42px; */
	
font-weight: 400;

    font-size: 20px;
    line-height: 46px;
}
.survey-popup .survey-wrap .s-img-box .img pre {
	position:absolute;
	bottom: 57px;
	color: #fff;
	width: 100%;
	display: flex;
	justify-content: center;
	line-height: 24px;
	text-align: center !important;
	font-weight: 500;
	font-size: 16px;
	font-family: 'Pretendard GOV';
}
.survey-popup .survey-wrap .s-close-btn {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	margin: 0 22px 22px 0;
	gap: 24px;
}

.survey-popup .survey-wrap .s-close-btn .check {
	margin: 0;
}

.survey-popup .survey-wrap .s-close-btn .check label {
	cursor: pointer;
}

.survey-popup .survey-wrap .s-close-btn button {
	margin: 0;
	background: #f4f4f4;
	width: 120px;
	height: 46px;
	border-radius: 41px;
	color: #707070;
	font-size: 14px;
	cursor: pointer;
}

.survey-popup .survey-wrap .s-close-btn button:hover {
	background-color: #e9e9e9;
	transition:.3s;
}

/* 설문조사 e */

/* 오늘의 날씨 tooltip s */
.wind_date{
	background:#ffffff; 
	width:100%; 
	height:100%;
	box-sizing: border-box;
}
.wind_date center {
	color: #69AEF2;
	font-size: 14px;
	padding-bottom: 5px;
	border-bottom: 1px solid #F5F5F5;
	margin-bottom: 5px;
	margin-top: 5px;
}
.wind_date table {
	margin-bottom: 5px;
}
.wind_date table th {
	margin-right: 5px;
	text-align: left;
	width: 30px;
	margin: 0;
	padding: 0;
}
.wind_date table th b {
	margin-right: 5px;
	vertical-align: sub;
}

.wind_date table td {
	color: #69AEF2;
}
/* 오늘의 날씨 tooltip e */

/* 저작권 팝업 s */
.copy {
	transform: translate(-50%, calc(-100% - -62px)) !important;
	top: 50%;
	left: 50%;
	position: fixed;
	height: 100vh;
	width: 100vw;
	background: #00000059;
	/* transition: all 0.4s cubic-bezier(0.25, 0.1, 0.08, 1.01); */
	opacity: 0;
	transform: translateY(-10px);
	z-index: -9999;
	pointer-events: none;
}
.copy.on {
	display: block;
    opacity: 1;
    transform: translateY(0);
    z-index: 99999999;
	pointer-events: auto;
}
.copy .copy-content {
	position: relative;
	max-width: 800px;
	height: 600px;
	background: #fff;
	left: calc(50% - 22px);
	top: 50%;
	border-radius: 30px;
	transform: translate(-50%, -50%);
	margin: 0 22px;
	/* width: 100%; */
}
.copy .c-content-box {
	padding: 0 22px;
	overflow: auto;
	height: 480px;
}
.copy .c-content-box .c-c-h1 {
	line-height: 1.6;
    font-size: 15px;
    border: 3px solid #B3D5F4;
    padding: 20px;
    box-sizing: border-box;
    color: #707070;
    font-weight: 500;
}
.copy .c-content-box .c-box {
	margin-top: 16px;
}
.copy .c-content-box .c-box pre {        
    line-height: 1.7;
    font-family: 'NanumSquare';
    margin-bottom: 16px;
    letter-spacing: .2px;
    color: #222222;
    width: 100%;
}
.copy .c-content-box .c-box span {
	background: url(./image/kogl_mark.jpg) 50% / contain no-repeat;
    width: 120px;
    display: block;
    height: 68px;
}
.copy .c-content-box .c-box pre.fr {
	width: calc(100% - 130px);
}
/* 저작권 팝업 e */


/* 풋터 s */
footer {
    height: 64px;
    width: calc(100% - 200px);
    display: flex !important;
    position: fixed;
    bottom: 30px;
    margin: 0 100px;
    box-sizing: border-box;
    max-width: 1415px;
    transform: translate(-50%, 0px);
    left: calc(50% - 100px);
    z-index: -21;
}

.footer {
    color: #a0a4a9;
    display: flex;
    height: 100%;
    gap: 10px;
    align-items: center;
    flex-direction: row;
    justify-content: space-between;
    box-shadow: none !important;
    border-radius: 50px;
    padding: 0 40px;
    width: 100%;
}

.footer .f-left {
	margin: 0;
	display: flex;
	align-items: center;
	gap: 16px;
}

.footer .f-left span {
	background: url('./image/logo-k-100-black.png') 50% / contain no-repeat;
	width: 112px;
	margin: 0;
	height: 30px;
	flex: 1 0 78px;
}

.footer .f-left p {
	line-height: 20px;
	font-size: 11px;
	margin: 0;
}

.footer .f-right {
	margin: 0;
	display: flex;
	gap: 12px;
}

.footer .f-right .f-s-custom {
	width: 160px;
}
.footer .f-right .f-s-custom select {
	background: #ffffff url(./image/select.png) no-repeat 93% 50%;
	border: none;
	color: #707070;
	cursor: pointer;
	border: 1px solid #e9ebee;
	padding: 0 15px;
	width: 160px;
}
.footer .f-right .f-s-copy {
	background: #e9ebee;
	cursor: pointer;
	display: flex;
	align-items: center;
	padding: 0 10px;
	border-radius: 5px;
	color: #707070;
	font-weight: 400;
	box-sizing: border-box;
	width: 90px;
	justify-content: center;
}
/* 풋터 e */

/* 반응형 s */
@media screen and (max-width: 1350px) {
	.op-information .op-main .main-nav {
		flex-wrap: wrap;
	}
	.op-information .op-main .main-nav .bar-left {
		width: 100%;
	}
	.op-information .op-main .main-nav .bar-right {
		margin: 0 auto;
	}
	.notice-popup .op-container .op-information .op-main .main-nav {
	    flex-wrap: inherit;
	}
	.notice-popup .op-container .op-information .op-main .main-nav .bar-left {
	    flex-wrap: inherit;
	    margin-right: 20px;
	}
	.op-information .op-main .main-nav .bar-left .nav {
		width: 33.3%;
	}
	.op-information .op-main .main-nav .bar-left .nav.nav-date {
		width: 66.3%;
	}
	.op-information .op-main .main-nav .bar-left .nav select {
		width: calc(100% - 70px);
		background-position-x: 94%;
	}
	.op-information .op-main .main-nav .bar-left .nav input {
		width: calc(100% - 70px);
	}
	.op-information .op-main .main-nav .bar-left .nav .switch-toggle {
		margin: 0;
	}
	.op-information .op-main .main-content {
		height: calc(100% - 282px);
	}
	.nav p {
		margin: 0;
		width: 70px;
	}
}


@media screen and (max-width: 1646px) {
	.content-07 .green-content .green-infor-box .infor-legend ul {
		grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
	}
}

@media (1200px <= width <= 1578px) {
	.content-07 .green-content .magnifier-map {
		height: calc(50% - 101px);
	}
}

@media (990px <= width <= 1663px) {
	.noxiousWild .right-box .noxious-list ul li .list-01-infor p span {
		display: none;
	}
}
@media screen and (max-width: 1320px) {
	.pop-address {
		top: 104px;
	}
}

@media screen and (max-width: 1116px) {
	.op-information .op-main .main-nav .bar-left .nav {
		width: 50%;
	}
	.op-information .op-main .main-content {
		height: calc(100% - 337px);
		padding: 0 20px;
	}
	.op-information .op-bottom .btn-right .btn-reset {
		width: 80px;
	}
	.op-information .op-bottom .btn-right .btn-surf {
		width: 80px;
	}
}

@media screen and (max-width: 1034px) {
	
}


@media screen and (max-width: 646px) {
	.noxiousWild .right-box .noxious-list ul li .list-01-infor p span {
		display: none;
	}
	.w-q-container .top-box .box-02 .w-q-value ul:nth-child(2) {
		display: none;
	}
	.w-q-container .top-box .box-02 .w-q-value ul:first-child li {
		font-size: 72px;
	}
	.content-07>.chart>.right-box-60 {
		display: none;
	}
	.content-07>.chart>.left-box-40 {
		width: 100%;
		border-right: none;
	}
}

@media screen and (max-width: 480px) {
/* 	footer {
	position: relative;
	display: block !important;
	} */

	.group-wildAnimals[class*='resize']>.chart>.wild-select {
		width: 60%;
		border-radius: 8px;
		height: 22px;
		background: #fff url(./image/select_arrow.png) 89% 50%/8px no-repeat;
		color: #707070;
		position: absolute;
		left: 22px;
		top: 0;
		display: block;
	}
	.noxiousWild .right-box .noxious-list ul li .nox-bg-b {
	    height: 40%;
   		width: 37%;
	}
	button.water-more {
		display: none;
	}
	.btn-more {
		display: none;
	}
}


/** 위젯 템플릿 저장 팝업 */

.templateDiv {
	position: fixed;
	width: 300px;
	height: auto;
	z-index: 9999999999;
	background: #fff;
	top: 50%;
	box-shadow: 2px 2px 7px 0px #0000001c;
	left: 50%;
	transform: translate(-50%, -50%);
	border-radius: 20px;
	padding: 15px;
}
.templateDiv > div {
	width: 100%;
}
.templateDiv-header .title {
	line-height: 45px;
	font-size: clamp(.9rem, 1vw, 1.1rem);
	font-weight: 600;
	color: #ffd576;
	padding: 0 10px;
}
.templateDiv-header .templateDiv-close {
	width: 35px;
    height: 35px;
    margin: 0;
    background-color: #e6e6e6;
    position: absolute;
    border-radius: 50px;
    cursor: pointer;
    transition: .3s;
    z-index: 20;
}
.templateListDiv {
	background: #fff;
	border-radius: 10px;
	border: 1px solid #D9D9D9;
}
.templateListDiv ul {
	padding: 10px;
	height: 140px;
}
.templateListDiv ul li{
	padding: 10px !important;
	font-family: 'NanumSquare';
	border-radius: 5px;
}
.templateListDiv ul li div{
	float: right;
    cursor: pointer;
}
.templateListDiv ul li.on{
	background: #ffe7b0;
}
.templateNmDiv {
	padding: 10px 0;
}
.templateNmDiv #templateNm{
	border-radius: 10px;
	border: 1px solid #D9D9D9;
	height: 30px;
	padding: 0 15px;
}
.templateDivBtn > div {
	width: 100%;
	height: 30px;
	border-radius: 10px;
	background: #ffd576;
	line-height: 30px;
	font-size: 15px;
	font-weight: 600;
	text-align: center;
	color: #fff;
	cursor: pointer;
}

/** 초기화면 변경 팝업 */

.templateChangeDiv {
	position: fixed;
	width: 850px;
	height: auto;
	z-index: 9999999999;
	background: #fff;
	top: 50%;
	box-shadow: 2px 2px 7px 0px #0000001c;
	left: 50%;
	transform: translate(-50%, -50%);
	border-radius: 20px;
	padding: 15px;
}
.templateChangeDiv .templateChangeDiv-header {
	margin-bottom: 16px;
}

.templateChangeDiv .templateChangeDiv-header .title {
	width: calc(100% - 49px);
	margin: 0;
	padding: 4px 0 0 0;
}

.templateChangeDiv .templateChangeDiv-header ul {
	display: flex;
	border-bottom: 1px solid #ddd;
	justify-content : center;
}

.templateChangeDiv .templateChangeDiv-header ul li {
	cursor: pointer;
	margin: 0;
	text-align: center;
	padding: 0 156px;
	transition: .3s;
}

.templateChangeDiv .templateChangeDiv-header ul li.on {
	border-bottom: 2px solid #000;
    color: #000;
}

.templateChangeDiv .templateChangeDiv-header ul li :hover {
	color: #000;
}

.templateChangeDiv>div {
	width: 100%;
}

.templateChangeDiv-header .title {
	line-height: 45px;
	font-size: clamp(.9rem, 1vw, 1.1rem);
	font-weight: 600;
	padding: 0 10px;
}
.templateChangeDiv-header .templateChangeDiv-close {
	width: 40px;
    height: 40px;
    margin: 0;
    background-color: #e6e6e6;
    position: absolute;
    border-radius: 50px;
    cursor: pointer;
    transition: .3s;
    z-index: 20;
}
.templateImgListDiv {
	background: #fff;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 10px;
}
.templateImgListDiv div {
	border-radius: 10px;
	border: 1px solid #D9D9D9;
	height: 205px;
	overflow: hidden;
	width: calc((100% / 2) - 5px);
    box-sizing: border-box;
}
.templateImgListDiv div.on {
	border-radius: 10px;
	border: 4px solid #ffc136;
}
.templateImgListDiv div {
	background: #f4f4f4;
}
.templateImgListDiv div.exist {
	background: #fff;
}
.templateImgListDiv div img {
	width: 400px;
}
.templateDivBtn > div {
	width: 100%;
	height: 35px;
	border-radius: 10px;
	background: #ffd576;
	line-height: 35px;
	font-size: 15px;
	font-weight: 600;
	text-align: center;
	color: #fff;
	cursor: pointer;
}
.templateChangeDiv .templateDivBtn {
	margin-top: 10px;
}
.template-table table thead th {
	padding: 10px 0;
	background: #ddd;
}

.template-table table tbody td {
	padding: 10px 0;
}

.preView-Pop {
	display:none;
	position: fixed;
	width: 850px;
	height: auto;
	z-index: 9999999999;
	background: #fff;
	top: 50%;
	box-shadow: 2px 2px 7px 0px #0000001c;
	left: 50%;
	transform: translate(-50%, -50%);
	border-radius: 20px;
	padding: 15px;
}

.preView-Pop .pv-title {
	line-height: 45px;
	font-size: clamp(.9rem, 1vw, 1.1rem);
	font-weight: 600;
	padding: 0 10px;
}

.preView-Pop .pv-preview {
	max-height: 42rem;
    overflow: auto;
    padding-bottom: 12px;
}

.preView-Pop button {
	height: 35px;
    border-radius: 10px;
    background: #2196F3;
    line-height: 35px;
    font-size: 15px;
    font-weight: 600;
    text-align: center;
    color: #fff;
    cursor: pointer;
    width: 100%;
}

/* 보드 추가 */
.board-search {
	border: 1px solid #C5C6C8;
    height: 32px;
    border-radius: 30px;
    margin-bottom: 10px;
    width: 287px;
}
.board-search input{
	width: 100%;
    background: #fff;
    height: 32px;
    line-height: 32px;
}
.board-search .search-button{
	background-image: url(./image/search.png);
    background-size: 34px;
    width: 32px;
    height: 32px;
    top: 0;
    right: 12px;
    position: absolute;
    cursor: pointer;
    border-radius: 50%;
}

.board-content {
	width:276px;
}
.board-content > div{
	margin: 5px 0px;
}
.board-title-name{
	line-height: 34px;
}
.board-title-name.on{
	color: #69AEF2;
    font-weight: 800;
}
/* .board-title-img {
	margin-top: 10px;
	float: right;
	content: url('./image/down.png');
}
.board-title-img.on{
	content: url('./image/up2.png');
} */
.board-row {
	margin-bottom: 10px;
}
.board-row-list > ul {
	display: flex; 
	gap: 11%;
}
.board-div { 
	display: none;
}
.board-div.on { 
	display: block;
}
.new-plus-content { 
	gap: 0px !important;
}
.board-row-list>ul>li{
	margin: 10px 0px !important;
	color: black !important;
	padding-left: 10px;
	list-style: none;
	list-style-type: none;
}
.board-row-list>ul>li.on{
	font-weight: 400;
    color: #69AEF2 !important;
}
.board-row-list > ul {
    display: block !important;
}
.board-title-check{
	float: left;
    margin-right: 5px;
}
.board-title-check .size{
	border: 1px solid #69aef2;
    font-size: 26px;
    font-weight: 300;
    line-height: 18px;
    cursor: pointer;
    background: #fff;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    text-align: center;
    margin: 8.9px 0;
    position: relative;
}
.board-title-check .size::before {
    left: 50%;
    top: 18%;
    position: absolute;
    content: '';
    background-color: #69aef2;
    transform: rotate(0deg);
    width: 1px;
    height: 10px;
}
.board-title-check .size::after {
    left: 50%;
    top: 18%;
    position: absolute;
    content: '';
    transform: rotate(-90deg);
    background-color: #69aef2;
    width: 1px;
    height: 10px;
}
.board-title-check .size.on::before {
    left: 48%;
    top: 18%;
    position: absolute;
    content: '';
    transform: rotate(90deg);
    background-color: #69aef2;
    width: 1px;
    height: 10px;
}
.board-title-check .size-li{
	border: 1px solid #69aef2;
    font-size: 26px;
    font-weight: 300;
    line-height: 18px;
    cursor: pointer;
    background: #fff;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    text-align: center;
    position: relative;
}
.board-title-check .size-li::after {
    left: 50%;
    top: 18%;
    position: absolute;
    content: '';
    transform: rotate(-90deg);
    background-color: #69aef2;
    width: 1px;
    height: 10px;
}
.widget-table table tbody tr td.on {
	color: #69AEF2 !important;
    font-weight: 800 !important;
}         

.ai-popup {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	z-index: 10;
	display: none;
}
.ai-popup.on {
	display: block;
}

/*  25.07.01 - 팝업창 수정 s */
.ai-popup-content {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 80%;
	max-width: 1032px;
	max-height: fit-content;
	background: #fff;
	z-index: 10;
	display: flex;
	flex-direction: row;
	min-width: 840px;
}
/*  25.07.01 - 팝업창 수정 e */

.ai-popup-content img {
	width: 100%;
	height: 100%;
}

.ai-popup-content .ai-content {
	flex: 1 0 42%;
	max-width: 561px;
}

.ai-content.right {
	flex: 1 0 58%;
	display: flex;
	flex-direction: column;
	width: 100%;
}

.ai-content.left.pc {
	display: block;
} 

.ai-content.left.mb {
	display: none;
}

.ai-content.right .ai-popup-footer {
	display: flex;
	flex-wrap:wrap;
	gap: 6px;
	margin: 0;
	padding: 24px;
	box-sizing: border-box;
	width: 100%;
}

.ai-content.right .ai-popup-footer button {
	cursor: pointer;
}

.ai-content.right .ai-popup-footer .btn-one-day {
	background: #F4F5F6;
	border-radius: 8px;
	color: #464C53;
	font-size: 16px;
	font-weight: 600;
	flex: 1 0 calc(40% - 6px);
	height: 48px;
}

.ai-content.right .ai-popup-footer .btn-apply {
	background: #1BB579;
	border-radius: 8px;
	color: #fff;
	font-size: 16px;
	font-weight: 600;
	flex: 1 0 calc(60% - 6px);
	height: 48px;
}	

.ai-content.right .ai-popup-footer .btn-close-mb {
	display: none;
}

.ai-content.right .ai-popup-footer .btn-close-bottom {
	background: #CDD1D5;
	border-radius: 8px;
	color: #6D7882;
	font-size: 16px;
	font-weight: 600;
	flex: 1 0 60%;
	height: 48px;
}

.ai-content.right .ai-popup-footer .btn-close-all {
	background: #fff;
	color: #464C53;
	font-size: 16px;
	font-weight: 600;
	flex: 1 0 50%;
	height: 48px;
	/* border-bottom-right-radius: 8px; */
	display:none;
}

.ai-popup-mb .btn-back {
	background: #1BB579;
	border-radius: 8px;
	color: #fff;
	font-size: 16px;
	font-weight: 600;
	height: 48px;
	width: 100%;
	flex: 0 0 48px;
}


.ai-content.right .btn-close {
	position: absolute;
	top: 12px;
	right: 12px;
	width: 40px;
	height: 40px;
	background: #fff;
	cursor: pointer;
	border-radius: 50%;
}

.ai-content.right .btn-close:before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(45deg);
	width: 1px;
	height: 28px;
	background: #6D7882;
}
.ai-content.right .btn-close:after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(-45deg);
	width: 1px;
	height: 28px;
	background: #6D7882;
}
.ai-content dl  {
	display: flex;
	flex-direction: row;
	gap: 36px;
	padding-top: 26px;
}
.ai-content dl dt {
	font-size: 16px;
	font-weight: 600;
	margin: 0;
	color: #1E2124;
	min-width: 107px;
}

.ai-content dl dd {
	color: #464C53;
	margin: 0;
}

.ai-content dl dd ul li {
	padding-bottom: 4px;
}

.ai-content dl dd strong {
	padding-bottom: 9px;
	display: block;
	color: #1E2124;
	font-weight: 600;
}

.ai-content dl dd strong.bottom {
	padding-top: 20px;
}

/*  25.07.01 - 팝업창 수정 s */
.content-article {
	flex: 1 0 auto;
	padding:2rem;
	box-sizing: border-box;
	overflow: auto;
	height: calc(100% - 96px);
}
/*  25.07.01 - 팝업창 수정 e */

.btn-contest-popup-btn {
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	cursor:pointer;
}

.ai-popup-mb {
	position: absolute;
	display: none;
	width: 100%;
	height: 100%;
	background-color: #fff;
	z-index: 30;
	padding: 20px;
	box-sizing: border-box;
	flex-direction: column;
	overflow:auto;
}

.ai-popup-mb .header-content-mb {
	padding-bottom:24px;
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin: 0;
	border-bottom: 1px solid #CDD1D5;
}

.ai-popup-mb .header-content-mb .title {
	font-size: 22px;
	font-weight: 700;
	color: #1E2124;
	margin: 0;
}

.ai-popup-mb .header-content-mb .sub-title {
	font-size: 16px;
	font-weight: 400;
	color: #464C53;
	margin: 0;
}

.ai-popup-mb .content-article-mb {
	padding-top: 24px;
	flex: 1;
}
.ai-popup-mb .content-article-mb dl {
	display: flex;
	flex-direction: row;
	margin-bottom: 16px;
}

.ai-popup-mb .content-article-mb dt {
	width: 90px;
	min-width: 90px;
	font-weight: 600;
	color: #222;
	font-size: 15px;
	line-height: 1.6;
}

.ai-popup-mb .content-article-mb dd {
	flex: 1;
	margin: 0;
	color: #464C53;
	font-size: 15px;
	line-height: 1.6;
}

.ai-popup-mb .content-article-mb dd strong {
	display: block;
	font-weight: 700;
	color: #222;
	margin-bottom: 4px;
	font-size: 15px;
}

.ai-popup-mb .content-article-mb dd strong.bottom {
	margin-top: 16px;
}

.ai-popup-mb .content-article-mb dd ul {
	margin: 0 0 0 0;
	padding-left: 18px;
}

.ai-popup-mb .content-article-mb dd ul li {
	list-style: disc;
	font-size: 15px;
	color: #464C53;
	margin-bottom: 2px;
}

.ai-popup-mb .content-article-mb dd ul li::marker {
	color: #3B82F6;
}


/*  */


.content-article .btn-file-upload,
.ai-popup-mb .btn-file-upload  {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 4px;
	background-color: #F4F5F6;
	width: 100%;
	justify-content: space-between;
	padding: 12px;
	border-radius: 8px;
	border: none;
	cursor: pointer;
}
.content-article .btn-file-upload {
	margin-top:20px;
}
.ai-popup-mb .btn-file-upload {
	margin-bottom:20px;
}
.content-article .btn-file-upload p,
.ai-popup-mb .btn-file-upload p {
	margin: 0;
	color: #464C53;
	font-size: 16px;
	width: auto;
	text-align:left;
}
.content-article .btn-file-upload .down,
.ai-popup-mb .btn-file-upload .down {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 8px;
	font-size: 16px;
	color: #464C53;
	flex: 0 0 90px;
}
.ai-popup-mb .btn-file-upload .down  {
	margin:0;
}