@charset "utf-8";

.widget_pr_weather {
	position: relative;
	font-size: 12px;
	color: #333;
	margin:0 auto;
	border: 2px solid #ccc; /* 테두리 색상 */
    border-radius: 15px; /* 둥근 모서리 */
    padding: 20px 20px 10px 20px; /* 안쪽 여백 */
    background-color: #f9f9f9; /* 배경 색상 */
    max-width: 400px; /* 최대 너비 설정 */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* 그림자 효과 */
}

#pr_select_pre, #pr_select_close, #pr_select_geo {
	cursor: pointer;
	padding: 3px;
}

#pr_select_pre:hover, #pr_select_close:hover {
	color: #333;
}

#pr_select_geo {
    position: absolute;
    top: 2px;
    right: 5px;
    padding: 0;
}

#pr_select_open:hover {
	color: #ff704a;
}

#pr_select_geo.pr_btn_geo {
	display: block;
    background: url(./img/ico_btn.png) no-repeat 0 0;
	width: 27px;
    height: 27px;
	-webkit-animation-name: none;
	-moz-animation-name: none;
	-o-animation-name: none;
	-ms-animation-name: none;
}

#pr_select_geo.off {
    background-position: 0px 0px;
}

#pr_select_geo.on {
    background-position: -28px 0px;
}

#pr_select_geo.act {
	background-position: -56px 0px;
	-webkit-animation-name: rotate;
	-webkit-animation-duration:1.5s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:linear;
	-moz-animation-name: rotate;
	-moz-animation-duration:1.5s;
	-moz-animation-iteration-count:infinite;
	-moz-animation-timing-function:linear;
	-o-animation-name: rotate;
	-o-animation-duration:1.5s;
	-o-animation-iteration-count:infinite;
	-o-animation-timing-function:linear;
	-ms-animation-name: rotate;
	-ms-animation-duration:1.5s;
	-ms-animation-iteration-count:infinite;
	-ms-animation-timing-function:linear;
}

@-webkit-keyframes rotate {
	from {-webkit-transform:rotate(0deg);}
	to {  -webkit-transform:rotate(360deg);}
}

@-moz-keyframes rotate {
	from {-moz-transform:rotate(0deg);}
	to {  -moz-transform:rotate(360deg);}
}

@-o-keyframes rotate {
	from {-o-transform:rotate(0deg);}
	to {  -o-transform:rotate(360deg);}
}

@-ms-keyframes rotate {
	from {-ms-transform:rotate(0deg);}
	to {  -ms-transform:rotate(360deg);}
}

#pr_weather_html {
	width:100%;
	min-height: 37px;
	padding: 5px;
}

.data_provide {
	text-align:right;
	padding:5px 5px 0;
	color: #333;
	font-size:10px;
}
.data_provide a {
	text-decoration: none;
    color: inherit;
    font-size: inherit;
}

#pr_weather_html .list_tommorrow {
	float: right;
    list-style: none;
    height: 48px;
    max-width: 50%;

}

#pr_weather_html .list_tommorrow li {
    display: inline-block;
    margin-left: 12px;
}

#pr_weather_html .list_tommorrow .txt_ampm {
    display: block;
    margin-top: 2px;
    font-size: 13px;
    color: #555;
    line-height: 1.17;
}

#pr_weather_html .list_tommorrow .txt_temper {
    display: inline-block;
    font-size: 18px;
    vertical-align: top;
	font-family: tahoma, sans-serif;
	line-height: 26px;
}



#pr_weather_html .info_weather {
    display: flex;
    align-items: center;
}

#pr_weather_html .wrap_desc {
    display: inline-block;
	margin-left:10px;
}

.info_temp {
    border-radius: 10px; 
    padding: 10px;
    background-color: #ffffff;
    border: 1px solid #e0e0e0; 
}

#pr_weather_html .info_temp .desc_temp {
    display: inline-block;
    padding-left: 10px;
	padding-bottom:5px;
    text-align: left;
	max-width: 50%;
}

#pr_weather_html .txt_weather {
	margin-top: 5px;
	padding-left:3px;
    display: block;
    white-space: nowrap;
}

#pr_weather_html .txt_temp {
    display: inline-block;
    overflow: hidden;
    font-size: 34px;
	line-height: 1;
}

#pr_weather_html .txt_temp .txt_unit {
    vertical-align: 10px;
    font-size: 22px;
	padding-left: 2px;
}

#pr_weather_html .txt_desc {
    text-align: right;
    line-height: 15px;
	margin: 0 0 3px 2px;
	padding: 0;
    font-size: 13px;
	word-break: keep-all;
	cursor: pointer;
	margin-right: 5px;
}

#pr_weather_html .info_another {
	border-top: 1px solid #f2f2f2;
	font-size: 14px;
	width: 100%;
	padding-top:3px;
}

#pr_weather_html .info_another .wind,
#pr_weather_html .info_another .humidity,
#pr_weather_html .info_another .dust,
#pr_weather_html .info_another .dust10,
#pr_weather_html .info_another .dust25
{
    padding-left: 10px;
	color: #3890fc;
}

