﻿
/*************************************************
* 프로젝트명 :연합뉴스 국문 PC 홈페이지 (★ 2024)
* comment :연합뉴스_홈_뉴스플러스_날씨
* as-is 홈페이지 날씨 css 원본을 weather_ui03.css 작업
-- 원본 r.yna.co.kr/global/home/v01/css/weather_ui.css
-- 원본 r.yna.co.kr/global/home/v01/css/weather_ui02.css
*************************************************/

/* =============== ####날씨 ======================== */
/* weather_ui.css */
/* =============== 날씨 애니메이션 ======================== */
.weather-animation{overflow:hidden;}
.w-animation{overflow:hidden;flex-shrink:0;float:left;position:relative;width:150px;height:150px;}
.w-animation-icon{margin:15px 0;background-image:url(../image/icon_weather_animation01.svg);background-repeat:no-repeat;}

/*------- w-animation -------*/
/* .w-animation.wm-$$
 * 150 x 150 */

/* wm-01 맑음 */
.wm-01{}
.sun-big{position:absolute;top:13px;left:14px;width:120px;height:120px;margin:0;background-position:-23px -23px;-webkit-animation:sun 25s linear infinite;-moz-animation:sun 25s linear infinite;animation:sun 25s linear infinite;}
.suncloud .sun-big{top:10px;left:20px;}
/* wm-02 구름조금 */
.wm-02 .cloud-small{position:absolute;top:75px;left:12px;width:82px;height:56px;margin:0;background-position:-190px -54px;}
/* wm-03 흐림 */
.cloud-gray-big{position:absolute;width:122px;height:74px;margin:0;background-position:-322px -45px;}
.wm-03 .cloud-gray-big{top:45px;left:10px;
-webkit-animation:cloud-big01 5s linear infinite;
-moz-animation:cloud-big01 5s linear infinite;
animation:cloud-big01 5s linear infinite;}
.cloud-gray-small{position:absolute;width:101px;height:62px;margin:0;background-position:-496px -52px;}
.wm-03 .cloud-gray-small{top:28px;left:42px;
-webkit-animation:cloud-big02 5s linear infinite;
-moz-animation:cloud-big02 5s linear infinite;
animation:cloud-big02 5s linear infinite;}
/* wm-04 비 */
.cloud-white-big{position:absolute;width:122px;height:100px;margin:0;background-position:-643px -25px;}
.rain-big{overflow:hidden;position:absolute;top:65px;left:28px;width:80px;height:80px;margin:0;}
.rain-big01{position:absolute;left:5px;width:22px;height:42px;margin:0;background-position:-756px -312px;
-webkit-animation:raindrop01 0.7s linear infinite;
-moz-animation:raindrop01 0.7s linear infinite;
animation:raindrop01 0.7s linear infinite;}
.rain-big02{position:absolute;top:0;left:22px;width:35px;height:56px;margin:0;background-position:-789px -310px;
-webkit-animation:raindrop02 0.7s linear infinite;
-moz-animation:raindrop02 0.7s linear infinite;
animation:raindrop02 0.7s linear infinite;
animation-delay:0.2s;}
.rain-big03{position:absolute;left:52px;width:20px;height:41px;margin:0;background-position:-756px -314px;
-webkit-animation:raindrop03 0.7s linear infinite;
-moz-animation:raindrop03 0.7s linear infinite;
animation:raindrop03 0.7s linear infinite;
animation-delay:0.4s;}
.wm-04 .cloud-gray-small{top:11px;left:42px;}
.wm-04 .cloud-white-big{top:1px;left:8px;}
/* wm-05 눈 */
.wm-05 .cloud-gray-small{top:18px;left:42px;}
.wm-05 .cloud-white-big{top:8px;left:8px;}
.wm-05 .snow-big{overflow:hidden;position:absolute;top:92px;left:34px;width:75px;height:45px;-webkit-animation:snowbig 3s linear infinite;-moz-animation:snowbig 3s linear infinite;animation:snowbig 3s linear infinite;}
.snow-big01{float:left;width:22px;height:22px;margin:1px;background-position:-997px -223px;text-align:center;}
.snow-big01:nth-child(1){top:0;left:3px;
-webkit-animation:snowbig01 3s linear infinite;
-moz-animation:snowbig01 3s linear infinite;
animation:snowbig01 3s linear infinite;}
.snow-big01:nth-child(2){float:left;top:0;left:2px;
-webkit-animation:snowbig01 3s linear infinite;
-moz-animation:snowbig01 3s linear infinite;
animation:snowbig01 3s linear infinite;}
.snow-big01:nth-child(3){top:0;left:2px;
-webkit-animation:snowbig01 3s linear infinite;
-moz-animation:snowbig01 3s linear infinite;
animation:snowbig01 3s linear infinite;}
.snow-big01:nth-child(4){top:0;margin-left:13px;
-webkit-animation:snowbig01 3s linear infinite;
-moz-animation:snowbig01 3s linear infinite;
animation:snowbig01 3s linear infinite;}
.snow-big01:nth-child(5){top:0;left:14px;
-webkit-animation:snowbig01 3s linear infinite;
-moz-animation:snowbig01 3s linear infinite;
animation:snowbig01 3s linear infinite;}
/* wm-06 눈비 */
.wm-06 .cloud-gray-small{top:18px;left:42px;}
.wm-06 .cloud-white-big{top:8px;left:8px;}
.wm-06 .snowrain-big{position:absolute;top:109px;left:28px;width:80px;height:50px;margin:0 10px;}
.snowrain-big p{float:left;}
.snowrain01{position:absolute;top:-15px;left:0;width:16px;height:16px;margin:0;background-position:-1114px -218px;-webkit-animation:snowrainbig01 3s linear infinite;-moz-animation:snowrainbig01 3s linear infinite;animation:snowrainbig01 3s linear infinite;}
.snowrain02{position:absolute;top:-15px;left:20px;width:17px;height:18px;margin:0 0 0 5px;background-position:-1036px -239px;-webkit-animation:snowrainbig02 3s linear infinite;-moz-animation:snowrainbig02 3s linear infinite;animation:snowrainbig02 3s linear infinite;}
.snowrain03{position:absolute;top:-15px;left:40px;width:16px;height:16px;margin:0 0 0 5px;background-position:-1114px -218px;-webkit-animation:snowrainbig01 3s linear infinite;-moz-animation:snowrainbig01 3s linear infinite;animation:snowrainbig01 3s linear infinite;}
.snowrain04{position:absolute;top:5px;left:-10px;width:17px;height:18px;margin:0;background-position:-1036px -239px;-webkit-animation:snowrainbig02 3s linear infinite;-moz-animation:snowrainbig02 3s linear infinite;animation:snowrainbig02 3s linear infinite;}
.snowrain05{position:absolute;top:6px;left:12px;width:16px;height:16px;margin:0;background-position:-1114px -218px;-webkit-animation:snowrainbig01 3s linear infinite;-moz-animation:snowrainbig01 3s linear infinite;animation:snowrainbig01 3s linear infinite;}
.snowrain06{position:absolute;top:5px;left:35px;width:17px;height:18px;margin:0;background-position:-1036px -239px;-webkit-animation:snowrainbig02 3s linear infinite;-moz-animation:snowrainbig02 3s linear infinite;animation:snowrainbig02 3s linear infinite;}
/* wm-07 소나기 */
.sun-small{width:105px;height:105px;background-position:-806px -30px;}
.cloud-white-middle{width:101px;height:64px;background-position:-950px -50px;}
.wm-07 .sun-small{position:absolute;top:15px;left:35px;margin:0;-webkit-animation:sun 25s linear infinite;-moz-animation:sun 25s linear infinite;animation:sun 25s linear infinite;}
.wm-07 .cloud-white-middle{position:absolute;top:42px;left:8px;}
.shower-big{position:absolute;top:108px;left:30px;width:52px;height:36px;}
.shower01{position:absolute;top:-5px;width:20px;height:32px;margin:0;background-position:-132px -325px;-webkit-animation:shower01 0.6s linear infinite;-moz-animation:shower01 0.6s linear infinite;animation:shower01 0.6s linear infinite;}
.shower02{position:absolute;top:-5px;left:19px;width:18px;height:34px;margin:0;background-position:-160px -328px;-webkit-animation:shower02 0.6s linear infinite;-moz-animation:shower02 0.6s linear infinite;animation:shower02 0.6s linear infinite;animation-delay:0.2s;}
.shower03{position:absolute;top:-5px;left:32px;width:20px;height:30px;margin:0;background-position:-132px -325px;-webkit-animation:shower03 0.6s linear infinite;-moz-animation:shower03 0.6s linear infinite;animation:shower03 0.6s linear infinite;animation-delay:0.4s;}
/* wm-08 소낙눈 */
.wm-08 .sun-small{position:absolute;top:-4px;left:35px;-webkit-animation:sun 25s linear infinite;-moz-animation:sun 25s linear infinite;animation:sun 25s linear infinite;}
.wm-08 .cloud-white-middle{position:absolute;top:38px;left:8px;}
.wm-08 .snowflurry-big{position:absolute;top:107px;left:31px;width:50px;height:50px;}
.snow-small01{float:left;width:15px;height:16px;margin:0 1px 0 0;background-position:-224px -329px;text-align:center;-webkit-animation:snowbig02 3s linear infinite;-moz-animation:snowbig02 3s linear infinite;animation:snowbig02 3s linear infinite;}
.snow-small02{float:left;width:16px;height:16px;margin:0 1px 0 0;background-position:-224px -329px;text-align:center;-webkit-animation:snowbig02 3s linear infinite;-moz-animation:snowbig02 3s linear infinite;animation:snowbig02 3s linear infinite;}
.snow-small03{float:left;width:16px;height:16px;margin:0 1px 0 0;background-position:-224px -329px;text-align:center;-webkit-animation:snowbig02 3s linear infinite;-moz-animation:snowbig02 3s linear infinite;animation:snowbig02 3s linear infinite;}
.snow-small04{float:left;top:0;left:8px;width:16px;height:16px;margin:0 1px 0 7px;background-position:-224px -329px;text-align:center;-webkit-animation:snowbig02 3s linear infinite;-moz-animation:snowbig02 3s linear infinite;animation:snowbig02 3s linear infinite;}
.snow-small05{float:left;top:0;left:8px;width:16px;height:16px;margin:0 1px 0 0;background-position:-224px -329px;text-align:center;-webkit-animation:snowbig02 3s linear infinite;-moz-animation:snowbig02 3s linear infinite;animation:snowbig02 3s linear infinite;}
/* wm-09 안개 */
.fog01{position:absolute;top:45px;left:8px;width:134px;height:50px;margin:0;background-position:-18px -205px;-webkit-animation:fog01 6s linear infinite;-moz-animation:fog01 6s linear infinite;animation:fog01 6s linear infinite;}
.fog02{position:absolute;top:65px;left:8px;width:134px;height:50px;margin:0;padding-right:10px;background-position:-165px -205px;-webkit-animation:fog02 6s linear infinite;-moz-animation:fog02 6s linear infinite;animation:fog02 6s linear infinite;}
/* wm-10 뇌우 */
.wm-10 .cloud-gray-small{top:18px;left:42px;margin:0;}
.wm-10 .cloud-white-big{top:8px;left:8px;margin:0;}
.thunderstorm-big{overflow:hidden;position:absolute;top:68px;left:30px;width:80px;height:78px;margin:0;}
.rain-middle01{float:left;position:absolute;top:20px;width:25px;height:45px;margin:0;background-position:-22px -320px;-webkit-animation:rain01 2s linear infinite;-moz-animation:rain01 2s linear infinite;animation:rain01 2s linear infinite;}
.rain-middle02{float:left;position:absolute;top:20px;left:16px;width:25px;height:45px;margin:0;background-position:-22px -320px;-webkit-animation:rain02 2s linear infinite;-moz-animation:rain02 2s linear infinite;animation:rain02 2s linear infinite;}
.thunder-big{float:right;position:absolute;top:0;left:42px;width:30px;height:46px;margin:0;background-position:-86px -319px;-webkit-animation:thunder-big 0.8s linear infinite;-moz-animation:thunder-big 0.8s linear infinite;animation:thunder-big 0.8s linear infinite;/*animation:lightning 2s linear infinite;*/}
/* wm-11 차차 흐려짐 */
.wm-11 .cloud-gray-big{top:45px;left:10px;margin:0;-webkit-animation:cloudover01 5s linear infinite;-moz-animation:cloudover01 5s linear infinite;animation:cloudover01 5s linear infinite;}
.cloud-white-small{width:100px;height:61px;background-position:-639px -203px;}
.wm-11 .cloud-white-small{position:absolute;top:28px;left:42px;margin:0;-webkit-animation:cloudover02 5s linear infinite;-moz-animation:cloudover02 5s linear infinite;animation:cloudover02 5s linear infinite;}
/* wm-12 흐려져 뇌우 */
.cloud-gray-big02{position:absolute;top:8px;left:8px;width:122px;height:100px;margin:0;background-position:-322px -178px;}
.wm-12 .cloud-gray-small{top:18px;left:42px;margin:0;}
/* wm-13 흐려져 비 */
.wm-13 .cloud-gray-small{position:absolute;top:11px;left:44px;}
.wm-13 .cloud-gray-big02{top:1px;left:10px;margin:0;}
.wm-13 .rain-big{overflow:hidden;position:absolute;top:65px;left:31px;width:72px;height:80px;}
/* wm-14 흐려져 눈 */
.wm-14 .over-snow-big{overflow:hidden;position:absolute;top:92px;left:33px;width:75px;height:45px;-webkit-animation:snowbig 3s linear infinite;-moz-animation:snowbig 3s linear infinite;animation:snowbig 3s linear infinite;}
.wm-14 .cloud-gray-small{top:18px;left:42px;}
.over-snow-big .w-animation-icon{float:left;width:22px;height:22px;margin:0 3px 0 0;background-position:-995px -223px;}
.over-snow-big p{float:left;width:24px;height:24px;margin:0;background-position:-995px -223px;}
.over-snow-big p:nth-child(1){top:0;left:0;-webkit-animation:snowbig01 3s linear infinite;-moz-animation:snowbig01 3s linear infinite;animation:snowbig01 3s linear infinite;}
.over-snow-big p:nth-child(2){float:left;top:0;left:2px;-webkit-animation:snowbig01 3s linear infinite;-moz-animation:snowbig01 3s linear infinite;animation:snowbig01 3s linear infinite;}
.over-snow-big p:nth-child(3){top:0;left:2px;-webkit-animation:snowbig01 3s linear infinite;-moz-animation:snowbig01 3s linear infinite;animation:snowbig01 3s linear infinite;}
.over-snow-big p:nth-child(4){top:0;margin-left:13px;-webkit-animation:snowbig01 3s linear infinite;-moz-animation:snowbig01 3s linear infinite;animation:snowbig01 3s linear infinite;}
.over-snow-big p:nth-child(5){top:0;left:14px;-webkit-animation:snowbig01 3s linear infinite;-moz-animation:snowbig01 3s linear infinite;animation:snowbig01 3s linear infinite;}
/* wm-15 흐려져 눈비 */
.wm-15 .cloud-gray-small{top:18px;left:42px;}
.wm-15 .cloud-white-big{top:8px;left:8px;}
.wm-15 .snowrain-big{position:absolute;top:109px;left:28px;width:80px;height:50px;margin:0 10px;}
.wm-15 .snowrain-big p{float:left;}
/* wm-16 흐린 후 갬 */
.wm-16 .sun-small{position:absolute;top:21px;left:35px;margin:0;-webkit-animation:sun 25s linear infinite;-moz-animation:sun 25s linear infinite;animation:sun 25s linear infinite;}
.wm-16 .cloud-gray-small{position:absolute;top:65px;left:8px;margin:0;background-position:-497px -203px;}
/* wm-17 뇌우 후 갬, 비 후 갬, 눈 후 갬 */
.wm-17 .sun-small{position:absolute;top:15px;left:35px;margin:0;-webkit-animation:sun 25s linear infinite;-moz-animation:sun 25s linear infinite;animation:sun 25s linear infinite;}
.cloud-gray-middle{width:100px;height:64px;background-position:-1081px -51px;}
.wm-17 .cloud-gray-middle{position:absolute;top:58px;left:5px;margin:0;}
/* wm-17 뇌우 후 갬 */
.thunderstorm-small{overflow:hidden;position:absolute;top:86px;left:30px;width:56px;height:50px;margin:0;}
.thunderstorm-small .rain-middle01{float:left;position:absolute;top:20px;left:0;width:15px;height:30px;margin:0;background-position:-136px -324px;-webkit-animation:rain01 2s linear infinite;-moz-animation:rain01 2s linear infinite;animation:rain01 2s linear infinite;}
.thunderstorm-small .rain-middle02{float:left;position:absolute;top:20px;left:11px;width:15px;height:30px;margin:0;background-position:-136px -324px;-webkit-animation:rain02 2s linear infinite;-moz-animation:rain02 2s linear infinite;animation:rain02 2s linear infinite;}
.thunderstorm-small .thunder-small{float:right;top:0;left:0;width:20px;height:30px;margin:0;background-position:-260px -324px;-webkit-animation:thunder-small 0.8s linear infinite;-moz-animation:thunder-small 0.8s linear infinite;animation:thunder-small 0.8s linear infinite;}
/* wm-18 비 후 갬 */
.wm-18 .sun-small{position:absolute;top:15px;left:35px;margin:0;-webkit-animation:sun 25s linear infinite;-moz-animation:sun 25s linear infinite;animation:sun 25s linear infinite;}
.wm-18 .cloud-gray-middle{position:absolute;top:58px;left:5px;margin:0;}
/* wm-19 비/눈 후 갬 */
.wm-19 .sun-small{position:absolute;top:15px;left:35px;margin:0;-webkit-animation:sun 25s linear infinite;-moz-animation:sun 25s linear infinite;animation:sun 25s linear infinite;}
.wm-19 .cloud-gray-middle{position:absolute;top:58px;left:5px;margin:0;}
.wm-19 .snowflurry-big{position:absolute;top:110px;left:31px;width:50px;height:50px;}
.wm-19 .snow-small01{float:left;width:16px;height:16px;margin:0;background-position:-225px -329px;-webkit-animation:snowbig02 3s linear infinite;-moz-animation:snowbig02 3s linear infinite;animation:snowbig02 3s linear infinite;}
.wm-19 .snow-small02{float:left;width:16px;height:16px;margin:0;background-position:-224px -329px;-webkit-animation:snowbig02 3s linear infinite;-moz-animation:snowbig02 3s linear infinite;animation:snowbig02 3s linear infinite;}
.wm-19 .snow-small03{float:left;width:16px;height:16px;margin:0;background-position:-224px -329px;-webkit-animation:snowbig02 3s linear infinite;-moz-animation:snowbig02 3s linear infinite;animation:snowbig02 3s linear infinite;}
.wm-19 .snow-small04{float:left;top:0;left:8px;width:16px;height:16px;margin:0 0 0 8px;background-position:-224px -329px;-webkit-animation:snowbig02 3s linear infinite;-moz-animation:snowbig02 3s linear infinite;animation:snowbig02 3s linear infinite;}
.wm-19 .snow-small05{float:left;top:0;left:8px;width:16px;height:16px;margin:0;background-position:-224px -329px;-webkit-animation:snowbig02 3s linear infinite;-moz-animation:snowbig02 3s linear infinite;animation:snowbig02 3s linear infinite;}
/* wm-20 눈비 후 갬 */
.wm-20 .sun-small{position:absolute;top:15px;left:35px;margin:0;-webkit-animation:sun 25s linear infinite;-moz-animation:sun 25s linear infinite;animation:sun 25s linear infinite;}
.wm-20 .cloud-gray-middle{position:absolute;top:58px;left:5px;margin:0;}
.wm-20 .snowrain-small{position:absolute;top:108px;left:23px;width:57px;height:44px;margin:0 7px;}
.wm-20 .s-snowrain01{position:absolute;top:2px;left:0;width:13px;height:13px;margin:0;background-position:-371px -323px;-webkit-animation:snowrainbig01 3s linear infinite;-moz-animation:snowrainbig01 3s linear infinite;animation:snowrainbig01 3s linear infinite;}
.wm-20 .s-snowrain02{position:absolute;top:3px;left:20px;width:11px;height:14px;margin:0;background-position:-301px -337px;-webkit-animation:snowrainbig02 3s linear infinite;-moz-animation:snowrainbig02 3s linear infinite;animation:snowrainbig02 3s linear infinite;}
.wm-20 .s-snowrain03{position:absolute;top:2px;left:35px;width:14px;height:14px;margin:0;background-position:-370px -324px;-webkit-animation:snowrainbig01 3s linear infinite;-moz-animation:snowrainbig01 3s linear infinite;animation:snowrainbig01 3s linear infinite;}
.wm-20 .s-snowrain04{position:absolute;top:18px;left:-7px;width:9px;height:14px;margin:0;background-position:-301px -337px;-webkit-animation:snowrainbig02 3s linear infinite;-moz-animation:snowrainbig02 3s linear infinite;animation:snowrainbig02 3s linear infinite;}
.wm-20 .s-snowrain05{position:absolute;top:18px;left:9px;width:14px;height:14px;margin:0;background-position:-370px -324px;-webkit-animation:snowrainbig01 3s linear infinite;-moz-animation:snowrainbig01 3s linear infinite;animation:snowrainbig01 3s linear infinite;}
.wm-20 .s-snowrain06{position:absolute;top:18px;left:28px;width:9px;height:14px;margin:0;background-position:-301px -337px;-webkit-animation:snowrainbig02 3s linear infinite;-moz-animation:snowrainbig02 3s linear infinite;animation:snowrainbig02 3s linear infinite;}
/* wm-21 구름많음 */
.cloud02{position:absolute;top:35px;left:60px;width:82px;height:53px;margin:0;background-position:-190px -54px;-webkit-animation:cloud02 7s linear infinite;-moz-animation:cloud02 7s linear infinite;animation:cloud02 7s linear infinite;}
.cloud01{position:absolute;top:45px;left:8px;width:100px;height:64px;margin:0;background-position:-638px -202px;-webkit-animation:cloud01 7s linear infinite;-moz-animation:cloud01 7s linear infinite;animation:cloud01 7s linear infinite;}
.cloud03{position:absolute;top:73px;left:68px;width:64px;height:60px;margin:0;background-position:-770px -217px;-webkit-animation:cloud03 7s linear infinite;-moz-animation:cloud03 7s linear infinite;animation:cloud03 7s linear infinite;}
/* wm-22 황사 */
.wind01{position:absolute;top:25px;left:15px;width:81px;height:100px;margin:0;background-position:-442px -285px;-webkit-animation:wind01 4s linear infinite;-moz-animation:wind01 4s linear infinite;animation:wind01 4s linear infinite;}
.wind02{position:absolute;top:76px;left:23px;width:98px;height:31px;margin:0;background-position:-533px -340px;-webkit-animation:wind02 4s linear infinite;-moz-animation:wind02 4s linear infinite;animation:wind02 4s linear infinite;}
.yellow-sand{position:absolute;top:20px;left:80px;width:62px;height:94px;background-position:-642px -288px;-webkit-animation:thunder 1.5s linear infinite;-moz-animation:thunder 1.5s linear infinite;animation:thunder 1.5s linear infinite;}

