@charset "utf-8";

#wrap.main{background:none}

/*비주얼영역*/
.mvisual_wrap{position:relative;background:url(/images/safe/main/mvisual_bg.jpg) no-repeat 50% 0;}
.mvisual_wrap .mvisual{overflow:hidden;width:1000px;height:428px;margin:3px auto 0;}
.mvisual .tit{position:absolute;top:257px;z-index:10}
.mvisual .tit a{display:block;width:210px;padding:17px 0 0 25px;background:url(/images/safe/main/tit_bg.png) no-repeat;color:#fff;font-size:2.625em;line-height:1;}
.mvisual .tit a .more{text-decoration:underline;font-size:0.595em;}


.mvisual .maps{position:absolute;top:50px;left:50%;width:560px;height:356px;margin-left:-410px;background:url(/images/safe/main/map_img.png) no-repeat;}

.mvisual .maps li{position:absolute;padding-left:5px;color:#000;background:url(/images/safe/main/drops_img.png) no-repeat 2px 17px;text-align:center;line-height:0.7}
.mvisual .maps .seo{top:37px;left:99px;padding-left:10px}
.mvisual .maps .biin{top:75px;left:175px}
.mvisual .maps .pangyo{top:58px;left:265px}
.mvisual .maps .munsan{top:65px;left:350px}
.mvisual .maps .masan{top:105px;left:415px}
.mvisual .maps .jongcheon{top:130px;left:240px}
.mvisual .maps .seocheon{top:180px;left:295px}
.mvisual .maps .seocho{top:144px;left:355px}
.mvisual .maps .maseo{top:242px;left:280px}
.mvisual .maps .gisan{top:192px;left:379px}
.mvisual .maps .hansan{top:170px;left:461px}
.mvisual .maps .jangnhang{top:292px;left:282px}
.mvisual .maps .hwayang{top:245px;left:410px}

.mvisual .maps li span{display:block;}

/*강우량정 보*/




.mvisual_wrap .rain_info{position:absolute;top:0;right:50%;width:288px;margin-right:-500px;padding-top:40px;color:#fff;background:#1173ab}
.mvisual_wrap .rain_info:before{position:absolute;display:block;content:"";top:54px;left:-18px;border-right:20px solid #1173ab;border-top:20px solid transparent;border-bottom:20px solid transparent;}

.rain_info .cap{position:absolute;top:12px;right:17px;color:#a0c7dd}
.rain_info h3{float:left;height:61;padding-left:11px;font-size:3em;letter-spacing:-5px;line-height:55px;}

.rain_info ul{overflow:hidden;} 
.rain_info ul:after{content:"";display:block;clear:both}

.rain_info .day{float:right;overflow:hidden;padding-right:12px;}
.rain_info .day li{float:left;width:62px;height:61px;line-height:72px;text-align:center;}
.rain_info .day li.last{background:url(/images/safe/main/day_last.gif) no-repeat}

.rain_info .rain_data{width:100%}
.rain_info .rain_data > li{padding-left:20px;border-top:1px dashed #1a6f9e;background:#1f82ba;}
.rain_info .rain_data > li:first-child{border-top-width:0;background:#2192b9;}
.rain_info .rain_data li ul li{float:left;width:62px;height:65px;line-height:65px;text-align:center;background:url(/images/safe/main/data_bg.png) no-repeat 50% 50%;}
.rain_info .rain_data li ul li.last{background:#1797df url(/images/safe/main/data_bg.png) no-repeat 50% 50%}
.rain_info .rain_data [class^="town"]{height:50px;margin-right:8px;padding-top:15px;}
.rain_info .rain_data .average{height:50px;margin-right:8px;padding-top:15px;background:url(/images/safe/main/average.png) no-repeat 50% 10px}
.rain_info .rain_data .town1{background:url(/images/safe/main/town_img1.png) no-repeat 50% 3px}
.rain_info .rain_data .town2{background:url(/images/safe/main/town_img2.png) no-repeat 50% 3px}
.rain_info .rain_data .town3{background:url(/images/safe/main/town_img3.png) no-repeat 50% 3px}
.rain_info .rain_data .town4{background:url(/images/safe/main/town_img4.png) no-repeat 50% 3px}
.rain_info .rain_data .town5{background:url(/images/safe/main/town_img5.png) no-repeat 50% 3px}
.rain_info .rain_data .town6{background:url(/images/safe/main/town_img6.png) no-repeat 50% 3px}
.rain_info .rain_data .town7{background:url(/images/safe/main/town_img7.png) no-repeat 50% 3px}
.rain_info .rain_data .town8{background:url(/images/safe/main/town_img8.png) no-repeat 50% 3px}
.rain_info .rain_data .town9{background:url(/images/safe/main/town_img9.png) no-repeat 50% 3px}
.rain_info .rain_data .town10{background:url(/images/safe/main/town_img10.png) no-repeat 50% 3px}
.rain_info .rain_data .town11{background:url(/images/safe/main/town_img11.png) no-repeat 50% 3px}
.rain_info .rain_data .town12{background:url(/images/safe/main/town_img12.png) no-repeat 50% 3px}
.rain_info .rain_data .town13{background:url(/images/safe/main/town_img13.png) no-repeat 50% 3px}



/*컨텐츠영역*/
.mcon_left{float:left;margin-right:30px}
.mcon_right{float:left}
.mcon1 h3,.mcon3 h3,.mcon4 h3{margin-bottom:19px;font-size:1.5em;}


/*공지사항*/
.mcon1{position:relative;width:345px;height:255px;margin-bottom:39px}
.mcon1 ul{padding-bottom:15px;border:1px solid #acacac}
.mcon1 ul li{margin-bottom:5px;padding:0 20px 0 35px;background:url(/images/safe/main/notice_bul.gif) no-repeat 22px 43%}
.mcon1 ul li a{float:left;display:block;width:65%;margin-right:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;color:#000}
.mcon1 ul li span{display:block;float:right;color:#000}

.mcon1 .more{position:absolute;top:7px;right:5px}
.mcon1 .more a{display:block;padding-right:15px;background:url(/images/safe/main/notice_more.gif) no-repeat 100% 38%}

.mcon1 ul li:first-child{margin-bottom:22px;padding:20px;border-bottom:1px solid #acacac;background:none}
.mcon1 ul li:first-child a{display:inline-block;width:auto;padding-right:30px;font-weight:700;background:url(/images/safe/main/notice_new.gif) no-repeat 100% 0%}
.mcon1 ul li:first-child span{width:100%;display:block;}
.mcon1 ul li:first-child .txt{width:90%;margin-top:5px;font-size:0.9em;}


/*위성영상*/
.mcon2{position:relative;width:345px;height:231px;background:#eee;border:1px solid #acacac}
.mcon2 h3{position:absolute;top:0;}
.mcon2 h3.tab1{left:0;width:122px;}
.mcon2 h3.tab2{left:122px;width:102px;}
.mcon2 h3.tab3{left:224px;width:70px;}

.mcon2 h3 a{display:block;height:58px;line-height:60px;text-align:center;}
.mcon2 h3 a.on,
.mcon2 h3 a:hover{background:#f4911e;color:#fff}

.mcon2 h3 a.on:after,
.mcon2 h3 a:hover:after{position:absolute;display:block;content:"";top:58px;left:51px;border-top:10px solid #f4911e;border-left:10px solid transparent;border-right:10px solid transparent;z-index:10}
.mcon2 .tab2 a.on:after,
.mcon2 .tab2 a:hover:after{left:41px}
.mcon2 .tab3 a.on:after,
.mcon2 .tab3 a:hover:after{left:26px}

.mcon2 .grap{position:absolute;top:58px;left:0;border-top:1px solid #ddd;}

.mcon2 .grap .more1{position:absolute;top:-45px;left:304px;}
.mcon2 .grap .more1 a{display:block;width:15px;height:29px;background:url(/images/safe/main/satle_more.gif) no-repeat;border:1px solid #acacac}


/*재난안전소식*/
.mcon3{position:relative;overflow:hidden;width:314px;height:255px;margin-bottom:39px}
.mcon3 h3 span{color:#f4911e;}
.mcon3 .obj{position:absolute;top:46px;left:0;width:312px;height:207px;border:1px solid #dcdcdc}
.mcon3 .obj li{position:absolute;top:0;left:0}
.mcon3 .obj li a{display:block;width:312px;height:207px}
.mcon3 .obj li a img{max-width:none;}

.mcon3 .pnote{position:absolute;top:9px;right:14px;width:50px}
.mcon3 .pnote a{float:left;display:block;width:11px;height:11px;margin-left:5px;background:url(/images/safe/main/pop_btn.gif) no-repeat;font-size:0}
.mcon3 .pnote a.ov{background:url(/images/safe/main/pop_btn_ov.gif) no-repeat}

.mcon3 .control{overflow:hidden;position:absolute;top:7px;right:0px;width:15px;height:17px}
.mcon3 .control:after{content:"";display:block;clear:both}
.mcon3 .control a{position:absolute;float:left;display:block;top:0;right:0;width:11px;height:15px;font-size:0}
.mcon3 .control a[rel="stop"]{background:url(/images/safe/main/pop_stop.gif) no-repeat 50% 50%}
.mcon3 .control a[rel="play"]{background:url(/images/safe/main/pop_play.gif) no-repeat 50% 50%}


/*자주찾는정보*/
.mcon4{width:314px;height:233px}
.mcon4 ul{overflow:hidden}
.mcon4 ul:after{content:"";display:block;clear:both}
.mcon4 ul li{float:left}
.mcon4 ul .btn1{background:url(/images/safe/main/mcon4_bg1.gif) no-repeat}
.mcon4 ul .btn2{background:url(/images/safe/main/mcon4_bg2.gif) no-repeat}
.mcon4 ul .btn3{background:url(/images/safe/main/mcon4_bg3.gif) no-repeat}
.mcon4 ul .btn4{background:url(/images/safe/main/mcon4_bg4.gif) no-repeat}
.mcon4 ul li a{display:block;width:156px;height:41px;padding-top:75px;text-align:center;color:#fff}
.mcon4 ul .btn1 a{background:url(/images/safe/main/mcon4_btn1.png) no-repeat 50% 22px}
.mcon4 ul .btn2 a{background:url(/images/safe/main/mcon4_btn2.png) no-repeat 50% 19px}
.mcon4 ul .btn3 a{background:url(/images/safe/main/mcon4_btn3.png) no-repeat 50% 21px}
.mcon4 ul .btn4 a{background:url(/images/safe/main/mcon4_btn4.png) no-repeat 50% 22px}


/*배너모음*/
.main #bannerWrap{background:#f3eee8}
#banner{width:980px}
#banner h3{float:left;width:70px;color:#54341c}
#banner .control{top:23px;left:73px;width:70px}
#banner .control a{display:block;float:left;width:22px;height:22px}
#banner .control .prev, #banner .control .next, #banner .more a{border:none}
#banner .control a[rel="prev"]{background:url(/images/safe/main/banner_up.gif) no-repeat 50% 50%}
#banner .control a[rel="next"]{background:url(/images/safe/main/banner_down.gif) no-repeat 50% 50%}
#banner .control a[rel="stop"]{background:url(/images/safe/main/banner_stop.gif) no-repeat 50% 50%;font-size:0}
#banner .control a[rel="play"]{background:url(/images/safe/main/banner_play.gif) no-repeat 50% 50%;font-size:0}
#banner .grap{float:left;width:840px;margin:5px 0 0 90px}
#banner .grap .obj li{position:relative}
#banner .grap .obj li:after{position:absolute;display:block;content:"";top:5px;left:0;height:14px;border-left:1px solid #e1dedc}
