@charset "utf-8";

#content.yna-weather .weather-cont,
.contents .weather-cont{opacity:0;filter:alpha(opacity=0);}

/** 임시 로더 */
.loader-box{display:none;opacity:0.95;position:fixed;top:0;left:0;z-index:99999;width:100%;height:100%;background-color:#fff;}
.loader-box .logger{position:absolute;top:0;left:0;padding:50px;width:calc(100% - 100px);height:auto;font-size:14px;}
.loader-box .logger li{margin-bottom:10px; letter-spacing:1px; border-bottom:1px dotted #333;}
.loader-box .logger li .warn-color-red{color:red;}
.loader-box .logger li .warn-color-green{color:green;}

/* 헤더날씨 */
.link-wrap .today-weather{height:45px !important;position:absolute !important;top:63px !important;padding-left:0 !important;}
.link-wrap .today-weather .main-top-weather{height:45px !important;padding-left:0;}
.link-wrap .today-weather .date{margin-top:13px;}

/* 오늘날씨 */
.txt-type03{float:left;}
.top-weather-box{width:657px;float:left;}
.top-weather-box .con-wrap dl{text-align:left;font-size:13px;line-height:16px;}
.top-weather-box .con-wrap dl dt{padding-top:5px;color:#000;}
.top-weather-box .con-wrap dl dd{padding:5px 0 8px;color:#666;}
.weather-con-box{padding:25px 0;border-top:1px solid #000;border-bottom:1px solid #ccc;}
.top-weather-box .txt-type03{display:inline-block;}
.top-weather-box .txt-type03 span{font-family:'Open Sans';}
.top-weather-box .txt-type03 button{content:'';display:inline-block;width:14px;height:14px;margin-top:3px;margin-left:10px;vertical-align:middle;background:url(/global/home/v01/img/sprites_global.png) -408px -30px no-repeat;}

.weather-left-area .weather-layer02{display:none;position:absolute;z-index:11;top:45px;left:160px;width:320px;}
.weather-left-area .con-wrap{position:absolute;top:1px;left:0;width:320px;padding:10px 19px;border:1px solid #ccc;box-sizing:border-box;background:#fff;}
.weather-left-area .weather-layer02 #con-wrap01{display:block;z-index:12;}
.weather-left-area .btn02 button{width:14px;height:14px;border:0;background:url(/global/home/v01/img/sprites_btn02.png) -70px -345px no-repeat;}
.weather-left-area .btn02 span{display:none;}
.weather-left-area .weather-layer02{top:133px;left:131px;}
.weather-left-area #con-wrap02{display:block;}
.weather-left-area .con-wrap .tit-wrap{text-align:right;}
.weather-left-area .btn02{height:auto;margin:5px 0 13px;}
.weather-left-area .btn02 button{width:14px;height:14px;border:0;background:url(/global/home/v01/img/sprites_btn02.png) -70px -345px no-repeat;position:absolute;right:15px;}
.weather-left-area .tit-wrap .btn02 button span{background:none;}

.main-temperature{padding-top:3px;letter-spacing:0;font-size:12px;}
.main-temperature span{color:#f84d31;}
.main-weather-air{float:left;clear:both;line-height:10px;letter-spacing:0;}
.main-weather-air span{color:#6177da;}

.weather-cont{width:100%;overflow:hidden;}
.weather-left-area{width:657px;float:left;position:relative;}
.weather-right-area{width:400px;float:right;}

/* .top-weather-wrap{} */
.top-weather-box{height:26px;border-bottom:1px solid #000;padding-bottom:10px;}
.top-weather-box h3{float:left;font-size:13px;padding-right:10px;border-right:1px solid #ccc;margin-right:10px;height:15px;margin-top:8px;line-height:13px;font-weight:normal;color:#333;}
.top-weather-box span{font-size:12px;color:#575757;letter-spacing:0;float:left;line-height:30px;}
.location-weather-area{float:right;height:30px;line-height:30px;margin-bottom:15px;}
.location-weather-area .location-weather-area{float:right;}
.location-weather-area span{background:url(/global/home/v01/img/icon_pub_weather.png) no-repeat -8px -7px;width:19px;height:19px;margin-right:5px;cursor:pointer;margin-top:7px;
-webkit-transition:-webkit-transform 0.5s;
transition:transform 0.5s;}
.location-weather-area span:hover{-webkit-transition:all 0.5s ease-in-out;-webkit-transform:rotate(360deg);
-moz-transition:all 0.5s ease-in-out;-moz-transform:rotate(360deg);
-o-transition:all 0.5s ease-in-out;-o-transform:rotate(360deg);
-ms-transition:all 0.5s ease-in-out;-ms-transform:rotate(360deg);
transition:all 0.5s ease-in-out;transform:rotate(360deg);-webkit-transform:rotate(360deg);transform:rotate(360deg);}
.location-weather-area p{float:left;font-size:13px;color:#666;margin-right:12px;}

.weather-today-location{width:200px;float:left;margin-right:10px;position:relative;}
.location-select-city{width:150px;}
.yhn-select-arrow{background:#fff url(/global/home/v01/img/icon_pub_weather.png) no-repeat -8px 0px;overflow:hidden;width:30px;height:26px;position:absolute;top:1px;right:1px;background-position:-197px -3px;z-index:2;cursor:pointer;}

.location-weather-area select{height:30px;width:100%;margin-right:5px;border:1px solid #ccc;padding-left:5px;line-height:28px;}
.location-weather-area button.btn-location-move{font-size:12px;padding:0 10px;background:#404b7f;height:30px;line-height:26px;color:#fff;}

.bott-weather-box{width:100%;overflow:hidden;padding:14px 0;border-bottom:1px solid #ccc;margin-bottom:8px;}
.weather-detail-info{width:285px;overflow:hidden;padding:15px 0px;float:left;}
.weather-today-info{float:right;width:135px;}
.weather-title{font-size:15px;color:#666;margin-top:10px;}
.weather-temperature{font-size:53px;color:#000;line-height:56px;margin:5px 0;}
.weather-temperature span{font-size:24px;line-height:30px;margin-top:5px;}
.weather-temperature-info p{margin-top:0px;}

.weather-temperature-info p:nth-child(1) span:nth-child(1){color:red;}
.weather-temperature-info p:nth-child(1) span:nth-child(2){color:#228cff;}
.weather-temperature-info p:nth-child(2){font-size:15px;color:#767676;}

.rwhs-area{width:100%;overflow:hidden;}
.rwhs-area li{float:left;font-size:12px;height:23px;color:#575757;padding-top:3px;letter-spacing:0;}
.rwhs-area li span{font-weight:bold;letter-spacing:0;color:#000;direction:initial;}
.rwhs-area li.precip{width:45%;}
.rwhs-area li.wind{width:55%;}
.rwhs-area li.humidity{width:45%;}

.air-info-area{float:right;width:370px;padding:10px 0;}
.air-info{border-bottom:1px solid #ddd;overflow:hidden;padding-bottom:10px;margin-bottom:20px;}
.air-info li{width:50%;float:left;padding:5px 0;}
.air-info li:nth-child(even){width:50%;float:right;}
.air-info li:first-child{width:100%;}
.air-info li:nth-child(2){display:none;}
.air-info li h4{font-size:12px;font-weight:bold;margin-bottom:5px;width:40px;;margin-right:5px;color:#575757;float:left;font-family:"나눔고딕",Nanum Gothic;}
.air-info li p.air-lv{width:20px;float:left;margin-top:8px;margin-right:5px;}
.air-info li p.air-lv1{width:10px;height:10px;border-radius:15px;background:#3399cc;}
.air-info li p.air-lv2{width:10px;height:10px;border-radius:15px;background:#33cc66;}
.air-info li p.air-lv3{width:10px;height:10px;border-radius:15px;background:#f9912f;}
.air-info li p.air-lv4{width:10px;height:10px;border-radius:15px;background:#f56767;}
.air-info li:nth-child(even) h4{width:40px;}
.air-lv-txt01{color:#3399cc;}
.air-lv-txt02{color:#33cc66;}
.air-lv-txt03{color:#f9912f;}
.air-lv-txt04{color:#f56767;}

/* 주간날씨 */
.weekly-area{overflow:hidden;}
.weekly-area h3{font-weight:normal;padding-bottom:8px;font-size:13px;color:#333;}
.weekly-area ul{border-bottom:1px solid #ddd;overflow:hidden;border-top:1px solid #000;clear:both;}
.weekly-area ul li{float:left;width:109px;min-height:203px;padding:17px 0;text-align:center;border-left:1px #ccc solid;box-sizing:border-box;}
.weekly-area ul li:first-child,.weekly-area ul li:last-child{border-right:0 none;width:108px;}
.weekly-area ul li:first-child{border-left:0 none;}
.weekly-area ul li p.day{font-size:13px;}
.weekly-area ul li p.day span{font-size:14px;color:#728694;}
.w-text{font-size:13px;color:#333;margin-top:2px;letter-spacing:0;height:65px;display:table-cell;vertical-align:middle;text-align:center;width:109px;line-height:18px;}
.temperature{letter-spacing:0;font-size:12px;color:#999;}
.temperature span{color:#777;}
.temperature span:first-child{color:#000;margin-right:2px;}
.temperature span:last-child{margin-left:2px;color:#999;}

/* 3시간예보 */
.forecast-life-area{overflow:hidden;}
.forecast-life-area h3{font-size:13px;color:#000;border-bottom:2px solid #666;padding-bottom:5px;font-weight:normal;}
.forecast-time-area{width:100%;position:relative;}
.forecast-time-area .space04{width:100%;margin-bottom:0;padding-bottom:15px;border-bottom:1px solid #000;}
.forecast-table{width:100%;border-left:1px solid #ddd;border-bottom:1px solid #ddd;border-top:1px solid #000;}
.forecast-table th{background:#f4f6f9;letter-spacing:0;font-weight:normal;color:#575757;height:34px;line-height:34px;border-right:1px solid #ddd;}
.forecast-table th span{color:#728694;}
.forecast-table td{text-align:center;border-right:1px solid #ddd;border-top:1px solid #ddd;font-size:11px;padding:8px 0 3px 0;color:#575757;letter-spacing:0;}
.forecast-table td.forecast-graph-area{width:293px;height:80px;padding:7px 0;}

.forecast-category{width:90px;float:left;background:#fafafa;height:293px;margin-bottom:20px;}
.forecast-category p{background:#FAFAFA;border-bottom:1px solid #ddd;font-weight:normal;width:90px;text-align:center;font-family:'Playfair Display';font-size:14px;color:#000;}
.forecast-category p:nth-child(1){height:36px;line-height:36px;}
.forecast-category p:nth-child(2){height:186px;line-height:186px;}
.forecast-category p:nth-child(3){height:36px;line-height:36px;}
.forecast-category p:nth-child(4){height:58px;line-height:58px;}
.yna-threetime-body{width:518px; float:left;background:#fff; height:290px;  }
.forecast-time-table{height:290px; width:auto; /*width:259px;*/}
.forecast-time-table td{text-align:center;border-bottom:1px solid #ddd;padding:5px 0;color:#666;font-size:12px;position:relative;width:auto;border-left:1px solid #ddd;}
.forecast-time-table tr:nth-child(4) td{color:#999;}
.forecast-th{background:#fafafa;color:#000;font-family:'Playfair Display';font-size:13px;}
.forecast-time-table tr:nth-child(1){height:30px;}
.forecast-time-table tr:nth-child(2){height:20px;}
.forecast-time-table tr:nth-child(3){position:relative; height:129px;}
.forecast-time-table tr:nth-child(4) td{position:relative;height:20px;}
.forecast-time-table tr:nth-child(5){height:20px;}
#threeTimeZone{position:absolute; top:5px; left:0; width:567px; height:120px;}
.forecast-tbl-left{float:left; height:320px;width:calc(100% - 90px);}
.forecast-tbl-right{width:471px;}
.time-now{width:64px;height:311px;/*background:url(/global/home/v01/img/time_now_bg.png?v2) no-repeat 0 0;*/position:absolute;top:74px;left:162px;border:1px solid #389CD7;}

/* 오른쪽 컨텐츠 */
/* 전국날씨 */
.aside-city-area{border:1px solid #ddd;overflow:hidden;}
.day-tab{height:40px;border-bottom:1px solid #ddd;}
.day-tab li{float:left;width:33.3%;height:38px;text-align:center;line-height:38px;}
.day-tab li a{display:block;color:#728694;letter-spacing:-0.5px;}
.day-tab li a:hover{text-decoration:none;}
.day-tab li.day-tab-on{border-bottom:2px solid #379bd6;}
.country-map{width:400px;height:480px;position:relative;}
.city-tab-contents{background:#E0EEF5 url(/global/home/v01/img/today_map.png) no-repeat 0 0;width:400px;height:480px;}
.ampm-tab{overflow:hidden;width:74px;position:absolute;right:10px;top:10px;z-index:9;}
.ampm-tab li{float:left;width:36px;height:22px;text-align:center;line-height:22px;background:#fff;font-size:13px;}
.ampm-tab li a{display:block;color:#888;}
.ampm-tab li.day-tab-on{background:#389dd3;color:#fff;font-size:13px;}
.ampm-tab li.day-tab-on a{color:#fff;}
.ampm-tab li a:hover{text-decoration:none;}
html.en .day-tab li{width:32%;font-family:'Playfair Display';}
html.en .day-tab li:last-child{width:36%}

.public-city-list{width:400px;height:480px;position:relative;clear:both;}
.public-city-list ul li{border:1px solid #ddd;background:#fff;width:68px;height:auto;text-align:center;position:absolute;padding-top:3px;}
.public-city-list ul li.seoul{top:60px;left:75px;}
.public-city-list ul li.chuncheon{top:41px;left:153px;}
.public-city-list ul li.gangneung{top:61px;left:231px;}
.public-city-list ul li.daejeon{top:172px;left:82px;}
.public-city-list ul li.cheongju{top:159px;left:160px;}
.public-city-list ul li.daegu{top:196px;left:238px;}
.public-city-list ul li.gwangju{top:280px;left:82px;}
.public-city-list ul li.jeonju{top:257px;left:160px;}
.public-city-list ul li.busan{top:284px;left:249px;}
.public-city-list ul li.jeju{top:389px;left:39px;}
.public-city-list ul li.ulleungdokdo{top:62px;left:309px;}

.city-name{font-size:11px;line-height:14px;}
.city-temperature{font-size:12px;letter-spacing:0;}
.w-time-standard{float:right;margin-top:-30px;margin-right:10px;color:#666;letter-spacing:0.5px;font-size:13px;}
.w-time-standard:before{content:"";display:none;margin-right:3px;margin-top:-3px;float:left;width:18px;height:18px;background:url(/global/home/v01/img/icon_reload.png) no-repeat 0 0;margin-top:4px;}

/* 관심지역 날씨 */
.aside-attention-city{border-bottom:1px solid #ddd;}
.aside-attention-city h5{color:#5d93d4;font-size:13px;font-weight:normal;padding-bottom:8px;border-bottom:1px solid #ddd;}
.ac-temperature{width:110px;float:left;padding-left:5px;padding-top:10px;margin-top:20px;}
.ac-detail-temperature{font-size:40px;margin-bottom:20px;color:#000;}
.ac-detail-temperature span{font-size:20px;vertical-align:top;display:inline-block;margin-top:-6px;}
.btn-location-move{background:#404b7f;color:#fff;padding:0 10px;}
.attention-coutry-area .weather-temperature-info p{font-size:13px;}
.attention-city-info .rwhs-area{width:180px;float:right;margin-bottom:8px;padding-left:5px;margin-top:20px;}
.attention-city-info .rwhs-area li{float:none;width:100% !important;}
.attention-city-info .ac-weather{width:100px;height:106px;clear:both;float:left;text-align:center;}
.attention-city-info .ac-weather span{color:#666;}
.attention-coutry-area{width:100%;overflow:hidden;border-top:1px solid #000;height:208px;}
.attention-coutry-area .location-weather-area{padding-top:10px;}
.attention-weekly-weather{padding:18px 0 15px 0;overflow:hidden;width:400px;border-top:1px dotted #ddd;}
.attention-weekly-weather li{float:left;width:25%;text-align:center;letter-spacing:0;}
.attention-weekly-weather li p.aw-day{font-size:12px;color:#666;margin-bottom:5px;letter-spacing:0;}
.attention-weekly-weather li p.aw-temperature{font-size:12px;color:#999;}
.attention-weekly-weather li p.aw-temperature span:first-child{color:#000;}

.air-info-area .air-info li:nth-child(4) h4{width:40px !important;}