/*------- s-animation -------*/
/* .s-animation.mm-$$
 * 60 x 60 */

.s-animation{overflow:hidden;position:relative;width:60px;height:60px;margin:0 auto;}
.s-animation-icon{margin:15px 0;background:url(../image/icon_weather_animation01.svg) no-repeat 0 0;}
/* mm-01 맑음 */
.mm-01:hover .s-sun-big{-webkit-animation:sun 25s linear infinite;-moz-animation:sun 25s linear infinite;animation:sun 25s linear infinite;}
.s-sun-big{position:absolute;top:6px;left:6px;width:50px;height:50px;margin:0 auto;background-position:-15px -402px;}
.s-suncloud .s-sun-big{top:5px;left:8px;}
/* mm-02 구름조금 */
.mm-02 .s-cloud-small{position:absolute;top:33px;left:6px;width:33px;height:21px;margin:0;background-position:-78px -415px;}
.mm-02:hover .s-sun-big{-webkit-animation:sun 25s linear infinite;-moz-animation:sun 25s linear infinite;animation:sun 25s linear infinite;}
/* mm-03 흐림 */
.mm-03:hover .s-cloud-gray-big{-webkit-animation:cloud-small01 5s linear infinite;-moz-animation:cloud-small01 5s linear infinite;animation:cloud-small01 5s linear infinite;}
.mm-03:hover .s-cloud-gray-small{-webkit-animation:cloud-small02 5s linear infinite;-moz-animation:cloud-small02 5s linear infinite;animation:cloud-small02 5s linear infinite;}
.s-cloud-gray-big{position:absolute;width:48px;height:30px;margin:0;background-position:-129px -411px;}
.mm-03 .s-cloud-gray-big{top:20px;left:2px;}
.s-cloud-gray-small{position:absolute;top:10px;left:18px;width:38px;height:26px;margin:0;background-position:-195px -413px;}
.mm-03 .s-cloud-gray-small{top:13px;left:23px;}
/* mm-04 비 */
.s-cloud-white-big{position:absolute;width:49px;height:31px;margin:0;background-position:-250px -411px;}
.s-rain-big{overflow:hidden;position:absolute;top:20px;left:8px;width:80px;height:80px;margin:0;}
.s-rain-big01{position:absolute;top:16px;left:8px;width:10px;height:17px;margin:0;background-position:-782px -405px;}
.s-rain-big02{position:absolute;top:12px;left:12px;width:13px;height:22px;margin:0;background-position:-797px -404px;}
.s-rain-big03{position:absolute;top:15px;left:22px;width:9px;height:15px;margin:0;background-position:-819px -402px;}
.mm-04:hover .s-rain-big01{-webkit-animation:raindropsmall01 0.7s linear infinite;-moz-animation:raindropsmall01 0.7s linear infinite;animation:raindropsmall01 0.7s linear infinite; }
.mm-04:hover .s-rain-big02{-webkit-animation:raindropsmall02 0.7s linear infinite;-moz-animation:raindropsmall02 0.7s linear infinite;animation:raindropsmall02 0.7s linear infinite;animation-delay:0.2s;}
.mm-04:hover .s-rain-big03{-webkit-animation:raindropsmall03 0.7s linear infinite;-moz-animation:raindropsmall03 0.7s linear infinite;animation:raindropsmall03 0.7s linear infinite; animation-delay:0.4s;}
.mm-04 .s-cloud-gray-small{top:10px;left:19px;}
.mm-04 .s-cloud-white-big{top:15px;left:5px;}
/* mm-05 눈 */
.mm-05 .s-cloud-gray-small{top:10px;left:19px;}
.mm-05 .s-cloud-white-big{top:15px;left:5px;}
.mm-05 .s-snow-big{overflow:hidden;position:absolute;top:37px;left:13px;width:30px;height:20px;}
.mm-05:hover .s-snow-big{-webkit-animation:snowsmall 3s linear infinite;-moz-animation:snowsmall 3s linear infinite;animation:snowsmall 3s linear infinite;}
.mm-05:hover .s-snow-big p{-webkit-animation:snowbig01 3s linear infinite;-moz-animation:snowbig01 3s linear infinite;animation:snowbig01 3s linear infinite;}
.s-snow-big p,.s-over-snow-big p{float:left;position:absolute;width:8px;height:8px;margin:1px;background-position:-837px -427px;text-align:center;}
.s-snow-big01{top:0;left:2px;}
.s-snow-big02{top:0;left:11px;}
.s-snow-big03{top:0;left:20px;}
.s-snow-big04{top:8px;left:6px;}
.s-snow-big05{top:8px;left:16px;}
/* mm-06 눈비 */
.mm-06 .s-cloud-gray-small{top:10px;left:19px;}
.mm-06 .s-cloud-white-big{top:15px;left:5px;}
.mm-06:hover .s-snowrain01,.mm-06:hover .s-snowrain03,.mm-06:hover .s-snowrain05{-webkit-animation:snowrainbig01 3s linear infinite;-moz-animation:snowrainbig01 3s linear infinite;animation:snowrainbig01 3s linear infinite;}
.s-snowyrainy:hover .s-snowrain02,.s-snowyrainy:hover .s-snowrain04,.s-snowyrainy:hover .s-snowrain06{-webkit-animation:snowrainbig02 3s linear infinite;-moz-animation:snowrainbig02 3s linear infinite;animation:snowrainbig02 3s linear infinite;}
.mm-06 .s-snowrain-big{position:absolute;top:39px;left:0;width:80px;height:50px;margin:0 10px;}
.s-snowrain-big p{float:left;}
.s-snowrain01{position:absolute;top:-2px;left:5px;width:8px;height:8px;margin:0;background-position:-837px -427px;}
.s-snowrain02{position:absolute;top:-1px;left:11px;width:5px;height:7px;margin:0 0 0 5px;background-position:-855px -443px;}
.s-snowrain03{position:absolute;top:-2px;left:19px;width:8px;height:8px;margin:0 0 0 5px;background-position:-837px -426px;}
.s-snowrain04{position:absolute;top:8px;left:2px;width:5px;height:7px;margin:0;background-position:-855px -443px;}
.s-snowrain05{position:absolute;top:8px;left:10px;width:8px;height:8px;margin:0;background-position:-837px -427px;}
.s-snowrain06{position:absolute;top:8px;left:21px;width:5px;height:7px;margin:0;background-position:-855px -443px;}
/* mm-07 소나기 */
.s-sun-small{width:40px;height:40px;background-position:-316px -408px;}
.s-cloud-white-middle{width:39px;height:25px;background-position:-368px -416px;}
.mm-07 .s-sun-small{position:absolute;top:8px;left:17px;margin:0;}
.mm-07 .s-cloud-white-middle{position:absolute;top:10px;left:6px;}
.mm-07:hover .s-shower01{-webkit-animation:shower_small01 0.6s linear infinite;-moz-animation:shower_small01 0.6s linear infinite;animation:shower_small01 0.6s linear infinite;}
.mm-07:hover .s-shower02{-webkit-animation:shower_small02 0.6s linear infinite;-moz-animation:shower_small02 0.6s linear infinite;animation:shower_small02 0.6s linear infinite;animation-delay:0.2s;}
.mm-07:hover .s-shower03{-webkit-animation:shower_small03 0.6s linear infinite;-moz-animation:shower_small03 0.6s linear infinite;animation:shower_small03 0.6s linear infinite;animation-delay:0.4s;}
.mm-07:hover .s-sun-small{-webkit-animation:sun 25s linear infinite;-moz-animation:sun 25s linear infinite;animation:sun 25s linear infinite;}
.s-shower-big{position:absolute;top:46px;left:15px;width:52px;height:36px;}
.s-shower01{position:absolute;top:-4px;left:2px;width:5px;height:9px;margin:0;background-position:-907px -408px;}
.s-shower02{position:absolute;top:-4px;left:7px;width:6px;height:12px;margin:0;background-position:-915px -408px;}
.s-shower03{position:absolute;top:-4px;left:14px;width:5px;height:9px;margin:0;background-position:-907px -408px;}
/* mm-08 소낙눈 */
.mm-08 .s-sun-small{position:absolute;top:8px;left:17px;margin:0;}
.mm-08 .s-cloud-white-middle{position:absolute;top:10px;left:6px;}
.mm-08 .s-snowflurry-big{position:absolute;top:43px;left:16px;width:18px;height:20px;}
.mm-08:hover .s-sun-small{-webkit-animation:sun 25s linear infinite;-moz-animation:sun 25s linear infinite;animation:sun 25s linear infinite;}
.mm-08:hover .s-snowflurry-big{-webkit-animation:snowsmall02 3s linear infinite;-moz-animation:snowsmall02 3s linear infinite;animation:snowsmall02 3s linear infinite;}
.mm-08:hover .s-snowflurry-big p{-webkit-animation:snowbig01 3s linear infinite;-moz-animation:snowbig01 3s linear infinite;animation:snowbig01 3s linear infinite;}
.s-snow-small01{float:left;width:5px;height:5px;margin:0 1px 0 0;background-position:-958px -412px;text-align:center;}
.s-snow-small02{float:left;width:5px;height:5px;margin:0 1px 0 0;background-position:-958px -412px;text-align:center;}
.s-snow-small03{float:left;width:5px;height:5px;margin:0 1px 0 0;background-position:-958px -412px;text-align:center;}
.s-snow-small04{clear:both;float:left;width:5px;height:5px;margin:1px 1px 0 3px;background-position:-958px -412px;text-align:center;}
.s-snow-small05{float:left;width:5px;height:5px;margin:1px 1px 0 0;background-position:-958px -412px;text-align:center;}
/* mm-09 안개 */
.s-fog01{position:absolute;top:15px;left:6px;width:49px;height:22px;margin:0;background-position:-426px -419px;}
.s-fog02{position:absolute;top:25px;left:6px;width:45px;height:22px;margin:0;padding-right:10px;background-position:-491px -419px;}
.mm-09:hover .s-fog01{-webkit-animation:fog-small01 4s linear infinite;-moz-animation:fog-small01 4s linear infinite;animation:fog-small01 4s linear infinite;}
.mm-09:hover .s-fog02{-webkit-animation:fog-small02 4s linear infinite;-moz-animation:fog-small02 4s linear infinite;animation:fog-small02 4s linear infinite;}
/* mm-10 뇌우 */
.mm-10 .s-cloud-gray-small{top:10px;left:19px;}
.mm-10 .s-cloud-white-big{top:15px;left:5px;}
.s-thunderstorm-big{overflow:hidden;position:absolute;top:26px;left:13px;width:30px;height:30px;margin:0;}
.mm-10:hover .s-rain-middle01{-webkit-animation:rain01 2s linear infinite;-moz-animation:rain01 2s linear infinite;animation:rain01 2s linear infinite;}
.mm-10:hover .s-rain-middle02{-webkit-animation:rain02 2s linear infinite;-moz-animation:rain02 2s linear infinite;animation:rain02 2s linear infinite;}
.mm-10:hover .s-thunder-big{-webkit-animation:thunder-big02 0.8s linear infinite;-moz-animation:thunder-big02 0.8s linear infinite;animation:thunder-big02 0.8s linear infinite;}
.s-rain-middle01{float:left;position:absolute;top:10px;width:10px;height:16px;margin:0;background-position:-776px -440px;}
.s-rain-middle02{float:left;position:absolute;top:10px;left:7px;width:10px;height:16px;margin:0;background-position:-776px -439px;}
.s-thunder-big{float:right;position:absolute;top:10px;left:18px;width:12px;height:20px;margin:0;background-position:-808px -438px;/*animation:lightning 2s linear infinite;*/}
/* mm-11 차차 흐려짐 */
.mm-11 .s-cloud-gray-big{top:18px;left:2px;margin:0;}
.mm-11:hover .s-cloud-gray-big{-webkit-animation:cloud-small01 5s linear infinite;-moz-animation:cloud-small01 5s linear infinite;animation:cloud-small01 5s linear infinite;}
.mm-11:hover .s-cloud-white-small{-webkit-animation:cloud-small02 5s linear infinite;-moz-animation:cloud-small02 5s linear infinite;animation:cloud-small02 5s linear infinite;}
.s-cloud-white-small{width:37px;height:24px;background-position:-685px -415px;}
.mm-11 .s-cloud-white-small{position:absolute;top:13px;left:23px;margin:0;}
/* mm-12 흐려져 뇌우 */
.s-cloud-gray-big02{position:absolute;top:15px;left:5px;width:49px;height:31px;margin:0;background-position:-559px -412px;}
.mm-12 .s-cloud-gray-small{top:10px;left:19px;margin:0;}
.mm-12:hover .s-rain-middle01{-webkit-animation:rain01 2s linear infinite;-moz-animation:rain01 2s linear infinite;animation:rain01 2s linear infinite;}
.mm-12:hover .s-rain-middle02{-webkit-animation:rain02 2s linear infinite;-moz-animation:rain02 2s linear infinite;animation:rain02 2s linear infinite;}
.mm-12:hover .s-thunder-big{-webkit-animation:thunder-big02 0.8s linear infinite;-moz-animation:thunder-big02 0.8s linear infinite;animation:thunder-big02 0.8s linear infinite;}
/* mm-13 흐려져 비 */
.mm-13 .s-cloud-gray-small{position:absolute;top:4px;left:42px;}
.mm-13 .s-cloud-gray-big02{top:15px;left:6px;margin:0;}
.mm-13 .s-rain-big{overflow:hidden;position:absolute;top:65px;left:31px;width:72px;height:80px;}
.mm-13 .s-cloud-gray-big02{position:absolute;top:15px;left:5px;width:49px;height:31px;margin:0;background-position:-559px -412px;}
.mm-13 .s-cloud-gray-small{top:10px;left:19px;margin:0;}
.mm-13 .s-rain-big{overflow:hidden;position:absolute;top:20px;left:8px;width:80px;height:80px;margin:0;}
.mm-13 .s-rain-big01{position:absolute;top:16px;left:8px;width:10px;height:17px;margin:0;background-position:-782px -408px;}
.mm-13 .s-rain-big02{position:absolute;top:12px;left:12px;width:13px;height:22px;margin:0;background-position:-797px -404px;}
.mm-13 .s-rain-big03{position:absolute;top:15px;left:22px;width:9px;height:15px;margin:0;background-position:-818px -406px;}
.mm-13:hover .s-rain-big01{-webkit-animation:raindropsmall01 0.7s linear infinite;-moz-animation:raindropsmall01 0.7s linear infinite;animation:raindropsmall01 0.7s linear infinite; }
.mm-13:hover .s-rain-big02{-webkit-animation:raindropsmall02 0.7s linear infinite;-moz-animation:raindropsmall02 0.7s linear infinite;animation:raindropsmall02 0.7s linear infinite;animation-delay:0.2s;}
.mm-13:hover .s-rain-big03{-webkit-animation:raindropsmall03 0.7s linear infinite;-moz-animation:raindropsmall03 0.7s linear infinite;animation:raindropsmall03 0.7s linear infinite; animation-delay:0.4s;}
/* mm-14 흐려져 눈 */
.mm-14 .s-over-snow-big{overflow:hidden;position:absolute;top:37px;left:13px;width:30px;height:20px;}
.mm-14:hover .s-over-snow-big{-webkit-animation:snowsmall 3s linear infinite;-moz-animation:snowsmall 3s linear infinite;animation:snowsmall 3s linear infinite;}
.mm-14:hover .s-over-snow-big p{-webkit-animation:snowbig01 3s linear infinite;-moz-animation:snowbig01 3s linear infinite;animation:snowbig01 3s linear infinite;}
.mm-14 .s-snow-big01{top:0;left:2px;}
.mm-14 .s-snow-big02{top:0;left:11px;}
.mm-14 .s-snow-big03{top:0;left:20px;}
.mm-14 .s-snow-big04{top:8px;left:6px;}
.mm-14 .s-snow-big05{top:8px;left:16px;}
/* mm-15 흐려져 눈비 */
.mm-15 .cloud-gray-big02{top:8px;left:8px;}
.mm-15 .cloud-gray-small{top:18px;left:42px;}
.mm-15 .snowrain-big{position:absolute;top:109px;left:28px;width:80px;height:50px;margin:0 10px;}
.mm-15 .s-snowrain-big{position:absolute;top:39px;left:0;width:80px;height:50px;margin:0 10px;}
.mm-15:hover .s-snowrain01,.mm-15:hover .s-snowrain03,.mm-15:hover .s-snowrain05{-webkit-animation:snowrainbig01 3s linear infinite;-moz-animation:snowrainbig01 3s linear infinite;animation:snowrainbig01 3s linear infinite;}
.mm-15:hover .s-snowrain02,.mm-15:hover .s-snowrain04,.mm-15:hover .s-snowrain06{-webkit-animation:snowrainbig02 3s linear infinite;-moz-animation:snowrainbig02 3s linear infinite;animation:snowrainbig02 3s linear infinite;}
.mm-15 .s-snowrain-big{position:absolute;top:39px;left:0;width:80px;height:50px;margin:0 10px;}
.mm-15 .s-snowrain-big p{float:left;}
/* mm-16 흐린 후 갬 */
.mm-16 .s-sun-small{position:absolute;top:10px;left:17px;margin:0;}
.mm-16 .s-cloud-gray-small{position:absolute;top:26px;left:6px;width:36px;height:24px;margin:0;background-position:-627px -414px;}
.mm-16:hover .s-sun-small{-webkit-animation:sun 25s linear infinite;-moz-animation:sun 25s linear infinite;animation:sun 25s linear infinite;}
/* mm-뇌우 후 갬, 비 후 갬, 눈 후 갬 */
.s-cloud-gray-middle{width:38px;height:24px;background-position:-626px -453px;}
.mm-19 .s-sun-small{position:absolute;top:-8px;left:17px;}
/* mm-17 뇌우 후 갬 */
.mm-17 .s-sun-small{position:absolute;top:8px;left:17px;margin:0;}
.mm-17 .s-cloud-gray-middle{position:absolute;top:10px;left:6px;}
.mm-17 .s-thunderstorm-small{overflow:hidden;position:absolute;top:32px;left:15px;width:18px;height:20px;margin:0;}
.mm-17 .s-thunderstorm-small .s-rain-middle01{float:left;position:absolute;top:10px;left:0;width:6px;height:10px;margin:0;background-position:-903px -441px;}
.mm-17 .s-thunderstorm-small .s-rain-middle02{float:left;position:absolute;top:10px;left:4px;width:6px;height:10px;margin:0;background-position:-903px -441px;}
.mm-17 .s-thunderstorm-small .s-thunder-small{position:absolute;top:10px;left:10px;width:7px;height:11px;margin:0;background-position:-922px -441px;}
.mm-17:hover .s-rain-middle01{-webkit-animation:rain01 2s linear infinite;-moz-animation:rain01 2s linear infinite;animation:rain01 2s linear infinite;}
.mm-17:hover .s-rain-middle02{-webkit-animation:rain02 2s linear infinite;-moz-animation:rain02 2s linear infinite;animation:rain02 2s linear infinite;}
.mm-17:hover .s-thunder-small{-webkit-animation:thunder-small03 1s linear infinite;-moz-animation:thunder-small03 1s linear infinite;animation:thunder-small03 1s linear infinite;}
.mm-17:hover .s-sun-small{-webkit-animation:sun 25s linear infinite;-moz-animation:sun 25s linear infinite;animation:sun 25s linear infinite;}
/* mm-18 비 후 갬 */
.mm-18 .s-sun-small{position:absolute;top:8px;left:17px;margin:0;}
.mm-18 .s-cloud-gray-middle{position:absolute;top:10px;left:6px;}
.mm-18 .s-shower-big{position:absolute;top:46px;left:15px;width:52px;height:36px;}
.mm-18 .s-shower01{position:absolute;top:-4px;left:0;width:5px;height:9px;margin:0;background-position:-907px -408px;}
.mm-18 .s-shower02{position:absolute;top:-4px;left:5px;width:6px;height:12px;margin:0;background-position:-915px -408px;}
.mm-18 .s-shower03{position:absolute;top:-4px;left:12px;width:5px;height:10px;margin:0;background-position:-907px -407px;}
.mm-18:hover .s-shower01{-webkit-animation:shower_small01 0.6s linear infinite;-moz-animation:shower_small01 0.6s linear infinite;animation:shower_small01 0.6s linear infinite;}
.mm-18:hover .s-shower02{-webkit-animation:shower_small02 0.6s linear infinite;-moz-animation:shower_small02 0.6s linear infinite;animation:shower_small02 0.6s linear infinite;animation-delay:0.2s;}
.mm-18:hover .s-shower03{-webkit-animation:shower_small03 0.6s linear infinite;-moz-animation:shower_small03 0.6s linear infinite;animation:shower_small03 0.6s linear infinite;animation-delay:0.4s;}
/* mm-19 눈 후 갬 */
.mm-19 .s-sun-small{position:absolute;top:8px;left:17px;margin:0;}
.mm-19 .s-cloud-gray-middle{position:absolute;top:10px;left:6px;}
.mm-19 .s-snowflurry-big{position:absolute;top:43px;left:16px;width:18px;height:20px;}
.mm-19 .s-snow-small01{float:left;width:5px;height:5px;margin:0 1px 0 0;background-position:-958px -412px;text-align:center;}
.mm-19 .s-snow-small02{float:left;width:5px;height:5px;margin:0 1px 0 0;background-position:-958px -412px;text-align:center;}
.mm-19 .s-snow-small03{float:left;width:5px;height:5px;margin:0 1px 0 0;background-position:-958px -412px;text-align:center;}
.mm-19 .s-snow-small04{clear:both;float:left;width:5px;height:5px;margin:1px 1px 0 3px;background-position:-958px -412px;text-align:center;}
.mm-19 .s-snow-small05{float:left;width:5px;height:5px;margin:1px 1px 0 0;background-position:-958px -412px;text-align:center;}
.mm-19:hover .s-sun-small{-webkit-animation:sun 25s linear infinite;-moz-animation:sun 25s linear infinite;animation:sun 25s linear infinite;}
.mm-19:hover .s-snowflurry-big{-webkit-animation:snowsmall02 3s linear infinite;-moz-animation:snowsmall02 3s linear infinite;animation:snowsmall02 3s linear infinite;}
.mm-19:hover .s-snowflurry-big p{-webkit-animation:snowbig01 3s linear infinite;-moz-animation:snowbig01 3s linear infinite;animation:snowbig01 3s linear infinite;}
/* mm-20 눈비 후 갬 */
.mm-20 .s-cloud-gray-middle{position:absolute;top:10px;left:6px;}
.mm-20 .s-sun-small{position:absolute;top:10px;left:17px;margin:0;}
.mm-20 .s-snowrain-small{position:absolute;top:40px;left:8px;width:18px;height:14px;margin:0 7px;}
.mm-20:hover .s-snowrain01,.mm-20:hover .s-snowrain03,.mm-20:hover .s-snowrain05{-webkit-animation:snowrainbig01 3s linear infinite;-moz-animation:snowrainbig01 3s linear infinite;animation:snowrainbig01 3s linear infinite;}
.mm-20:hover .s-snowrain02,.mm-20:hover .s-snowrain04,.mm-20:hover .s-snowrain06{-webkit-animation:snowrainbig02 3s linear infinite;-moz-animation:snowrainbig02 3s linear infinite;animation:snowrainbig02 3s linear infinite;}
.mm-20 .s-snowrain01{position:absolute;top:2px;left:0;width:6px;height:6px;margin:0;background-position:-958px -411px;}
.mm-20 .s-snowrain02{position:absolute;top:3px;left:6px;width:6px;height:6px;margin:0;background-position:-948px -445px;}
.mm-20 .s-snowrain03{position:absolute;top:2px;left:14px;width:6px;height:6px;margin:0;background-position:-958px -411px;}
.mm-20 .s-snowrain04{position:absolute;top:8px;left:-4px;width:6px;height:6px;margin:0;background-position:-949px -446px;}
.mm-20 .s-snowrain05{position:absolute;top:9px;left:2px;width:6px;height:6px;margin:0;background-position:-958px -411px;}
.mm-20 .s-snowrain06{position:absolute;top:8px;left:9px;width:6px;height:6px;margin:0;background-position:-948px -445px;}
/* mm-21 구름많음 */
.s-cloud02{position:absolute;top:16px;left:22px;width:34px;height:22px;margin:0;background-position:-77px -415px;}
.s-cloud01{position:absolute;top:19px;left:5px;width:37px;height:25px;margin:0;background-position:-686px -415px;}
.s-cloud03{position:absolute;top:30px;left:29px;width:24px;height:16px;margin:0;background-position:-739px -415px;}
.mm-21:hover .s-cloud02{-webkit-animation:cloudsmall02 7s linear infinite;-moz-animation:cloudsmall02 7s linear infinite;animation:cloudsmall02 7s linear infinite;}
.mm-21:hover .s-cloud01{-webkit-animation:cloudsmall01 7s linear infinite;-moz-animation:cloudsmall01 7s linear infinite;animation:cloudsmall01 7s linear infinite;}
.mm-21:hover .s-cloud03{-webkit-animation:cloudsmall03 7s linear infinite;-moz-animation:cloudsmall03 7s linear infinite;animation:cloudsmall03 7s linear infinite;}
/* mm-22 황사 */
.s-wind01{position:absolute;top:11px;left:8px;width:32px;height:37px;margin:0;background-position:-1003px -401px;}
.s-wind02{position:absolute;top:30px;left:10px;width:38px;height:14px;margin:0;background-position:-1046px -419px;}
.s-yellow-sand{position:absolute;top:1px;left:32px;width:26px;height:38px;background-position:-1105px -404px;}
.mm-22:hover .s-wind01{-webkit-animation:windsmall01 4s linear infinite;-moz-animation:windsmall01 4s linear infinite;animation:windsmall01 4s linear infinite;}
.mm-22:hover .s-wind02{-webkit-animation:windsmall02 4s linear infinite;-moz-animation:windsmall02 4s linear infinite;animation:windsmall02 4s linear infinite;}
.mm-22:hover .s-yellow-sand{-webkit-animation:thunder 1.5s linear infinite;-moz-animation:thunder 1.5s linear infinite;animation:thunder 1.5s linear infinite;}


