@import url(font.css); .clear { clear:both; } .clearfix:after { clear:both; display: table; content: " ";} .ellipsis { text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal !important; display: block; } .show { display:block !important; } .hide { display:none !important; } #weather h3 {width:25% !important; } #weather h3.tab3 a { border-right:1px solid #c7e5ff; } /*메인페이지*/ #intro_left { } .main-img { position:relative; z-index:-1; } .main-text { position:absolute; bottom:0px; left:0px;z-index:200; } #intro_left .air-info {border:1px solid #c7e5ff; margin-top:5px; height:180px; box-sizing:border-box; } #intro_left .air-info h3 {text-align:center; background:#f4f9ff; text-align:center; font-family:'NanumGothicWeb'; font-size:18px; color:#3466a3; height:35px; padding-top:5px; letter-spacing:-1px; } #intro_left .air-info .text-wrap { padding:6px 10px; } #intro_left .air-info .location {padding-left:15px; font-weight:bold; background:url(../images/main/5_icon.png) no-repeat left 4px; font-size:14px; color:#222; margin-bottom:5px; } #intro_left .air-info dl {margin-bottom:5px; } #intro_left .air-info dl dt { margin-bottom:1px; background:url(../images/main/bit.png) no-repeat left 8px; font-weight:bold; font-size:12px; color:#575757; padding-left:8px; } #intro_left .air-info dl dd {height:20px; width:100%; position:relative; background:url(../images/main/5_data_bar.png) no-repeat left 9px; } #intro_left .air-info dl dd span { position:absolute; top:0px; display:inline-block; width:50px; height:20px; text-align:center; letter-spacing:-1px; font-size:11px; line-height:20px; } #intro_left .air-info dl dd span.air00 {left:50%; margin-left:-40px; background:url(../images/main/checking.png) no-repeat left top; width:80px; text-indent:-99999px; } #intro_left .air-info dl dd span.air01 {left:2px; background:url(../images/main/5_data_bg01.png) no-repeat left top; } #intro_left .air-info dl dd span.air02 {left:27%; background:url(../images/main/5_data_bg02.png) no-repeat left top; } #intro_left .air-info dl dd span.air03 {left:52%; background:url(../images/main/5_data_bg03.png) no-repeat left top; } #intro_left .air-info dl dd span.air04 {right:0px; background:url(../images/main/5_data_bg04.png) no-repeat left top; width:70px; } #intro_left .air-info .from { font-size:12px; color:#8e8e8e; vertical-align:bottom; } #intro_left .air-info .from a { margin-left:3px;float:right; } #notice { border:1px solid #c7e5ff; background:#f4f9ff; margin-top:10px; margin-bottom:10px; } #intro_left .air-info *, #intro_left .campaign * { box-sizing:border-box; } .campaign { width:238px; height:239px; border:1px solid #c7e5ff; } .campaign h3 { height:50px;font-family:'NanumGothicWeb';letter-spacing:-1.2px; text-align:center; padding-top:10px; background: #f4f9ff; font-size:18px; color:#222; } .campaign h3 strong {color:#ff5b0f; } .campaign .img {text-align:center; } .campaign .down-btn { text-align:center; } .campaign .down-btn a { display:block; float:left; width:50%;padding-left:20px;padding-top:10px; font-family:'NanumGothicWeb'; font-size:12px; color:#575757; background:url(../images/main/3_main_campaign_down.png) no-repeat 12px 10px; } .campaign .down-btn2 a {display:block; float:left; width:100%; padding-left:30px;padding-top:10px; font-family:'NanumGothicWeb'; font-size:12px; color:#575757; background:url(../images/main/3_main_campaign_down.png) no-repeat 12px 10px; } .campaign .down-btn a:hover , .campaign .down-btn2 a:hover { color:#3466a3; } #intro_right { height:auto; margin-bottom:0px; padding-bottom:0px; } #intro_right .one-click-link * , #intro_right .public-officer *, #intro_right .public-officer2 * { box-sizing:border-box; } #intro_right .one-click-link { box-sizing:border-box; border:1px solid #c7e5ff; background:#e4f0ff; width:100%; font-family:'NanumGothicWeb'; margin-bottom:10px; } #intro_right .one-click-link h3 { font-size:18px; color:#3466a3; margin-bottom:10px; text-align:center; letter-spacing:-1px; } #intro_right .one-click-link h3 a { color:#3466a3; } #intro_right .one-click-link .top-part { height:170px; border-bottom:1px dashed #c0d1e5; } #intro_right .one-click-link .top-part { display:block; width:100%; padding-left:16px; padding-right:16px; height:181px; padding-top:75px; background:url(../images/main/4_main_icon01.png) no-repeat center 10px; } #intro_right .one-click-link .top-part h3 { margin-bottom:5px; } #intro_right .one-click-link .top-part p { text-align:center; font-size:12px; color:#575757;margin-bottom:5px; letter-spacing:-1px; } #intro_right .one-click-link .top-part ul { } #intro_right .one-click-link .top-part ul li { padding-left:8px; letter-spacing:-0.5px; font-size:12px; margin-bottom:3px; color:#3466a3; background:url(../images/main/bit.png) no-repeat left 8px; } #intro_right .one-click-link .top-part ul li a { color:#575757;} #intro_right .one-click-link .top-part ul li a:hover {text-decoration:underline; color:#3466a3; font-weight:bold; } #intro_right .one-click-link .top-part:hover{ background:url(../images/main/4_main_icon01_h.png) no-repeat center 10px #c8e1ff; } #intro_right .one-click-link .middle-part { width:100%; height:164px; padding-left:5px; padding-right:5px; border-bottom:1px dashed #c0d1e5; } #intro_right .one-click-link .middle-part:hover { background:#c8e1ff; } #intro_right .one-click-link .middle-part h3 { padding-top:20px; margin-bottom:5px; } #intro_right .one-click-link .middle-part ul li { width:50%;float:left; text-align:center; line-height:1.2; } #intro_right .one-click-link .middle-part ul li a { display:block; width:100%; padding-top:70px; font-size:12px; color:#575757; } #intro_right .one-click-link .middle-part ul li a:hover {color:#3466a3; text-decoration:underline; } #intro_right .one-click-link .middle-part ul li.list01 a {background:url(../images/main/4_main_icon02.png) no-repeat center top; } #intro_right .one-click-link .middle-part ul li.list02 a {background:url(../images/main/4_main_icon03.png) no-repeat center top; } #intro_right .one-click-link .middle-part ul li.list01 a:hover {background:url(../images/main/4_main_icon02_h.png) no-repeat center top; font-weight:bold;} #intro_right .one-click-link .middle-part ul li.list02 a:hover {background:url(../images/main/4_main_icon03_h.png) no-repeat center top; font-weight:bold;} #intro_right .one-click-link .bottom-part { width:100%; height:164px; padding-left:5px; padding-right:5px; } #intro_right .one-click-link .bottom-part:hover { background:#c8e1ff; } #intro_right .one-click-link .bottom-part h3 { padding-top:20px; margin-bottom:5px; } #intro_right .one-click-link .bottom-part ul li { width:50%;float:left; text-align:center; line-height:1.2; } #intro_right .one-click-link .bottom-part ul li a { display:block; width:100%; padding-top:67px; font-size:12px; color:#575757; } #intro_right .one-click-link .bottom-part ul li a:hover {color:#3466a3; text-decoration:underline; } #intro_right .one-click-link .bottom-part ul li.list01 a {background:url(../images/main/4_main_icon05.png) no-repeat center top; } #intro_right .one-click-link .bottom-part ul li.list02 a {background:url(../images/main/4_main_icon04n.png) no-repeat center top; } #intro_right .one-click-link .bottom-part ul li.list01 a:hover {background:url(../images/main/4_main_icon05_h.png) no-repeat center top; font-weight:bold;} #intro_right .one-click-link .bottom-part ul li.list02 a:hover {background:url(../images/main/4_main_icon04n_h.png) no-repeat center top; font-weight:bold;} .public-officer { width:162px; height:80px; background:url(../images/main/1_main_bg.jpg) no-repeat left top; margin-bottom:10px; box-sizing:border-box; } .public-officer h3 { padding-top:18px; padding-left:9px; height: 45px; } .public-officer ul li { float:left; width:50%; } .public-officer ul li a { float:left;display:block; width:100%; height:35px; text-align:center; padding-top:10px; font-family:'NanumGothicWeb'; font-size:12px; color:#575757; } .public-officer ul li a:hover {color:#3466a3; font-weight:bold;} .complaint-banner { margin-bottom:10px; } .public-officer2 { width:162px; height:80px; background:url(../images/main/1_main_bg.jpg) no-repeat left top; margin-bottom:10px; box-sizing:border-box; } .public-officer2 h3 { padding-top:18px; padding-left:9px; height: 45px; } .public-officer2 ul li { float:left; width:50%; } .public-officer2 ul li a { float:left;display:block; width:100%; height:35px; text-align:center; padding-top:10px; font-family:'NanumGothicWeb'; font-size:12px; color:#575757; } .public-officer2 ul li a:hover {color:#3466a3; font-weight:bold;} #intro_right .sns-link { margin-bottom:10px; } #intro_right .r-service { padding-top:0px; margin-bottom:25px; height:auto; } #intro_right .r-service h3 , #intro_right .related h3 { padding-bottom:5px; } #intro_right .r-service ul li a { margin-bottom:2px;float:none; } #intro_right .related { padding-top:0px; } /*메인 기상특보 부분*/ #weather h3.tab2 img {margin-top:-2px; display:inline-block; } #weather .weather-special { box-sizing:border-box; padding-left:15px; padding-right:15px; position: absolute; top: 63px; left: 1px; width: 238px; height: 242px;} #weather .relative { position: absolute; ; top: 65px; left: 1px;} #weather .iframe-main { box-sizing:border-box; overflow:hidden; width:236px; margin-left:0px; height:256px; margin-top:-14px; } #weather .iframe-main .img { position:absolute; box-sizing:border-box; padding-top:5px; height:44px; bottom:-11px; background:#f2f9ff; width:237px; padding-left:20px; left:0px; } #weather .iframe-main .img img { width:180px; } #weather .more { position:absolute; top:-10px; right:0px; } #weather .iframe-main .date { margin-bottom:5px; overflow:hidden; width:218px; height:22px; } #weather .iframe-main .contents { overflow:hidden; width:218px; height:200px; } #weather .iframe-main iframe.contents-iframe { margin-left:-388px; margin-top:-309px; } #weather .iframe-main iframe.date-iframe { margin-left:-452px; margin-top:-177px; } /*#weather .iframe-main iframe { margin-left:-405px; margin-top:-260px; }*/ #weather .weather-special * { box-sizing:border-box; } #weather .weather-special h4 { font-family:'NanumGothicWeb'; background:url(../images/main/bit.png) no-repeat left 8px; font-size:12px;padding-left:8px; color:#3466a3;margin-bottom:5px; } #weather .weather-special .more-btn { position:absolute; top:0px; right:15px; } #weather .weather-special .svg-img { margin-bottom:8px; } #weather .weather-special .bottom-text { font-family:'NanumGothicWeb'; } #weather .weather-special .bottom-text .info {margin-left:-15px; margin-bottom:8px; } #weather .weather-special .bottom-text .info li { float:left; margin-left:15px; font-size:12px; color:#000; font-weight:bold; } #weather .weather-special .bottom-text .info li span { width:8px; height:8px; display:inline-block;margin-right:2px; } #weather .weather-special .bottom-text .info li span.kuncolor01 { background:#00f000;} #weather .weather-special .bottom-text .info li span.kuncolor02 { background:#00ffff;} #weather .weather-special .bottom-text .info li span.kuncolor03 { background:#0000ff;} #weather .weather-special .bottom-text .info li span.kuncolor04 { background:#ff00ff;} #weather .weather-special .bottom-text .info li span.kuncolor05 { background:#ff7f00;} #weather .weather-special .bottom-text .info li span.kuncolor06 { background:#c3c091;} #weather .weather-special .bottom-text .info li span.kuncolor07 { background:#007fff;} #weather .weather-special .bottom-text .info li span.kuncolor08 { background:#ff0000;} #weather .weather-special .bottom-text .info li span.kuncolor09 { background:#ffff00;} #weather .weather-special .bottom-text .info li span.kuncolor10 { background:#c300c3;} #weather .radar { box-sizing:border-box; padding-left:15px; padding-right:15px; position: absolute; top: 63px; left: 1px; width: 238px; height: 242px; background:red; } /*기상상황*/ /*pattern*/ .location01 path{ } /*남쪽 먼바다*/ .location02 path{ } /*동쪽 먼바다*/ .location03 path{ } /*서쪽 먼바다*/ .location04 path{ } /*서쪽 젤끝 먼바다*/ .location05 path{ } /*북쪽 바다*/ .location06 path{ } /*서쪽 바다*/ .location07 path{ } /*북쪽 바다*/ .location08 path{ } /*동쪽 바다*/ .location09 path{ } /*서귀포*/ .location10 path{ } /*동부*/ .location11 path{ } /*서부*/ .location12 path{ } /*제주시*/ .location13 path{ } /*한라산*/ .location14 path{ } /*제주도 전체*/ .location15 path{ } /*추자도*/ .kuncolor01 path{ fill:#00f000;} .kuncolor02 path{ fill:#00ffff;} .kuncolor03 path{ fill:#0000ff;} .kuncolor04 path{ fill:#ff00ff;} .kuncolor05 path{ fill:#ff7f00;} .kuncolor06 path{ fill:#c3c091;} .kuncolor07 path{ fill:#007fff;} .kuncolor08 path{ fill:#ff0000;} .kuncolor09 path{ fill:#ffff00;} .kuncolor10 path{ fill:#c300c3;}