#pr_weather_html .info_another ul {
    border-radius: 10px;
    background-color: #ffffff;
    border: 1px solid #e0e0e0;
    padding: 10px;
}

#pr_weather_html .info_another ul li {
    display: flex;
}

#pr_weather_html .info_another span:nth-child(2) { 
	text-align:right; margin-right:5px;
}

#pr_weather_html .info_another .txt_tit {
	margin-left:5px;
    width: 50%;
	font-weight: bold;
}

#pr_weather_html .ico_wl {
	float: left;
    display: block;
    overflow: hidden;
    width: 60px;
    height: 50px;
    background: url(./img/ico_weather_l.png) no-repeat 0 0;
    text-indent: -9999px;
}
#pr_weather_html .ico_ws, .fcst_table .ico_ws {
    width: 26px;
    height: 26px;
	line-height: 26px;
    background: url(./img/ico_weather_26.png) no-repeat 0 0;
	display: inline-block;
	float: none;
}
/* 맑음 */
#pr_weather_html .ico_wl.DB01, .fcst_table .ico_wl.DB01 {
    background-position: 0 0
}
/* 맑음 밤 */
#pr_weather_html .ico_wl.DB01_N, .fcst_table .ico_wl.DB01_N {
    background-position: 0 -60px
}
/* 구름조금 */
#pr_weather_html .ico_wl.DB02, .fcst_table .ico_wl.DB02 {
    background-position: 0 -120px
}
/* 구름조금 밤 */
#pr_weather_html .ico_wl.DB02_N, .fcst_table .ico_wl.DB02_N {
    background-position: 0 -180px
}
/* 구름많음 */
#pr_weather_html .ico_wl.DB03, .fcst_table .ico_wl.DB03 {
    background-position: 0 -240px
}
/* 구름많음 밤 */
#pr_weather_html .ico_wl.DB03_N, .fcst_table .ico_wl.DB03_N {
    background-position: 0 -300px
}
/* 흐림 */
#pr_weather_html .ico_wl.DB04, #pr_weather_html .ico_wl.DB04_N, .fcst_table .ico_wl.DB04, .fcst_table .ico_wl.DB04_N {
    background-position: 0 -360px
}
/* 소나기 */
#pr_weather_html .ico_wl.ico_w07, .fcst_table .ico_wl.ico_w07 {
    background-position: 0 -420px
}

#pr_weather_html .ico_wl.DB09, #pr_weather_html .ico_wl.DB09_N, .fcst_table .ico_wl.DB09, .fcst_table .ico_wl.DB09_N {
    background-position: 0 -420px
}

/* 비 */
#pr_weather_html .ico_wl.DB05, #pr_weather_html .ico_wl.DB05_N, .fcst_table .ico_wl.DB05, .fcst_table .ico_wl.DB05_N {
    background-position: 0 -480px
}
/* 한때 비 */
#pr_weather_html .ico_wl.ico_w09, .fcst_table .ico_wl.ico_w09 {
    background-position: 0 -540px
}
/* 눈 */
#pr_weather_html .ico_wl.DB08, #pr_weather_html .ico_wl.DB08_N, .fcst_table .ico_wl.DB08, .fcst_table .ico_wl.DB08_N {
    background-position: 0 -600px
}
/* 한때 눈 */
#pr_weather_html .ico_wl.ico_w11, .fcst_table .ico_wl.ico_w11 {
    background-position: 0 -660px
}
/* 비/눈 */
#pr_weather_html .ico_wl.DB06, #pr_weather_html .ico_wl.DB06_N, .fcst_table .ico_wl.DB06, .fcst_table .ico_wl.DB06_N {
    background-position: 0 -720px
}
/* 한때 비/눈 */
#pr_weather_html .ico_wl.ico_w13, .fcst_table .ico_wl.ico_w13 {
    background-position: 0 -780px
}
/* 눈/비 */
#pr_weather_html .ico_wl.DB07, #pr_weather_html .ico_wl.DB07_N, .fcst_table .ico_wl.DB07, .fcst_table .ico_wl.DB07_N {
    background-position: 0 -840px
}
/* 한때 눈/비 */
#pr_weather_html .ico_wl.ico_w15, .fcst_table .ico_wl.ico_w15 {
    background-position: 0 -900px
}
/* 천둥번개 */
#pr_weather_html .ico_wl.ico_w16, .fcst_table .ico_wl.ico_w16 {
    background-position: 0 -960px
}
/* 연무 */
#pr_weather_html .ico_wl.ico_w17, .fcst_table .ico_wl.ico_w17 {
    background-position: 0 -1020px
}
/* 안개 */
#pr_weather_html .ico_wl.ico_w18, .fcst_table .ico_wl.ico_w18 {
    background-position: 0 -1080px
}
/* 박무 */
#pr_weather_html .ico_wl.ico_w19, .fcst_table .ico_wl.ico_w19 {
    background-position: 0 -1140px
}
/* 황사 */
#pr_weather_html .ico_wl.ico_w20, .fcst_table .ico_wl.ico_w20 {
    background-position: 0 -1200px
}

@media (min-width: 300px)
	.list_tommorrow {display: none;}
}