/*------- keyframes motion -------*/
/* 맑음 */
@keyframes sun{100%{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);transform:rotate(360deg);}}
/* 구름조금 */
@keyframes cloudsmall{
	0%{left:52px;}
	40%{left:32px;}
	60%{left:42px;}
	90%{left:42px;}
	100%{left:52px;}
}
/* 흐림 */
@keyframes cloud-big01{
	0%{-webkit-transform:translate(-2px, 0px);transform:translate(-2px, 0px);}
	25%{-webkit-transform:translate(2px, 0px);transform:translate(2px, 0px);}
	50%{-webkit-transform:translate(6px, 0px);transform:translate(6px, 0px);}
	75%{-webkit-transform:translate(2px, 0px);transform:translate(2px, 0px);}
	100%{-webkit-transform:translate(-2px, 0px);transform:translate(-2px, 0px);}
}
@keyframes cloud-big02{
	0%{-webkit-transform:translate(0, 0px);transform:translate(0, 0px);}
	25%{-webkit-transform:translate(-3px, 0px);transform:translate(-3px, 0px);}
	50%{-webkit-transform:translate(-6px, 0px);transform:translate(-6px, 0px);}
	75%{-webkit-transform:translate(-3px, 0px);transform:translate(-3px, 0px);}
	100%{-webkit-transform:translate(0, 0px);transform:translate(0, 0px);}
}
/* 흐림_small */
@keyframes cloud-small01{
	0%{-webkit-transform:translate(-2px, 0px);transform:translate(-2px, 0px);}
	25%{-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
	50%{-webkit-transform:translate(2px, 0px);transform:translate(2px, 0px);}
	75%{-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
	100%{-webkit-transform:translate(-2px, 0px);transform:translate(-2px, 0px);}
}
@keyframes cloud-small02{
	0%{-webkit-transform:translate(0, 0px);transform:translate(0, 0px);}
	25%{-webkit-transform:translate(-2px, 0px);transform:translate(-2px, 0px);}
	50%{-webkit-transform:translate(-4px, 0px);transform:translate(-4px, 0px);}
	75%{-webkit-transform:translate(-2px, 0px);transform:translate(-2px, 0px);}
	100%{-webkit-transform:translate(0, 0px);transform:translate(0, 0px);}
}
/* 비 */
@keyframes raindrop01{
	0%{opacity:1;
	-webkit-transform:translate(10px, 0px);
	-moz-transform:translate(10px, 0px);
	-o-transform:translate(10px, 0px);
	-ms-transform:translate(10px, 0px);
	transform:translate(10px, 0px);}
	100%{opacity:0.2;
	-webkit-transform:translate(0px, 20px);
	-moz-transform:translate(0px, 20px);
	-o-transform:translate(0px, 20px);
	-ms-transform:translate(0px, 20px);
	transform:translate(0px, 20px);}
}
@-webkit-keyframes raindrop01{
	0%{-webkit-transform:translate(10px, 0px);}
	100%{-webkit-transform:translate(0px, 20px);}
}
@keyframes raindrop02{
	0%{opacity:0.2;
	-webkit-transform:translate(10px, 0px);
	-moz-transform:translate(10px, 0px);
	-o-transform:translate(10px, 0px);
	-ms-transform:translate(10px, 0px);
	transform:translate(10px, 0px);}
	100%{opacity:1;
	-webkit-transform:translate(0px, 20px);
	-moz-transform:translate(0px, 20px);
	-o-transform:translate(0px, 20px);
	-ms-transform:translate(0px, 20px);
	transform:translate(0px, 20px);}
}
@-webkit-keyframes raindrop02{
	0%{-webkit-transform:translate(10px, 0px);}
	100%{-webkit-transform:translate(0px, 20px);}
}
@keyframes raindrop03{
	0%{opacity:1;
	-webkit-transform:translate(5px, 0px);
	-moz-transform:translate(5px, 0px);
	-o-transform:translate(5px, 0px);
	-ms-transform:translate(5px, 0px);
	transform:translate(5px, 0px);}
	100%{opacity:0.2;
	-webkit-transform:translate(-5px, 20px);
	-moz-transform:translate(-5px, 20px);
	-o-transform:translate(-5px, 20px);
	-ms-transform:translate(-5px, 20px);
	transform:translate(-5px, 20px);}
}
@-webkit-keyframes raindrop03{
	0%{-webkit-transform:translate(5px, 0px);}
	100%{-webkit-transform:translate(-5px, 20px);}
}
/* 비_small */
@keyframes raindropsmall01{
	0%{opacity:1;
	-webkit-transform:translate(0px, 1px);
	-moz-transform:translate(0px, 1px);
	-o-transform:translate(0px, 1px);
	-ms-transform:translate(0px, 1px);
	transform:translate(0px, 1px);}
	100%{opacity:0.2;
	-webkit-transform:translate(-4px, 7px);
	-moz-transform:translate(-4px, 7px);
	-o-transform:translate(-4px, 7px);
	-ms-transform:translate(-4px, 7px);
	transform:translate(-4px, 7px);}
}
@-webkit-keyframes raindropsmall01{
	0%{-webkit-transform:translate(0px, 1px);}
	100%{-webkit-transform:translate(-4px, 7px);}
}
@keyframes raindropsmall02{
	0%{opacity:0.2;
	-webkit-transform:translate(2px, -2px);
	-moz-transform:translate(2px, -2px);
	-o-transform:translate(2px, -2px);
	-ms-transform:translate(2px, -2px);
	transform:translate(2px, -2px);}
	100%{opacity:1;
	-webkit-transform:translate(-3px, 8px);
	-moz-transform:translate(-3px, 8px);
	-o-transform:translate(-3px, 8px);
	-ms-transform:translate(-3px, 8px);
	transform:translate(-3px, 8px);}
}
@-webkit-keyframes raindropsmall02{
	0%{-webkit-transform:translate(3px, -2px);}
	100%{-webkit-transform:translate(-3px, 8px);}
}
@keyframes raindropsmall03{
	0%{opacity:1;
	-webkit-transform:translate(2px, 0px);
	-moz-transform:translate(2px, 0px);
	-o-transform:translate(2px, 0px);
	-ms-transform:translate(2px, 0px);
	transform:translate(2px, 0px);}
	100%{opacity:0.2;
	-webkit-transform:translate(-3px, 10px);
	-moz-transform:translate(-3px, 10px);
	-o-transform:translate(-3px, 10px);
	-ms-transform:translate(-3px, 10px);
	transform:translate(-3px, 10px);}
}
@-webkit-keyframes raindropsmall03{
	0%{-webkit-transform:translate(2px, 0px);}
	100%{-webkit-transform:translate(-3px, 10px);}
}

/* 눈 */
@keyframes snowbig01{100%{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);transform:rotate(360deg);}}
@Keyframes snowbig{
	0%{opacity:0;
	-webkit-transform:translate(0, -12px);
	-moz-transform:translate(0, -12px);
	-o-transform:translate(0, -12px);
	-ms-transform:translate(0, -12px);
	transform:translate(0, -12px);}
	50%{opacity:1}
	100%{opacity:0;
	-webkit-transform:translate(0, 3px);
	-moz-transform:translate(0, 3px);
	-o-transform:translate(0, 3px);
	-ms-transform:translate(0, 3px);
	transform:translate(0, 3px);}
}
@keyframes snowsmall{
	0%{opacity:0;
	-webkit-transform:translate(0, -5px);
	-moz-transform:translate(0, -5px);
	-o-transform:translate(0, -5px);
	-ms-transform:translate(0, -5px);
	transform:translate(0, -5px);}
	50%{opacity:1}
	100%{opacity:0;
	-webkit-transform:translate(0, 3px);
	-moz-transform:translate(0, 3px);
	-o-transform:translate(0, 3px);
	-ms-transform:translate(0, 3px);
	transform:translate(0, 3px);}
}
@keyframes  snowsmall02{
	0%{opacity:0;
	-webkit-transform:translate(0, -3px);
	-moz-transform:translate(0, -3px);
	-o-transform:translate(0, -3px);
	-ms-transform:translate(0, -3px);
	transform:translate(0, -3px);}
	50%{opacity:1}
	100%{opacity:0;
	-webkit-transform:translate(0, 2px);
	-moz-transform:translate(0, 2px);
	-o-transform:translate(0, 2px);
	-ms-transform:translate(0, 2px);
	transform:translate(0, 2px);}
}
/* 눈비 */
@keyframes snowrainbig01{
	0%{opacity:0.2;}
	50%{opacity:1;}
	100%{opacity:0.2;-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);transform:rotate(360deg);}
}
@keyframes snowrainbig02{
	0%{opacity:0.5;}
	50%{opacity:0.2;}
	90%{opacity:1;}
	100%{opacity:0.5;}
}
/* 소나기 */
@keyframes shower01{
	0%{opacity:1;
	-webkit-transform:translate(6px, -5px);
	-moz-transform:translate(6px, -5px);
	-o-transform:translate(6px, -5px);
	-ms-transform:translate(6px, -5px);
	transform:translate(6px, -5px);}
	100%{opacity:0.2;
	-webkit-transform:translate(-5px, 15px);
	-moz-transform:translate(-5px, 15px);
	-o-transform:translate(-5px, 15px);
	-ms-transform:translate(-5px, 15px);
	transform:translate(-5px, 15px);}
}
@-webkit-keyframes shower01{
	0%{-webkit-transform:translate(6px, -5px);}
	100%{-webkit-transform:translate(-5px, 15px);}
}

