@charset "euc-kr";

body,div,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,blo,ckquote,button { margin:0; padding:0; }
body,input,textarea,select,table,button { color:#444; font-family:Verdana, Geneva, Arial, sans-serif; font-size:75%; font-weight:normal; }
table { border-collapse:collapse; border-spacing:0; }
img,fieldset { border:0; }
img,input,select,textarea { vertical-align:top; }
address,caption,cite,code,dfn,em,strong,th,var { font-style:normal; font-weight:normal; }
strong { font-weight:bold; }
ol,ul { list-style:none; }
caption,th { text-align:right; }
h1,h2,h3,h4,h5,h6 { font-size:100%; }
abbr,acronym { border:0; }
pre {overflow-x:hidden;overflow-y:hidden;font-size:1.1em;word-wrap:break-word;white-space:pre-wrap;}

.ml3 { margin-left:3px; }
.ml5 { margin-left:5px; }
.ml10 { margin-left:10px; }
.ml20 { margin-left:20px; }
.mt3 { margin-top:3px; }
.mt5 { margin-top:5px; }
.mt10 { margin-top:10px; }
.mt20 { margin-top:20px; }
.mr3 { margin-right:3px; }
.mr5 { margin-right:5px; }
.mr10 { margin-right:10px; }
.mr20 { margin-right:20px; }
.mb3 { margin-bottom:3px; }
.mb5 { margin-bottom:5px; }
.mb10 { margin-bottom:10px; }
.mb20 { margin-bottom:20px; }
.mbm10 { margin-bottom:-10px; }

.pl3 { padding-left:3px; }
.pl5 { padding-left:5px; }
.pl10 { padding-left:10px; }
.pl15 { padding-left:15px; }
.pl20 { padding-left:20px; }
.pl25 { padding-left:25px; }
.pt3 { padding-top:3px; }
.pt5 { padding-top:5px; }
.pt10 { padding-top:10px; }
.pt15 { padding-top:15px; }
.pt20 { padding-top:20px; }
.pt25 { padding-top:25px; }
.pr3 { padding-right:3px; }
.pr5 { padding-right:5px; }
.pr10 { padding-right:10px; }
.pr15 { padding-right:15px; }
.pr20 { padding-right:20px; }
.pr25 { padding-right:25px; }
.pb3 { padding-bottom:3px; }
.pb5 { padding-bottom:5px; }
.pb10 { padding-bottom:10px; }
.pb15 { padding-bottom:15px; }
.pb20 { padding-bottom:20px; }
.pb25 { padding-bottom:25px; }

.pt5p { padding-top:5%; }
.pt10p { padding-top:10%; }
.pt20p { padding-top:20%; }
.pt25p { padding-top:25%; }

body {  }

#ocean_wrap { width:720px; padding:5px; font-size:12px; }
div.ocean_head { font-size:24px; font-weight:bold; width:100%; text-align:center; padding-top:10px; height:50px; background-image:url(./images/tt_bg.jpg); background-repeat:no-repeat; }

div.ocean_wrn { float:left; width:800px; }
table.pwrn { border-collapse:collapse; border:0px; width:800px; font-size:1em; font-weight:normal; table-layout:fixed; }
table.pwrn th { border:2px solid #6081e0; text-align:left; font-size:1.2em; font-weight:bold; height:25px; background-color:#6081e0; color:#ffffff; }
table.pwrn td { border:2px solid #6081e0; text-align:left; font-size:0.9em; font-weight:normal; line-height:160%; word-break:break-all; }

#ocean { float:left; width:100%; }

div.ocean_tt { float:left; background-image:url(./images/icon_1.jpg); background-repeat:no-repeat; padding-left:20px; font-size:12px; font-weight:bold; margin-bottom:5px; }
div.ocean_tt span { font-weight:normal; }

#ocean_map { position:relative; float:left; width:100%; height:370px; background-image:url(./images/ocean_map.jpg); background-repeat:no-repeat; margin-bottom:10px; }
#tx1 { position:absolute; top:295px; left:2px; width:80px; height:15px; border:1px solid #aaa; background-color:#fff; color:#000; font-size:11px; font-weight:normal; text-align:left; }
#tx2 { position:absolute; top:315px; left:2px; width:135px; height:15px; border:1px solid #aaa; background-color:#b0ffaa; color:#000; font-size:11px; font-weight:normal; text-align:left; }
#tx3 { position:absolute; top:335px; left:2px; width:135px; height:15px; border:1px solid #aaa; background-color:#ffbbaa; color:#000; font-size:11px; font-weight:normal; text-align:left; }

#ss155 { position:absolute; top:17px; left:97px; width:45px; height:15px; border:1px solid #aaa; background-color:#b0ffaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss156 { position:absolute; top:17px; left:190px; width:45px; height:15px; border:1px solid #aaa; background-color:#b0ffaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss157 { position:absolute; top:17px; left:283px; width:45px; height:15px; border:1px solid #aaa; background-color:#b0ffaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss158 { position:absolute; top:17px; left:376px; width:45px; height:15px; border:1px solid #aaa; background-color:#b0ffaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss159 { position:absolute; top:17px; left:469px; width:45px; height:15px; border:1px solid #aaa; background-color:#b0ffaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss160 { position:absolute; top:17px; left:562px; width:45px; height:15px; border:1px solid #aaa; background-color:#b0ffaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss161 { position:absolute; top:17px; left:655px; width:45px; height:15px; border:1px solid #aaa; background-color:#b0ffaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }

#ss162 { position:absolute; top:131px; left:97px; width:45px; height:15px; border:1px solid #aaa; background-color:#b0ffaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss163 { position:absolute; top:131px; left:190px; width:45px; height:15px; border:1px solid #aaa; background-color:#b0ffaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss164 { position:absolute; top:131px; left:283px; width:45px; height:15px; border:1px solid #aaa; background-color:#b0ffaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss165 { position:absolute; top:131px; left:376px; width:45px; height:15px; border:1px solid #aaa; background-color:#b0ffaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss166 { position:absolute; top:131px; left:469px; width:45px; height:15px; border:1px solid #aaa; background-color:#b0ffaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss167 { position:absolute; top:131px; left:562px; width:45px; height:15px; border:1px solid #aaa; background-color:#b0ffaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss168 { position:absolute; top:131px; left:655px; width:45px; height:15px; border:1px solid #aaa; background-color:#b0ffaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }

#ss169 { position:absolute; top:319px; left:190px; width:45px; height:15px; border:1px solid #aaa; background-color:#b0ffaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss170 { position:absolute; top:319px; left:283px; width:45px; height:15px; border:1px solid #aaa; background-color:#b0ffaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss171 { position:absolute; top:319px; left:376px; width:45px; height:15px; border:1px solid #aaa; background-color:#b0ffaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss172 { position:absolute; top:319px; left:469px; width:45px; height:15px; border:1px solid #aaa; background-color:#b0ffaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss173 { position:absolute; top:319px; left:562px; width:45px; height:15px; border:1px solid #aaa; background-color:#b0ffaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss174 { position:absolute; top:319px; left:655px; width:45px; height:15px; border:1px solid #aaa; background-color:#b0ffaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }

#ss555 { position:absolute; top:36px; left:97px; width:45px; height:15px; border:1px solid #aaa; background-color:#ffbbaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss556 { position:absolute; top:36px; left:190px; width:45px; height:15px; border:1px solid #aaa; background-color:#ffbbaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss557 { position:absolute; top:36px; left:283px; width:45px; height:15px; border:1px solid #aaa; background-color:#ffbbaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss558 { position:absolute; top:36px; left:376px; width:45px; height:15px; border:1px solid #aaa; background-color:#ffbbaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss559 { position:absolute; top:36px; left:469px; width:45px; height:15px; border:1px solid #aaa; background-color:#ffbbaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss560 { position:absolute; top:36px; left:562px; width:45px; height:15px; border:1px solid #aaa; background-color:#ffbbaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss561 { position:absolute; top:36px; left:655px; width:45px; height:15px; border:1px solid #aaa; background-color:#ffbbaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }

#ss562 { position:absolute; top:150px; left:97px; width:45px; height:15px; border:1px solid #aaa; background-color:#ffbbaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss563 { position:absolute; top:150px; left:190px; width:45px; height:15px; border:1px solid #aaa; background-color:#ffbbaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss564 { position:absolute; top:150px; left:283px; width:45px; height:15px; border:1px solid #aaa; background-color:#ffbbaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss565 { position:absolute; top:150px; left:376px; width:45px; height:15px; border:1px solid #aaa; background-color:#ffbbaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss566 { position:absolute; top:150px; left:469px; width:45px; height:15px; border:1px solid #aaa; background-color:#ffbbaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss567 { position:absolute; top:150px; left:562px; width:45px; height:15px; border:1px solid #aaa; background-color:#ffbbaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss568 { position:absolute; top:150px; left:655px; width:45px; height:15px; border:1px solid #aaa; background-color:#ffbbaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }

#ss569 { position:absolute; top:338px; left:190px; width:45px; height:15px; border:1px solid #aaa; background-color:#ffbbaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss570 { position:absolute; top:338px; left:283px; width:45px; height:15px; border:1px solid #aaa; background-color:#ffbbaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss571 { position:absolute; top:338px; left:376px; width:45px; height:15px; border:1px solid #aaa; background-color:#ffbbaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss572 { position:absolute; top:338px; left:469px; width:45px; height:15px; border:1px solid #aaa; background-color:#ffbbaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss573 { position:absolute; top:338px; left:562px; width:45px; height:15px; border:1px solid #aaa; background-color:#ffbbaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }
#ss574 { position:absolute; top:338px; left:655px; width:45px; height:15px; border:1px solid #aaa; background-color:#ffbbaa; color:#000; font-size:11px; font-weight:bold; text-align:center; }

#tw01 { position:absolute; top:60px; left:15px; width:50px; height:18px; border:1px solid #aaa; background-color:#fff; color:blue; font-size:12px; font-weight:bold; text-align:center; }
#tw02 { position:absolute; top:170px; left:70px; width:50px; height:18px; border:1px solid #aaa; background-color:#fff; color:blue; font-size:12px; font-weight:bold; text-align:center; }
#tw03 { position:absolute; top:260px; left:135px; width:50px; height:18px; border:1px solid #aaa; background-color:#fff; color:blue; font-size:12px; font-weight:bold; text-align:center; }
#tw04 { position:absolute; top:265px; left:430px; width:50px; height:18px; border:1px solid #aaa; background-color:#fff; color:blue; font-size:12px; font-weight:bold; text-align:center; }
#tw05 { position:absolute; top:260px; left:630px; width:50px; height:18px; border:1px solid #aaa; background-color:#fff; color:blue; font-size:12px; font-weight:bold; text-align:center; }
#tw06 { position:absolute; top:180px; left:490px; width:50px; height:18px; border:1px solid #aaa; background-color:#fff; color:blue; font-size:12px; font-weight:bold; text-align:center; }
#tw07 { position:absolute; top:208px; left:410px; width:50px; height:18px; border:1px solid #aaa; background-color:#fff; color:blue; font-size:12px; font-weight:bold; text-align:center; }
#tw08 { position:absolute; top:210px; left:540px; width:50px; height:18px; border:1px solid #aaa; background-color:#fff; color:blue; font-size:12px; font-weight:bold; text-align:center; }
#tw09 { position:absolute; top:230px; left:340px; width:50px; height:18px; border:1px solid #aaa; background-color:#fff; color:blue; font-size:12px; font-weight:bold; text-align:center; }
#tw10 { position:absolute; top:260px; left:545px; width:50px; height:18px; border:1px solid #aaa; background-color:#fff; color:blue; font-size:12px; font-weight:bold; text-align:center; }
#tw11 { position:absolute; top:160px; left:595px; width:50px; height:18px; border:1px solid #aaa; background-color:#fff; color:blue; font-size:12px; font-weight:bold; text-align:center; }
#tw12 { position:absolute; top:60px; left:595px; width:50px; height:18px; border:1px solid #aaa; background-color:#fff; color:blue; font-size:12px; font-weight:bold; text-align:center; }

table.ocean { border-collapse:collapse; border:1px solid #aaa; border-top:2px solid #1c548e; font-size:12px; font-weight:normal; background:#FFFFFF; width:100%; }
table.ocean caption { font-size:11px; font-weight:normal; color:#777; font-family:µ¸¿ò,Tahoma; }
table.ocean th { border:1px solid #aaa; border-bottom:3px double #aaa; text-align:center; font-weight:bold; background:#e9f3fe; height:30px; }
table.ocean td { border:1px solid #aaa; text-align:center; font-size:12px; font-weight:bold; height:20px; padding:5px; }
table.ocean td img { width: 340px; height: 200px; border: 0px; }
table.ocean td span { font-size:11px; font-weight:normal; }
table.ocean td.grn { /*background:#ecffea;*/ background:#e9f3fe; }
table.ocean td.day { font-weight:bold; }
table.ocean td span.bl { color:blue; }
table.ocean td span.re { color:red; }
table.ocean td span.gr { color:#555; }

#ocean_fog { position:relative; float:left; width:100%; height:430px; margin-bottom:10px; border:1px solid #aaa; }
#fog_img { position:absolute; top:5px; left:5px; width: 710px; height: 400px; z-index: 200;}
#fog_level { position:absolute; bottom:25px; right:0px; width:260px; height:30px; border:0px; z-index: 201; }
#fog_line { position:absolute; top:5px; left:5px; width: 710px; height: 400px; z-index: 202;}
#fog_help { position:absolute; bottom:0px; left:5px; width: 710px; height: 20px; z-index: 203; margin-top: 5px;}


.ocean_foot { float:left; width:100%; margin-top:5px; border-top:2px solid #245782; }
.ocean_ci { float:left; margin-top:5px; font-size:12px; font-weight:bold; }
.ocean_crt { float:right; }