@keyframes shower02{
	0%{opacity:0.2;
	-webkit-transform:translate(4px, -5px);
	-moz-transform:translate(4px, -5px);
	-o-transform:translate(4px, -5px);
	-ms-transform:translate(4px, -5px);
	transform:translate(4px, -5px);}
	100%{opacity:1;
	-webkit-transform:translate(-5px, 15px);
	-moz-transform:translate(-5px, 15px);
	-o-transform:translate(-5px, 15px);
	-ms-transform:translate(-5px, 15px);
	transform:translate(-5px, 15px);}
}

@-webkit-keyframes shower02{
	0%{-webkit-transform:translate(4px, -5px);}
	100%{-webkit-transform:translate(-5px, 15px);}
}

@keyframes shower03{
	0%{
	opacity:1;-webkit-transform:translate(6px, -5px);
	-moz-transform:translate(6px, -5px);
	-o-transform:translate(6px, -5px);
	-ms-transform:translate(6px, -5px);
	transform:translate(6px, -5px);}
	100%{
	opacity:0.2;-webkit-transform:translate(-5px, 15px);
	-moz-transform:translate(-5px, 15px);
	-o-transform:translate(-5px, 15px);
	-ms-transform:translate(-5px, 15px);
	transform:translate(-5px, 15px);}
}

@-webkit-keyframes shower03{
	0%{-webkit-transform:translate(6px, -5px);}
	100%{-webkit-transform:translate(-5px, 15px);}
}

/* 소나기_small */
@keyframes shower_small01{
	0%{
	opacity:1;-webkit-transform:translate(3px, -5px);
	-moz-transform:translate(3px, -5px);
	-o-transform:translate(3px, -5px);
	-ms-transform:translate(3px, -5px);
	transform:translate(3px, -5px);}
	100%{
	opacity:0.2;-webkit-transform:translate(-1px, 5px);
	-moz-transform:translate(-1px, 5px);
	-o-transform:translate(-1px, 5px);
	-ms-transform:translate(-1px, 5px);
	transform:translate(-1px, 5px);}
}

@-webkit-keyframes shower_small01{
	0%{-webkit-transform:translate(3px, -5px);}
	100%{-webkit-transform:translate(-1px, 5px);}
}

@keyframes shower_small02{
	0%{
	opacity:0.2;-webkit-transform:translate(3px, -5px);
	-moz-transform:translate(3px, -5px);
	-o-transform:translate(3px, -5px);
	-ms-transform:translate(3px, -5px);
	transform:translate(3px, -5px);}
	100%{
	opacity:1;-webkit-transform:translate(-2px, 5px);
	-moz-transform:translate(-2px, 5px);
	-o-transform:translate(-2px, 5px);
	-ms-transform:translate(-2px, 5px);
	transform:translate(-2px, 5px);}
}
@-webkit-keyframes shower_small02{
	0%{-webkit-transform:translate(3px, -5px);}
	100%{-webkit-transform:translate(-2px, 5px);}
}
@keyframes shower_small03{
	0%{
	opacity:1;-webkit-transform:translate(3px, -5px);
	-moz-transform:translate(3px, -5px);
	-o-transform:translate(3px, -5px);
	-ms-transform:translate(3px, -5px);
	transform:translate(3px, -5px);}
	100%{
	opacity:0.2;-webkit-transform:translate(-2px, 5px);
	-moz-transform:translate(-2px, 5px);
	-o-transform:translate(-2px, 5px);
	-ms-transform:translate(-2px, 5px);
	transform:translate(-2px, 5px);}
}
@-webkit-keyframes shower_small03{
	0%{-webkit-transform:translate(3px, -5px);}
	100%{-webkit-transform:translate(-2px, 5px);}
}

/* 소낙눈 */
@keyframes snowbig02{
	0%{opacity:0;-webkit-transform:translate(-2px, -10px) rotate(0deg);transform:translate(-2px, -10px) rotate(0deg);}
	50%{opacity:1;-webkit-transform:translate(-1px, -5px) rotate(180deg);transform:translate(-1px, -5px) rotate(180deg);}
	100%{opacity:0;-webkit-transform:translate(0, 0) rotate(360deg);transform:translate(0, 0) rotate(360deg);}
}

/* 안개 */
@keyframes fog01{
	0%{opacity:1;left:10px;-webkit-transform:translate(-2px, 0px);transform:translate(-2px, 0px);}
	25%{opacity:0.75;left:10px;-webkit-transform:translate(2px, 0px);transform:translate(2px, 0px);}
	50%{opacity:0.5;-webkit-transform:translate(6px, 0px);transform:translate(6px, 0px);}
	75%{opacity:0.75;-webkit-transform:translate(2px, 0px);transform:translate(2px, 0px);}
	100%{opacity:1;left:10px;-webkit-transform:translate(-2px, 0px);transform:translate(-2px, 0px);}
}

@keyframes fog02{
	0%{opacity:0.5;left:10px;-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
	25%{opacity:0.75;left:10px;-webkit-transform:translate(-4px, 0px);transform:translate(-4px, 0px);}
	50%{opacity:1;-webkit-transform:translate(-8px, 0px);transform:translate(-8px, 0px);}
	75%{opacity:0.75;-webkit-transform:translate(-4px, 0px);transform:translate(-4px, 0px);}
	100%{opacity:0.5;left:10px;-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
}

/* 안개_small */
@keyframes fog-small01{
	0%{opacity:1;left:10px;-webkit-transform:translate(-8px, 0px);transform:translate(-8px, 0px);}
	25%{opacity:0.75;left:10px;-webkit-transform:translate(-4px, 0px);transform:translate(-4px, 0px);}
	50%{opacity:0.5;-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
	75%{opacity:0.75;-webkit-transform:translate(-4px, 0px);transform:translate(-4px, 0px);}
	100%{opacity:1;left:10px;-webkit-transform:translate(-8px, 0px);transform:translate(-8px, 0px);}
}

@keyframes fog-small02{
	0%{opacity:0.5;left:10px;-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
	25%{opacity:0.75;left:10px;-webkit-transform:translate(-4px, 0px);transform:translate(-4px, 0px);}
	50%{opacity:1;-webkit-transform:translate(-8px, 0px);transform:translate(-8px, 0px);}
	75%{opacity:0.75;-webkit-transform:translate(-4px, 0px);transform:translate(-4px, 0px);}
	100%{opacity:0.5;left:10px;-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
}

/* 뇌우 */
@keyframes rain01{
	0%{opacity:0.2;}
	50%{opacity:1;}
	90%{opacity:0.5;}
	100%{opacity:0.2;}
}
@keyframes rain02{
	0%{opacity:0.5;}
	50%{opacity:0.2;}
	90%{opacity:1;}
	100%{opacity:0.5;}
}
@keyframes thunder-big{
	0%{
	opacity:0.2;-webkit-transform:translate(8px, 0px);
	-moz-transform:translate(8px, 0px);
	-o-transform:translate(8px, 0px);
	-ms-transform:translate(8px, 0px);
	transform:translate(8px, 0px);}
	60%{
	opacity:1;-webkit-transform:translate(0px, 20px);
	-moz-transform:translate(0px, 20px);
	-o-transform:translate(0px, 20px);
	-ms-transform:translate(0px, 20px);
	transform:translate(0px, 20px);}
	100%{
	opacity:0.5;-webkit-transform:translate(0px, 20px);
	-moz-transform:translate(0px, 20px);
	-o-transform:translate(0px, 20px);
	-ms-transform:translate(0px, 20px);
	transform:translate(0px, 20px);}
}
@keyframes thunder-small{
	0%{
	opacity:0.2;-webkit-transform:translate(0px, 0px);
	-moz-transform:translate(0px, 0px);
	-o-transform:translate(0px, 0px);
	-ms-transform:translate(0px, 0px);
	transform:translate(0px, 0px);}
	60%{
	opacity:1;-webkit-transform:translate(-10px, 20px);
	-moz-transform:translate(-10px, 20px);
	-o-transform:translate(-10px, 20px);
	-ms-transform:translate(-10px, 20px);
	transform:translate(-10px, 20px);}
	100%{
	opacity:0.5;-webkit-transform:translate(-10px, 20px);
	-moz-transform:translate(-10px, 20px);
	-o-transform:translate(-10px, 20px);
	-ms-transform:translate(-10px, 20px);
	transform:translate(-10px, 20px);}
}

/* 뇌우_small */
@keyframes thunder-big02{
	0%{
	opacity:0.2;-webkit-transform:translate(3px, -10px);
	-moz-transform:translate(3px, -10px);
	-o-transform:translate(3px, -10px);
	-ms-transform:translate(3px, -10px);
	transform:translate(3px, -10px);}
	60%{
	opacity:1;-webkit-transform:translate(-2px, 0px);
	-moz-transform:translate(-2px, 0px);
	-o-transform:translate(-2px, 0px);
	-ms-transform:translate(-2px, 0px);
	transform:translate(-2px, 0px);}
	100%{
	opacity:0.5;-webkit-transform:translate(-2px, 0px);
	-moz-transform:translate(-2px, 0px);
	-o-transform:translate(-2px, 0px);
	-ms-transform:translate(-2px, 0px);
	transform:translate(-2px, 0px);}
}
@keyframes thunder-small02{
	0%{
	opacity:0.2;-webkit-transform:translate(0px, 0px);
	-moz-transform:translate(0px, 0px);
	-o-transform:translate(0px, 0px);
	-ms-transform:translate(0px, 0px);
	transform:translate(0px, 0px);}
	60%{
	opacity:1;-webkit-transform:translate(-10px, 20px);
	-moz-transform:translate(-10px, 20px);
	-o-transform:translate(-10px, 20px);
	-ms-transform:translate(-10px, 20px);
	transform:translate(-10px, 20px);}
	100%{
	opacity:0.5;-webkit-transform:translate(-10px, 20px);
	-moz-transform:translate(-10px, 20px);
	-o-transform:translate(-10px, 20px);
	-ms-transform:translate(-10px, 20px);
	transform:translate(-10px, 20px);}
}
@keyframes thunder-small03{
	0%{
	opacity:0.2;-webkit-transform:translate(5px, -10px);
	-moz-transform:translate(5px, -10px);
	-o-transform:translate(5px, -10px);
	-ms-transform:translate(5px, -10px);
	transform:translate(5px, -10px);}
	60%{
	opacity:1;-webkit-transform:translate(-1px, 0px);
	-moz-transform:translate(-1px, 0px);
	-o-transform:translate(-1px, 0px);
	-ms-transform:translate(-1px, 0px);
	transform:translate(-1px, 0px);}
	100%{
	opacity:0.5;-webkit-transform:translate(-1px, 0px);
	-moz-transform:translate(-1px, 0px);
	-o-transform:translate(-1px, 0px);
	-ms-transform:translate(-1px, 0px);
	transform:translate(-1px, 0px);}
}

/* 차차흐려짐 */
@keyframes cloudover01{
	0%{-webkit-transform:translate(-4px, 0px);transform:translate(-4px, 0px);}
	25%{-webkit-transform:translate(1px, 0px);transform:translate(1px, 0px);}
	50%{-webkit-transform:translate(6px, 0px);transform:translate(6px, 0px);}
	75%{-webkit-transform:translate(1px, 0px);transform:translate(1px, 0px);}
	100%{-webkit-transform:translate(-4px, 0px);transform:translate(-4px, 0px);}
}
@keyframes cloudover02{
	0%{opacity:0.2;-webkit-transform:translate(-4px, 0px);transform:translate(-4px, 0px);}
	25%{-webkit-transform:translate(1px, 0px);transform:translate(1px, 0px);}
	50%{opacity:1;-webkit-transform:translate(6px, 0px);transform:translate(6px, 0px);}
	75%{-webkit-transform:translate(1px, 0px);transform:translate(1px, 0px);}
	100%{opacity:0.1;-webkit-transform:translate(-4px, 0px);transform:translate(-4px, 0px);}
}

/* 흐려져 눈 */
@keyframes snow01{100%{-webkit-transform:rotate(-360deg);-moz-transform:rotate(-360deg);transform:rotate(-360deg);}}
@keyframes snow02{100%{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);transform:rotate(360deg);}}

/* 구름많음 */
@keyframes cloud01{
	0%{-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
	25%{-webkit-transform:translate(5px, 0px);transform:translate(5px, 0px);}
	50%{-webkit-transform:translate(10px, 0px);transform:translate(10px, 0px);}
	75%{-webkit-transform:translate(5px, 0px);transform:translate(5px, 0px);}
	100%{-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
}
@keyframes cloud02{
	0%{-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
	25%{-webkit-transform:translate(-7px, 0px);transform:translate(-7px, 0px);}
	50%{-webkit-transform:translate(-14px, 0px);transform:translate(-14px, 0px);}
	75%{-webkit-transform:translate(-7px, 0px);transform:translate(-7px, 0px);}
	100%{-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
}
@keyframes cloud03{
	0%{-webkit-transform:translate(-5px, 0px);transform:translate(-5px, 0px);}
	25%{-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
	50%{-webkit-transform:translate(5px, 0px);transform:translate(5px, 0px);}
	75%{-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
	100%{-webkit-transform:translate(-5px, 0px);transform:translate(-5px, 0px);}
}

/* 구름많음_small */
@keyframes cloudsmall01{
	0%{-webkit-transform:translate(-2px, 0px);transform:translate(-2px, 0px);}
	25%{-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
	50%{-webkit-transform:translate(2px, 0px);transform:translate(2px, 0px);}
	75%{-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
	100%{-webkit-transform:translate(-2px, 0px);transform:translate(-2px, 0px);}
}
@keyframes cloudsmall02{
	0%{-webkit-transform:translate(4px, 0px);transform:translate(4px, 0px);}
	25%{-webkit-transform:translate(2px, 0px);transform:translate(2px, 0px);}
	50%{-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
	75%{-webkit-transform:translate(2px, 0px);transform:translate(2px, 0px);}
	100%{-webkit-transform:translate(4px, 0px);transform:translate(4px, 0px);}
}
@keyframes cloudsmall03{
	0%{-webkit-transform:translate(-2px, 0px);transform:translate(-2px, 0px);}
	25%{-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
	50%{-webkit-transform:translate(2px, 0px);transform:translate(2px, 0px);}
	75%{-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
	100%{-webkit-transform:translate(-2px, 0px);transform:translate(-2px, 0px);}
}

/* 황사 */
@keyframes wind01{
	0%{-webkit-transform:translate(-6px, 0px);transform:translate(-6px, 0px);}
	25%{-webkit-transform:translate(-3px, 0px);transform:translate(-3px, 0px);}
	50%{-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
	75%{-webkit-transform:translate(-3px, 0px);transform:translate(-3px, 0px);}
	100%{-webkit-transform:translate(-6px, 0px);transform:translate(-6px, 0px);}
}
@keyframes wind02{
	0%{-webkit-transform:translate(3px, 0px);transform:translate(3px, 0px);}
	25%{-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
	50%{-webkit-transform:translate(-3px, 0px);transform:translate(-3px, 0px);}
	75%{-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
	100%{-webkit-transform:translate(3px, 0px);transform:translate(3px, 0px);}
}

/* 황사_small */
@keyframes windsmall01{
	0%{-webkit-transform:translate(-4px, 0px);transform:translate(-4px, 0px);}
	25%{-webkit-transform:translate(-2px, 0px);transform:translate(-2px, 0px);}
	50%{-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
	75%{-webkit-transform:translate(-2px, 0px);transform:translate(-2px, 0px);}
	100%{-webkit-transform:translate(-4px, 0px);transform:translate(-4px, 0px);}
}
@keyframes windsmall02{
	0%{-webkit-transform:translate(3px, 0px);transform:translate(3px, 0px);}
	25%{-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
	50%{-webkit-transform:translate(-1px, 0px);transform:translate(-1px, 0px);}
	75%{-webkit-transform:translate(0px, 0px);transform:translate(0px, 0px);}
	100%{-webkit-transform:translate(3px, 0px);transform:translate(3px, 0px);}
}

/* 관심지역날씨 Interested Location Weather */
.aw-img{width:55px;height:55px;margin:15px auto 0 auto;background:url(../image/sp_weather_all03.svg) no-repeat 0 0;}
.aw-img01{background-position:-200px -17px;}
.aw-img02{background-position:-266px -19px;}
.aw-img03{background-position:-333px -17px;}
.aw-img04{background-position:-398px -19px;}
.aw-img05{background-position:-200px -85px;}
.aw-img06{background-position:-267px -85px;}
.aw-img07{background-position:-331px -85px;}
.aw-img08{background-position:-398px -85px;}
.aw-img09{background-position:-200px -150px;}
.aw-img10{background-position:-267px -150px;}
.aw-img11{background-position:-331px -150px;}
.aw-img12{background-position:-398px -150px;}
.aw-img13{background-position:-200px -218px;}
.aw-img14{background-position:-267px -218px;}
.aw-img15{background-position:-331px -218px;}
.aw-img16{background-position:-398px -218px;}
.aw-img17{background-position:-200px -285px;}
.aw-img18{background-position:-267px -285px;}
.aw-img19{background-position:-331px -285px;}
.aw-img20{background-position:-398px -285px;}
.aw-img21{background-position:-201px -345px;}








/* 3시간날씨 3-hour forecast / 전국날씨 National / 관심지역날씨 주간 Interested Location Weather Weekly */
.fw-img{background:url(../image/sp_weather_all01.svg) no-repeat 0 0;}
.fw-img{width:40px;height:40px;margin:0 auto;}
.fw-img01{background-position:-15px -15px;}
.fw-img02{background-position:-55px -15px;}
.fw-img03{background-position:-96px -14px;}
.fw-img04{background-position:-136px -14px;}
.fw-img05{background-position:-15px -54px;}
.fw-img06{background-position:-56px -54px;}
.fw-img07{background-position:-95px -54px;}
.fw-img08{background-position:-135px -54px;}
.fw-img09{background-position:-14px -95px;}
.fw-img10{background-position:-56px -95px;}
.fw-img11{background-position:-95px -95px;}
.fw-img12{background-position:-135px -95px;}
.fw-img13{background-position:-15px -133px;}
.fw-img14{background-position:-56px -133px;}
.fw-img15{background-position:-95px -133px;}
.fw-img16{background-position:-135px -133px;}
.fw-img17{background-position:-15px -176px;}
.fw-img18{background-position:-56px -176px;}
.fw-img19{background-position:-95px -176px;}
.fw-img20{background-position:-135px -176px;}
.fw-img21{background-position:-15px -214px;}

/* 주간날씨 Weekly Weather */
.ww-img{width:60px;height:60px;margin:0 auto;background:url(../image/sp_weather_all01.svg) no-repeat 0 0;}
.ww-img01{background-position:-200px -15px;}
.ww-img02{background-position:-263px -15px;}
.ww-img03{background-position:-331px -15px;}
.ww-img04{background-position:-397px -10px;}
.ww-img05{background-position:-198px -82px;}
.ww-img06{background-position:-264px -80px;}
.ww-img07{background-position:-329px -84px;}
.ww-img08{background-position:-395px -82px;}
.ww-img09{background-position:-198px -147px;}
.ww-img10{background-position:-264px -150px;}
.ww-img11{background-position:-328px -150px;}
.ww-img12{background-position:-395px -150px;}
.ww-img13{background-position:-198px -213px;}
.ww-img14{background-position:-265px -213px;}
.ww-img15{background-position:-329px -213px;}
.ww-img16{background-position:-396px -215px;}
.ww-img17{background-position:-198px -280px;}
.ww-img18{background-position:-264px -282px;}
.ww-img19{background-position:-329px -282px;}
.ww-img20{background-position:-395px -282px;}
.ww-img21{background-position:-198px -343px;}
.ww-img22{background-position:-270px -324px;}

/* 3시간날씨_풍향 3-hour forecast_winds */
.wd-img{width:20px;height:20px;margin:0 auto;background:url(../image/ico_weather02.svg) no-repeat 0 0;}
.wd-img-west{background-position:-94px -10px;}
.wd-img-east{background-position:-66px -10px;}
.wd-img-north{background-position:-38px -10px;}
.wd-img-south{background-position:-10px -10px;}
.wd-img-se{background-position:-123px -11px;}
.wd-img-sw{background-position:-149px -11px;}
.wd-img-ne{background-position:-179px -10px;}
.wd-img-nw{background-position:-205px -9px;}

body[data-weather] .rwhs-area li p{display:inline-block;float:none;width:20px;height:20px;margin-right:8px;background:url(../image/ico_weather01.svg) no-repeat 0 0;}
body[data-weather] .rwhs-area li.precip p{background-position:-9px -9px;}
body[data-weather] .rwhs-area li.wind p{background-position:-49px -9px;}
body[data-weather] .rwhs-area li.humidity p{background-position:-90px -10px;}
body[data-weather] .rwhs-area li.sunrise p{background-position:-129px -10px;}


/* 헤더날씨 */
body[data-weather] .link-wrap .today-weather{overflow:hidden;position:absolute !important;top:63px !important;height:35px !important;padding-left:0 !important;}
body[data-weather] .link-wrap .today-weather .main-top-weather{height:45px !important;padding-left:0;}
body[data-weather] .link-wrap .today-weather .date{margin-top:13px;}
body[data-weather] .weather-cont{overflow:hidden;display:flex;box-sizing:border-box;width:100%;max-width:1200px;margin:48px auto 0 auto;}
body[data-weather] .main-temperature{padding-top:3px;font-size:12px;color:var(--font-color012);letter-spacing:0;}
body[data-weather] .main-weather-air{clear:both;float:left;line-height:10px;letter-spacing:0;}
body[data-weather] .weather-left-area{width:calc(100% - 340px);max-width:800px;padding-right:60px;}
body[data-weather] .weather-right-area{width:100%;max-width:340px;}


@media only screen and (min-width:1024px) and (max-width:1279px){
	body[data-weather] .weather-cont{max-width:980px;}
	body[data-weather] .weather-left-area{padding-right:30px;}
	body[data-weather] .weather-left-area{width:calc(100% - 370px);}
}

@media only screen and (min-width:768px) and (max-width:1023px){
	body[data-weather] .weather-cont{flex-wrap:wrap;padding:0 24px !important;}
	body[data-weather] .weather-left-area{width:100%;max-width:100%;padding-right:0;}
	body[data-weather] .weather-right-area{display:flex;justify-content:space-between;max-width:100%;}
	body[data-weather] .weather-right-area .aside-wrap{width:calc(100% - 340px);}

}

@media only screen and (max-width:767px){
	body[data-weather] .weather-cont{flex-wrap:wrap;padding:0 16px !important;}
	body[data-weather] .weather-left-area{width:100%;max-width:100%;padding-right:0;}
	body[data-weather] .weather-right-area{display:flex;max-width:100%;flex-wrap:wrap;}
	body[data-weather] .weather-right-area .aside-wrap{width:100%;}
}

body[data-weather] .top-weather-box{overflow:hidden;}
body[data-weather] .top-weather-box .tit01{float:left;padding-right:8px;font-size:20px;line-height:30px;font-weight:700;color:var(--font-color003);}
body[data-weather] .top-weather-box .txt01{float:left;position:relative;padding-left:8px;font-size:16px;line-height:30px;font-weight:500;color:var(--font-color005);}
body[data-weather] .top-weather-box .txt01:before{content:'';display:inline-block;position:absolute;top:9px;left:0;width:1px;height:12px;background-color:var(--ui-tag022);}
body[data-weather] .location-weather-area{display:flex;float:right;padding-left:40px;gap:8px;line-height:30px;}
body[data-weather] .location-weather-area .location-weather-area{float:right;}
body[data-weather] .location-weather-area span{width:19px;height:19px;margin-top:7px;margin-right:5px;background:url(../image/ico_weather.png) no-repeat -8px -7px;-webkit-transition:-webkit-transform 0.5s;transition:-webkit-transform 0.5s;cursor:pointer;}
body[data-weather] .location-weather-area span:hover{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-o-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg);-webkit-transition:all 0.5s ease-in-out;-moz-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;}
body[data-weather] .location-weather-area p{flex-shrink:0;float:left;font-size:13px;font-weight:600;color:var(--font-color006);}
body[data-weather] .weather-today-location{position:relative;width:134px;}
body[data-weather] .location-select-city{width:150px;}
body[data-weather] .yhn-select-arrow{overflow:hidden;position:absolute;top:4px;right:1px;z-index:2;width:30px;height:26px;background:var(--ui-tag001) url(../image/ico_weather.png) no-repeat -197px -3px;cursor:pointer;}
body[data-weather] .location-weather-area select{width:100%;height:30px;margin-right:8px;padding:0 22px 0 8px;border:1px solid var(--ui-tag004);border-radius:2px;background:var(--ui-bg822) 95% 50% no-repeat;font-size:13px;line-height:20px;-moz-appearance:none;-webkit-appearance:none;appearance:none;}
body[data-weather] .location-weather-area button.btn-location-move{flex-shrink:0;height:30px;padding:0 12px;border:1px solid var(--ui-tag060);border-radius:2px;background:var(--ui-tag060);font-size:13px;line-height:20px;color:var(--font-color001);}
body[data-weather] .bott-weather-box{overflow:hidden;display:flex;justify-content:space-between;box-sizing:border-box;width:100%;padding:40px 30px;border:1px solid var(--ui-tag005);border-bottom:0;border-top-left-radius:2px;border-top-right-radius:2px;}
body[data-weather] .weather-detail-info{display:flex;flex-shrink:0;width:calc(100% - 438px);padding:12px 0;gap:24px;}
body[data-weather] .weather-today-info{flex-shrink:0;width:125px;}
body[data-weather] .weather-title,
.weather-zone .weather-title{padding-bottom:4px;font-size:14px;line-height:21px;font-weight:600;color:var(--font-color006);}
body[data-weather] .weather-temperature,
.weather-zone .weather-temperature{overflow:hidden;display:flex;align-items:center;height:72px;font-size:48px;font-weight:600;color:var(--font-color003);}
body[data-weather] .weather-temperature span,
.weather-zone .weather-temperature span{display:inline-block;height:100%;padding-top:10px;font-size:16px;font-weight:500;color:var(--font-color003);vertical-align:top;}
body[data-weather] .weather-temperature-info p,
.weather-zone .weather-temperature-info p{display:flex;}
body[data-weather] .weather-temperature-info p:nth-child(1) .txt01,
.weather-zone .weather-temperature-info p:nth-child(1) .txt01{margin-right:3px;font-weight:400;color:var(--font-color003);}
body[data-weather] .weather-temperature-info p:nth-child(1) span,
.weather-zone .weather-temperature-info p:nth-child(1) span{font-size:15px;}
body[data-weather] .weather-temperature-info p:nth-child(1) span:nth-child(1),
.weather-zone .weather-temperature-info p:nth-child(1) span:nth-child(1){padding-right:8px;color:var(--font-color032);}
body[data-weather] .weather-temperature-info p:nth-child(1) span:nth-child(2),
.weather-zone .weather-temperature-info p:nth-child(1) span:nth-child(2){position:relative;padding-left:8px;color:var(--font-color021);}
body[data-weather] .weather-temperature-info p:nth-child(1) span:nth-child(2):before,
.weather-zone .weather-temperature-info p:nth-child(1) span:nth-child(2):before{content:'';position:absolute;top:6px;left:0;width:1px;height:12px;background-color:var(--ui-tag004);}
body[data-weather] .weather-temperature-info p span{flex-shrink:0;}
body[data-weather] .weather-temperature-info .compare-txt,
.weather-zone .weather-temperature-info .compare-txt{margin-top:4px;font-size:13px;line-height:20px;color:var(--font-color005);}

@media only screen and (min-width:1024px) and (max-width:1279px){
	body[data-weather] .bott-weather-box{justify-content:space-between;position:relative;height:347px;padding:32px;}
	body[data-weather] .weather-detail-info{width:auto;height:150px;padding:3px 0;}
	body[data-weather] .location-weather-area{clear:both;float:none;width:100%;padding-top:12px;padding-left:0;}
	body[data-weather] .weather-today-location{width:100%;}
	.weather-zone .weather-detail-info{gap:20px 8px !important;}
}

@media only screen and (min-width:768px) and (max-width:1023px){
	body[data-weather] .top-weather-box h3{font-size:18px;line-height:27px;}
	body[data-weather] .top-weather-box span{float:none;font-size:15px;line-height:27px;}
	body[data-weather] .weather-today-location{width:calc((100% - 16px) / 2);}
	body[data-weather] .location-weather-area{float:none;width:100%;padding:8px 0 0}
	body[data-weather] .bott-weather-box{justify-content:center;position:relative;height:347px;}
	body[data-weather] .weather-detail-info,
	.weather-zone .weather-detail-info{width:auto;height:150px;padding:0;}
	body[data-weather] .weather-today-info{width:auto;}
	.weather-zone .weather-temperature span{padding-top:20px;}
}

@media only screen and (max-width:767px){
	body[data-weather] .top-weather-box .tit01{font-size:18px;line-height:27px;}
	body[data-weather] .top-weather-box span{float:none;font-size:15px;line-height:27px;}
	body[data-weather] .weather-today-location{width:100%;}
	body[data-weather] .location-weather-area{/*display:grid;grid-template-columns:1fr 1fr 55px;*/clear:both;float:none;padding-left:0;}
	body[data-weather] .location-weather-area .att-btn{grid-column-start:1;grid-column-end:4;}
	body[data-weather] .location-weather-area .att-btn .btn-attention-move{width:100%;height:30px;}
	body[data-weather] .bott-weather-box{justify-content:flex-start;flex-direction:column;align-items:center;position:relative;height:auto;padding:20px;flex-wrap:wrap;gap:20px;}
	body[data-weather] .weather-detail-info,
	.weather-zone .weather-detail-info{justify-content:center;width:100%;height:150px;padding:0;gap:0;}
	body[data-weather] .weather-today-info{width:auto;padding-left:24px;}
	.weather-zone .weather-temperature span{padding-top:20px;}
}

@media only screen and (max-width:375px){
	body[data-weather] .bott-weather-box{height:565px !important;padding:20px 10px !important;}
	body[data-weather] .weather-detail-info{height:auto;}

	body[data-weather] .weather-today-info{padding-left:12px;}
	body[data-weather] .bott-weather-box{height:545px;padding:20px;}
	body[data-weather] .weather-temperature-info p:nth-child(1) span:nth-child(1){padding-right:4px;}
	body[data-weather] .weather-temperature-info p:nth-child(1) span:nth-child(2){padding-left:4px;}
	body[data-weather] .rwhs-area li.wind,
	body[data-weather] .rwhs-area li.sunrise{width:100% !important;}
}
@media only screen and (max-width:319px){
	body[data-weather] .weather-today-info{padding-left:24px;}
	body[data-weather] .bott-weather-box{height:545px;}
	body[data-weather] .weather-detail-info{display:block;}
	body[data-weather] .weather-temperature-info p{flex-wrap:wrap;}

}

body[data-weather] {}

/* 메인-오늘의날씨 */
.weather-zone{position:relative;width:100%;background-color:var(--ui-tag009);}
.weather-zone .swiper-area{width:100%;}
.weather-zone .btns-wrap11{position:absolute;top:-46px;right:0;max-width:150px;z-index:1;}
.weather-zone li{position:relative;box-sizing:border-box;width:100%;height:256px;padding:40px 35px 32px;}
.weather-zone li .weather-title{padding-bottom:0;font-size:15px;color:var(--font-color003);}
.weather-zone li .weather-detail-info{display:flex;justify-content:center;align-items:center;box-sizing:border-box;flex-wrap:wrap;gap:20px 16px;}
.weather-zone li .weather-space{display:block;flex-shrink:0;width:100%;font-size:16px;font-weight:600;color:var(--font-color003);text-align:center;}
.weather-zone li .weather-detail-info .ww-img{margin:0;}
.weather-zone li .weather-today-info{display:block;margin-top:20px;text-align:center;}
.weather-zone li .weather-temperature span{font-size:20px;}
.weather-zone li .circle-item{font-size:13px;font-weight:500;}
.weather-zone li .circle-item .tit01{color:var(--font-color010);}
.weather-zone li .tw-img{overflow:visible;}
.weather-zone li .weather-temperature-info p:nth-child(1) span{font-size:13px;}
.weather-zone li .swiper-slide{width:auto;}
/* 미세먼지  */
.txt-dust{display:block;margin-top:6px;font-size:13px;line-height:1.5;font-weight:500;color:var(--font-color010);}
.txt-dust [class*='state']{display:inline-block;margin-left:2px;}
.txt-dust .state01{color:var(--font-color055);} /* 좋음 */
.txt-dust .state02{color:var(--font-color056);} /* 보통 */
.txt-dust .state03{color:var(--font-color057);} /* 나쁨 */
.txt-dust .state04{color:var(--font-color058);} /* 매우나쁨 */
@media only screen and (min-width:1024px) and (max-width:1279px){
	/*.weather-zone .btns-wrap11{display:none;}*/
	.weather-zone li{width:221px;height:243px;padding:32px 20px;gap:24px 12px;}
	.weather-zone li .weather-today-info{margin-top:22px;}
	.weather-zone li .weather-temperature{font-size:42px;}
	.txt-dust{margin-top:4px;}
	.weather-zone li .tw-img{position:absolute;top:0;right:0;}
	.weather-zone li .weather-temperature{height:63px;}
	.weather-zone li .txt-dust,
	.weather-zone li .weather-title{font-size:14px;}
}
@media only screen and (min-width:768px) and (max-width:1023px){
	/*.weather-zone .btns-wrap11{display:none;}*/
	.weather-zone .btns-wrap11{top:-42px;}
	.weather-zone li{display:flex;justify-content:center;align-items:center;width:100%;height:88px;padding:0;column-gap:40px;}
	.weather-zone li .weather-space{display:inline-block;flex-shrink:0;width:auto;margin-right:28px;}
	.weather-zone li .weather-detail-info{align-items:center;height:100%;margin-top:0;padding-left:0;column-gap:12px;}
	.weather-zone li .weather-today-info{display:block;margin-top:0;text-align:left;}
	.weather-zone li .tw-img{overflow:hidden;flex-shrink:0;width:60px;height:60px;margin-right:8px;}
	.weather-zone li .circle-item{display:flex;margin-left:110px;font-size:16px;}/*margin-left:110px;margin-right:60px;*/
	.weather-zone li .weather-temperature-info p:nth-child(1) span{font-size:16px;}
	.weather-zone li .weather-temperature-info{margin-left:60px;}
	.weather-zone li .weather-temperature{font-size:40px;}
	.weather-zone li .weather-temperature span{font-size:18px;}
	.weather-zone li .weather-title{font-size:14px;}
	/* 미세먼지 */
	.weather-zone li .txt-dust{margin-top:4px;font-size:14px;}
}
@media only screen and (max-width:767px){
	/*.weather-zone .btns-wrap11{display:none;}*/
	.weather-zone .btns-wrap11{top:-42px;}
	.weather-zone li{display:flex;justify-content:center;align-items:flex-end;width:100%;height:108px;padding:13px 0 15px;column-gap:30px;}
	.weather-zone li .weather-space{flex-shrink:0;margin-right:0;font-size:14px;text-align:left;}
	.weather-zone li .weather-detail-info{overflow:hidden;display:block;width:auto;height:auto;margin-top:0;padding-left:0;}
	.weather-zone li .weather-temperature{float:left;height:60px;}
	.weather-zone li  .weather-detail-info .ww-img{float:left;margin-left:12px;}
	.weather-zone li .weather-today-info{display:block;margin-top:0;padding-bottom:9px;text-align:left;}
	.weather-zone li .tw-img{overflow:hidden;flex-shrink:0;width:60px;height:60px;margin-right:8px;}
	.weather-zone li .circle-item{display:flex;margin-left:110px;font-size:16px;}/*margin-left:110px;margin-right:60px;*/
	.weather-zone li .weather-temperature-info p:nth-child(1) span{font-size:16px;}
	.weather-zone li .weather-temperature-info{margin-left:60px;}
	.weather-zone li .weather-temperature{font-size:40px;}
	.weather-zone li .weather-temperature span{font-size:18px;}
	.weather-zone li .weather-title{font-size:14px;}
	/* 미세먼지 */
	.weather-zone li .txt-dust{margin-top:4px;font-size:14px;}
}
@media only screen and (max-width:375px){
	.weather-zone li{column-gap:8px;}
	.weather-zone li .weather-detail-info .ww-img{margin-left:8px;}
	.weather-zone li .weather-detail-info{display:block;height:auto;}
}
@media only screen and (max-width:320px){
	.weather-zone{display:block;height:auto;}
	.weather-zone li .weather-detail-info{display:flex;justify-content:center;flex-wrap:wrap;gap:16px 16px;}
	.weather-zone li .weather-space{flex-shrink:0;width:100%;}
	.weather-zone li .weather-space{text-align:center;}
	.weather-zone li .weather-today-info{padding-bottom:0;text-align:center;}
}

body[data-weather] .rwhs-area li{display:inline-flex;font-size:13px;line-height:20px;color:var(--font-color005);}
body[data-weather] .rwhs-area li span{display:inline-block;margin-left:8px;font-weight:500;color:var(--font-color003)}
body[data-weather] .rwhs-area li i{display:inline-block;margin:0 8px;}
body[data-weather] .rwhs-area li.precip{width:calc(100% - 230px);}
body[data-weather] .rwhs-area li.wind{width:calc(100% - 200px);}
body[data-weather] .rwhs-area li.humidity{width:calc(100% - 230px);margin-top:4px;}
body[data-weather] .rwhs-area li.sunrise{width:calc(100% - 200px);margin-top:4px;}
body[data-weather] .air-info-area{width:100%;max-width:400px;height:168px;padding-left:43px;}
body[data-weather] .air-info{margin-top:16px;padding-top:16px;border-top:1px solid var(--ui-tag005);}
body[data-weather] .air-info-area .rwhs-area{display:flex;flex-wrap:wrap;gap:4px;}
body[data-weather] .air-info .yhn-weather-circle{display:flex;gap:25px;}
body[data-weather] .yhn-weather-circle .circle-item{display:inline-block;position:relative;width:92px;height:92px;line-height:1.2;text-align:center;}
body[data-weather] .yhn-weather-circle .circle-item .tit01{display:block;font-size:13px;line-height:20px;font-weight:400;color:var(--font-color005);}
body[data-weather] .yhn-weather-circle .circle-item .txt01{position:absolute;top:16px;left:0px;width:100%;font-size:13px;line-height:20px;text-align:center;}
body[data-weather] .yhn-weather-circle .circle-item .txt02{width:100%;font-size:12px;line-height:18px;text-align:center;}

@media only screen and (min-width:1024px) and (max-width:1279px){
	body[data-weather] .air-info{position:absolute;left:50%;bottom:32px;box-sizing:border-box;width:546px;margin-left:-272px;}
	body[data-weather] .air-info-area{width:190px;height:150px;padding-left:0;}
	body[data-weather] .air-info-area .rwhs-area{gap:16px;padding:11px 0;}
	body[data-weather] .rwhs-area li.precip,
	body[data-weather] .rwhs-area li.wind,
	body[data-weather] .rwhs-area li.humidity,
	body[data-weather] .rwhs-area li.sunrise{width:100%;}
}

@media only screen and (min-width:768px) and (max-width:1023px){
	body[data-weather] .air-info{position:absolute;left:50%;bottom:32px;box-sizing:border-box;width:546px;margin-left:-272px;}
	body[data-weather] .air-info-area{width:190px;height:150px}
	body[data-weather] .air-info-area .rwhs-area{gap:16px;padding:7px 0;}
	body[data-weather] .rwhs-area li.precip,
	body[data-weather] .rwhs-area li.wind,
	body[data-weather] .rwhs-area li.humidity,
	body[data-weather] .rwhs-area li.sunrise{width:100%;}
}

@media only screen and (max-width:767px){
	body[data-weather] .air-info{position:static;box-sizing:border-box;width:100%;height:auto;margin:16px 0 0;}
	body[data-weather] .air-info-area{display:flex;justify-content:center;width:100%;max-width:303px;height:auto;padding:0;flex-wrap:wrap;}
	body[data-weather] .air-info-area .rwhs-area{justify-content:space-between;}
	body[data-weather] .rwhs-area li i{margin:0 4px;}
	body[data-weather] .rwhs-area li span{margin-left:4px;}
	body[data-weather] .rwhs-area li p{margin-right:4px;}
	body[data-weather] .rwhs-area li.precip,
	body[data-weather] .rwhs-area li.wind{margin-top:0;}
	body[data-weather] .rwhs-area li.humidity,
	body[data-weather] .rwhs-area li.sunrise{margin-top:0;}
	body[data-weather] .rwhs-area li.precip,
	body[data-weather] .rwhs-area li.humidity{width:36%;}
	body[data-weather] .rwhs-area li.wind,
	body[data-weather] .rwhs-area li.sunrise{width:56%;}
	body[data-weather] .air-info .yhn-weather-circle{justify-content:center;max-width:303px;margin:0 auto;padding:0 20px;flex-wrap:wrap;gap:16px 40px;}
	body[data-weather] .yhn-weather-circle .circle-item{width:calc((100% - 80px) / 3);}
}

@media only screen and (max-width:375px){
	body[data-weather] .air-info-area .rwhs-area{display:block;}
	body[data-weather] .rwhs-area li.precip,
	body[data-weather] .rwhs-area li.humidity{width:100%;}
	body[data-weather] .air-info{width:100%;margin:16px 0 0;}
	body[data-weather] .air-info .yhn-weather-circle{gap:16px 20px;}
	body[data-weather] .yhn-weather-circle .circle-item{width:calc((100% - 56px) / 3);}
}

@media only screen and (max-width:350px){
	body[data-weather] .air-info-area{padding:0;}
	body[data-weather] .air-info-area .rwhs-area{display:block;}
	body[data-weather] .rwhs-area li.wind,
	body[data-weather] .rwhs-area li.sunrise{width:62%;}
	body[data-weather] .air-info{width:100%;}
	body[data-weather] .air-info .yhn-weather-circle{justify-content:flex-start;margin-top:-12px;padding:0;}
	body[data-weather] .yhn-weather-circle .circle-item{min-width:60px;margin-top:12px;}
	body[data-weather] .bott-weather-box{display:block;height:auto !important;}
	body[data-weather] .weather-detail-info{display:block;margin-bottom:20px;}
	body[data-weather] .w-animation{float:none;margin:0 auto;}
	body[data-weather] .weather-today-info{display:flex;align-items:center;padding-left:0;flex-wrap:wrap;}
	body[data-weather] .weather-title{width:100%;}
	body[data-weather] .weather-temperature{margin-right:20px;}
}

@media only screen and (max-width:319px){
	/*body[data-weather] .air-info-area{padding:0;}*/
	/*body[data-weather] .rwhs-area li.precip,*/
	/*body[data-weather] .rwhs-area li.humidity,*/
	/*body[data-weather] .rwhs-area li.wind,*/
	/*body[data-weather] .rwhs-area li.sunrise{width:100%;}*/
}

/* 기상특보 */
body[data-weather] .weather-breaking-news{overflow:hidden;position:relative;margin-bottom:40px;padding:16px 20px;border:1px solid var(--ui-tag005);border-top:0;background:var(--ui-tag091);cursor:pointer;border-bottom-left-radius:2px;border-bottom-right-radius:2px;}
body[data-weather] .w-break-news{/*overflow:hidden;*/}
body[data-weather] .w-break-news .breaknews-title{overflow:hidden;float:left;position:relative;top:2px;width:50px;height:20px;margin-right:8px;padding:0 4px 5px 4px;font-size:12px;line-height:20px;color:var(--font-color001);text-align:center;}
body[data-weather] .w-break-news .breaknews-title .txt01{position:relative;z-index:2;height:20px;font-size:12px;line-height:20px;font-weight:600;color:var(--font-color001);}
body[data-weather] .w-break-news .breaknews-title:after{content:'';display:block;position:absolute;top:0;left:0;z-index:1;width:100%;height:20px;background-color:var(--ui-tag061);}
body[data-weather] .w-break-news .breaknews-title:before{content:'';display:block;position:absolute;left:-4px;bottom:-6px;z-index:1;width:6px;height:18px;background-color:var(--ui-tag061);transform:rotate(45deg);}
body[data-weather] .breaknews{overflow:hidden;display:flex;float:left;max-width:calc(100% - 100px);white-space:nowrap;text-overflow:ellipsis;word-wrap:normal;}
body[data-weather] .breaknews strong{overflow:hidden;display:block;float:left;margin-right:8px;font-size:16px;font-weight:600;color:var(--font-color003);white-space:nowrap;text-overflow:ellipsis;word-wrap:normal;}
body[data-weather] .breaknews .txt-date{float:right;font-size:13px;line-height:24px;font-weight:400;color:var(--font-color004);}
body[data-weather] .breaknews a{color:var(--font-color002);}
body[data-weather] .breaknews a:hover{text-underline-position:under;text-decoration-thickness:1px;text-decoration-line:underline;text-decoration-color:currentColor;}
body[data-weather] .w-breaknews-more{display:block;float:right;width:24px;height:24px;border:none;background:var(--ui-bg037) no-repeat 50% 50%;}

@media only screen and (min-width:768px) and (max-width:1023px){
	body[data-weather] .breaknews strong{font-size:15px;line-height:23px;}
	body[data-weather] .breaknews .txt-date{line-height:23px;}
}

@media only screen and (max-width:767px){
	body[data-weather] .weather-breaking-news{padding:18px 20px;}
	body[data-weather] .w-break-news .breaknews-title{float:none;}
	body[data-weather] .breaknews{display:block;width:100%;max-width:100%;}
	body[data-weather] .breaknews strong{float:none;width:100%;margin-top:8px;font-size:15px;line-height:23px;white-space:normal;}
	body[data-weather] .w-breaknews-more{position:absolute;top:15px;right:15px;}
	body[data-weather] .breaknews .txt-date{width:100%;margin-top:4px;line-height:20px;}
}

/* 주간날씨 */
body[data-weather] .weekly-area .title-type001{display:block;width:100%;}
body[data-weather] .weekly-area .tit01{width:100%;padding-bottom:12px;font-size:20px;line-height:30px;font-weight:700;color:var(--font-color003);}
body[data-weather] .weekly-area .weekly-field01{box-sizing:border-box;padding:12px 0;border-top:1px solid var(--ui-tag003);border-bottom:1px solid var(--ui-tag005);}
body[data-weather] .weekly-area .weekly-list{display:flex;justify-content:center;align-items:center;}
body[data-weather] .weekly-area .weekly-list li{display:flex;flex-shrink:initial;justify-content:center;flex-direction:column;align-items:center;max-width:132px;border-right:1px solid var(--ui-tag011);gap:4px;}
body[data-weather] .weekly-area .weekly-list li:last-child{border-right:0 none;}
body[data-weather] .weekly-area .weekly-list li p.day{display:flex;justify-content:center;flex-direction:column;align-items:center;font-size:15px;line-height:23px;font-weight:600;color:var(--font-color003);}
body[data-weather] .weekly-area .weekly-list li p.day span{font-size:12px;line-height:18px;font-weight:500;color:var(--font-color004);}
body[data-weather] .w-text{margin-top:4px;font-size:13px;line-height:20px;color:var(--font-color006);}
body[data-weather] .temperature{line-height:23px;}
body[data-weather] .temperature span{font-size:15px;line-height:23px;font-weight:500;}
body[data-weather] .temperature span:first-child{padding-right:6px;color:var(--font-color032);}
body[data-weather] .temperature span:last-child{position:relative;padding-left:9px;color:var(--font-color021);}
body[data-weather] .temperature span:last-child::before{content:'';position:absolute;top:5.5px;left:0;width:1px;height:12px;background-color:var(--ui-tag004);}

@media only screen and (min-width:768px) and (max-width:1023px){
	body[data-weather] .weekly-area .tit01{font-size:18px;line-height:27px;}
	body[data-weather] .weekly-area .weekly-list li{max-width:100%;}
	body[data-weather] .weekly-area .weekly-list li p.day{font-size:14px;}
	body[data-weather] .temperature span{font-size:14px;line-height:21px;}
	body[data-weather] .temperature span:last-child::before{top:4.4px;}
	body[data-weather] .weekly-area .weekly-field01{height:154px;}
}

@media only screen and (max-width:767px){
	body[data-weather] .weekly-area .tit01{font-size:18px;line-height:27px;}
	body[data-weather] .weekly-area .weekly-list{justify-content:flex-start;width:auto;}
	body[data-weather] .weekly-area .weekly-list li{flex-shrink:0;width:119px;min-width:76px;}
	body[data-weather] .weekly-area .weekly-list li p.day{font-size:14px;}
	body[data-weather] .temperature span{font-size:14px;line-height:21px;}
	body[data-weather] .weekly-area .weekly-field01{height:154px;}
}
@media only screen and (max-width:375px){
	body[data-weather] .weekly-area .weekly-list li{flex-shrink:0;width:76px;min-width:76px;}
}


/* 3시간예보 */
body[data-weather] .forecast-life-area{overflow:hidden;margin-top:20px;}
body[data-weather] .forecast-life-area .title-type001{display:block;width:100%;}
body[data-weather] .forecast-life-area .tit01{width:100%;padding-bottom:12px;border-bottom:1px solid var(--ui-tag003);font-size:20px;line-height:30px;font-weight:700;color:var(--font-color003);}
body[data-weather] .forecast-time-area{ overflow:hidden;position:relative;width:100%;}
body[data-weather] .forecast-time-table{table-layout:fixed;width:100%;}
body[data-weather] .forecast-time-table th{padding:12px 0;border-right:1px solid var(--ui-tag005);border-bottom:1px solid var(--ui-tag005);font-size:14px;line-height:21px;font-weight:500;color:var(--font-color003);text-align:center;}
body[data-weather] .forecast-time-table td{padding:12px 0;border-left:1px solid var(--ui-tag005);border-bottom:1px solid var(--ui-tag005);font-size:15px;color:var(--font-color006);text-align:center;}
body[data-weather] .forecast-time-table tr:first-child td{font-size:14px;}
body[data-weather] .forecast-time-table tr .wd-txt01{color:var(--font-color005);}
#threeTimeZone{width:100%;min-height:110px;}
#threeTimeZone svg{font-size:0.8em;font-weight:500;}

@media only screen and (min-width:768px) and (max-width:1023px){
body[data-weather] .forecast-life-area .tit01{font-size:18px;line-height:27px;}
body[data-weather] .forecast-time-table{border-bottom:1px solid var(--ui-tag005);}
body[data-weather] .forecast-time-table th{display:none;}
body[data-weather] .forecast-time-table colgroup{display:none;}
body[data-weather] .forecast-time-table td{border-left:0;border-bottom:0;}
body[data-weather] .forecast-time-table tr:first-child td{padding:12px 0 8px;}
body[data-weather] .forecast-time-table tr:nth-of-type(2) td{padding:0;}
body[data-weather] .forecast-time-table tr:nth-of-type(4) td{padding:8px 0;font-size:13px;}
body[data-weather] .forecast-time-table tr:last-child td{padding:0 0 12px;font-size:13px;}
	#threeTimeZone svg{font-size:0.6em;}
}

@media only screen and (max-width:767px){
	body[data-weather] .forecast-life-area .tit01{font-size:18px;line-height:27px;}
	body[data-weather] .forecast-time-table{border-bottom:1px solid var(--ui-tag005);}
	body[data-weather] .forecast-time-table th{display:none;}
	body[data-weather] .forecast-time-table colgroup{display:none;}
	body[data-weather] .forecast-time-table td{border-left:0;border-bottom:0;font-size:13px;}
	body[data-weather] .forecast-time-table tr:first-child td{padding:12px 0 8px;font-size:13px;}
	body[data-weather] .forecast-time-table tr:nth-of-type(2) td{padding:0;}
	body[data-weather] .forecast-time-table tr:nth-of-type(4) td{padding:8px 0;}
	body[data-weather] .forecast-time-table tr:last-child td{padding:0 0 12px;}
	#threeTimeZone svg{font-size:1.3em;}
}

/* 날씨 탭6 */
body[data-weather] .weather-tab-area{margin-top:60px;}
body[data-weather] .weather-tab-area .tab-type03 ul li{padding-bottom:6px;}
body[data-weather] .weather-tab-area .tab-type03 ul li:first-child{margin-left:0;}
body[data-weather] .tab-type03 ul li .tab{}
@media only screen and (min-width:768px) and (max-width:1023px){
	body[data-weather] .weather-tab-area{margin-top:40px;}
	body[data-weather] .tab-type03 ul li .tab{height:40px;font-size:16px;}
	body[data-weather] .tab-type03 ul li.active .tab{border-left:none;}
}

@media only screen and (max-width:767px){
	body[data-weather] .tab-type03 ul li .tab{height:40px;font-size:16px;}
	.tab-type03 ul li.active .tab{border-left:none;}
}
@media only screen and (max-width:375px){
	body[data-weather] .weather-tab-area .tab-type03{overflow-x:auto;}
	body[data-weather] .weather-tab-area .tab-type03 ul li{min-width:80px;}
}
@media only screen and (max-width:319px){
	body[data-weather] .tab-type03 ul li .tab{font-size:14px;}
}


/* 탭1_월간날씨 */
body[data-weather] .city-select-area{display:flex;gap:8px;justify-content:space-between;}
body[data-weather] .weather-public-area .location-weather-area{overflow:hidden;justify-content:flex-end;float:none;padding:8px 0;}
body[data-weather] .month-list{overflow:hidden;width:100%;margin-bottom:15px;border-top:1px solid var(--ui-tag023);border-left:1px solid var(--ui-tag023);}
body[data-weather] .month-list li{float:left;width:117px;height:148px;border-right:1px solid var(--ui-tag023);border-bottom:1px solid var(--ui-tag023);text-align:center;}
body[data-weather] .month-list li .day{height:30px;border-bottom:1px solid var(--ui-tag023);background:var(--ui-tag024);line-height:30px;letter-spacing:0;}
body[data-weather] .month-list li .w-img{margin-top:10px;margin-bottom:2px;}
body[data-weather] .weather-month .title-type001{display:block;width:100%;}
body[data-weather] .weather-month .tit01{width:100%;margin-bottom:12px;font-size:20px;line-height:30px;font-weight:700;color:var(--font-color003);}
body[data-weather] .weather-month .txt01{font-size:15px;line-height:23px;color:var(--font-color003);}
body[data-weather] .weather-i{margin:60px 0 0 0;font-size:15px;line-height:23px;color:var(--font-color005);}
body[data-weather] .weather-i a{text-underline-position:under;text-decoration-thickness:1px;text-decoration-line:underline;text-decoration-color:currentColor;}

@media only screen and (min-width:768px) and (max-width:1023px){
	body[data-weather] .weather-public-area .location-weather-area .weather-today-location{width:134px;}
	body[data-weather] .weather-i{margin:20px 0 0;font-size:14px;line-height:21px;}
	body[data-weather] .weather-month .tit01{font-size:18px;line-height:27px;}
	body[data-weather] .weather-month .txt01{font-size:13px;line-height:21px;}
}

@media only screen and (max-width:767px){
	body[data-weather] .weather-public-area .location-weather-area .weather-today-location{width:134px;}
	body[data-weather] .weather-i{margin:20px 0 0;font-size:14px;line-height:21px;}
	body[data-weather] .weather-month .tit01{font-size:18px;line-height:27px;}
	body[data-weather] .weather-month .txt01{font-size:13px;line-height:21px;}
	body[data-weather] .weather-month .weather-list01 li + li{margin-top:8px;}
}

/* 날씨확률 */
body[data-weather] .weather-probability{margin-top:40px;}
body[data-weather] .weather-probability .title-type001{display:block;width:100%;}
body[data-weather] .weather-probability .tit01{width:100%;padding-bottom:12px;font-size:20px;line-height:30px;font-weight:700;color:var(--font-color003);}
body[data-weather] .probability-table-field01{margin-top:30px;border-top:1px solid var(--ui-tag003);}
body[data-weather] .title-con02 + .probability-table-field01{margin-top:0;}
body[data-weather] .probability-table{width:100%;border-bottom:1px solid var(--ui-tag005);}
body[data-weather] .probability-table th{padding:12px 16px;border-top:1px solid var(--ui-tag005);border-right:1px solid var(--ui-tag005);background:var(--ui-tag007);font-size:14px;line-height:21px;font-weight:500;color:var(--font-color003);text-align:center;}
body[data-weather] .probability-table th:last-child{border-right:0;}
body[data-weather] .probability-table td{padding:12px 16px;border-top:1px solid var(--ui-tag005);border-right:1px solid var(--ui-tag005);font-size:14px;line-height:21px;color:var(--font-color005);text-align:center;}
body[data-weather] .probability-table td:last-child{border-right:0;text-align:left;}
body[data-weather] .probability-table tr:first-child td span{margin-right:2px;font-size:14px;font-weight:700;color:var(--font-color021);}

@media only screen and (min-width:768px) and (max-width:1023px){
	body[data-weather] .weather-probability .tit01{font-size:18px;line-height:27px;}
	body[data-weather] .probability-table th{font-size:13px;line-height:20px;}
	body[data-weather] .probability-table td{font-size:13px;line-height:20px;}
}

@media only screen and (max-width:767px){
	body[data-weather] .weather-probability .tit01{font-size:18px;line-height:27px;}
	body[data-weather] .probability-table th{font-size:13px;line-height:20px;}
	body[data-weather] .probability-table td{font-size:13px;line-height:20px;}
}

@media only screen and (max-width:400px){
	body[data-weather] .probability-table th,
	body[data-weather] .probability-table td{padding:12px 8px;}
}

/* 탭2_세계날씨 */
body[data-weather] .weather-world-area{overflow:hidden;width:100%;margin-top:12px;}
body[data-weather] .weather-world-area .title-type001{display:block;width:100%;}
body[data-weather] .weather-world-area .tit01{display:block;width:100%;padding-bottom:8px;font-size:16px;line-height:24px;font-weight:600;color:var(--font-color003);}
body[data-weather] .weather-world-area ul + [class*='title-con0'] .tit01{margin-top:24px;}
body[data-weather] .weather-world-area ul{overflow:hidden;display:flex;border:1px solid var(--ui-tag005);}
body[data-weather] .weather-world-area ul.world-list:last-child{margin-bottom:0;}
body[data-weather] .weather-world-area ul li{width:100%;padding:12px 0;border-left:1px solid var(--ui-tag005);font-size:13px;text-align:center;}
body[data-weather] .weather-world-area ul li:first-child{border-left:0;}
body[data-weather] .weather-world-area ul li p.w-city{font-size:15px;line-height:23px;font-weight:600;color:var(--font-color003);}
body[data-weather] .weather-world-area ul li p.w-nation{margin-bottom:4px;font-size:12px;line-height:18px;font-weight:500;color:var(--font-color006);}
body[data-weather] .weather-world-area .temperature span:first-child{color:var(--font-color003);}
body[data-weather] .weather-world-area .temperature span:last-child{color:var(--font-color004);}

@media only screen and (min-width:768px) and (max-width:1023px){
	body[data-weather] .weather-world-area .tit01{font-size:15px;line-height:23px;}
	body[data-weather] .weather-world-area ul li p.w-city{font-size:14px;line-height:21px;}
	body[data-weather] .weather-world-area ul{border-top:0;border-left:0;flex-wrap:wrap;}
	body[data-weather] .weather-world-area ul li{width:calc((100% - 3px) / 3);border-top:1px solid var(--ui-tag005);}
	body[data-weather] .weather-world-area ul li:first-child{border-left:1px solid var(--ui-tag005)}
}

@media only screen and (max-width:767px){
	body[data-weather] .weather-world-area .tit01{font-size:15px;line-height:23px;}
	body[data-weather] .weather-world-area ul li p.w-city{font-size:14px;line-height:21px;}
	body[data-weather] .weather-world-area ul{border-top:0;border-left:0;flex-wrap:wrap;}
	body[data-weather] .weather-world-area ul li{width:calc((100% - 3px) / 3);border-top:1px solid var(--ui-tag005);}
	body[data-weather] .weather-world-area ul li:first-child{border-left:1px solid var(--ui-tag005)}

}

/* 탭3_기상특보 */
body[data-weather] .weather-condition{margin-top:12px;}
body[data-weather] .weather-condition .title-type001{display:block;width:100%;}
body[data-weather] .weather-condition .tit01{width:100%;padding-bottom:12px;font-size:20px;line-height:30px;font-weight:700;color:var(--font-color003);}
body[data-weather] .forecast-life-area .title-type001{display:block;width:100%;}
body[data-weather] .weather-condition .tit02{width:100%;padding-bottom:8px;border-bottom:1px solid var(--ui-tag003);font-size:16px;line-height:24px;font-weight:600;color:var(--font-color005);}
body[data-weather] .weather-condition .weather-condition-info{margin-top:24px;}
body[data-weather] .special-weather-table02{margin-bottom:30px;}
body[data-weather] .special-weather-table02 th{padding:12px;border-right:1px solid var(--ui-tag005);border-bottom:1px solid var(--ui-tag005);background:var(--ui-tag007);font-size:14px;line-height:21px;font-weight:500;color:var(--font-color003);text-align:center;}
body[data-weather] .special-weather-table02 td{padding:12px;border-bottom:1px solid var(--ui-tag005);font-size:14px;line-height:21px;color:var(--font-color005);}
body[data-weather] .special-weather-table02 td:last-child{border-right:0;}

.weather-condition-field01{display:inline-block;position:relative;box-sizing:border-box;width:100%;padding:15px 16px;border:1px solid var(--ui-tag004);border-radius:2px;vertical-align:top;}

/* @@@@코드정리 필요 (btn-type211-toggle 겹침, svg 도 다른걸 이용함) */
.weather-condition-field01 .btn-type211-toggle{display:flex;justify-content:space-between !important;align-items:center;width:100%;}
.weather-condition-field01 .btn-type211-toggle:after{content:'';display:block;width:20px;height:20px;background-image:var(--ui-bg823);background-size:21px;transform:rotate(0deg);}
.weather-condition-field01 .sort{display:none;position:absolute;top:56px;left:-1px;z-index:10;box-sizing:border-box;width:calc(100% + 2px);padding:16px;border:1px solid var(--ui-tag004);background-color:var(--font-color001);border-bottom-left-radius:2px;border-bottom-right-radius:2px;}
.weather-condition-field01 .sort li + li{margin-top:12px;}
.weather-condition-field01 .btn-type211-toggle .txt01{overflow:hidden;max-width:calc(100% - 30px);font-size:17px;line-height:26px;font-weight:400;color:var(--font-color003);white-space:nowrap;text-overflow:ellipsis;}
.weather-condition-field01 .btn-type212>.txt01{display:block;font-size:17px;line-height:23px;font-weight:400;color:var(--font-color003);text-align:left;white-space:normal;}
.weather-condition-field01.active{border-bottom-left-radius:0;border-bottom-right-radius:0;}
.weather-condition-field01.active .sort{display:block;}
.weather-condition-field01.active .btn-type211-toggle:after{transform:rotate(180deg);}

@media only screen and (min-width:768px) and (max-width:1023px){
	body[data-weather] .weather-condition .tit01{font-size:18px;line-height:27px;}
	.weather-condition-field01 .btn-type211-toggle .txt01{font-size:15px;line-height:23px;}
	.weather-condition-field01 .btn-type212>.txt01{font-size:15px;line-height:23px;}
	.weather-condition-field01 .sort{top:53px;}
	body[data-weather] .special-weather-table02 th,
	body[data-weather] .special-weather-table02 td{font-size:13px;line-height:20px;}

}

@media only screen and (max-width:767px){
	body[data-weather] .weather-condition .tit01{font-size:18px;line-height:27px;}
	.weather-condition-field01 .btn-type211-toggle .txt01{font-size:15px;line-height:23px;}
	.weather-condition-field01 .btn-type212>.txt01{font-size:15px;line-height:23px;}
	.weather-condition-field01 .sort{top:53px;}
	body[data-weather] .special-weather-table02 th,
	body[data-weather] .special-weather-table02 td{font-size:13px;line-height:20px;}
}

/* 탭4_태풍정보 */
body[data-weather] .weather-typhoon-info{margin-top:12px;}
body[data-weather] .weather-typhoon-info .title-type001{display:block;width:100%;}
body[data-weather] .weather-typhoon-info .tit01{width:100%;padding-bottom:12px;font-size:20px;line-height:30px;font-weight:700;color:var(--font-color023);}
body[data-weather] .typhoon-map{border:2px solid var(--ui-tag005);}
body[data-weather] .typhoon-map img{width:100%;}
body[data-weather] .typhoon-rank{margin:12px 0 24px 0;}
body[data-weather] .typhoon-rank ul{display:flex;gap:14px 40px;flex-wrap:wrap;}
body[data-weather] .typhoon-rank ul li{display:flex;flex-shrink:0;align-items:center;}
body[data-weather] .typhoon-rank .txt-rank{box-sizing:border-box;min-width:52px;padding:2px 8px;border-radius:100px;font-size:11px;line-height:17px;font-weight:500;color:var(--font-color003);}
body[data-weather] .typhoon-rank .txt-rank + .txt-rank{margin-left:4px;}
body[data-weather] .typhoon-rank .rank05{background:var(--ui-tag092);}
body[data-weather] .typhoon-rank .rank04{background:var(--ui-tag093);}
body[data-weather] .typhoon-rank .rank03{background:var(--ui-tag094);}
body[data-weather] .typhoon-rank .rank02{background:var(--ui-tag095);color:var(--font-color001);}
body[data-weather] .typhoon-rank .rank01{background:var(--ui-tag096);color:var(--font-color001);}
body[data-weather] .typhoon-rank .txt01{font-size:12px;line-height:18px;font-weight:500;color:var(--font-color004);}
body[data-weather] .typhoon-rank .txt-rank + .txt01{margin-left:8px;}
body[data-weather] .typhoon-rank td:nth-child(5){border-right:0 none;}
body[data-weather] .typhoon-detail-info{border-collapse:inherit;width:100%;border-top:1px solid var(--font-color003);}
body[data-weather] .typhoon-detail-info th{padding:12px 16px;border-right:1px solid var(--ui-tag005);border-bottom:1px solid var(--ui-tag005);background:var(--ui-tag007);font-size:14px;line-height:21px;font-weight:500;color:var(--font-color003);text-align:center;}
body[data-weather] .typhoon-detail-info td{padding:12px 16px;border-bottom:1px solid var(--ui-tag005);font-size:14px;line-height:21px;color:var(--font-color005);}

@media only screen and (min-width:768px) and (max-width:1023px){
	body[data-weather] .weather-typhoon-info .tit01{font-size:18px;line-height:27px;}
	body[data-weather] .typhoon-detail-info th,
	body[data-weather] .typhoon-detail-info td{font-size:13px;line-height:20px;}
}

@media only screen and (max-width:767px){
	body[data-weather] .weather-typhoon-info .tit01{font-size:18px;line-height:27px;}
	body[data-weather] .typhoon-detail-info th,
	body[data-weather] .typhoon-detail-info td{font-size:13px;line-height:20px;}
}
@media only screen and (max-width:400px){
	body[data-weather] .typhoon-detail-info th,
	body[data-weather] .typhoon-detail-info td{padding:12px 8px;}
}
body[data-weather] .display-none{display:none!important;}
body[data-weather] .display-block{display:block;}

/* 오른쪽 컨텐츠 */
/* 전국날씨 */
body[data-weather] .aside-city-area{border:1px solid var(--ui-tag005);border-radius:2px;}
body[data-weather] .day-tab{display:flex;height:61px;border-bottom:1px solid var(--ui-tag005);}
body[data-weather] .day-tab li{width:100%;}
body[data-weather] .day-tab li a,
body[data-weather] .day-tab li button{display:inline-flex;justify-content:center;flex-direction:column;align-items:center;box-sizing:border-box;width:100%;padding:10px 6px 8px;border:none;background-color:var(--ui-tag000);font-size:14px;line-height:21px;font-weight:600;color:var(--font-color004);}
body[data-weather] .day-tab li a:hover,
body[data-weather] .day-tab li button:hover{text-decoration:none;}
body[data-weather] .day-tab li.day-tab-on{border-bottom:2px solid var(--ui-tag030);}
body[data-weather] .day-tab li.day-tab-on .tit01{font-weight:600;color:var(--font-color005);}
body[data-weather] .day-tab li .txt-date{font-size:11px;line-height:17px;}
body[data-weather] .day-tab li .txt-date.today{padding:2px 4px;border-radius:2px;background-color:var(--ui-tag009);font-weight:700;color:var(--font-color021);}
body[data-weather] .country-map{position:relative;width:100%;height:510px;}
body[data-weather] .city-tab-contents{width:100%;height:510px;background:var(--ui-tag039) url(../image/bg_map01.jpg) no-repeat 50% 50%;}
body[data-weather] .ampm-tab{display:flex;position:absolute;top:16px;right:16px;z-index:1;box-sizing:border-box;}
body[data-weather] .ampm-tab li button{overflow:hidden;display:inline-block;box-sizing:border-box;padding:4px 8px;border:1px solid var(--ui-tag005);border-radius:2px;background-color:var(--ui-tag001);font-size:12px;}
body[data-weather] .ampm-tab li:nth-of-type(1) button{border-right:0;border-radius:2px 0 0 2px;}
body[data-weather] .ampm-tab li:nth-of-type(2) button{border-left:0;border-radius:0 2px 2px 0;}
body[data-weather] .ampm-tab li.day-tab-on button{background-color:var(--ui-tag060);border-color:var(--ui-tag060);color:var(--font-color001);}
body[data-weather] .public-city-list{clear:both;position:relative;width:340px;height:510px;}
body[data-weather] .public-city-list ul li{position:absolute;box-sizing:border-box;width:68px;height:88px;padding:4px 0;border:1px solid var(--ui-tag005);border-radius:6px;background:var(--ui-tag001);text-align:center;}
body[data-weather] .public-city-list ul li.seoul{top:73px;left:28px;}
body[data-weather] .public-city-list ul li.chuncheon{top:29px;left:104px;}
body[data-weather] .public-city-list ul li.gangneung{top:66px;left:180px;}
body[data-weather] .public-city-list ul li.daejeon{top:170px;left:40px;}
body[data-weather] .public-city-list ul li.cheongju{top:158px;left:120px;}
body[data-weather] .public-city-list ul li.daegu{top:190px;left:200px;}
body[data-weather] .public-city-list ul li.gwangju{top:296px;left:16px;}
body[data-weather] .public-city-list ul li.jeonju{top:273px;left:100px;}
body[data-weather] .public-city-list ul li.busan{top:300px;left:184px;}
body[data-weather] .public-city-list ul li.jeju{top:392px;left:62px;}
body[data-weather] .public-city-list ul li.ulleungdokdo{top:94px;left:256px;}
body[data-weather] .city-name{font-size:13px;line-height:18px;font-weight:500;color:var(--font-color003);}
body[data-weather] .city-temperature{font-size:13px;line-height:18px;font-weight:700;letter-spacing:0;}
body[data-weather] .w-time-standard{position:absolute;right:16px;bottom:16px;font-size:13px;line-height:20px;color:var(--font-color006);}

@media only screen and (min-width:768px) and (max-width:1023px){
	body[data-weather] .aside-city-area{height:510px;}
	body[data-weather] .day-tab li a{padding:10px 8px 8px;}
	body[data-weather] .public-city-list{width:344px;margin:0 auto;}
	body[data-weather] .public-city-list ul li.seoul{top:73px;left:32px;}
	body[data-weather] .public-city-list ul li.chuncheon{top:29px;left:108px;}
	body[data-weather] .public-city-list ul li.gangneung{top:66px;left:184px;}
	body[data-weather] .public-city-list ul li.daejeon{top:170px;left:44px;}
	body[data-weather] .public-city-list ul li.cheongju{top:158px;left:124px;}
	body[data-weather] .public-city-list ul li.daegu{top:190px;left:204px;}
	body[data-weather] .public-city-list ul li.gwangju{top:296px;left:20px;}
	body[data-weather] .public-city-list ul li.jeonju{top:273px;left:104px;}
	body[data-weather] .public-city-list ul li.busan{top:300px;left:188px;}
	body[data-weather] .public-city-list ul li.jeju{top:394px;left:68px;}
	body[data-weather] .public-city-list ul li.ulleungdokdo{top:94px;left:260px;}
	body[data-weather] .weather-right-area{margin-top:40px;}
	body[data-weather] .weather-right-area .aside-wrap{padding-left:32px;}
}

@media only screen and (max-width:767px){
	body[data-weather] .aside-city-area{width:100%}
	body[data-weather] .city-tab-contents{background-color:var(--ui-tag038);background-position:50%;}
	body[data-weather] .public-city-list{width:100%;max-width:344px;margin:0 auto;}
	body[data-weather] .public-city-list ul li.seoul{left:50%;margin-left:-142px;}
	body[data-weather] .public-city-list ul li.busan{left:50%;margin-left:14px;}
	body[data-weather] .public-city-list ul li.daegu{left:50%;margin-left:30px;}
	body[data-weather] .public-city-list ul li.gwangju{left:50%;margin-left:-152px;}
	body[data-weather] .public-city-list ul li.daejeon{left:50%;margin-left:-133px;}
	body[data-weather] .public-city-list ul li.chuncheon{left:50%;margin-left:-66px;}
	body[data-weather] .public-city-list ul li.gangneung{left:50%;margin-left:10px;}
	body[data-weather] .public-city-list ul li.cheongju{left:50%;margin-left:-50px;}
	body[data-weather] .public-city-list ul li.jeonju{left:50%;margin-left:-68px;}
	body[data-weather] .public-city-list ul li.ulleungdokdo{left:50%;margin-left:85px;}
	body[data-weather] .public-city-list ul li.jeju{left:50%;margin-left:-108px;}
	body[data-weather] .weather-right-area{margin-top:40px;}
}

@media only screen and (max-width:340px){
	body[data-weather] .public-city-list ul li.gwangju{margin-left:-139px;}
	body[data-weather] .public-city-list ul li.ulleungdokdo{margin-left:72px;}
	body[data-weather] .public-city-list ul li.gangneung{margin-left:0;}
	body[data-weather] .public-city-list ul li.chuncheon{margin-left:-72px;}
}

@media only screen and (max-width:319px){
	body[data-weather] .day-tab li a{padding:8px 2px;}
	body[data-weather] .public-city-list ul li{width:60px;}
	body[data-weather] .public-city-list ul li.seoul{margin-left:-122px;}
	body[data-weather] .public-city-list ul li.chuncheon{margin-left:-61px;}
	body[data-weather] .public-city-list ul li.ulleungdokdo{margin-left:62px;}
	body[data-weather] .public-city-list ul li.daejeon{margin-left:-113px;}
	body[data-weather] .public-city-list ul li.cheongju{margin-left:-40px;}
	body[data-weather] .public-city-list ul li.gwangju{margin-left:-120px;}
	body[data-weather] .public-city-list ul li.jeonju{margin-left:-68px;}
	body[data-weather] .public-city-list ul li.jeonju{margin-left:-47px;}
	body[data-weather] .public-city-list ul li.busan{margin-left:25px;}

}

/* 관심지역 날씨 */
body[data-weather] .mid-weather-box{margin-bottom:12px;}
body[data-weather] .attention-coutry-area{display:flex;position:relative;width:100%;}
body[data-weather] .attention-coutry-area .swiper-area{position:relative;box-sizing:border-box;width:100%;height:40px;padding:5px 0;}
body[data-weather] .attention-coutry-area .location-weather-area{padding-top:10px;}
body[data-weather] .attention-coutry-area .attention-field01{display:inline-flex;width:auto;}
body[data-weather] .attention-coutry-area .attention-field01 .att-btn{box-sizing:border-box;width:auto;padding-right:8px;}
body[data-weather] .attention-coutry-area .attention-field01 .att-btn:last-of-type{padding-right:0;}
body[data-weather] .attention-coutry-area .txt-mes01{padding:5px 8px 5px 26px;border-bottom:0;background:var(--ui-tag019) url(../image/ico_favorite01.svg) 8px 50% no-repeat;font-size:13px;line-height:20px;font-weight:600;color:var(--font-color006);}
body[data-weather] .attention-coutry-area .btn-attention{padding:5px 8px 5px 26px;border-bottom:0;background:var(--ui-tag019) url(../image/ico_favorite02.svg) 8px 7px no-repeat;font-size:13px;line-height:20px;font-weight:600;color:var(--font-color006);}
body[data-weather] .attention-coutry-area .btn-attention.active{background:var(--ui-tag019) url(../image/ico_favorite01.svg) 8px 7px no-repeat;}
/* 관심지역 arrow */
body[data-weather] .attention-coutry-area [class*='btn-dir001']{display:none !important;position:absolute;top:50%;z-index:10;width:26px;height:40px;margin-left:0;border-radius:0;background:var(--ui-tag001);background-position:100% 50%;background-repeat:no-repeat;transform:translateY(-50%) rotate(-180deg);}
body[data-weather] .attention-coutry-area .btn-dir001-next{right:0;}
body[data-weather] .attention-coutry-area .swiper-area [class*='btn-dir001']:after{display:none;}
body[data-weather] .attention-coutry-area [class*='btn-dir001']:before{content:'';display:block;position:absolute;top:50%;right:0;width:18px;height:18px;background:var(--ui-bg021);transform:translateY(-50%) rotate(-180deg);}
/*body[data-weather] .attention-coutry-area [class*='btn-dir001'].swiper-button-disabled:before{filter:var(--ui-filter008);opacity:0.8;}*/
body[data-weather] .attention-coutry-area [class*='btn-dir001'].swiper-button-disabled{display:none;}
body[data-weather] .attention-coutry-area .btn-dir001-prev{left:0;transform:translateY(-50%) rotate(0deg);}
body[data-weather] .btn-attention-move{box-sizing:border-box;min-width:90px;padding:5px 8px;border-radius:2px;background-color:var(--ui-tag030);font-size:13px;line-height:20px;font-weight:600;color:var(--font-color001);}
/* 날씨뉴스 */
body[data-weather] .aside-news{margin-top:40px;}
body[data-weather] .aside-news .title-type001{display:block;width:100%;}
body[data-weather] .aside-news .tit01{width:100%;padding-bottom:12px;font-size:20px;line-height:1.5;font-weight:bold;color:var(--font-color003);}
body[data-weather] .aside-news-list li{margin-top:12px;padding:12px 0 0;border-top:1px solid var(--ui-tag023);}
body[data-weather] .aside-news-list li:first-child{margin-top:0;padding-top:0;border-top:0;}
body[data-weather] .aside-news-list li a{width:100%;}
body[data-weather] .aside-news-list .tit-wrap{margin-bottom:4px;}
body[data-weather] .aside-news-list .tit-news{overflow:hidden;display:-webkit-box;font-size:16px;font-weight:500;color:var(--font-color003);-webkit-line-clamp:2;-webkit-box-orient:vertical;}
body[data-weather] .aside-news-list .tit-news+span{display:block;font-size:14px;color:var(--font-color004);}
body[data-weather] .aside-news-list .txt-time{font-size:13px;line-height:1.5;color:var(--font-color004);}
/* 일반형/대형 프레임 : 1025px 이상 */
@media only screen and (min-width:1024px){
	body[data-weather] .aside-news-list .tit-news:hover{text-underline-position:under;text-decoration-thickness:1px;text-decoration-line:underline;text-decoration-color:currentColor;}
	body[data-weather] .aside-news-list [class*='item-box'] a .tit-news:hover,
	body[data-weather] .weather-video-list [class*='item-box'] a .tit-news:hover{opacity:0.5;}
}
@media only screen and (min-width:768px) and (max-width:1023px){
	body[data-weather] .aside-news{margin-top:0;}
	body[data-weather] .aside-news .tit01{font-size:18px;line-height:27px;}
}

/* 날씨영상 */
body[data-weather] .aside-video{margin-top:40px;}
body[data-weather] .aside-video .title-type001{display:block;width:100%;}
body[data-weather] .aside-video .tit01{width:100%;padding-bottom:12px;font-size:20px;line-height:30px;font-weight:700;color:var(--font-color003);}
body[data-weather] .aside-video ul{overflow:hidden;display:flex;justify-content:flex-start;align-items:flex-start;gap:20px 12px;flex-wrap:wrap;}
body[data-weather] .aside-video ul li{box-sizing:border-box;width:calc((100% - 12px) / 2);}
body[data-weather] .aside-video .item-box01{overflow:hidden;display:flex;position:relative;}
body[data-weather] .aside-video .item-box01 a{display:block;}
body[data-weather] .aside-video .item-box01 .img-con01{position:relative;box-sizing:border-box;min-width:50px;}
body[data-weather] .aside-video .item-box01 .img-con01 .img{display:flex;justify-content:center;align-items:center;position:relative;width:100%;padding-top:66.67%;}
body[data-weather] .aside-video .item-box01 .img-con01 .img:before{content:'';display:block;position:absolute;top:0;left:0;z-index:2;box-sizing:border-box;width:100%;height:100%;border:1px solid rgba(0, 0, 0, .04);}
body[data-weather] .aside-video .item-box01 .img-con01 .img img{position:absolute;top:0;left:50%;z-index:1;width:100%;height:100%;transform:translateX(-50%);object-position:center top;object-fit:cover;}
body[data-weather] .aside-video .item-box01 .news-con{box-sizing:border-box;width:100%;margin-top:4px;}
body[data-weather] .aside-video .tit-news{overflow:hidden;display:-webkit-box;font-size:15px;font-weight:500;color:var(--font-color003);-webkit-line-clamp:2;-webkit-box-orient:vertical;}
body[data-weather] .aside-video .tit-news:hover{text-underline-position:under;text-decoration-thickness:1px;text-decoration-line:underline;text-decoration-color:currentColor;}
body[data-weather] .aside-video .txt-time{display:block;margin-top:4px;font-size:14px;line-height:21px;color:var(--font-color004);}

@media only screen and (max-width:767px){
	body[data-weather] .aside-video .tit-news{-webkit-line-clamp:3;}
}


/* chart그래프 */
[class*='wstate0'] .circle-chart-bg{stroke:var(--ui-tag005);}
.wstate01 .circle-chart-circle{stroke:var(--ui-tag086);} /*좋음 wstate01*/
.wstate02 .circle-chart-circle{stroke:var(--ui-tag087);} /*보통 wstate02*/
.wstate03 .circle-chart-circle{stroke:var(--ui-tag088);} /*나쁨 wstate03*/
.wstate04 .circle-chart-circle{stroke:var(--ui-tag089);} /*매우나쁨(권고조치) wstate04*/
.wstate05 .circle-chart-circle{stroke:var(--ui-tag090);} /*위험 wstate05*/
.circle-chart-circle {transform: rotate(-90deg);transform-origin: center;
  animation: circle-chart-fill 2s reverse; /* 1 */
}
@keyframes circle-chart-fill {
  to { stroke-dasharray: 0 100; }
}
@keyframes circle-chart-appear {
  to {opacity: 1;transform: translateY(0);}
}





