@charset "utf-8";

@media print {
  * {-webkit-print-color-adjust: exact; print-color-adjust: exact;}
  #gloHeader {display:none;}
  .subVisual {display:none;}
  .comnWrap .localNavi {display:none;}
  .subComnSec .inner .subLnb {display:none;}
  .subComnSec .inner .subCont .pageTabWrap {display:none;}
  .bbsBtns {display:none;}
  .footer {display:none;}
}

.wrap *::-webkit-scrollbar {width: 6px; height:6px;}
.wrap *::-webkit-scrollbar-thumb {background-color: #ccc; border-radius: 6px;}
.wrap *::-webkit-scrollbar-thumb:hover {background:#1d50a2;}
.wrap *::-webkit-scrollbar-track {background-color: #f0f0f0; border-radius: 6px;}
.wrap *:hover::-webkit-scrollbar-thumb {background:#1d50a2;}

.wrap {position:relative; min-width:360px;}
.wrap.fullSize {height:100vh; overflow:hidden;}
.wrap.mngPop {background:#222; min-height:100vh; padding-top:75px;}
.inner {width:100%; max-width:1600px; margin:0 auto;}

select {display:inline-block; border:1px solid #ddd; border-radius:4px; background:#FFF url(../images/ar_select.svg) no-repeat 90% 50%; background-size:8px 4px; font-size:14px; padding:0 30px 0 9px; height:40px; font-weight:500; -webkit-appearance: none; -moz-appearance:none; appearance: none;}
select::-ms-expand {display: none;}
input[type="text"], input[type="number"], input[type="password"] {display:inline-block; background:#FFF; border:1px solid #ddd; border-radius:4px; height:40px; line-height:38px; padding:0 9px; color:#333; font-size:16px; font-weight:500;}
.flex {display:flex; align-items:center;}
.between {justify-content:space-between;}
.start {justify-content:flex-start;}

.alertPop {position:fixed; background:#FFF; border-radius:16px; overflow:hidden; z-index:200;}
.alertPop .popHead {display:block; background:#003697; padding:15px 20px; color:#FFF; font-size:18px; font-weight:700;}
.alertPop .popCon {height:auto; max-height:600px; overflow:hidden; overflow-y:auto; padding:20px; font-size:14px; line-height:1.3; color:#444;}
.alertPop .popCon img {display:block; margin-bottom:10px;}
.alertPop .popCon div, .alertPop .popCon p, .alertPop .popCon span {color:#444; font-size:14px; line-height:1.3;}
.alertPop .popClose {background:#444; color:#FFF; font-size:14px; padding:15px 20px;}
.alertPop .popClose form {display:flex; justify-content:space-between; align-items:center;}
.alertPop .popClose .chkB input + span {color:#999; font-size:14px;}
.alertPop .popClose .chkB input:checked + span {color:#FFF;}
.alertPop .popClose .close {color:#FFF; font-size:14px; font-weight:500; cursor:pointer;}

header {background:#FFF; position:fixed; left:0; top:0; width:100%; border-bottom:1px solid #e1e1e1; z-index:110;}
header:after {content:''; position:absolute; left:0; top:100px; width:100%; height:1px; background:#e1e1e1;}
header .inner {display:flex; justify-content:space-between; align-items:center; padding-top:100px; position:relative;}
header .inner h1 {position:absolute; left:0; top:25px; width:182px;}
header .inner h1 a {display:block;}
header .inner nav {display:flex; justify-content:space-between; align-items:center; padding:0; background:#FFF; width:100%; transition:.4s all;}
header .inner nav .menu a.dep01 {display:block; color:#222; font-size:20px; font-weight:700; padding:24px; line-height:1.0;}
header .inner .funcUtil {position:absolute; right:0; top:32px; display:flex; align-items:center; gap:16px;}
header .inner .funcUtil .gloSearch {width:240px; height:36px; border:1px solid #ccc; border-radius:8px; position:relative; overflow:hidden;}
header .inner .funcUtil .gloSearch input {display:inline-block; width:calc(100% - 40px); height:36px; line-height:34px; border:0; background:transparent; font-size:14px; padding:0 15px;}
header .inner .funcUtil .gloSearch button {position:absolute; right:0; top:0; width:36px; height:36px; background:url(../images/ico_search.svg) no-repeat 50% 50%; text-indent:-9999px; cursor:pointer; background-size:19px 19px;}
header .inner .funcUtil .gloSearch .schClose {display:none;}
header .inner .funcUtil .btnSearch {display:none;}
header .inner .funcUtil .btns {display:flex; align-items:center;}
header .inner .funcUtil .btns a {display:block; width:80px; height:36px; line-height:36px; color:#FFF; font-size:14px; text-align:center;}
header .inner .funcUtil .btns a.sitemap {border-radius:8px; background:#0e56d9;}
header .inner .funcUtil .btns a.lang {border-radius:0 8px 8px 0; background:#0ac097;}
header .inner .funcUtil .mobileMenu {display:none;}

header.fix:after {display:none;}
header.fix .inner {padding:14px 0;}
header.fix .inner h1 {position:relative; display:block; left:unset; top:unset; flex:0 0 152px;}
header.fix .inner .funcUtil {position:relative; right:unset; top:unset;}
header.fix .inner nav {width:100%; max-width:884px;}
header.fix .inner nav .menu a.dep01 {padding:10px;}
header.fix .subMenuWrap {top:69px;}

.moHeader {display:none;}

#loading{width: 100%; height: 100%; position: absolute; top:0; left:0; z-index:3; display: none;}
#loading img{position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); width: 10%;}

.dim {position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.6); z-index:90; display:none;}
.subMenuWrap {position:fixed; left:0; top:168px; background:#FFF; width:100%; z-index:100; border-top:1px solid #e1e1e1; display:none;}
.subMenuWrap:before {content:''; position:absolute; left:0; top:0; width:50%; height:100%; background:#2457e7;}
.subMenuWrap .subMenuArea {width:100%; max-width:1600px; height:auto; min-height:467px; margin:0 auto; position:relative; display:flex; justify-content:flex-end;}
.subMenuWrap .subMenuArea .ico {position:absolute; left:-128px; top:0; width:368px; height:100%; text-align:center; color:#FFF; font-size:30px; font-weight:700; padding-top:96px;}
.subMenuWrap#subMenu01 .subMenuArea .ico {background:url(../images/sm_ico01.png) no-repeat 50% 50%; background-size:100% auto;}
.subMenuWrap#subMenu02 .subMenuArea .ico {background:url(../images/sm_ico02.png) no-repeat 50% 50%; background-size:100% auto;}
.subMenuWrap#subMenu03 .subMenuArea .ico {background:url(../images/sm_ico03.png) no-repeat 50% 50%; background-size:100% auto;}
.subMenuWrap#subMenu04 .subMenuArea .ico {background:url(../images/sm_ico04.png) no-repeat 50% 50%; background-size:100% auto;}
.subMenuWrap#subMenu05 .subMenuArea .ico {background:url(../images/sm_ico05.png) no-repeat 50% 50%; background-size:100% auto;}
.subMenuWrap#subMenu06 .subMenuArea .ico {background:url(../images/sm_ico06.png) no-repeat 50% 50%; background-size:100% auto;}
.subMenuWrap#subMenu07 .subMenuArea .ico {background:url(../images/sm_ico07.png) no-repeat 50% 50%; background-size:100% auto;}
.subMenuWrap#subMenu08 .subMenuArea .ico {background:url(../images/sm_ico08.png) no-repeat 50% 50%; background-size:100% auto;}
.subMenuWrap .subMenuArea .subMenuList {width:calc(100% - 240px); background:#FFF; padding:30px 0 30px 44px; display:flex; justify-content:flex-start; align-content:flex-start; align-items:stretch; flex-wrap:wrap; gap:24px 44px;}
.subMenuWrap .subMenuArea .subMenuList .subMenuBox {display:block; width:calc(25% - 33px); min-height:170px;}
.subMenuWrap .subMenuArea .subMenuList .subMenuBox .smTitle {font-size:18px; font-weight:600; padding-bottom:16px; border-bottom:1px solid #0e56d9; position:relative; padding-left:16px;}
.subMenuWrap .subMenuArea .subMenuList .subMenuBox .smTitle a {display:block; color:#0e56d9;}
.subMenuWrap .subMenuArea .subMenuList .subMenuBox .smTitle:after {content:''; position:absolute; left:3px; top:8px; width:5px; height:5px; background:#0e56d9; border-radius:50%;}
.subMenuWrap .subMenuArea .subMenuList .subMenuBox ul {padding:15px 0;}
.subMenuWrap .subMenuArea .subMenuList .subMenuBox ul li {display:block; font-size:16px; color:#666;}
.subMenuWrap .subMenuArea .subMenuList .subMenuBox ul li a {display:block; padding:6px 14px;}
.subMenuWrap .subMenuArea .subMenuList .subMenuBox ul li a:hover {color:#222; font-weight:600;}

.mDevice {position:fixed; right:20px; top:50%; transform:translate(0, -50%); z-index:80;}
.mDevice:after {content:''; position:absolute; right:9px; top:6px; width:2px; height:calc(100% - 12px); background:#aaa; transition:.4s all;}
.mDevice li {display:block; height:20px; padding-right:20px; position:relative; margin-bottom:36px; z-index:1;}
.mDevice li span {position:absolute; right:30px; top:50%; transform:translate(0, -50%); color:#0e56d9; font-size:16px; font-weight:700; width:90px; text-align:right; opacity:0; transition:.4s all;}
.mDevice li:last-child {margin-bottom:0;}
.mDevice li:after {content:''; position:absolute; right:0; top:0; width:20px; height:20px; border:2px solid transparent; border-radius:50%; box-sizing:border-box; transition:.4s all;}
.mDevice li:before {content:''; position:absolute; right:5px; top:5px; width:10px; height:10px; background:#aaa; border-radius:50%; box-sizing:border-box; transition:.4s all;}
.mDevice li.active span {opacity:1.0;}
.mDevice li.active:after {border:2px solid #0e56d9;}
.mDevice li.active:before {background:#0e56d9;}

.mDevice.whiteBlue:after {background:#FFF;}
.mDevice.whiteBlue li:before {background:#FFF;}
.mDevice.whiteBlue li.active:after {border:2px solid #0e56d9;}
.mDevice.whiteBlue li.active:before {background:#0e56d9;}

.mDevice.white:after {background:#FFF;}
.mDevice.white li span {color:#FFF;}
.mDevice.white li:before {background:#FFF;}
.mDevice.white li.active:after {border:2px solid #FFF;}
.mDevice.white li.active:before {background:#FFF;}

.section {position:relative;}
.section .mTitleSec {text-align:center; margin-bottom:30px;}
.section .mTitleSec .ico {width:67px; margin:0 auto 10px;}
.section .mTitleSec .title {color:#222; font-size:42px; font-weight:700;}
.section.sec1 {background:url(../images/main_visual.jpg) no-repeat center/cover; background-size:cover; padding-top:0;}
.section.sec1 .inner {display:flex; align-items:flex-end; position:relative; height:100%; padding-bottom:60px;}
.section.sec1 .inner h2 {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);}
.section.sec1 .inner h2 img {max-width:100%;}
.section.sec1 .inner .majorFunc {width:100%; display:flex; justify-content:space-between; align-items:stretch; color:#FFF; background:rgba(0, 150, 236, 0.3); border-radius:16px; overflow:hidden;}
.section.sec1 .inner .majorFunc .perFunc {width:11.111111%; text-align:center; position:relative;}
.section.sec1 .inner .majorFunc .perFunc:after {content:''; position:absolute; right:0; top:50%; transform:translate(0, -50%); width:1px; height:110px; background:#FFF; opacity:0.2;}
.section.sec1 .inner .majorFunc .perFunc:last-child:after {display:none;}
.section.sec1 .inner .majorFunc .perFunc a {display:block; width:100%; height:100%; padding:34px 0;}
.section.sec1 .inner .majorFunc .perFunc .ico {margin-bottom:8px;}
.section.sec1 .inner .majorFunc .perFunc .ico img {width:60px;}
.section.sec1 .inner .majorFunc .perFunc .txt {color:#FFF; font-size:16px; font-weight:400; text-shadow:1px 1px 5px rgba(0, 0, 0, 0.5), 1px 1px 10px rgba(0, 0, 0, 0.5);}
.section.sec1 .inner .majorFunc .perFunc:hover {background:#0ac097;}
.section.sec1 .inner .majorFunc .perFunc:hover .txt {text-shadow:none;}
.section.sec1 .inner .majorFunc .perFunc a:after {display:none;}

.section.sec2 {background:#ebf0fc url(../images/bg_wave.png) repeat-x left bottom; background-size:auto 109px;}
.section.sec2 .inner {display:flex; justify-content:space-between; align-items:stretch; flex-wrap:wrap;}
.section.sec2 .tabCont {width:63.5%; position:relative;}
.section.sec2 .tabCont:after {content:''; clear:both; display:block; height:auto;}
.section.sec2 .tabCont .cauCont {position:absolute; left:16px; top:102%; color:#111; font-size:14px; display:none; line-height:1.3;}

.section.sec2 .wgWrap {border-radius:16px; border:1px solid #0e56d9; background:#FFF; position:relative; overflow:hidden;}
.section.sec2 .wgTab {display:flex; justify-content:flex-start; align-items:stretch; position:relative;}
.section.sec2 .wgTab .wgMenu {width:16.666667%;}
.section.sec2 .wgTab .wgMenu br {display:none;}
.section.sec2 .wgTab .wgMenu a {position:relative; background:#0e56d9; display:flex; justify-content:center; align-items:center; color:#FFF; font-size:18px; font-weight:700; padding:16px 0;}
.section.sec2 .wgTab .wgMenu a:after {content:''; position:absolute; right:0; top:0; width:1px; height:100%; background:#FFF; opacity:0.2;}
.section.sec2 .wgTab .wgMenu a.on {background:#FFF; color:#0e56d9;}

.section.sec2 .wgInfo {display:none;}
.section.sec2 .wgTable {width:51%; float:left;}
.section.sec2 .wgTable .tHead {position:relative; border-bottom:1px solid #ccc;}
.section.sec2 .wgTable .tHead:after {content:''; clear:both; display:block; height:auto; overflow:hidden;}
.section.sec2 .wgTable .tHead li {float:left; height:70px; display:flex; justify-content:center; align-items:center; text-align:center; color:#000; font-size:14px; font-weight:400; line-height:1.2;}
.section.sec2 .wgTable .tBody {height:calc(542px - 70px); overflow:hidden; overflow-y:auto;}

.section.sec2 .wgTable .tBody table {padding:0; margin:0; width:100%; table-layout:fixed;}
.section.sec2 .wgTable .tBody table th,
.section.sec2 .wgTable .tBody table td {padding:12px 0; color:#000; font-size:14px; text-align:center; font-weight:400;}
.section.sec2 .wgTable .tBody table tr:nth-child(odd) {background:#e4ecfb;}
.section.sec2 .wgTable .tBody .up {display:inline-block; position:relative; margin-left:3px;}
.section.sec2 .wgTable .tBody .up:after {content:'▲'; color:#d9180e;}
.section.sec2 .wgTable .tBody .down {display:inline-block; position:relative; margin-left:3px;}
.section.sec2 .wgTable .tBody .down:after {content:'▼'; color:#0e56d9;}
.section.sec2 .wgTable .tBody .same {display:inline-block; position:relative; margin-left:7px;}
.section.sec2 .wgTable .tBody .same:after {content:''; display:inline-block; width:8px; height:2px; background:#009700; vertical-align:4px;}

.section.sec2 .wgInfo .item {width:30%;}
.section.sec2 .wgInfo#tabCon01 .ipCon {width:14%;}
.section.sec2 .wgInfo#tabCon02 .ipCon {width:23.33333%;}
.section.sec2 .wgInfo#tabCon03 .ipCon {width:23.3%;}
.section.sec2 .wgInfo#tabCon04 .ipCon {width:23.33333%;}
.section.sec2 .wgInfo#tabCon05 .ipCon {width:17.5%;}
.section.sec2 .wgInfo#tabCon06 .ipCon {width:14%;}

.section.sec2 .wgInfo#tabCon01 .wgMap .localInfo .item {width:64%;}
.section.sec2 .wgInfo#tabCon01 .wgMap .localInfo .ipCon {width:36%;}
.section.sec2 .wgInfo#tabCon02 .wgMap .localInfo .item {width:64%;}
.section.sec2 .wgInfo#tabCon02 .wgMap .localInfo .ipCon {width:36%;}
.section.sec2 .wgInfo#tabCon03 .wgMap .localInfo .item {width:70%;}
.section.sec2 .wgInfo#tabCon03 .wgMap .localInfo .ipCon {width:30%;}
.section.sec2 .wgInfo#tabCon04 .wgMap .localInfo .item {width:70%;}
.section.sec2 .wgInfo#tabCon04 .wgMap .localInfo .ipCon {width:30%;}
.section.sec2 .wgInfo#tabCon05 .wgMap .localInfo .item {width:70%;}
.section.sec2 .wgInfo#tabCon05 .wgMap .localInfo .ipCon {width:30%;}

.section.sec2 .wgMap {width:49%; position:relative; height:543px; float:right;}
.section.sec2 .wgMap .legend {position:absolute; right:10px; top:10px; background:rgba(255, 255, 255, 0.8); border-radius:5px; border:1px solid #ccc; padding:8px; z-index:100;}
.section.sec2 .wgMap .legend li {display:flex; justify-content:flex-start; align-items:center; gap:8px; color:#333; font-size:14px; font-weight:400; line-height:1.0; padding:6px 0;}
.section.sec2 .wgMap .legend li.title {text-align:center; font-size:14px; line-height:1.2;}
.section.sec2 .wgMap .legend li .ico {width:16px; height:16px;}
.section.sec2 .wgMap .legend li .ico.up {background:url(../images/ico_soo_up_gray.svg) no-repeat 50% 50%; background-size:100%;}
.section.sec2 .wgMap .legend li .ico.down {background:url(../images/ico_soo_down_gray.svg) no-repeat 50% 50%; background-size:100%;}
.section.sec2 .wgMap .legend li .ico.same {background:url(../images/ico_soo_same_gray.svg) no-repeat 50% 50%; background-size:100%;}
.section.sec2 .wgMap .legend li .ico.caution {background:url(../images/ico_soo_caution.svg) no-repeat 50% 50%; background-size:100%;}
.section.sec2 .wgMap .legend li .ico.warning {background:url(../images/ico_soo_warning.svg) no-repeat 50% 50%; background-size:100%;}
.section.sec2 .wgMap .legend li .ico.rainLev01 {background:url(../images/ico_rain_level01.svg) no-repeat 50% 50%; background-size:100%;}
.section.sec2 .wgMap .legend li .ico.rainLev02 {background:url(../images/ico_rain_level02.svg) no-repeat 50% 50%; background-size:100%;}
.section.sec2 .wgMap .legend li .ico.rainLev03 {background:url(../images/ico_rain_level03.svg) no-repeat 50% 50%; background-size:100%;}
.section.sec2 .wgMap .legend li .ico.rainLev04 {background:url(../images/ico_rain_level04.svg) no-repeat 50% 50%; background-size:100%;}
.section.sec2 .wgMap .legend li .ico.rainLev05 {background:url(../images/ico_rain_level05.svg) no-repeat 50% 50%; background-size:100%;}
.section.sec2 .wgMap .legend li .ico.rainLev06 {background:url(../images/ico_rain_level06.svg) no-repeat 50% 50%; background-size:100%;}
.section.sec2 .wgMap .legend li .ico.rainLev07 {background:url(../images/ico_rain_level07.svg) no-repeat 50% 50%; background-size:100%;}
.section.sec2 .wgMap .legend li .ico.floodLev01 {background:url(../images/ico_flood_level01.svg) no-repeat 50% 50%; background-size:100%;}
.section.sec2 .wgMap .legend li .ico.floodLev02 {background:url(../images/ico_flood_level02.svg) no-repeat 50% 50%; background-size:100%;}
.section.sec2 .wgMap .legend li .ico.floodLev03 {background:url(../images/ico_flood_level03.svg) no-repeat 50% 50%; background-size:100%;}
.section.sec2 .wgMap .legend li .ico.floodLev04 {background:url(../images/ico_flood_level04.svg) no-repeat 50% 50%; background-size:100%;}
.section.sec2 .wgMap .legend li .ico.floodLev05 {background:url(../images/ico_flood_level05.svg) no-repeat 50% 50%; background-size:100%;}

.section.sec2 .useComnMapSec {position:relative;}
.section.sec2 .useComnMapSec .wgMap {background:#e4ecfb;}
.section.sec2 .useComnMapSec .comnUseMap {position:absolute; right:0; top:0; width:49%; height:543px; }
.section.sec2 .useComnMapSec .localInfo {position:absolute; border-radius:5px; overflow:hidden; background:#FFF; border:1px solid #0e56d9; z-index:100;}
.section.sec2 .useComnMapSec .localInfo div {padding:0; margin:0; width:100%; table-layout:fixed;}
.section.sec2 .useComnMapSec .localInfo table {padding:0; margin:0; width:100%; table-layout:fixed;}
.section.sec2 .useComnMapSec .localInfo table th {background:#0e56d9; text-align:center; color:#FFF; font-size:14px; font-weight:600; padding:8px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
.section.sec2 .useComnMapSec .localInfo table td {padding:5px; text-align:center; color:#222; font-size:14px; border-bottom:1px solid #ddd;}
.section.sec2 .useComnMapSec .localInfo table td.item {background:#eee;}
.section.sec2 .useComnMapSec .localInfo table td.lev01 {color:#555;}
.section.sec2 .useComnMapSec .localInfo table td.lev02 {color:#0e56d9;}
.section.sec2 .useComnMapSec .localInfo table td.lev03 {color:#f0a402;}
.section.sec2 .useComnMapSec .localInfo table td.lev04 {color:#f0710a;}
.section.sec2 .useComnMapSec .localInfo table td.lev05 {color:#fd0c00;}
.section.sec2 .useComnMapSec .localInfo table td .up {display:inline-block; position:relative; margin-left:3px;}
.section.sec2 .useComnMapSec .localInfo table td .up:after {content:'▲'; color:#d9180e;}
.section.sec2 .useComnMapSec .localInfo table td .down {display:inline-block; position:relative; margin-left:3px;}
.section.sec2 .useComnMapSec .localInfo table td .down:after {content:'▼'; color:#0e56d9;}
.section.sec2 .useComnMapSec .localInfo table td .same {display:inline-block; position:relative; margin-left:7px;}
.section.sec2 .useComnMapSec .localInfo table td .same:after {content:''; display:inline-block; width:8px; height:2px; background:#009700; vertical-align:4px;}
.section.sec2 .useComnMapSec .localInfo table tr:last-child td {border-bottom:0;}


.marker {position:absolute; width:18px; height:29px; z-index:100;}
.marker a {display:block; width:100%; height:100%; text-indent:-99999px;}
.marker.up {background:url(../images/mark_soo_up.svg) no-repeat 50% 50%; background-size:100%;}
.marker.down {background:url(../images/mark_soo_down.svg) no-repeat 50% 50%; background-size:100%;}
.marker.same {background:url(../images/mark_soo_same.svg) no-repeat 50% 50%; background-size:100%;}
.marker.caution {background:url(../images/mark_soo_caution.svg) no-repeat 50% 50%; background-size:100%;}
.marker.warning {background:url(../images/mark_soo_warning.svg) no-repeat 50% 50%; background-size:100%;}
.marker.rainLev01 {background:url(../images/mark_rain_level01.svg) no-repeat 50% 50%; background-size:100%;}
.marker.rainLev02 {background:url(../images/mark_rain_level02.svg) no-repeat 50% 50%; background-size:100%;}
.marker.rainLev03 {background:url(../images/mark_rain_level03.svg) no-repeat 50% 50%; background-size:100%;}
.marker.rainLev04 {background:url(../images/mark_rain_level04.svg) no-repeat 50% 50%; background-size:100%;}
.marker.rainLev05 {background:url(../images/mark_rain_level05.svg) no-repeat 50% 50%; background-size:100%;}
.marker.rainLev06 {background:url(../images/mark_rain_level06.svg) no-repeat 50% 50%; background-size:100%;}
.marker.rainLev07 {background:url(../images/mark_rain_level07.svg) no-repeat 50% 50%; background-size:100%;}
.marker.floodLev01 {background:url(../images/mark_flood_level01.svg) no-repeat 50% 50%; background-size:100%;}
.marker.floodLev02 {background:url(../images/mark_flood_level02.svg) no-repeat 50% 50%; background-size:100%;}
.marker.floodLev03 {background:url(../images/mark_flood_level03.svg) no-repeat 50% 50%; background-size:100%;}
.marker.floodLev04 {background:url(../images/mark_flood_level04.svg) no-repeat 50% 50%; background-size:100%;}
.marker.floodLev05 {background:url(../images/mark_flood_level05.svg) no-repeat 50% 50%; background-size:100%;}
.marker.dam {background:url(../images/mark_dam.svg) no-repeat 50% 50%; background-size:100%;}
.marker.bo {background:url(../images/mark_bo.svg) no-repeat 50% 50%; background-size:100%;}
.marker.vod {background:url(../images/mark_vod.svg) no-repeat 50% 50%; background-size:100%;}
.section.sec2 .wgMap .localInfo {position:absolute; border-radius:5px; overflow:hidden; background:#FFF; border:1px solid #0e56d9; z-index:100;}
.section.sec2 .wgMap .localInfo table {padding:0; margin:0; width:100%; table-layout:fixed;}
.section.sec2 .wgMap .localInfo table th {background:#0e56d9; text-align:center; color:#FFF; font-size:14px; font-weight:600; padding:8px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
.section.sec2 .wgMap .localInfo table td {padding:5px; text-align:center; color:#222; font-size:14px; border-bottom:1px solid #ddd;}
.section.sec2 .wgMap .localInfo table td.item {background:#eee;}
.section.sec2 .wgMap .localInfo table td.lev01 {color:#555;}
.section.sec2 .wgMap .localInfo table td.lev02 {color:#0e56d9;}
.section.sec2 .wgMap .localInfo table td.lev03 {color:#f0a402;}
.section.sec2 .wgMap .localInfo table td.lev04 {color:#f0710a;}
.section.sec2 .wgMap .localInfo table td.lev05 {color:#fd0c00;}
.section.sec2 .wgMap .localInfo table td .up {display:inline-block; position:relative; margin-left:3px;}
.section.sec2 .wgMap .localInfo table td .up:after {content:'▲'; color:#d9180e;}
.section.sec2 .wgMap .localInfo table td .down {display:inline-block; position:relative; margin-left:3px;}
.section.sec2 .wgMap .localInfo table td .down:after {content:'▼'; color:#0e56d9;}
.section.sec2 .wgMap .localInfo table td .same {display:inline-block; position:relative; margin-left:7px;}
.section.sec2 .wgMap .localInfo table td .same:after {content:''; display:inline-block; width:8px; height:2px; background:#009700; vertical-align:4px;}
.section.sec2 .wgMap .localInfo table tr:last-child td {border-bottom:0;}
.section.sec2 .wgMap .lastTime {position:absolute; right:10px; bottom:10px; padding:3px 15px; border-radius:50px; color:#FFF; font-size:12px; font-weight:400; background:#444; z-index:100;}

.section .mArticle {width:35%; display:flex; justify-content:flex-start; align-items:stretch; gap:24px; flex-direction:column;}
.section .mArticle .articleBox {background:#FFF; border:1px solid #ddd; border-radius:16px; padding:0 32px; 
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
}

.section .mArticle .articleBox .title {display:flex; justify-content:space-between; align-items:center; padding:20px 0; color:#222; font-size:22px; font-weight:700; border-bottom:1px solid #ccc;}
.section .mArticle .articleBox .title a {color:#999; font-size:14px; font-weight:400; display:flex; justify-content:center; align-items:center;}
.section .mArticle .articleBox .title a:after {content:''; display:inline-block; width:8px; height:12px; background:url(../images/dir_right.svg) no-repeat 50% 50%; background-size:auto 100%; opacity:0.5; margin-left:5px;}
.section .mArticle .articleBox ul {padding:14px 0;}
.section .mArticle .articleBox ul li {display:block;}
.section .mArticle .articleBox ul li a {display:flex; width:100%; height:38px; justify-content:space-between; align-items:center;}
.section .mArticle .articleBox ul li a .subject {color:#666; width:calc(100% - 106px); font-size:16px; font-weight:400; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; position:relative;}
.section .mArticle .articleBox ul li a .subject em {display:inline-block; width:44px; padding:4px 0; color:#FFF; font-size:11px; border-radius:4px; text-align:center; margin-right:5px; vertical-align:2px;}
.section .mArticle .articleBox ul li a .subject em.clear {background:#999;}
.section .mArticle .articleBox ul li a .subject em.danger {background:#d21d25;}
.section .mArticle .articleBox ul li a .subject em.caution {background:#f0710a;}
.section .mArticle .articleBox ul li a .subject em.stDam {background:#0e56d9;}
.section .mArticle .articleBox ul li a .subject em.stBo {background:#0ac097;}
.section .mArticle .articleBox ul li a .subject em.stReservior {background:#760ac0;}
.section .mArticle .articleBox ul li a .date {color:#666; font-size:16px;}

.section.sec3 {background:#f4f4f4 url(../images/bg_wave.png) repeat-x left bottom; background-size:auto 109px;}
.section.sec3 .inner {display:flex; justify-content:space-between; align-items:stretch; gap:1.5%;}
.section.sec3 .orgPart {width:35%; display:flex; justify-content:space-between; align-items:stretch; flex-direction:column;}
.section.sec3 .orgPart .inOrg {border-radius:16px; width:100%; height:286px; 
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
}
.section.sec3 .orgPart .inOrg a {display:block; padding:38px 34px; width:100%; height:100%;}
.section.sec3 .orgPart .inOrg .title {color:#222; font-size:26px; font-weight:700; margin-bottom:12px;}
.section.sec3 .orgPart .inOrg .desc {color:#222; font-size:16px; line-height:1.3;}
.section.sec3 .orgPart .inOrg.information {background:url(../images/bg_info.png) no-repeat 50% 50%; background-size:cover;}
.section.sec3 .orgPart .inOrg.news {background:url(../images/bg_org.png) no-repeat 50% 50%; background-size:cover;}
.section.sec3 .orgPart .inOrg.news p {color:#FFF;}

.section.sec3 .newsBnr {width:430px; background:#FFF; border:1px solid #ccc; border-radius:16px; overflow:hidden; flex:0 0 430px;
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
}
.section.sec3 .newsBnr .outBnr {height:533px;}
.section.sec3 .newsBnr .bnrFunc {display:flex; justify-content:space-between; align-items:center; height:61px; padding:0 24px 0 34px;}
.section.sec3 .newsBnr .bnrFunc .title {color:#222; font-size:22px; font-weight:700;}
.section.sec3 .newsBnr .bnrFunc .funcControl {display:flex; align-items:center; text-indent:-9999px;}
.section.sec3 .newsBnr .bnrFunc .funcControl .outBnr-prev {display:inline-block; width:20px; height:20px; background:url(../images/dir_left.svg) no-repeat 50% 50%; background-size:9px 16px; cursor:pointer;}
.section.sec3 .newsBnr .bnrFunc .funcControl .outBnr-next {display:inline-block; width:20px; height:20px; background:url(../images/dir_right.svg) no-repeat 50% 50%; background-size:9px 16px; cursor:pointer;}
.section.sec3 .newsBnr .bnrFunc .funcControl .swiper-play {display:none; width:20px; height:20px; background:url(../images/bnr_play.svg) no-repeat 50% 50%; background-size:100%; cursor:pointer;}
.section.sec3 .newsBnr .bnrFunc .funcControl .swiper-pause {display:inline-block; width:20px; height:20px; background:url(../images/bnr_pause.svg) no-repeat 50% 50%; background-size:100%; cursor:pointer;}

.section.sec4 {background:url(../images/sbg_info.jpg) no-repeat center/cover; background-size:cover;}
.section.sec4 .mTitleSec .title {color:#FFF;}
.section.sec4 .inner {position:relative; display:flex; justify-content:center; align-items:stretch; flex-wrap:wrap;}

.section.sec4 .inner .serviceItem {width:57%;}
.section.sec4 .inner .majorComplain {display:flex; justify-content:space-between; align-items:center; border-radius:16px; background:#FFF; height:208px; margin-bottom:24px;}
.section.sec4 .inner .majorComplain .perMajor {width:33.3333%; position:relative;}
.section.sec4 .inner .majorComplain .perMajor:after {content:''; position:absolute; right:0; top:0; width:1px; height:100%; background:#d8d8d8;}
.section.sec4 .inner .majorComplain .perMajor:last-child:after {display:none;}
.section.sec4 .inner .majorComplain .perMajor a {display:block; padding:5px 0;}
.section.sec4 .inner .majorComplain .perMajor .ico {display:block; width:57px; margin:0 auto 26px;}
.section.sec4 .inner .majorComplain .perMajor .txt {color:#222; font-size:20px; line-height:1.2; text-align:center; font-weight:500;}

.section.sec4 .inner .linkPart {display:flex; justify-content:space-between; align-items:stretch; gap:24px; height:208px;}
.section.sec4 .inner .linkPart .outerLink {width:100%; height:100%; background:#FFF; border-radius:16px; display:flex; justify-content:center; align-items:center; flex-direction:column;}
.section.sec4 .inner .linkPart .outerLink .title {color:#222; font-size:26px; font-weight:700; margin-bottom:20px;}
.section.sec4 .inner .linkPart .outerLink ul {width:100%; max-width:386px;}
.section.sec4 .inner .linkPart .outerLink li {float:left; width:50%;}
.section.sec4 .inner .linkPart .outerLink li a {display:block; color:#222; font-size:16px; font-weight:500; padding:8px 0; position:relative}
.section.sec4 .inner .linkPart .outerLink li a:after {content:''; display:inline-block; width:8px; height:14px; background:url(../images/dir_right.svg) no-repeat 50% 50%; background-size:100%; vertical-align:-2px; margin-left:10px; opacity:0.6;}
.section.sec4 .inner .linkPart .callCenter {width:100%; height:100%; border-radius:16px; border:2px solid rgba(255, 255, 255, 0.3); background:rgba(34, 34, 34, 0.3);}
.section.sec4 .inner .linkPart .callCenter .title {font-size:26px; font-weight:700; margin-bottom:30px;}
.section.sec4 .inner .linkPart .callCenter a {display:flex; justify-content:center; align-items:center; flex-direction:column; color:#FFF; width:100%; height:100%;}
.section.sec4 .inner .linkPart .callCenter .telNumber {font-size:46px; font-weight:400;}
.section.sec4 .inner .linkPart .callCenter .telNumber em {font-weight:700;}

.section.sec4 .inner .mLinkBox {width:20%; border-radius:16px; background:#FFF; position:absolute; top:0;}
.section.sec4 .inner .mLinkBox .title {color:#222; font-size:26px; font-weight:700; padding:35px 34px 20px;}
.section.sec4 .inner .mLinkBox li {display:block; position:relative; padding:0 24px;}
.section.sec4 .inner .mLinkBox li:after {content:''; position:absolute; left:27px; bottom:0; width:calc(100% - 54px); height:1px; background:#e8e8e8;}
.section.sec4 .inner .mLinkBox li:last-child:after {display:none;}
.section.sec4 .inner .mLinkBox li a {display:block; padding:26px 12px; position:relative; color:#222; font-size:16px; font-weight:500;}
.section.sec4 .inner .mLinkBox li a:after {content:''; position:absolute; right:5px; top:50%; transform:translate(0, -50%); width:8px; height:14px; background:url(../images/dir_right.svg) no-repeat 50% 50%; background-size:100%;}
.section.sec4 .inner .mLinkBox li a:hover {color:#0ac097;}
.section.sec4 .inner .mLinkBox li a:hover:after {background:url(../images/dir_right_on.svg) no-repeat 50% 50%; background-size:100%;}
.section.sec4 .inner .mLinkBox.complain {left:0;}
.section.sec4 .inner .mLinkBox.orgInfo {right:0;}

.footer {position:relative;}
.footer .btmUtil {background:#222;}
.footer .btmUtil .inner {display:flex; justify-content:space-between; align-items:center;}
.footer .btmUtil .inner .sitePolicy {padding:0;}
.footer .btmUtil .inner .sitePolicy .title {display:block; color:#888; font-weight:500; padding:20px 13px; position:relative; cursor:pointer; display:none;}
.footer .btmUtil .inner .sitePolicy .title .tail {position:absolute; right:13px; top:25px; width:11px; height:6px; background:url(../images/ar_select.svg) no-repeat 50% 50%; background-size:100%; transition:.4s all;}
.footer .btmUtil .inner .sitePolicy .title .tail.on {transform:rotate(-180deg);}
.footer .btmUtil .inner .sitePolicy li {float:left; font-size:14px;}
.footer .btmUtil .inner .sitePolicy li a {display:block; color:#b0b0b0; font-weight:500; padding-right:10px; margin-right:10px; position:relative;}
.footer .btmUtil .inner .sitePolicy li a:after {content:''; position:absolute; right:0; top:50%; transform:translate(0, -50%); width:1px; height:70%; background:#b0b0b0;}

/* 2024.05.20 상부지침 '개인정보처리방침' 흰색이 아닌 다른색상으로 변경  */
/* .footer .btmUtil .inner .sitePolicy li a.privacy {color:#FFF;} */
.footer .btmUtil .inner .sitePolicy li a.privacy {color:#Fb9700;}
.footer .btmUtil .inner .sitePolicy li:last-child a {padding-right:0; margin-right:0;}
.footer .btmUtil .inner .sitePolicy li:last-child a:after {display:none;}
.footer .btmUtil .inner .btmFunc {display:flex; align-items:center;}
.footer .btmUtil .inner .btmFunc .snsBtns {display:inline-block; margin-right:30px;}
.footer .btmUtil .inner .btmFunc .snsBtns a {float:left; width:36px; height:36px;}
.footer .btmUtil .inner .btmFunc .snsBtns a.twitter {background:url(../images/sns_twitter.svg) no-repeat 50% 50%; background-size:20px auto;}
.footer .btmUtil .inner .btmFunc .snsBtns a.facebook {background:url(../images/sns_fb.svg) no-repeat 50% 50%; background-size:20px auto;}
.footer .btmUtil .inner .btmFunc .otherSite {position:relative; width:150px; border-left:1px solid #444; border-right:1px solid #444;}
.footer .btmUtil .inner .btmFunc .otherSite .title {display:block; color:#888; font-weight:500; position:relative; cursor:pointer; padding:20px 13px;}
.footer .btmUtil .inner .btmFunc .otherSite .title .tail {position:absolute; right:13px; top:25px; width:11px; height:6px; background:url(../images/ar_select.svg) no-repeat 50% 50%; background-size:100%; transition:.4s all;}
.footer .btmUtil .inner .btmFunc .otherSite .title .tail.on {transform:rotate(-180deg);}
.footer .btmUtil .inner .btmFunc .otherSite ul {position:absolute; left:0; bottom:56px; width:100%; background:#FFF; border:1px solid #e1e1e1; padding:10px 0; box-sizing:border-box; display:none;}
.footer .btmUtil .inner .btmFunc .otherSite ul li {display:block;}
.footer .btmUtil .inner .btmFunc .otherSite ul li a {display:block; padding:10px 12px; color:#888; font-size:14px; font-weight:400;}

.footer .footerInfo {background:#1c1c1c;}
.footer .footerInfo .copyInfo {padding:20px 0; border-bottom:1px solid #222;}
.footer .footerInfo .copyInfo span {color:#999; font-size:14px; font-weight:500; margin-right:36px;}
.footer .footerInfo .copyright {padding:20px 0; display:flex; justify-content:flex-start; align-items:center; gap:42px;}
.footer .footerInfo .copyright .logoBtm {width:163px; height:44px;}
.footer .footerInfo .copyright .txt .address {color:#999; margin-bottom:8px;}
.footer .footerInfo .copyright .txt .cauTxt {color:#666;}
.footer .footerInfo .copyright .txt .cauTxt span {display:inline-block;}

.subVisual {height:384px; position:relative;}
.subVisual .visualDim {position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.2);}
.subVisual.visualA {background:url(../images/sub_visual_a.jpg) no-repeat 50% 50%; background-size:cover;}

.comnWrap {position:relative;}
.comnWrap .localNavi {background:#fcfcfc; border-bottom:1px solid #e1e1e1; padding:20px 0;}
.comnWrap .localNavi .inner {display:flex; justify-content:flex-start; align-items:center;}
.comnWrap .localNavi .inner .home {display:inline-block; text-indent:-9999px; width:17px; height:16px; background:url(../images/sico_home.png) no-repeat 50% 50%; background-size:100%; margin-right:37px; position:relative;}
.comnWrap .localNavi .inner .home:after {content:''; position:absolute; right:-22px; top:50%; transform:translate(0, -50%); width:8px; height:14px; background:url(../images/ar_navi.png) no-repeat 50% 50%; background-size:100%;}
.comnWrap .localNavi .inner .depth {display:inline-block; color:#555; font-size:16px; font-weight:400; position:relative; padding-right:22px; margin-right:15px;}
.comnWrap .localNavi .inner .depth:after {content:''; position:absolute; right:0; top:50%; transform:translate(0, -50%); width:8px; height:14px; background:url(../images/ar_navi.png) no-repeat 50% 50%; background-size:100%;}
.comnWrap .localNavi .inner .depth:last-child {padding-right:0; margin-right:0;}
.comnWrap .localNavi .inner .depth:last-child:after {display:none;}

.subComnSec {position:relative; padding:60px 0 150px;}
.subComnSec .inner {display:flex; justify-content:space-between; align-items:flex-start; gap:62px;}
.subComnSec .inner .subLnb {display:block; width:232px; flex:0 0 232px; margin-bottom:24px;}
.subComnSec .inner .subLnb .pSubMenu {margin-bottom:24px;}
.subComnSec .inner .subLnb .pSubMenu h1 {padding:0 16px 30px; color:#222; font-size:28px; font-weight:700; border-bottom:1px solid #222;}
.subComnSec .inner .subLnb .pSubMenu li {display:block; height:auto; border-bottom:1px solid #d3d3d3;}
.subComnSec .inner .subLnb .pSubMenu li a.dep01 {display:block; color:#222; font-size:16px; font-weight:600; padding:16px; position:relative;}
.subComnSec .inner .subLnb .pSubMenu li a.dep01:hover {color:#0e56d9;}
.subComnSec .inner .subLnb .pSubMenu li a.dep01 .tail {position:absolute; right:16px; top:25px; width:12px; height:7px; transition:.4s all;}
.subComnSec .inner .subLnb .pSubMenu li a.dep01 .tail:before {content:''; position:absolute; left:0; top:0; width:7px; height:1px; background:#222; transform:rotate(45deg);}
.subComnSec .inner .subLnb .pSubMenu li a.dep01 .tail:after {content:''; position:absolute; right:0; top:0; width:7px; height:1px; background:#222; transform:rotate(-45deg);}
.subComnSec .inner .subLnb .pSubMenu li.on a.dep01 {background:#f4f4f4; color:#0e56d9;}
.subComnSec .inner .subLnb .pSubMenu li.on a.dep01 .tail {transform:rotate(-180deg); top:19px;}
.subComnSec .inner .subLnb .pSubMenu li.on a.dep01 .tail:before {background:#0e56d9;}
.subComnSec .inner .subLnb .pSubMenu li.on a.dep01 .tail:after {background:#0e56d9;}
.subComnSec .inner .subLnb .pSubMenu li dl {position:relative; margin:6px 0; display:none;}
.subComnSec .inner .subLnb .pSubMenu li dl:after {content:''; clear:both; display:block; height:auto; overflow:hidden;}
.subComnSec .inner .subLnb .pSubMenu li dd {display:block;}
.subComnSec .inner .subLnb .pSubMenu li dd a {display:block; padding:6px 16px 6px 34px; position:relative; color:#666; font-size:16px; font-weight:400;}
.subComnSec .inner .subLnb .pSubMenu li dd a:before {content:''; position:absolute; left:23px; top:13px; width:3px; height:3px; background:#666; border-radius:50%;}
.subComnSec .inner .subLnb .pSubMenu li dd a:hover {color:#222; font-weight:500;}
.subComnSec .inner .subLnb .pSubMenu li dd a:hover:before {background:#222;}
.subComnSec .inner .subLnb .pSubMenu li dd a.on {color:#222; font-weight:500;}
.subComnSec .inner .subLnb .pSubMenu li dd a.on:before {background:#222;}
.subComnSec .inner .subLnb .contMng {border:1px solid #ddd; border-radius:8px; padding:20px 16px;}
.subComnSec .inner .subLnb .contMng .mngInfo {display:flex; justify-content:flex-start; align-items:center; gap:12px; padding-bottom:16px; margin-bottom:16px; border-bottom:1px solid #ddd;}
.subComnSec .inner .subLnb .contMng .mngInfo .icoSec {display:inline-block; width:33px; height:33px; background:url(../images/ico_tel.svg) no-repeat 50% 50%; background-size:100%;}
.subComnSec .inner .subLnb .contMng .mngInfo ul {display:block;}
.subComnSec .inner .subLnb .contMng .mngInfo ul li {display:block; position:relative; color:#222; font-size:14px; padding-left:60px; margin-bottom:8px;}
.subComnSec .inner .subLnb .contMng .mngInfo ul li:last-child {margin-bottom:0;}
.subComnSec .inner .subLnb .contMng .mngInfo ul li .txt {position:absolute; left:0; top:0; font-weight:700;}
.subComnSec .inner .subLnb .contMng .mngCau {color:#222; font-size:13px; line-height:1.3; letter-spacing:-1px;}

.subComnSec .inner .subCont {display:block; width:100%;}
.subComnSec .inner .subCont h2 {color:#222; font-size:32px; font-weight:700; padding-bottom:25px; border-bottom:1px solid #ccc; margin-bottom:30px;}

.subComnSec .inner .subCont .contInfoBox {display:flex; justify-content:flex-start; align-items:stretch; gap:10px; flex-direction:column; padding:25px; border:1px solid #ddd; border-radius:8px; margin-bottom:30px; position:relative;}
.subComnSec .inner .subCont .contInfoBox.marTop {margin-top:30px;}
.subComnSec .inner .subCont .contInfoBox .title {color:#0e56d9; font-size:18px; font-weight:600; padding-left:30px; position:relative; text-align:left;}
.subComnSec .inner .subCont .contInfoBox .title:after {content:''; position:absolute; left:0; top:0; width:20px; height:20px; background:url(../images/ico_cau_blue.svg) no-repeat 50% 50%; background-size:100%;}
.subComnSec .inner .subCont .contInfoBox .conTxt {color:#333; font-size:16px; line-height:1.3; padding-left:30px;}
.subComnSec .inner .subCont .contInfoBox .conTxt em {color:#0e56d9;}
.subComnSec .inner .subCont .contInfoBox.cau {display:block;}
.subComnSec .inner .subCont .contInfoBox.cau .conTxt {padding-left:28px; margin-bottom:20px;}
.subComnSec .inner .subCont .contInfoBox.cau .item {padding-left:46px; position:relative; color:#0e56d9; font-size:16px; font-weight:500; line-height:1.3; margin-bottom:5px;}
.subComnSec .inner .subCont .contInfoBox.cau .item:after {content:'※'; position:absolute; left:28px; top:0;}
.subComnSec .inner .subCont .contInfoBox.cau .item:last-child {margin-bottom:0;}

.subComnSec .inner .subCont .contInfoBox.warning .title {color:#222; font-size:20px; font-weight:500;}
.subComnSec .inner .subCont .contInfoBox.warning .title:after {content:''; position:absolute; left:0; top:2px; width:20px; height:20px; background:url(../images/ico_cau_red.svg) no-repeat 50% 50%; background-size:100%;}
.subComnSec .inner .subCont .contInfoBox.warning .title em {color:#d9180e;}

.subComnSec .inner .subCont .contInfoBox.onlyInfo {margin-top:30px;}
.subComnSec .inner .subCont .contInfoBox.onlyInfo .title {color:#222; font-weight:500; padding-left:0;}
.subComnSec .inner .subCont .contInfoBox.onlyInfo .title:after {display:none;}
.subComnSec .inner .subCont .contInfoBox.onlyInfo .conTxt {padding-left:0;}

.subComnSec .inner .subCont .contInfoBox ul {padding:0 14px;}
.subComnSec .inner .subCont .contInfoBox ul li {display:block; color:#666; font-size:16px; font-weight:400; line-height:1.3; margin-bottom:8px; padding-left:14px; position:relative;}
.subComnSec .inner .subCont .contInfoBox ul li:before {content:'•'; position:absolute; left:0; top:-1px;}
.subComnSec .inner .subCont .contInfoBox ul li.cau {color:#D9180E; margin-top:15px; padding-top:15px; border-top:1px dashed #ddd;}
.subComnSec .inner .subCont .contInfoBox ul li.cau.blue {color:#0e56d9;}
.subComnSec .inner .subCont .contInfoBox ul li.cau:before {content:'*'; position:absolute; left:0; top:17px;}

.subComnSec .inner .subCont .contInfoBox.icoTy {flex-direction:row; gap:0; align-items:center;}
.subComnSec .inner .subCont .contInfoBox.icoTy .ico {width:154px; flex:0 0 auto; text-align:center;}
.subComnSec .inner .subCont .contInfoBox.icoTy .ico img {width:57px;}
.subComnSec .inner .subCont .contInfoBox.icoTy .txtSec {padding-left:45px; position:relative; border-left:1px dashed #ddd;}
.subComnSec .inner .subCont .contInfoBox.icoTy .txtSec .title {margin-bottom:10px; padding-left:0;}
.subComnSec .inner .subCont .contInfoBox.icoTy .txtSec .title:after {display:none;}
.subComnSec .inner .subCont .contInfoBox.icoTy .txtSec .conTxt {padding-left:0;}

.subComnSec .inner .subCont .contInfoBox .absBtns {position:absolute; right:25px; top:50%; transform:translate(0, -50%);}
.subComnSec .inner .subCont .contInfoBox .absBtns .absBtn {display:inline-block;}
.subComnSec .inner .subCont .contInfoBox .absBtns .absBtn a {display:flex; justify-content:center; align-items:center; gap:0px; padding:6px 20px; color:#FFF; font-size:18px; font-weight:500; border-radius:8px;}
.subComnSec .inner .subCont .contInfoBox .absBtns .absBtn a:after {content:''; display:inline-block; width:10px; height:18px; background:url(../images/ar_btn.png) no-repeat 50% 50%; background-size:100%; margin-left:15px;}
.subComnSec .inner .subCont .contInfoBox .absBtns .absBtn.adobe a {background:#ed1f24; margin-right:5px;}
.subComnSec .inner .subCont .contInfoBox .absBtns .absBtn.hwp a {background:#27a0e0;}
.subComnSec .inner .subCont .contInfoBox .absBtns .absBtn.adobe a:before {content:''; display:inline-block; width:50px; height:50px; background:url(../images/sym_adobe_w.svg) no-repeat 50% 50%; background-size:100%;}
.subComnSec .inner .subCont .contInfoBox .absBtns .absBtn.hwp a:before {content:''; display:inline-block; width:50px; height:50px; background:url(../images/sym_hwp_w.svg) no-repeat 50% 50%; background-size:100%;}

.subComnSec .inner .subCont .pageTabWrap {position:relative; background:#FFF;}
.subComnSec .inner .subCont .pageTabWrap .pTab {border:2px solid #0e56d9; border-radius:8px; display:flex; justify-content:flex-start; align-items:center; flex-wrap:wrap;}
.subComnSec .inner .subCont .pageTabWrap .pTab a {display:flex; justify-content:center; align-items:center; height:56px; width:16.66667%; padding:0 10px; color:#222; font-size:16px; font-weight:400; text-align:center; position:relative; word-break:break-all;}
.subComnSec .inner .subCont .pageTabWrap .pTab a.on {background:#0e56d9; color:#FFF;}
.subComnSec .inner .subCont .pageTabWrap .pTab a:hover {color:#0e56d9; font-weight:600;}
.subComnSec .inner .subCont .pageTabWrap .pTab a:after {content:''; position:absolute; right:0; top:50%; transform:translate(0, -50%); width:1px; height:15px; background:#cfddf7;}
.subComnSec .inner .subCont .pageTabWrap .pTab a.on:after {display:none;}
.subComnSec .inner .subCont .pageTabWrap .pTab a.on:hover {color:#FFF;}
.subComnSec .inner .subCont .pageTabWrap .pTab.col1 a:before {display:none;}
.subComnSec .inner .subCont .pageTabWrap .pTab.col2 a {width:50%;}
.subComnSec .inner .subCont .pageTabWrap .pTab.col2 a:before {display:none;}
.subComnSec .inner .subCont .pageTabWrap .pTab.col3 a {width:33.333334%;}
.subComnSec .inner .subCont .pageTabWrap .pTab.col3 a:before {display:none;}
.subComnSec .inner .subCont .pageTabWrap .pTab.col4 a {width:25%;}
.subComnSec .inner .subCont .pageTabWrap .pTab.col5 a {width:20%;}
.subComnSec .inner .subCont .pageTabWrap .pTab.col6 a {width:33.33334%;}
.subComnSec .inner .subCont .pageTabWrap .pTab.col6 a:nth-child(3n):after {display:none;}
.subComnSec .inner .subCont .pageTabWrap .pTab.col6 a:before {content:''; position:absolute; left:0; bottom:0; width:100%; height:1px; background:#cfddf7; display:block;}
.subComnSec .inner .subCont .pageTabWrap .pTab.col6 a:nth-child(n+4):nth-child(-n+30):before {display:none;}
.subComnSec .inner .subCont .pageTabWrap .pTab.col7 a {width:25%;}
.subComnSec .inner .subCont .pageTabWrap .pTab.col12 a {width:25%;}

.contSec {position:relative; margin:60px 0 0 0;}
.contSec .imgTxtCont {display:flex; justify-content:space-between; align-items:stretch; border-top:2px solid #444; border-bottom:1px solid #ccc;}
.contSec .imgTxtCont .perImgTxt {display:block; width:33.3333%; text-align:center; padding:60px 40px;}
.contSec .imgTxtCont .perImgTxt .imgSec {display:block; text-align:center; margin-bottom:20px;}
.contSec .imgTxtCont .perImgTxt .imgSec img {width:100px;}
.contSec .imgTxtCont .perImgTxt .txtSec .title {color:#222; font-size:20px; font-weight:600; margin-bottom:15px;}
.contSec .imgTxtCont .perImgTxt .txtSec .desc {color:#222; font-size:16px; font-weight:400; line-height:1.4;}
.contSec .imgSec {position:relative; text-align:center;}
.contSec .imgSec img {max-width:100%; width:auto;}

.contSec .partBox {position:relative;}
.contSec .pGuideBox {padding:25px; color:#222; font-size:16px; line-height:1.6; border-radius:8px; background:#f0fbff; margin-bottom:30px;}
.contSec .pGuideBox.marTop {margin-top:30px;}
.contSec .pGuideBox.gray {background:#f4f4f4;}
.contSec .pGuideBox em {color:#0e56d9;}
.contSec .pGuideBox li {display:block; line-height:1.6; margin-bottom:5px; color:#222; font-size:16px; position:relative; padding-left:25px;}
.contSec .pGuideBox li:last-child {margin-bottom:0;}
.contSec .pGuideBox li span {position:absolute; left:0; top:0;}
.contSec .pGuideBox .numNo li {padding-left:70px;}
.contSec .pGuideBox .numNo li span {font-weight:700;}

.contSec .pGuideBox ul.items li {padding-left:16px;}
.contSec .pGuideBox ul.items li:before {content:''; position:absolute; left:0; top:11px; width:6px; height:1px; background:#666;}

.contSec h3 {color:#000; font-size:22px; font-weight:700; padding-left:28px; position:relative; margin-bottom:40px;}
.contSec h3:before {content:''; position:absolute; left:0; top:3px; width:20px; height:20px; background:url(../images/dot_title.svg) no-repeat 50% 50%; background-size:100%;}
.contSec.cctv h3 {padding-left:0;}
.contSec.cctv h3:before {display:none;}

.contSec .comnConTitle {color:#000; font-size:22px; font-weight:700; padding-left:28px; position:relative; margin-bottom:30px;}
.contSec .comnConTitle:before {content:''; position:absolute; left:0; top:3px; width:20px; height:20px; background:url(../images/dot_title.svg) no-repeat 50% 50%; background-size:100%;}
.contSec .comnConTitle em {display:inline-block; margin-left:8px; font-size:16px; font-weight:400;}

.contSec .midTitle {color:#000; font-size:16px; font-weight:700; margin-bottom:10px; padding-left:13px; position:relative;}
.contSec .midTitle:before {content:''; position:absolute; left:0; top:7px; width:4px; height:4px; background:#000; border-radius:50%;}
.contSec .midTitle.marTop {margin-top:20px;}
.contSec .midTitle em {font-weight:400;}
.contSec .perCont {padding:0 16px; margin-bottom:30px; color:#666; font-size:16px; line-height:1.3;}
.contSec .perCont:last-child {margin-bottom:0;}
.contSec .perCont .imgSec {position:relative; padding:0 14px;}
.contSec .perCont .imgSec.marTop {margin-top:30px;}
.contSec .perCont .imgSec.marSet {margin:30px 0;}
.contSec .perCont .contDesc {color:#666; font-size:16px; font-weight:400; line-height:1.4; padding:0 16px;}
.contSec .perCont .btns {clear:both; display:block; margin-top:0px; padding:0 16px;}
.contSec .perCont .btns .btnLink {display:inline-block; width:auto;}
.contSec .perCont .btns .btnLink a {display:block; padding:22px 64px 22px 24px; position:relative; background:#0e56d9; color:#FFF; font-size:18px; font-weight:500; margin-top:40px; border-radius:6px;}
.contSec .perCont .btns .btnLink a:after {content:''; position:absolute; right:24px; top:50%; transform:translate(0, -50%); width:10px; height:18px; background:url(../images/ar_btn.png) no-repeat 50% 50%; background-size:100%;}

.contSec .perCont ul {padding:0 14px;}
.contSec .perCont ul.marTop {margin-top:20px;}
.contSec .perCont ul li {display:block; color:#666; font-size:16px; font-weight:400; line-height:1.4; margin-bottom:6px; padding-left:14px; position:relative;}
.contSec .perCont ul li:before {content:''; position:absolute; left:0; top:8px; width:6px; height:1px; background:#666;}
.contSec .perCont ul li.cau {color:#0e56d9;}
.contSec .perCont ul li.cau:before {content:'※'; position:absolute; left:0; top:0px; width:auto; height:auto; background:none;}
.contSec .perCont ul li a.outLink {display:inline-block; color:#0e56d9; position:relative; padding-right:25px; margin-top:5px; font-weight:600;}
.contSec .perCont ul li a.outLink:after {content:''; position:absolute; right:0; top:2px; width:15px; height:15px; background:url(../images/ico_outlink_b.svg) no-repeat 50% 50%; background-size:100%;}
.contSec .perCont ul li a.outLink:before {content:''; position:absolute; left:0; bottom:-1px; width:calc(100% - 25px); height:1px; background:#0e56d9;}
.contSec .perCont ul li em {color:#0e56d9; font-weight:700;}
.contSec .perCont a.btnDownload {display:inline-block; margin-left:10px; color:#0e56d9; font-size:16px; font-weight:700; position:relative;}
.contSec .perCont a.btnDownload:before {content:''; display:inline-block; width:15px; height:15px; background:url(../images/ico_download_blue.svg) no-repeat 50% 50%; background-size:100%; margin-right:5px; vertical-align:-2px;}

.contSec .imgBlock {position:relative; margin-bottom:30px;}
.contSec .imgBlock.marTop {margin-top:30px;}
.contSec .imgBlock .imgTitle {display:block; text-align:center; color:#222; font-size:22px; font-weight:700; padding:20px 0; border-top:2px solid #ddd; background:#f4f4f4;}
.contSec .imgBlock .img {padding:60px 30px; text-align:center;}
.contSec .imgBlock .img img {width:auto; max-width:100%;}

.contSec .perCont ul.depth02 {padding:0;}
.contSec .perCont ul.depth02.padSet {padding:0 10px;}
.contSec .perCont ul.depth02 li:before {content:'•'; position:absolute; left:0; top:-2px; width:auto; height:auto; background:none;}
.contSec .perCont ul.depth02 li span {color:#000; font-weight:500;}
.contSec .perCont ul.depth02 li .item {display:inline-block; width:80px; font-weight:700;}
.contSec .perCont ul.depth02 li.cau {color:#0e56d9;}
.contSec .perCont ul.depth02 li.cau:before {content:'※'; position:absolute; left:0; top:0px; width:auto; height:auto; background:none;}

.contSec .perCont ul.itemBox {display:flex; justify-content:flex-start; align-items:stretch; gap:20px; padding:0 14px; margin-bottom:20px;}
.contSec .perCont ul.itemBox:last-child {margin-bottom:0;}
.contSec .perCont ul.itemBox li {width:100%; display:block; border:1px solid #ddd; border-radius:8px; margin-bottom:0; padding-left:0; text-align:center; overflow:hidden; flex:0 1 auto;}
.contSec .perCont ul.itemBox li p {display:block; padding:10px 0; color:#FFF; font-size:16px; font-weight:700; background:#666;}
.contSec .perCont ul.itemBox li p.level01 {background:#0e56d9;}
.contSec .perCont ul.itemBox li p.level02 {background:#f0aa02;}
.contSec .perCont ul.itemBox li p.level03 {background:#f0710a;}
.contSec .perCont ul.itemBox li p.level04 {background:#d9180e;}
.contSec .perCont ul.itemBox li span {display:block; padding:25px 20px; color:#222; font-size:16px;}
.contSec .perCont ul.itemBox li span em {display:block; margin-bottom:5px; font-weight:700; color:#222;}
.contSec .perCont ul.itemBox li:before {display:none;}

.contSec .perCont ul.conDesc li {display:flex; justify-content:flex-start; align-items:flex-start;}
.contSec .perCont ul.conDesc li em {width:55px;}

.contSec .perCont.depth02 {margin:20px 0;}
.contSec .perCont.depth02 ul {padding:0;}
.contSec .perCont.depth02 ul li {padding-left:14px;}
.contSec .perCont.depth02 ul li.cau {color:#D9180E;}
.contSec .perCont.depth02 ul li:before {content:'※'; position:absolute; left:0; top:0px; width:auto; height:auto; background:none;}

.contSec .perCont .scrollTable {padding:0 14px;}
.contSec .perCont .icoTitle {display:flex; justify-content:flex-start; align-items:center; color:#222; font-size:22px; font-weight:700; position:relative; gap:10px; margin-bottom:20px;}
.contSec .perCont .icoTitle:before {content:''; display:inline-block; width:34px; height:34px;}
.contSec .perCont .icoTitle.ico01:before {background:url(../images/ico_e0401.svg) no-repeat 50% 50%; background-size:100%;}
.contSec .perCont .icoTitle.ico02:before {background:url(../images/ico_e0402.svg) no-repeat 50% 50%; background-size:100%;}
.contSec .perCont .icoTitle.ico03:before {background:url(../images/ico_e0403.svg) no-repeat 50% 50%; background-size:100%;}
.contSec .perCont .icoTitle.ico04:before {background:url(../images/ico_e0404.svg) no-repeat 50% 50%; background-size:100%;}
.contSec .perCont .icoTitle.ico05:before {background:url(../images/ico_e0405.svg) no-repeat 50% 50%; background-size:100%;}
.contSec .perCont .icoTitle.ico06:before {background:url(../images/ico_e0406.svg) no-repeat 50% 50%; background-size:100%;}
.contSec .perCont .icoTitle.ico07:before {background:url(../images/ico_e0407.svg) no-repeat 50% 50%; background-size:100%;}

.contSec hr {display:block; margin:60px 0; position:relative; border:0; border-top:1px solid #cfcfcf;}
.contSec hr.bdrNone {border:0; margin:60px 0 0 0;}

.inPartBox {display:flex; justify-content:flex-start; align-items:center; gap:60px;}
.inPartBox .btnWater {width:30%; flex:0 0 auto;}
.inPartBox .btnWater a {display:block; padding:30px; color:#FFF; font-size:20px; position:relative; border-radius:8px; background:#0e56d9; line-height:1.2;}
.inPartBox .btnWater a:after {content:''; position:absolute; right:24px; top:50%; transform:translate(0, -50%); width:10px; height:18px; background:url(../images/ar_btn.png) no-repeat 50% 50%; background-size:100%;}
.inPartBox .btnWater a span {font-size:14px;}

.scrollTable {position:relative; overflow:hidden; overflow-x:auto;}
.scrollTable:after {display:none;}
.scrollTable table {padding:0; margin:0; width:100%; table-layout:fixed; min-width:768px;}
.scrollTable table th, .scrollTable table td {padding:14px; color:#222; font-size:16px; border:1px solid #ddd;}
.scrollTable table th {text-align:center; font-weight:600; background:#f4f4f4;}
.scrollTable table th.sideItem {background:#f9f9f9;}
.scrollTable table td {text-align:left; padding:20px;}
.scrollTable table td dl {display:block; height:auto; overflow:hidden; margin-bottom:30px;}
.scrollTable table td dl:last-child {margin-bottom:0;}
.scrollTable table td dl dt {color:#222; position:relative; padding-left:12px; font-weight:600; margin-bottom:10px;}
.scrollTable table td dl dt:after {content:''; position:absolute; left:0; top:8px; width:4px; height:4px; border-radius:50%; background:#222;}
.scrollTable table td dl dd {color:#666; line-height:1.4; position:relative; padding-left:12px;}
.scrollTable table td dl dd:after {content:''; position:absolute; left:0px; top:8px; width:4px; height:1px; background:#666;}
.scrollTable table td dl dd.cau {padding-left:0; margin-top:10px;}
.scrollTable table td dl dd.cau:after {display:none;}
.scrollTable table td.arCenter {text-align:center; vertical-align:middle;}
.scrollTable table td.arRight {text-align:right;}
.scrollTable.arCenter table td {text-align:center;}
.scrollTable.shortCenter table {min-width:1024px;}
.scrollTable.shortCenter table th {padding:10px 0;}
.scrollTable.shortCenter table td {text-align:center; padding:10px 0; vertical-align:middle;}
.scrollTable .cau {margin-top:20px;}
.scrollTable ul li {display:block; position:relative; color:#D9180E; font-size:16px; font-weight:400; line-height:1.3; margin-bottom:6px; padding-left:14px;}
.scrollTable ul li:before {content:'※'; position:absolute; left:0; top:0px; width:auto; height:auto; background:none;}
.scrollTable.max table {min-width:1280px;}
.scrollTable.res table {min-width:100%;}

/* 홍수특보상황 현재년도 style 적용 */
.bbsTable .fldNo {width:10%; flex:0 0 100px;}
.bbsTable .fldDate {width:30%; flex:0 0 auto;}
.bbsTable .fldId {width:25%; flex:0 0 auto;}
.bbsTable .fldContent {width:37.4%; flex:0 0 auto;}


.bbsTable {position:relative;}
.bbsTable .thead {display:flex; justify-content:flex-start; align-items:center; border-top:2px solid #222; background:#f4f4f4; width:100%;}
.bbsTable span {color:#222; border-right:1px solid #ddd; font-size:16px;}
.bbsTable span:last-child {border-right:0;}
.bbsTable .thead span {color:#222; border-right:1px solid #ddd; font-size:16px; text-align:center; font-weight:700; padding:30px 0; border-bottom:1px solid #ddd;}
.bbsTable .thead span:last-child {border-right:0;}
.bbsTable .no {width:100px; flex:0 0 100px;}
.bbsTable .subject {width:100%;}
.bbsTable .round {width:15%; flex:0 0 auto;}
.bbsTable .time {width:15%; flex:0 0 auto;}
.bbsTable .depart {width:15%; flex:0 0 auto;}
.bbsTable .tel {width:15%; flex:0 0 auto;}
.bbsTable .date {width:15%; flex:0 0 auto;}
.bbsTable .hit {width:10%; flex:0 0 auto;}
.bbsTable .cDate {width:120px; flex:0 0 auto;}
.bbsTable .cName {width:110px; flex:0 0 auto;}
.bbsTable .cTime {width:160px; flex:0 0 auto;}
.bbsTable .cMount {width:150px; flex:0 0 auto;}
.bbsTable .apoint {width:20%; flex:0 0 auto;}
.bbsTable .pnum {width:20%; flex:0 0 auto;}
.bbsTable .pointcont {width:20%; flex:0 0 auto;}
.bbsTable .cDesc {width:calc(100% - 540px); flex:0 0 auto; padding:0 15px;}
.bbsTable .partwork {width:calc((100% - 260px) - 15%); flex:0 0 auto; padding:0 15px;}
.bbsTable .tbody {position:relative;}
.bbsTable .tbody li {display:block; border-bottom:1px solid #ddd; position:relative;}
.bbsTable .tbody li:after {content:''; clear:both; display:block; height:auto; overflow:hidden;}
.bbsTable .tbody li:hover {background:#eef4ff;}
.bbsTable .tbody li a {display:flex; justify-content:flex-start; align-items:center; width:100%;}
.bbsTable .tbody li span {padding:20px 0; text-align:center;}
.bbsTable .tbody li span em {display:none;}
.bbsTable .tbody li .subject {text-align:left; padding:20px;}
.bbsTable .tbody.noLink li {display:flex; justify-content:flex-start; align-items:stretch;}
.bbsTable .tbody.noLink li p {color:#222; border-right:1px solid #ddd; font-size:16px;}
.bbsTable .tbody.noLink li p:last-child {border-right:0;}
.bbsTable .tbody.noLink li p span {display:flex; justify-content:center; align-items:center; height:100%; padding:20px 0; text-align:center;}
.bbsTable .tbody.noLink li p.partwork span {text-align:left; justify-content:flex-start;}

.bbsTable .moreView a {display:block; width:100%; max-width:300px; margin:40px auto 0; padding:15px 0; border:2px solid #222; border-radius:50px; color:#222; font-size:18px; font-weight:700; text-align:center; box-sizing:border-box;}

.pagination {margin-top:50px; display:flex; justify-content:center; align-items:center;}
.pagination a {display:block; width:30px; height:30px; line-height:28px; text-align:center; font-size:14px; font-weight:400; margin-left:-1px;}
.pagination a:first-child {margin-left:0;}
.pagination a:hover {border:1px solid #0e56d9; position:relative; z-index:10;}
.pagination a.on {border:1px solid #0e56d9; background:#0e56d9; color:#FFF; position:relative; z-index:10;}
.pagination a.dir {border:1px solid #ddd;}
.pagination a.dir.first {background:url(../images/bbs_dir_first.png) no-repeat 50% 50%;}
.pagination a.dir.forward {background:url(../images/bbs_dir_forward.png) no-repeat 50% 50%; margin-right:5px;}
.pagination a.dir.back {background:url(../images/bbs_dir_back.png) no-repeat 50% 50%;}
.pagination a.dir.backword {background:url(../images/bbs_dir_backward.png) no-repeat 50% 50%; margin-left:5px;}

.bbsFunc {display:flex; justify-content:space-between; align-items:center; margin-bottom:15px;}
.bbsFunc .bbsSearch {width:100%; display:flex; justify-content:flex-start; align-items:stretch; gap:4px;}
.bbsFunc .bbsSearch button {border:0; background:#444; color:#FFF; font-size:14px; font-weight:600; padding:0 14px; border-radius:4px;}
.bbsFunc .bbsSearch button.excel {background:#0ac097;}

/*form 태그 안에 있으면 css 적용이 안되서 임시 제작(작성자 : 유태균)*/
.bbsTable .bbsFunc .bbsSearch .searchForm button {border:0; background:#444; color:#FFF; font-size:14px; font-weight:600; padding:12px 14px; border-radius:4px;}
.bbsTable .bbsFunc .bbsSearch .csvForm button {border:0; background:#444; color:#FFF; font-size:14px; font-weight:600; padding:12px 14px; border-radius:4px;}
.bbsTable .bbsFunc .bbsSearch .csvForm button.excel {background:#0ac097;}
/*****************************************************/

.viewTable {position:relative;}
.viewTable .vSubject {padding:20px; border-top:2px solid #222; background:#f4f4f4; color:#222; font-size:16px; font-weight:700; line-height:1.3;}
.viewTable .vBlock {padding:20px; position:relative; border-bottom:1px solid #ddd;}
.viewTable .vBlock.cont {padding:40px 20px; font-size:16px !important; line-height:1.3 !important; font-family:'Pretendard Variable', sans-serif !important; min-height:200px; border-bottom:2px solid #ddd;}
.viewTable .vBlock.cont div, .viewTable .vBlock.cont p, .viewTable .vBlock.cont .vInfo span {line-height:1.3 !important; font-family:'Pretendard Variable', sans-serif !important;}
.viewTable .vBlock .vInfo {}
.viewTable .vBlock .vInfo span {color:#222; font-size:16px; font-weight:400; margin-right:30px;}
.viewTable .vBlock .vInfo span:last-child {margin-right:0;}
.viewTable .vBlock span em {position:relative; padding-left:10px; font-weight:700; margin-right:15px;}
.viewTable .vBlock span em:after {content:''; position:absolute; left:0; top:8px; width:4px; height:4px; background:#222; border-radius:50%;}

.viewTable .vBlock.flex.start {align-items:flex-start;}
.viewTable .vBlock.flex.start span {margin-right:0px; flex:0 0 auto;}
.viewTable .vBlock.flex.start ul {width:100%;}
.viewTable .vBlock.flex.start li {float:left; width:33.3333%; line-height:1.3;}
.viewTable .vBlock.flex.start li a {display:block; font-size:16px; color:#222;}

.viewForm {padding:40px; border-top:2px solid #222; background:#f4f4f4; color:#222; font-size:16px; line-height:1.3; text-align:center;}
.viewForm .subject {font-size:36px; font-weight:700;}
.viewForm .formInfo {display:flex; justify-content:space-between; align-items:flex-start; margin:15px 0;}
.viewForm .formInfo .infoTxt {font-size:20px; font-weight:700; line-height:1.4;}
.viewForm .formInfo .infoTxt:last-child {text-align:right;}
.viewForm .viewCon .txt {font-size:20px; padding:20px 0; font-weight:500;}
.viewForm .viewCon .scrollTable {margin-top:20px;}
.viewForm .viewCon .scrollTable .legendTxt {text-align:left; margin-bottom:10px;}
.viewForm .viewCon .scrollTable tr:first-child th {border-top:2px solid #0e56d9;}
.viewForm .viewCon .scrollTable th {background:#f0fbff; color:#0e56d9;}
.viewForm .viewCon .scrollTable td {background:#FFF; text-align:center;}
.viewForm .viewCon .contInfoBox {padding:0 !important; margin-top:20px; text-align:left; border:0 !important;}

.bbsBtns {position:relative; margin:40px 0;}
.bbsBtns .btn a {display:inline-block; padding:16px 27px; border-radius:4px; font-size:16px; border:1px solid #ddd; color:#222; position:relative;}
.bbsBtns .list a {background:#666; border:1px solid #666; color:#FFF; font-weight:600;}
.bbsBtns .print a {background:#0ac097; border:1px solid #0ac097; color:#FFF; font-weight:600;}
.bbsBtns .print a:before {content:''; display:inline-block; width:16px; height:16px; background:url(../images/ico_print_w.svg) no-repeat 50% 50%; background-size:100%; margin-right:8px; vertical-align:-2px;}
.bbsBtns .relBtn {}
.bbsBtns .relBtn .btn a:hover {border:1px solid #666;}
.bbsBtns .relPrev a:before {content:''; display:inline-block; width:8px; height:14px; background:url(../images/ar_navi.png) no-repeat 50% 50%; transform:rotate(180deg); margin-right:10px; vertical-align:0px;}
.bbsBtns .relNext a:after {content:''; display:inline-block; width:8px; height:14px; background:url(../images/ar_navi.png) no-repeat 50% 50%; margin-left:10px; vertical-align:-2px;}
.bbsBtns .bbsFuncBtns {}

.relArticle {position:relative; border-top:1px solid #ddd;}
.relArticle .perArticle {display:flex; justify-content:flex-start; align-items:stretch; border-bottom:1px solid #ddd; padding:20px;}
.relArticle .perArticle .item {display:block; color:#222; font-size:16px; font-weight:600; position:relative;}
.relArticle .perArticle .item span {display:inline-block; width:12px; height:7px; position:relative; margin-left:10px; vertical-align:0px;}
.relArticle .perArticle .item span:before {content:''; position:absolute; left:0; top:0; width:7px; height:1px; background:#222; transform:rotate(45deg);}
.relArticle .perArticle .item span:after {content:''; position:absolute; right:0; top:0; width:7px; height:1px; background:#222; transform:rotate(-45deg);}
.relArticle .perArticle:first-child .item span {transform:rotate(180deg); vertical-align:5px;}
.relArticle .perArticle a {padding-left:40px; color:#222; font-size:16px; font-weight:400; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}

.conInfoBox {border:1px solid #ddd; border-radius:8px; padding:24px; display:flex; justify-content:flex-start; align-items:center;}
.conInfoBox .imgSec {width:30%; flex:0 0 auto; text-align:center;}
.conInfoBox .imgSec img {width:auto; max-width:100%;}
.conInfoBox .txtSec {padding:24px 36px 24px 60px; border-left:1px dashed #999; width:100%;}
.conInfoBox .txtSec .title {color:#222; font-size:20px; font-weight:600; line-height:1.4; margin-bottom:20px;}
.conInfoBox .txtSec .title em {color:#0e56d9;}
.conInfoBox .txtSec .title.short {margin-bottom:10px;}
.conInfoBox .txtSec .tel {color:#222; font-size:36px; font-weight:700;}
.conInfoBox .txtSec .item {color:#666; font-size:18px; font-weight:400; line-height:1.4; padding-left:18px; position:relative; margin-bottom:20px;}
.conInfoBox .txtSec .item:after {content:'※'; position:absolute; left:0; top:0;}
.conInfoBox .txtSec .item.single {padding-left:0;}
.conInfoBox .txtSec .item.single:after {display:none;}
.conInfoBox .txtSec li {display:block; position:relative; padding-left:18px; margin-bottom:10px;}
.conInfoBox .txtSec li:after {content:''; position:absolute; left:4px; top:8px; width:4px; height:4px; background:#0e56d9; border-radius:50%;}
.conInfoBox .txtSec li a {display:inline-block; color:#0e56d9; font-size:18px; font-weight:500; position:relative; padding-right:25px;}
.conInfoBox .txtSec li a:after {content:''; position:absolute; right:0; top:4px; width:15px; height:15px; background:url(../images/ico_outlink_b.svg) no-repeat 50% 50%; background-size:100%;}
.conInfoBox .txtSec li a:before {content:''; position:absolute; left:0; bottom:-1px; width:calc(100% - 25px); height:1px; background:#0e56d9;}
.conInfoBox .txtSec .btns {display:flex; justify-content:flex-start; align-items:center; gap:12px; width:100%;}
.conInfoBox .txtSec .btnLink {display:inline-block; width:100%; max-width:300px;}
.conInfoBox .txtSec .btnLink a {display:block; padding:22px 24px; position:relative; background:#0e56d9; color:#FFF; font-size:18px; font-weight:500; margin-top:40px; border-radius:6px;}
.conInfoBox .txtSec .btnLink a:after {content:''; position:absolute; right:24px; top:50%; transform:translate(0, -50%); width:10px; height:18px; background:url(../images/ar_btn.png) no-repeat 50% 50%; background-size:100%;}
.conInfoBox .txtSec .btnLink.dark a {background:#104096;}
.conInfoBox .txtSec .items {margin-top:10px;}
.conInfoBox .txtSec .items li {color:#222; font-size:18px; margin-bottom:0; margin:5px 0; line-height:1.4;}
.conInfoBox .txtSec .items li:after {background:#222; top:10px;}

.comnImgSec {border:1px solid #ddd; border-radius:8px; padding:70px; text-align:center;}
.comnImgSec.bdrNone {border:0;}
.comnImgSec img {width:auto; max-width:100%;}

.useStep {display:flex; justify-content:center; align-items:stretch; gap:54px; margin-bottom:60px;}
.useStep .perStep {display:flex; justify-content:flex-start; align-items:center; gap:24px; border:1px solid #ddd; border-radius:8px; padding:10px 24px; position:relative; color:#666; font-size:16px; line-height:1.6; width:calc(33.3333% - 36px); flex:0 0 auto;}
.useStep .perStep:after {content:''; position:absolute; right:-44px; top:50%; transform:translate(0, -50%); width:32px; height:32px; background:url(../images/ar_step.svg) no-repeat 50% 50%; background-size:100%;}
.useStep .perStep:last-child:after {display:none;}
.useStep .perStep .num {color:#0ac097; font-size:40px; font-weight:500;}

.cauTitle {color:#222; font-size:20px; font-weight:600; line-height:1.4; padding-left:28px; position:relative; margin-bottom:10px;}
.cauTitle:after {content:''; position:absolute; left:0; top:4px; width:20px; height:20px; background:url(../images/ico_cau_red.svg) no-repeat 50% 50%; background-size:100%;}
.cauTitle.blue:after {background:url(../images/ico_cau_blue.svg) no-repeat 50% 50%; background-size:100%;}

.schSec {display:flex; justify-content:flex-end; align-items:center; gap:30px; padding:20px 0; border-top:2px solid #222; border-bottom:1px solid #222;}
.schSec .selectBox select {display:inline-block; width:150px; margin:0 5px;}
.schSec .dateBox {display:flex; justify-content:center; align-items:center; gap:10px;}
.schSec .dateBox .dbTitle {color:#222; font-size:16px;}
input.calendar {background:#FFF url(../images/ico_schedule.svg) no-repeat 94% 50%; background-size:17px 14px; padding-right:40px; width:200px;}
.schSec button {border:0; background:#444; color:#FFF; font-size:14px; font-weight:600; padding:0 14px; border-radius:4px; height:40px;}

.itemFunc {display:flex; justify-content:space-between; align-items:center; margin:60px 0 15px;}
.itemFunc .itemSearch {width:100%; display:flex; justify-content:flex-start; align-items:center; gap:10px;}
.itemFunc .itemSearch .funcTitle {font-size:16px; font-weight:500; margin-right:10px;}
.itemFunc .itemSearch button {border:0; background:#444; color:#FFF; font-size:14px; font-weight:600; padding:0 14px; border-radius:4px; height:40px;}

.comnItemList {margin:60px 0 30px;}
.comnItemList select {width:100%; max-width:230px;}
.comnItemList span a {display:inline-block; margin:6px 3px; width:130px; padding:6px 0; text-align:center; border-radius:50px; border:1px solid #ddd; color:#222; font-size:16px;}
.comnItemList span a:hover {border:1px solid #0e56d9; color:#0e56d9;}
.comnItemList span a.on {background:#0e56d9; border:1px solid #0e56d9; color:#FFF;}
.comnItemList.large span a {width:13%;}

.comnItemList.policy {margin:0 0 30px;}
.comnItemList.policy span a {width:auto; padding:6px 25px;}

.scrollTable.b010101 table tr:nth-child(even) {background:#f5f8fd;}

.formBox {position:relative; border:1px solid #333; border-radius:8px; overflow:hidden;}
.formBox table {padding:0; margin:0; width:100%; table-layout:fixed;}
.formBox th, .formBox td {padding:15px; text-align:left; border:1px solid #ddd; font-weight:500;}
.formBox th {color:#0e56d9; padding:10px 20px; font-size:16px; font-weight:500; background:#f0fbff;}
.formBox .formBlock {display:flex; justify-content:flex-start; align-items:center; margin-bottom:10px;}
.formBox .formBlock .inTitle {width:45px;}
.formBox .formBlock .at {width:20px; text-align:center;}
.formBox .formBlock select {width:calc(40% - 75px); margin-left:10px;}
.formBox .formBlock input[type="text"] {width:30%;}
.formBox .mentTxt {color:#333; font-size:14px; margin:15px 0; line-height:1.2;}
.formBox .termsBox .smTitle {font-weight:600; margin-bottom:10px;}
.formBox .termsBox .terms {background:#f4f4f4; padding:20px; line-height:1.3; margin-bottom:15px;}
.formBox .termsBox .terms li {display:block; color:#666; font-size:14px; font-weight:400; line-height:1.2; margin-bottom:5px; padding-left:14px; position:relative;}
.formBox .termsBox .terms li:before {content:'•'; position:absolute; left:0; top:-1px;}
.formBox .termsBox .terms li.cau:before {content:'*'; position:absolute; left:0; top:2px;}
.formBox input {width:100%;}
.formBox textarea {display:inline-block; width:100%; background:#FFF; border:1px solid #ddd; border-radius:4px; height:100px; line-height:1.3; padding:9px; color:#333; font-size:16px; font-weight:500;}
.formBox .limitWord {margin-top:5px; font-size:14px;}
.formBox td label.radioB {margin-right:20px;}
.formBox td button {display:inline-block; padding:6px 15px; border-radius:4px; border:1px solid #0e56d9; background:#0e56d9; color:#FFF; font-size:16px; font-weight:500;}
.formBox td button:hover {background:#FFF; color:#0e56d9;}
.formBox td .apiResult {color:#000; font-size:16px; line-height:1.4; min-height:300px; overflow:hidden; overflow-y:auto;}

.halfSec {display:flex; justify-content:flex-start; align-items:stretch; flex-wrap:wrap; gap:20px 20px;}
.halfSec .formBox {width:calc(60% - 10px);}
.halfSec .legalBox {width:calc(40% - 10px); border-radius:8px; border:1px solid #ddd;}
.halfSec .btnArea {width:100%; text-align:center; margin-top:30px;}
.halfSec .btnArea a {display:inline-block; padding:16px 36px; border-radius:4px; font-size:16px; border:1px solid #0e56d9; background:#0e56d9; color:#FFF;}

.legalBox .innerBox {height:715px; overflow:hidden; overflow-y:auto; padding:20px;}
.legalBox .innerBox * {line-height:1.5;}
.legalBox .innerBox h5 {margin:15px 0;}
.legalBox .innerBox li {margin:8px 0;}
.legalBox .innerBox .mrg_t10 {color:#0e56d9;}
.legalBox label.chkB {margin:20px 0; padding:0 20px;}

.policyBox {position:relative; padding:40px 0;}
.policyBox .pyTitle {color:#000; font-size:16px; font-weight:700; margin-bottom:20px;}
.policyBox .pyTitle em {color:#0e56d9;}
.policyBox div.perPolicy {color:#000; font-size:16px; line-height:1.3; padding:20px; background:#f4f4f4; border-radius:8px;}
.policyBox .appyDate {display:inline-block; background:#0e56d9; padding:10px 30px; border-radius:50px; color:#FFF;}

.perPolicy {counter-reset: circle 0; padding:20px; background:#f4f4f4; border-radius:8px;}
.perPolicy li {position:relative; padding-left:20px; font-size:16px; line-height:1.3; margin-bottom:10px;}
.perPolicy li:last-child {margin-bottom:0;}
.perPolicy li:before {content:counter(circle); counter-increment:circle 1; position:absolute; left:0; top:2px; color:#333; font-size:12px; width:14px; height:14px; line-height:14px; text-align:center;}
.perPolicy li:after {content:''; position:absolute; left:0; top:2px; width:14px; height:14px; border:1px solid #333; border-radius:50%; box-sizing:border-box;}

.perPolicy li dl {counter-reset: number 0; margin-top:10px;}
.perPolicy li dd {position:relative; padding-left:18px; line-height:1.3; margin-bottom:10px;}
.perPolicy li dd:last-child {margin-bottom:0;}
.perPolicy li dd:before {content:counter(number)')'; counter-increment:number 1; position:absolute; left:0; top:0;}

.popWrap {max-width:100%; background:#f8f8f8;}
.popHead {background:#0e56d9; display:flex; justify-content:space-between; align-items:center; padding:20px;}
.popHead .popTitle {color:#FFF; font-size:28px; font-weight:600;}
.popHead .popUtil {position:relative;}
.popHead .popUtil .dePart {color:#FFF; font-size:16px;}

.popFunc {padding:20px; background:#FFF;}
.pfBlock {display:flex; justify-content:flex-start; align-items:center; margin-bottom:15px;}
.pfBlock.between {justify-content:space-between;}
.pfBlock:last-child {margin-bottom:0;}
.pfBlock .pfItem {display:flex; justify-content:flex-start; align-items:center; gap:8px; flex-wrap:wrap; margin-right:30px;}
.pfBlock .pfItem:last-child {margin-right:0;}
.pfBlock .pfItem .item {color:#222; font-size:16px; font-weight:600; flex:0 0 auto;}
.pfBlock .pfItem .ipCon {color:#666; font-size:14px; line-height:1.2;}
.pfBlock .pfItem select {width:200px;}
.pfBlock .pfItem .sortBtns {border:1px solid #646b76; border-radius:4px; display:flex; justify-content:flex-start; align-items:center;}
.pfBlock .pfItem .sortBtns .sort a {display:block; padding:0px 15px; color:#666; font-size:14px; flex:0 0 auto; position:relative; height:40px; line-height:40px;}
.pfBlock .pfItem .sortBtns .sort a.on {background:#646b76; color:#FFF;}
.pfBlock .pfItem .sortBtns .sort a:after {content:''; position:absolute; right:0; top:50%; transform:translate(0, -50%); width:1px; height:50%; background:#ddd;}
.pfBlock .pfItem .sortBtns .sort a.on:after {display:none;}
.pfBlock .pfItem .sortBtns .sort:last-child a:after {display:none;}

.pfBlock .pfItem button {display:flex; justify-content:center; align-items:center; gap:5px; border-radius:4px; border:0; color:#FFF; font-size:16px; height:40px; padding:0 15px; position:relative;}
button.search {background:#0e56d9;}
button.search:before {content:''; display:inline-block; width:17px; height:17px; background:url(../images/ico_search_w.svg) no-repeat 50% 50%; background-size:100%;}
button.save {background:#0ac097;}
button.save:before {content:''; display:inline-block; width:17px; height:17px; background:url(../images/ico_excel.svg) no-repeat 50% 50%; background-size:100%;}
button.print {background:#0ac097;}
button.print:before {content:''; display:inline-block; width:17px; height:17px; background:url(../images/ico_print_w.svg) no-repeat 50% 50%; background-size:100%;}

.popCont {background:#f8f8f8; padding:20px;}
.popCont.white {background:#FFF; padding-top:0;}
.popCont .popDevice {display:flex; justify-content:space-between; align-items:stretch;}
.popCont .popDevice .graphSec {display:block; width:64%; border:1px solid #ddd; background:#FFF; position:relative;}
.popCont .popDevice .graphSec .pointInfo {position:absolute; width:190px; height:auto; border-radius:5px; overflow:hidden; border:1px solid #0e56d9;}
.popCont .popDevice .graphSec .pointInfo table {padding:0; margin:0; table-layout:fixed; width:100%;}
.popCont .popDevice .graphSec .pointInfo col.item {width:65%;}
.popCont .popDevice .graphSec .pointInfo col.ipCon {width:35%;}
.popCont .popDevice .graphSec .pointInfo th {background:#0e56d9; text-align:center; color:#FFF; font-size:16px; font-weight:500; padding:8px 0;}
.popCont .popDevice .graphSec .pointInfo td {background:#FFF; border-bottom:1px solid #ddd; color:#222; padding:5px; font-size:14px; text-align:right;}
.popCont .popDevice .graphSec .pointInfo td.item {background:#eee; text-align:center;}
.popCont .popDevice .graphSec .pointInfo td.lev01 {color:#555;}
.popCont .popDevice .graphSec .pointInfo td.lev02 {color:#0e56d9;}
.popCont .popDevice .graphSec .pointInfo td.lev03 {color:#f0a402;}
.popCont .popDevice .graphSec .pointInfo td.lev04 {color:#f0710a;}
.popCont .popDevice .graphSec .pointInfo td.lev05 {color:#fd0c00;}

.popCont .popDevice.Ty01 .graphCctv {display:block; width:50%; position:relative;}
.popCont .popDevice.Ty01 .graphCctv .graphSec {width:100%;}
.popCont .popDevice.Ty01 .statSec {width:48%; height:calc(100vh + 42px);}
.popCont .popDevice.Ty01 .popVod {margin-top:20px;}

.popCont .popDevice .statSec {display:block; width:34%; height:470px; overflow-y:auto; position:relative;}
.popCont .popDevice .statSec .stHead {position:sticky; left:0; top:0; width:100%;}
.popCont .popDevice .statSec table {padding:0; margin:0; width:100%; table-layout:fixed;}
.popCont .popDevice .statSec table th {padding:10px; vertical-align:middle; color:#222; font-size:14px; font-weight:500; text-align:center; background:#eee; border:1px solid #ddd;}
.popCont .popDevice .statSec table td {padding:8px; font-size:14px; text-align:right; border:1px solid #ddd;}
.popCont .popDevice .statSec table tr {background:#FFF;}
.popCont .popDevice .statSec table tr:nth-child(even) {background:#f5f8fd;}

.popCont .cauTxt {padding-left:16px; position:relative; color:#666; font-size:14px; font-weight:400; line-height:1.3; margin:15px 0 0px;}
.popCont .cauTxt:after {content:'※'; position:absolute; left:0px; top:0;}
.popCont .cauTxt strong {font-weight:700;}

/* 위기경보단계별 수문현황 */
.sortBtns .sort a:hover {cursor:pointer;}
.mngWrap .mngUi.point li.location {width:25%;}
.cctvImg {margin-left:3px; width:20%;}
.popLevelWrap .tempMap .pointInfo {display:none; position:absolute; width:190px; height:auto; border-radius:5px; overflow:hidden; border:1px solid #0e56d9; z-index:999; left:10px; top:10px; width:90px;}
#tooltipTable {padding:0; margin:0; table-layout:fixed; width:100%;}
#tooltipTable .item {width: 40%;}
#tooltipTable .ipCon {width: 60%;}
#tooltipTable th {background:#0e56d9; text-align:center; color:#FFF; font-size:16px; font-weight:500; padding:8px 0;}
#tooltipTable td {background:#FFF; border-bottom:1px solid #ddd; color:#222; padding:5px; font-size:14px; text-align:right;}
#tooltipTable td.item {background:#eee; text-align:center;}
#tooltipTable td.lev01 {color:#555;}
#tooltipTable td.lev02 {color:#0e56d9;}
#tooltipTable td.lev03 {color:#f0a402;}
#tooltipTable td.lev04 {color:#f0710a;}
#tooltipTable td.lev05 {color:#fd0c00;}

.waterMap {position:relative; display:none;}
.waterMap .imgSec {text-align:center; margin-bottom:30px; position:relative;}
.waterMap .imgSec img {max-width:100%;}
.waterMap#wm02 .imgSec.maxSize {overflow:hidden; overflow-x:auto;}
.waterMap#wm02 .imgSec.maxSize img {width:1296px; max-width:1296px; height:810px;}
.waterMap .wmDesc {position:relative;}
.waterMap .wmDesc li {display:block; color:#222; font-size:16px; line-height:1.3; margin-bottom:10px; padding-left:12px; position:relative; word-break:keep-all;}
.waterMap .wmDesc li:after {content:''; position:absolute; left:0; top:6px; width:4px; height:4px; background:#222; border-radius:50%;}
.waterMap .scrollTable {margin-top:30px;}

.waterMap .damLive {position:absolute; width:132px; border:1px solid #0e56d9; border-radius:4px; background:#FFF; overflow:hidden;
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
}
.waterMap .damLive .title a {display:block; color:#FFF; font-size:16px; padding:12px 0; text-align:center; background:#0e56d9;}
.waterMap .damLive li {display:flex; justify-content:flex-start; align-items:center; border-bottom:1px solid #ddd;}
.waterMap .damLive li:last-child {border-bottom:0;}
.waterMap .damLive li .item {width:64px; flex:0 0 auto; background:#eee; text-align:center; color:#222; font-size:14px; font-weight:400; padding:5px 0;}
.waterMap .damLive li .ipCon {width:calc(100% - 64px); flex:0 0 auto; text-align:right; padding:0 5px; color:#222; font-size:14px; font-weight:400;}

.waterMap .legend {position:absolute; width:116px; right:12px; top:12px; border:1px solid #222; border-radius:4px; background:#FFF; overflow:hidden;
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
}
.waterMap .legend .title {display:block; color:#FFF; font-size:16px; padding:12px 0; text-align:center; background:#222;}
.waterMap .legend li {display:flex; justify-content:flex-start; align-items:center; border-bottom:1px solid #ddd;}
.waterMap .legend li:last-child {border-bottom:0;}
.waterMap .legend li .item {width:64px; flex:0 0 auto; background:#eee; text-align:center; color:#222; font-size:14px; font-weight:400; padding:5px 0;}
.waterMap .legend li .ipCon {width:calc(100% - 64px); flex:0 0 auto; text-align:right; padding:0 5px; color:#222; font-size:14px; font-weight:400;}

.waterMap .damLive.rtd1009710 {left:12px; top:12px;}
.waterMap .damLive.rtd1010310 {left:156px; top:65px;}
.waterMap .damLive.rtd1010320 {left:300px; top:112px;}
.waterMap .damLive.rtd1013310 {left:444px; top:162px;}
.waterMap .damLive.rtd1015310 {left:588px; top:212px;}
.waterMap .damLive.rtd1017310 {left:732px; top:262px;}
.waterMap .damLive.rtd1012110 {left:12px; bottom:370px;}
.waterMap .damLive.rtd1003110 {left:12px; bottom:190px;}
.waterMap .damLive.rtd1001210 {left:12px; bottom:12px;}
.waterMap .damLive.rtd1004310 {left:300px; bottom:12px;}
.waterMap .damLive.rtd1003611 {left:444px; bottom:12px;}
.waterMap .damLive.rtd1006110 {left:588px; bottom:12px;}
.waterMap .damLive.rtd1021701 {left:732px; bottom:12px;}
.waterMap .damLive.rtd1022701 {left:876px; bottom:12px;}

.waterMap .lastUpdate {position:absolute; right:15px; bottom:12px; color:#FFF; font-size:18px; font-weight:500; padding-left:25px;}
.waterMap .lastUpdate:before {content:''; position:absolute; left:2px; top:2px; width:16px; height:16px; background:url(../images/ico_time.svg) no-repeat 50% 50%; background-size:100%;}

.imgTxtSec {display:flex; justify-content:flex-start; align-items:center; gap:40px; margin-bottom:60px;}
.imgTxtSec .imgSec {display:block; width:28%; position:relative; overflow:hidden; border-radius:6px;}
.imgTxtSec .imgSec:after {content:''; display:block; height:auto; padding-bottom:59.16666667%;}
.imgTxtSec .imgSec img {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; height:100%;}
.imgTxtSec .txtSec {display:block; width:calc((100% - 28%) - 40px);}
.imgTxtSec .txtSec .title {color:#222; font-size:24px; font-weight:600; margin-bottom:20px;}
.imgTxtSec .txtSec .desc {color:#222; font-size:16px; line-height:1.4;}
.imgTxtSec .txtSec .desc a {display:inline-block; font-weight:700; color:#000;}

.dicSearch {border:1px solid #ddd; border-radius:8px; background:#f4f4f4; padding:30px;}
.dicSearch .searchForm {display:flex; justify-content:flex-start; align-items:center; gap:10px; margin-bottom:15px;}
.dicSearch .searchForm input {width:30%;}
.dicSearch .searchForm button {display:flex; justify-content:center; align-items:center; gap:5px; border-radius:4px; border:0; color:#FFF; font-size:16px; height:40px; padding:0 15px; position:relative;}
.dicSearch .consoNent {position:relative;}
.dicSearch .consoNent .conso {margin-bottom:10px; padding-bottom:10px; border-bottom:1px dashed #ddd; display:flex; justify-content:flex-start; align-items:center; gap:5px; flex-wrap:wrap;}
.dicSearch .consoNent .conso:last-child {padding-bottom:0; margin-bottom:0; border-bottom:none;}
.dicSearch .consoNent .conso span {position:relative;}
.dicSearch .consoNent .conso span a {display:block; color:#222; font-weight:500; width:100%; height:100%; border:1px solid #ccc; width:34px; height:34px; line-height:34px; border-radius:4px; text-align:center; text-transform:uppercase; background:#FFF;}
.dicSearch .consoNent .conso span a.on {background:#0e56d9; color:#FFF;}
.dicSearch .consoNent .conso.kr span a {font-size:16px;}
.dicSearch .resultTxt {color:#222; font-size:16px; margin-top:20px;}
.dicSearch .resultTxt em {color:#0e56d9; font-weight:700;}

.dicExp {display:flex; justify-content:flex-start; align-items:stretch; border:1px solid #ddd; border-top:2px solid #222; position:relative; margin-top:40px;}
.dicExp .resultSec {display:block; width:34%;}
.dicExp .resultSec .resultList {height:500px; overflow:hidden; overflow-y:auto;}
.dicExp .resultSec .resultList ul {padding:20px 0;}
.dicExp .resultSec .resultList li {display:block;}
.dicExp .resultSec .resultList li a {display:block; padding:9px 30px; color:#222; font-size:16px; line-height:1.3;}
.dicExp .resultSec .resultList li a:hover {background:#ebf0fc;}
.dicExp .resultSec .resultList li a.on {background:#ebf0fc; color:#0e56d9; font-weight:700;}
.dicExp .expSec {display:block; width:66%; border-left:1px solid #ddd;}
.dicExp .expSec .expConBox {height:500px; overflow:hidden; overflow-y:auto; padding:30px;}
.dicExp .expSec .expConBox .selectedTitle {color:#0e56d9; font-size:20px; font-weight:700; margin-bottom:20px;}
.dicExp .expSec .expConBox .expCon {color:#333; line-height:1.4;}
.dicExp .title {text-align:center; padding:20px 0; background:#f4f4f4; color:#222; font-size:16px; font-weight:700; border-bottom:1px solid #ddd;}

.yrsBox {display:flex; justify-content:flex-start; align-items:stretch; padding-bottom:30px; margin-bottom:30px; border-bottom:1px dashed #ddd; gap:30px;}
.yrsBox:nth-last-of-type(1) {border-bottom:0; padding-bottom:0; margin-bottom:80px;}
.yrsBox .currentYr {display:flex; justify-content:center; align-items:center; text-align:center; background:#FFF; color:#0e56d9; border:1px solid #ddd; font-size:18px; font-weight:500; border-radius:8px; width:150px; flex:0 0 auto;}
.yrsBox .currentYr em {font-size:30px; font-weight:700; margin-left:5px; display:inline-block;}
.yrsBox .perYrDown {width:calc(100% - 180px); border:1px solid #ddd; border-radius:8px; display:flex; justify-content:space-between; align-items:stretch; gap:0px; overflow:hidden;}
.yrsBox .perYrDown .pMonth {position:relative; width:12%;}
.yrsBox .perYrDown .pMonth .month {text-align:center; background:#f4f4f4; padding:10px 0; color:#222; font-size:16px; font-weight:600; position:relative;}
.yrsBox .perYrDown .pMonth .month:after {content:''; position:absolute; right:0; top:50%; transform:translate(0, -50%); width:1px; height:30%; background:#ddd;}
.yrsBox .perYrDown .pMonth:last-child .month:after {display:none;}
.yrsBox .perYrDown .pMonth .mDown {padding:15px; text-align:center; display:block;}
.yrsBox .perYrDown .pMonth .mDown a {display:block; width:30px; height:30px; text-indent:-9999px; margin:0 auto;}
.yrsBox .perYrDown .pMonth .mDown.adobe a {background:url(../images/ico_adobe.svg) no-repeat 50% 50%; background-size:100%;}
.yrsBox .perYrDown .pMonth .mDown.hwp a {background:url(../images/ico_hwp.svg) no-repeat 50% 50%; background-size:100%;}
.yrsBox .perYrDown .pMonth .mDown.empty {line-height:30px; color:#999; font-size:18px;}

.historyBox {position:relative;}
.historyBox ul {position:relative;}
.historyBox ul:after {content:''; position:absolute; left:18px; top:6px; width:1px; height:calc(100% - 16px); background:#ddd;}
.historyBox ul li {margin-bottom:12px !important; padding-left:146px !important; z-index:4; line-height:1.8 !important;}
.historyBox ul li:before {display:none !important;}
.historyBox ul li:after {content:''; position:absolute; left:0; top:8px; width:6px; height:6px; background:#FFF; border:2px solid #0ac097; border-radius:50%;}
.historyBox ul li span {position:absolute; left:26px; top:0; width:120px; font-weight:700;}
.historyBox ul.short li {padding-left:90px !important;}
.historyBox ul.short li span {width:55px;}

.greetingBox {display:flex; justify-content:flex-start; align-items:flex-start; gap:56px;}
.greetingBox .imgSec {display:block; width:220px; flex:0 0 auto;}
.greetingBox .imgSec .thumb {display:block;}
.greetingBox .imgSec .txt {text-align:center; color:#222; font-size:18px; margin-top:20px;}
.greetingBox .imgSec .txt em {font-size:22px; font-weight:700;}
.greetingBox .txtSec {display:block; width:100%;}
.greetingBox .txtSec .headTxt {margin-bottom:50px;}
.greetingBox .txtSec .headTxt span {color:#0e56d9; font-size:28px; position:relative;}
.greetingBox .txtSec .headTxt span:before {content:''; position:absolute; left:-18px; top:-5px; width:14px; height:12px; background:url(../images/ico_quot_left.png) no-repeat 50% 50%; background-size:100%;}
.greetingBox .txtSec .headTxt span:after {content:''; position:absolute; right:-16px; bottom:-5px; width:14px; height:12px; background:url(../images/ico_quot_right.png) no-repeat 50% 50%; background-size:100%;}
.greetingBox .txtSec .headTxt span em {font-weight:700;}
.greetingBox .txtSec {color:#222; font-size:16px; line-height:1.4; font-weight:500;}

.hisDirector {position:relative;}
.hisDirector .imgSec {border-radius:8px; overflow:hidden; position:relative; margin-bottom:40px;}
.hisDirector .imgSec .imgDim {position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0, 12, 52, 0.5);}
.hisDirector .imgSec .hisTitle {position:absolute; left:0; top:50%; transform:translate(0, -50%); width:100%; height:auto; color:#FFF; font-size:40px; line-height:1.4; text-align:center; z-index:1;}
.hisDirector .imgSec .hisTitle em {display:block; font-weight:700;}
.hisDirector .hisDir {padding:0 30px; display:flex; justify-content:flex-start; align-items:center; flex-wrap:wrap; gap:18px 6px;}
.hisDirector .hisDir ul {display:block; width:calc(25% - 6px); flex:0 0 auto; padding-left:60px; position:relative;}
.hisDirector .hisDir ul li.num {position:absolute; left:0; top:0; width:50px; height:50px; border-radius:50%; background:#0e56d9; line-height:50px; color:#FFF; font-size:16px; font-weight:700; text-align:center;}
.hisDirector .hisDir ul li.name {display:block; color:#222; font-size:18px; font-weight:700; margin-bottom:6px; padding-top:3px;}
.hisDirector .hisDir ul li.date {display:block; color:#222; font-size:16px;}

.bbsGallery {position:relative;}
.bbsGallery .galleryList {position:relative;}
.bbsGallery .galleryList ul {display:flex; justify-content:flex-start; align-items:stretch; gap:48px 24px; flex-wrap:wrap;}
.bbsGallery .galleryList li {display:block; width:calc(25% - 18px); flex:0 0 auto;}
.bbsGallery .galleryList li a {display:block; width:100%; height:100%;}
.bbsGallery .galleryList li .thumb {display:block; position:relative; overflow:hidden; border-radius:8px;}
.bbsGallery .galleryList li .thumb:after {content:''; display:block; height:auto; padding-bottom:56.25%;}
.bbsGallery .galleryList li .thumb img {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; height:100%;}
.bbsGallery .galleryList li .thumb .icoPlay {position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.6); z-index:1; opacity:0; transition:.4s all;}
.bbsGallery .galleryList li .thumb .icoPlay:after {content:''; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:68px; height:68px; background:url(../images/ico_play.svg) no-repeat 50% 50%; background-size:100%; z-index:2;}
.bbsGallery .galleryList li:hover .thumb .icoPlay {opacity:1.0;}
.bbsGallery .galleryList li .txtInfo {margin-top:20px;}
.bbsGallery .galleryList li .txtInfo .txt {color:#222; font-size:16px; font-weight:500; line-height:1.4;}

.bbsGallery .dataList {position:relative;}
.bbsGallery .dataList ul {display:flex; justify-content:flex-start; align-items:stretch; gap:48px 24px; flex-wrap:wrap;}
.bbsGallery .dataList li {display:flex; justify-content:flex-start; align-items:stretch; gap:28px; width:calc(50% - 12px); flex:0 0 auto;}
.bbsGallery .dataList li .thumb {display:block; width:48%; position:relative; border-radius:8px; overflow:hidden; flex:0 0 auto;}
.bbsGallery .dataList li .thumb:after {content:''; display:block; height:auto; padding-bottom:126%;}
.bbsGallery .dataList li .thumb img {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:auto; height:100%;}
.bbsGallery .dataList li .txtInfo {display:block; width:calc(52% - 28px); flex:0 0 auto;}
.bbsGallery .dataList li .txtInfo .subject {color:#222; font-size:16px; font-weight:700; line-height:1.4; margin-bottom:4px;}
.bbsGallery .dataList li .txtInfo .txt {color:#666; font-size:16px; font-weight:400; line-height:1.4; margin-bottom:10px;}
.bbsGallery .dataList li .txtInfo a {display:inline-block; padding:12px 12px 12px 40px; background:#0ac097 url(../images/ico_download_w.svg) no-repeat 12px 50%; background-size:18px; border-radius:4px; color:#FFF; font-size:16px; font-weight:700;}

.bbsGalleryView {display:flex; justify-content:space-between; align-items:flex-start; overflow:hidden;}
.bbsGalleryView .viewBox {display:block; width:calc(100% - 18%);}
.bbsGalleryView .viewBox .vodPlayer {display:block; position:relative; border-radius:8px; overflow:hidden;}
.bbsGalleryView .viewBox .vodPlayer:after {content:''; display:block; height:auto; padding-bottom:56.25%;}
.bbsGalleryView .viewBox .vodPlayer video, .bbsGalleryView .viewBox .vodPlayer embed, .bbsGalleryView .viewBox .vodPlayer iframe {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; height:100%;}
.bbsGalleryView .viewBox .vodFunc {display:flex; justify-content:space-between; align-items:stretch; padding:20px 0;}
.bbsGalleryView .viewBox .vodFunc .subject {color:#222; font-size:24px; font-weight:500; line-height:1.4;}
.bbsGalleryView .viewBox .vodFunc .btns {display:flex; justify-content:center; align-items:center; gap:10px;}
.bbsGalleryView .viewBox .vodFunc .btns button {display:inline-block; width:46px; height:46px; background:#0ac097 url(../images/ico_download_w.svg) no-repeat 50% 50%; background-size:22px; border-radius:4px;}
.bbsGalleryView .viewBox .vodFunc .btns .btn.list a {display:inline-block; padding:0 20px; height:46px; line-height:46px; background:#666; border:1px solid #666; color:#FFF; font-weight:600; border-radius:4px;}
.bbsGalleryView .relGallery {display:block; width:15%; height:inherit; position:relative;overflow:hidden;}
.bbsGalleryView .relGallery:after {content:''; display:block; height:auto; padding-bottom:310%;}
.bbsGalleryView .relGallery .rel {position:absolute; right:0; top:20px; width:100%; height:calc(100% - 20px); overflow:hidden;}
.bbsGalleryView .relGallery .swiper-slide {display:block; height:auto !important;}
.bbsGalleryView .relGallery .swiper-slide a {display:block; width:100%; height:100%;}
.bbsGalleryView .relGallery .swiper-slide .thumb {display:block; position:relative; overflow:hidden; border-radius:8px;}
.bbsGalleryView .relGallery .swiper-slide .thumb:after {content:''; display:block; height:auto; padding-bottom:56.25%;}
.bbsGalleryView .relGallery .swiper-slide .thumb img {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; height:100%;}
.bbsGalleryView .relGallery .swiper-slide .thumb .icoPlay {position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.6); z-index:1; opacity:0; transition:.4s all;}
.bbsGalleryView .relGallery .swiper-slide .thumb .icoPlay:after {content:''; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:68px; height:68px; background:url(../images/ico_play.svg) no-repeat 50% 50%; background-size:100%; z-index:2;}
.bbsGalleryView .relGallery .swiper-slide:hover .thumb .icoPlay {opacity:1.0;}
.bbsGalleryView .relGallery .swiper-slide .txtInfo {margin-top:16px;}
.bbsGalleryView .relGallery .swiper-slide .txtInfo .txt {color:#222; font-size:16px; font-weight:500; line-height:1.4; padding-left:10px; display:-webkit-box; word-wrap:break-word; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis;}
.bbsGalleryView .relGallery .rel-prev {position:absolute; left:0; top:0; width:100%; height:60px; background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(255,255,255,1) 28%,rgba(255,255,255,0.5) 66%,rgba(255,255,255,0) 100%); z-index:10; cursor:pointer;}
.bbsGalleryView .relGallery .rel-prev:after {content:''; position:absolute; left:50%; top:15px; transform:translate(-50%, 0); width:32px; height:15px; background:url(../images/dir_up.svg) no-repeat 50% 50%; background-size:100%;}
.bbsGalleryView .relGallery .rel-next {position:absolute; left:0; bottom:0; width:100%; height:60px; background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.5) 28%,rgba(255,255,255,1) 66%,rgba(255,255,255,1) 100%); z-index:10; cursor:pointer;}
.bbsGalleryView .relGallery .rel-next:after {content:''; position:absolute; left:50%; bottom:15px; transform:translate(-50%, 0); width:32px; height:15px; background:url(../images/dir_down.svg) no-repeat 50% 50%; background-size:100%;}
.bbsGalleryView .relGallery .bbsBtns {position:absolute; right:0; bottom:-50px;}

.perWork {display:block; margin-bottom:56px;}
.perWork .pwTitle {color:#222; font-size:22px; font-weight:700; display:flex; justify-content:flex-start; align-items:center; gap:15px; margin-bottom:20px;}
.perWork .pwTitle:before {content:''; display:inline-block; width:34px; height:34px;}
.perWork .pwTitle.work01:before {background:url(../images/ico_work01.svg) no-repeat 50% 50%; background-size:100%;}
.perWork .pwTitle.work02:before {background:url(../images/ico_work02.svg) no-repeat 50% 50%; background-size:100%;}
.perWork .pwTitle.work03:before {background:url(../images/ico_work03.svg) no-repeat 50% 50%; background-size:100%;}
.perWork .pwTitle.work04:before {background:url(../images/ico_work04.svg) no-repeat 50% 50%; background-size:100%;}
.perWork .workInfo {padding:20px 36px; border-radius:8px; background:#f4f4f4; display:block; height:auto; overflow:hidden;}
.perWork .workInfo li {float:left; width:50%; color:#666; font-size:16px; padding-left:16px; line-height:1.4; position:relative; margin:5px 0;}
.perWork .workInfo li:after {content:''; position:absolute; left:0; top:10px; width:6px; height:1px; background:#666;}

.orgHis {position:relative; margin:60px 0 0 0;}
.orgHis:after {content:''; position:absolute; left:50%; top:0; width:1px; height:calc(100% - 40px); transform:translate(-50%, 0); background:#bbb;}
.orgHis .ohTitle {display:flex; justify-content:center; align-items:center; width:156px; height:156px; border-radius:50%; background:#0e56d9; color:#FFF; font-size:24px; font-weight:700; text-align:center; margin:0 auto; position:relative; z-index:1; margin-bottom:60px;}
.orgHis .hisBlock {display:flex; justify-content:flex-end; align-items:center; position:relative; z-index:1; margin:40px 0;}
.orgHis .hisBlock:after {content:''; position:absolute; left:50%; top:8px; transform:translate(-50%, 0); width:23px; height:23px; border:1px solid #bbb; border-radius:50%; background:#FFF; z-index:2;}
.orgHis .hisBlock:before {content:''; position:absolute; left:50%; top:15px; transform:translate(-50%, 0); width:11px; height:11px; border-radius:50%; background:#bbb; z-index:3;}
.orgHis .hisBlock .hisContBox {display:block; width:50%; padding:0 60px; position:relative; z-index:1;}
.orgHis .hisBlock .hisContBox .hisYrs {color:#0e56d9; font-size:36px; font-weight:600; margin-bottom:5px;}
.orgHis .hisBlock .hisContBox .hisCont {color:#222; font-size:18px; line-height:1.4;}
.orgHis .hisBlock:nth-child(odd) {justify-content:flex-start;}
.orgHis .hisBlock:nth-child(odd) .hisContBox {text-align:right;}

.hrMap {display:block; height:600px; position:relative; border:1px solid #ddd; border-radius:8px; overflow:hidden; background:#ccc;}

.trafficSec {display:flex; justify-content:flex-start; align-items:flex-start; gap:20px;}
.trafficSec .perWay {width:calc(50% - 10px); display:flex; justify-content:flex-start; align-items:center; gap:24px;}
.trafficSec .perWay .icoSec {display:flex; justify-content:center; align-items:center; flex-direction:column; width:140px; height:140px; background:#f4f4f4; text-align:center; border-radius:50%; flex:0 0 auto;}
.trafficSec .perWay .icoSec .ico {display:block; width:58px; height:58px; margin:0 auto 10px;}
.trafficSec .perWay .icoSec .ico img {max-width:100%;}
.trafficSec .perWay .icoSec .txt {color:#222; font-size:16px; font-weight:700;}
.trafficSec .perWay .txtSec {display:block; width:100%; flex:0 0 auto;}
.trafficSec .perWay .txtSec .title {color:#222; font-size:16px; font-weight:700; padding-left:14px; position:relative; margin-bottom:10px;}
.trafficSec .perWay .txtSec .title:after {content:''; position:absolute; left:0; top:8px; width:3px; height:3px; background:#222; border-radius:50%;}
.trafficSec .perWay .txtSec .way {margin-bottom:5px; color:#222; font-size:16px; line-height:1.4; padding-left:14px;}
.trafficSec .perWay .txtSec .way .type {display:inline-block; color:#FFF; font-size:14px; padding:4px 12px; margin-right:10px; vertical-align:middle;}
.trafficSec .perWay .txtSec .way .type.blue {background:#0050b2;}
.trafficSec .perWay .txtSec .way .type.green {background:#009f00;}
.trafficSec .perWay .txtSec .way .type.red {background:#e84810; margin-left:10px;}
.trafficSec .perWay .txtSec .way .type.sky {background:#459ad6;}
.trafficSec .perWay .txtSec .way .type.gold {background:#bf9c04;}
.trafficSec .perWay li {display:block; color:#666; font-size:16px; padding-left:80px; position:relative; line-height:1.4; margin-bottom:10px;}
.trafficSec .perWay li .title {position:absolute; left:0; top:0; color:#222; font-weight:700; padding-left:12px;}
.trafficSec .perWay li .title:after {content:''; position:absolute; left:0; top:8px; width:3px; height:3px; background:#222; border-radius:50%;}
.trafficSec .perWay .long li {padding-left:150px;}
.trafficSec .perWay li dd {float:left; width:50%; position:relative; padding-left:12px;}
.trafficSec .perWay li dd:after {content:''; position:absolute; left:0; top:8px; width:5px; height:1px; background:#666;}

.bookCategory {display:flex; justify-content:flex-start; flex-direction:column; align-items:flex-start; flex-wrap:wrap; gap:30px;}
/* .bookCategory .perCategory {display:block; flex:1 0 calc(25% - 23px); border:1px solid #ddd; border-radius:10px;} */
.bookCategory .perCategory {display:flex; width:100%; justify-content:flex-start; align-items:center; gap:20px; border:1px solid #ddd; border-radius:10px; padding:20px;}
.bookCategory .perCategory .ico {display:block; width:140px; flex:0 0 auto;}
.bookCategory .perCategory .expCate {display:flex; justify-content:flex-start; align-items:flex-start; flex-direction:column; gap:20px;}
.bookCategory .perCategory .expCate .cateInfo {display:flex; justify-content:flex-start; align-items:center; gap:20px;}
.bookCategory .perCategory .expCate .cateInfo .title {color:#0e56d9; font-size:22px; font-weight:700;}
.bookCategory .perCategory .expCate .cateInfo ul {display:block;}
.bookCategory .perCategory .expCate .cateInfo ul li {display:inline-block; color:#222; font-size:16px; font-weight:400; position:relative; padding-left:14px; margin-right:15px;}
.bookCategory .perCategory .expCate .cateInfo ul li:after {content:''; position:absolute; left:4px; top:8px; width:3px; height:3px; background:#222; border-radius:50%;}

.bookCategory .perCategory .dataList {display:flex; justify-content:flex-start; align-items:flex-start; gap:15px 15px; width:100%; flex:0 0 auto; flex-wrap:wrap;}
/*yrData 크기가 달라져서 width:200px 추가함(승훈)*/
.bookCategory .perCategory .dataList .yrData {width: 200px; display:flex; justify-content:space-between; align-items:center; gap:20px; border:1px solid #bbb; border-radius:4px; background:#FFF; padding:15px; cursor:pointer;}
.bookCategory .perCategory .dataList .yrData a {display:block; color:#222; font-size:15px; font-weight:700;}
.bookCategory .perCategory .dataList .yrData.on {background:#0ac097; border:1px solid #0ac097;}
.bookCategory .perCategory .dataList .yrData.on a {color:#FFF;}
.bookCategory .perCategory .dataList .yrData .downHit {display:flex; justify-content:space-between; align-items:center; background:#f1f1f1; padding:4px 10px; border-radius:50px; position:relative; width:70px;}
.bookCategory .perCategory .dataList .yrData .downHit:before {content:''; display:inline-block; width:14px; height:14px; background:url(../images/ico_download_g.svg) no-repeat 50% 50%; background-size:100%;}

.bookCategory .perCategory .dataList .yrData.dis {background:#f1f1f1;}
.bookCategory .perCategory .dataList .yrData.dis a {color:#999;}
.bookCategory .perCategory .dataList .yrData.dis .chkN {display:none;}
.bookCategory .perCategory .dataList .yrData.dis.on {border:1px solid #ccc;}
.bookCategory .perCategory .dataList .yrData.dis .downHit {font-size:0; padding:0; width:auto;}
.bookCategory .perCategory .dataList .yrData.dis .downHit:before {content:'자료없음'; background:none; width:auto; height:auto; font-size:14px; color:#999;}

.bookCategory .perCategory .dataFunc {display:flex; justify-content:flex-end; align-items:center; gap:10px; padding-top:20px; border-top:1px dashed #ddd; width:100%;}
.bookCategory .perCategory .dataFunc button {display:inline-block; padding:10px 20px; border-radius:6px; color:#FFF; font-weight:500; border:0;}
.bookCategory .perCategory .dataFunc button.selAll {background:#0ac097;}
.bookCategory .perCategory .dataFunc button.selDown {background:#0e56d9;}
.bookCategory .itemFunc {margin:0;}
.bookCategory .itemFunc .itemSearch select {width:140px;}

/* 이용안내 */
.roundImg {position:relative; border:1px solid #ddd; border-radius:8px;}
.roundImg .riTitle {padding:24px 12px; color:#222; font-size:22px; font-weight:700; text-align:center; background:#f4f4f4;}
.roundImg .inImg {padding:50px;}

.perStepBox {position:relative; border-radius:8px; border:4px solid #0e56d9; background:#0e56d9; margin-bottom:28px;}
.perStepBox .psTitle {display:flex; justify-content:flex-start; align-items:center; gap:10px; padding:12px 28px 16px; background:#0e56d9; color:#FFF; font-size:16px; position:relative;}
.perStepBox .psTitle:after {content:''; position:absolute; left:50%; bottom:-24px; transform:translate(-50%, 0); border-top:12px solid #0e56d9; border-left:12px solid transparent; border-right:12px solid transparent; border-bottom:12px solid transparent;}
.perStepBox .psTitle.single {padding-bottom:12px;}
.perStepBox .psTitle span {color:#0ac097; font-size:22px; font-weight:600;}
.perStepBox .psImg {display:block; border-radius:4px; overflow:hidden;}
.perStepBox:last-child .psTitle:after {display:none;}

.policyLicenseSec {margin-bottom: 50px;}
.policyLicenseSec:last-child {margin-bottom: 0;}
.policyLicenseSec .scrollTable .disNotice{margin-top: 20px; color: #666; font-size: 16px; line-height: 1.3;}

.perCont .DownloadBtn {display: block; width: calc(52% - 28px); flex: 0 0 auto; margin: 20px 0 0 28px;}
.perCont .DownloadBtn.noMar {margin-left:0;}
.perCont .DownloadBtn a {display: inline-block; padding: 12px 16px 12px 40px; background: #0ac097 url(../images/ico_download_w.svg) no-repeat 12px 50%; background-size: 18px; border-radius: 4px; color: #FFF; font-size: 16px; font-weight: 700;}

.perCont .linkBtn {display: block; width: calc(52% - 28px); flex: 0 0 auto; margin: 20px 0 0 28px;}
.perCont .linkBtn a {display: inline-block; padding: 12px 40px 12px 12px; background: #0ac097 url(../images/ar_btn.svg)  no-repeat 200px 50%; background-size: auto 14px; border-radius: 4px; color: #FFF; font-size: 16px; font-weight: 700;}

.perWork .pwTitle.relativeSite:before {background: url(../images/ico_relativeSite.svg) no-repeat 50% 50%; background-size: 100%;}
.perWork .relativeSiteInfo li { float: left; width: 33.33%; color: #666; font-size: 16px; padding-left: 16px; line-height: 1.4; position: relative; margin: 5px 0;}

.perCont .Mb30{margin-bottom: 30px; }
.Mb30{margin-bottom: 30px;}

.privacyBox {display:flex; justify-content:space-between; align-items:stretch; gap:20px; flex-wrap:wrap; margin-top:20px;}
.privacyBox .perItem {display:flex; justify-content:flex-start; align-items:stretch; gap:20px; width:calc(33.33334% - 14px); border:1px solid #ddd; border-radius:10px; padding:20px;}
.privacyBox .perItem .ico {display:flex; justify-content:center; align-items:center; width:80px; flex:0 0 auto;}
.privacyBox .perItem .txtSec {display:block; width:calc(100% - 100px);}
.privacyBox .perItem .txtSec .title {color:#222; font-size:18px; font-weight:700; margin-bottom:10px;}
.privacyBox .perItem .txtSec .desc {color:#666; font-size:16px; line-height:1.4;}

.privacyRound {padding:0 16px; margin:20px 0 0 0; display:flex; justify-content:flex-start; align-items:stretch; flex-wrap:wrap; gap:10px;}
.privacyRound .perRound {width:calc(50% - 5px); border:1px solid #ddd; border-radius:10px;}
.privacyRound .perRound:hover {border:1px solid #0e56d9;}
.privacyRound .perRound a {display:flex; justify-content:flex-start; align-items:center; gap:0px; padding:15px; width:100%; position:relative;}
.privacyRound .perRound a span {font-weight:700; margin:0 10px;}
.privacyRound .perRound a:before {content:''; display:inline-block; width:30px; height:30px;}
.privacyRound .perRound a.pri01:before {background:url(../images/pico01.png) no-repeat 50% 50%; background-size:auto 100%;}
.privacyRound .perRound a.pri02:before {background:url(../images/pico02.png) no-repeat 50% 50%; background-size:auto 100%;}
.privacyRound .perRound a.pri03:before {background:url(../images/pico03.png) no-repeat 50% 50%; background-size:auto 100%;}
.privacyRound .perRound a.pri04:before {background:url(../images/pico04.png) no-repeat 50% 50%; background-size:auto 100%;}
.privacyRound .perRound a.pri05:before {background:url(../images/pico05.png) no-repeat 50% 50%; background-size:auto 100%;}
.privacyRound .perRound a.pri06:before {background:url(../images/pico06.png) no-repeat 50% 50%; background-size:auto 100%;}
.privacyRound .perRound a.pri07:before {background:url(../images/pico07.png) no-repeat 50% 50%; background-size:auto 100%;}
.privacyRound .perRound a.pri08:before {background:url(../images/pico08.png) no-repeat 50% 50%; background-size:auto 100%;}
.privacyRound .perRound a.pri09:before {background:url(../images/pico09.png) no-repeat 50% 50%; background-size:auto 100%;}
.privacyRound .perRound a.pri10:before {background:url(../images/pico10.png) no-repeat 50% 50%; background-size:auto 100%;}
.privacyRound .perRound a.pri11:before {background:url(../images/pico02.png) no-repeat 50% 50%; background-size:auto 100%;}
.privacyRound .perRound a.pri12:before {background:url(../images/pico12.png) no-repeat 50% 50%; background-size:auto 100%;}

.contSec .privacyItems {padding:0 30px;}
.contSec .privacyItems .perPolicy {padding:0 6px; background:transparent;}
.contSec .privacyItems .perPolicy .scrollTable {margin:15px 0;}
.contSec .privacyItems .perPolicy table th, .contSec .privacyItems .perPolicy table td {padding:5px; font-size:14px; font-weight:400;}
.contSec .privacyItems .perPolicy .cau {padding-left:12px; position:relative; font-size:14px; line-height:1.4; font-weight:400;}
.contSec .privacyItems .perPolicy .cau:after {content:'※'; position:absolute; left:0px; top:0;}
.contSec .privacyItems .perPolicy .cau.normal {font-size:16px; line-height:1.4; margin-top:20px;}
.contSec .privacyItems .perPolicy .cau.normal:last-child {margin-top:10px;}
/* .contSec .privacyItems .perPolicy .cau.normal a {margin-left:10px;} */
.contSec .privacyItems .perPolicy a {display:inline-block; color:#0e56d9; position:relative;}
.contSec .privacyItems .perPolicy a:after {content:''; position:absolute; left:0; bottom:0px; width:100%; height:1px; background:#0e56d9;}
.contSec .privacyItems .perPolicy li {margin-bottom:15px; font-weight:700;}
.contSec .privacyItems .perPolicy li dd {padding-left:18px; line-height:1.5; margin-bottom:15px; font-weight:400;}
.contSec .privacyItems .perPolicy .pastPrivacy {margin-top:15px; display:flex; justify-content:flex-start; align-items:center; gap:10px;}
.contSec .privacyItems .perPolicy .pastPrivacy select {background-position:94% 50%;}
.contSec .privacyItems .perPolicy .pastPrivacy .btnViewPrivacy a {display:inline-block; height:40px; line-height:40px; color:#FFF; padding:0 20px; border-radius:4px; background:#0ac097;}
.contSec .privacyItems .perPolicy .pastPrivacy .btnViewPrivacy a:after {display:none;}

.siteMapSec {display:flex; justify-content:flex-start; align-items:stretch; flex-wrap:wrap; gap:36px 36px;}
.siteMapSec .menu {display:block; width:calc(25% - 27px); flex:0 0 auto;}
.siteMapSec .menu a.conMenu {display:block; color:#000; font-size:20px; font-weight:700; padding-left:28px; position:relative; margin-bottom:20px;}
.siteMapSec .menu a.conMenu:before {content:''; position:absolute; left:0; top:3px; width:20px; height:20px; background:url(../images/dot_title.svg) no-repeat 50% 50%; background-size:100%;}
.siteMapSec .menu .subMenuBox {padding-left:8px; position:relative; margin-bottom:20px;}
.siteMapSec .menu .subMenuBox:last-child {margin-bottom:0;}
.siteMapSec .menu .subMenuBox .smTitle {color:#222; font-size:16px; padding-left:12px; position:relative; font-weight:600; margin-bottom:10px;}
.siteMapSec .menu .subMenuBox .smTitle a {color:#0e56d9;}
.siteMapSec .menu .subMenuBox .smTitle:after {content:''; position:absolute; left:0; top:8px; width:3px; height:3px; background:#222; border-radius:50%;}
.siteMapSec .menu .subMenuBox ul {padding-left:12px;}
.siteMapSec .menu .subMenuBox ul li {display:block; font-size:14px; line-height:1.8; position:relative; padding-left:8px;}
.siteMapSec .menu .subMenuBox ul li:after {content:''; position:absolute; left:0; top:10px; width:2px; height:2px; background:#222; border-radius:50%;}

/* 관제 관련 */
/* tempMap(지도)에 백그라운드 이미지 추가 X */
.tempMap {width:100%; height:100%; background-size:cover;}
.suLastUpdate {position:fixed; left:38px; top:80px; color:#FFF; display:flex; justify-content:flex-start; align-items:center;}
.suLastUpdate:after {content:''; display:inline-block; width:14px; height:14px; background:url(../images/ico_reload.svg) no-repeat 50% 50%; background-size:100%; margin-left:10px;}
.stUxTop {position:fixed; left:24px; top:24px; width:100%; display:flex; justify-content:flex-start; gap:8px; align-items:center;}
.stUxTop .suSearch {display:block; width:230px; height:42px; position:relative;}
.stUxTop .suSearch input[type="text"] {display:inline-block; width:100%; height:42px; line-height:42px; border:0; padding:0 42px 0 15px; background:rgba(0, 0, 0, 0.7); border-radius:6px; color:#FFF; font-size:16px; font-weight:500;}
.stUxTop .suSearch button {position:absolute; right:0; top:0; width:42px; height:42px; background:url(../images/ico_search_g.svg) no-repeat 50% 50%; background-size:17px auto; z-index:1; text-indent:-99999px;}

.stUxTop .suSearch .autoComplete {position:absolute; left:0; top:46px; width:100%; height:200px; overflow:hidden; overflow-y:auto; background:#FFF; z-index:10; border-radius:6px; display:none;}
.stUxTop .suSearch .autoComplete li {display:block;}
.stUxTop .suSearch .autoComplete li a {display:block; padding:10px 15px; border-bottom:1px dashed #ddd; text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}

.stUxTop .suLocal {position:relative; width:100%; max-width:920px; margin-right:210px;}
.stUxTop .suLocal .current {display:none; cursor:pointer; position:relative;}
.stUxTop .suLocal ul {display: block;}
.stUxTop .suLocal ul li {float:left; width:11.11111%; height:42px; line-height:42px; text-align:center;}
.stUxTop .suLocal ul li a {display:block; background:rgba(0, 0, 0, 0.7); width:100%; height:100%; color:#FFF; font-size:16px; position:relative;}
.stUxTop .suLocal ul li a:after {content:''; position:absolute; right:0; top:0; width:1px; height:100%; background:#FFF; opacity:.2;}
.stUxTop .suLocal ul li:first-child a {border-radius:8px 0px 0px 8px;}
.stUxTop .suLocal ul li:last-child a {border-radius:0 8px 8px 0;}
.stUxTop .suLocal ul li:last-child a:after {display:none;}
.stUxTop .suLocal ul li a.on {background:rgba(14, 86, 217, 0.7);}
.stUxTop .suLocal ul li a.on:after {display:none;}
.stUxTop .suLocal ul li a:hover {background:rgba(14, 86, 217, 0.7);}
.stUxTop .suLocal ul li a:hover:after {display:none;}

.suZoom {position:fixed; right:24px; top:24px; display:flex; justify-content:center; align-items:center; gap:8px;}
.suZoom button:hover {background:rgba(14, 86, 217, 0.7);}
.suZoom .zoomIn {display:flex; justify-content:center; align-items:center; height:42px; padding:0 14px; background:rgba(0, 0, 0, 0.7); border:0; border-radius:6px; color:#FFF; font-size:16px; position:relative;}
.suZoom .zoomIn:after {content:''; display:inline-block; width:13px; height:13px; background:url(../images/ico_zoomin.svg) no-repeat 50% 50%; background-size:100%; margin-left:5px;}
.suZoom .zoomOut {display:flex; justify-content:center; align-items:center; height:42px; padding:0 14px; background:rgba(0, 0, 0, 0.7); border:0; border-radius:6px; color:#FFF; font-size:16px; position:relative;}
.suZoom .zoomOut:after {content:''; display:inline-block; width:13px; height:13px; background:url(../images/ico_zoomout.svg) no-repeat 50% 50%; background-size:100%; margin-left:5px;}

.stUxSide {position:absolute; right:24px; top:100px; width:100%; max-width:360px; display:flex; justify-content:flex-start; align-items:stretch; gap:8px; overflow:hidden; transform:translateX(176px); transition:.4s all;}
.stUxSide.on {transform:translateX(0);}
.stUxSide .defaultCate {display:flex; justify-content:space-evenly; align-items:flex-start; flex-direction:column; gap:16px; position:relative; padding:16px 0;}
.stUxSide .defaultCate:after {content:''; position:absolute; right:0; top:0; width:56px; height:100%; border-radius:56px; background:rgba(0, 0, 0, 0.7);}
.stUxSide .defaultCate .perCate {display:block; width:184px;}
.stUxSide .defaultCate .perCate a {display:flex; justify-content:flex-end; align-items:center; position:relative; z-index:1; font-weight:400; opacity:0.5;}
.stUxSide .defaultCate .perCate a:hover {opacity:0.8;}
.stUxSide .defaultCate .perCate a.on {opacity:1.0; font-weight:500;}
.stUxSide .defaultCate .perCate a .txt {width:calc(100% - 56px); color:#FFF; font-size:16px; text-align:right; padding-right:15px; flex:0 0 auto;}
.stUxSide .defaultCate .perCate a .ico {width:56px; height:24px; flex:0 0 auto;}
.stUxSide .defaultCate .perCate a .ico.cate01 {background:url(../images/wico_height.svg) no-repeat 50% 50%; background-size:24px auto;}
.stUxSide .defaultCate .perCate a .ico.cate02 {background:url(../images/wico_mount.svg) no-repeat 50% 50%; background-size:24px auto;}
.stUxSide .defaultCate .perCate a .ico.cate03 {background:url(../images/wico_dam.svg) no-repeat 50% 50%; background-size:24px auto;}
.stUxSide .defaultCate .perCate a .ico.cate04 {background:url(../images/wico_bo.svg) no-repeat 50% 50%; background-size:24px auto;}
.stUxSide .defaultCate .perCate a .ico.cate05 {background:url(../images/wico_cctv.svg) no-repeat 50% 50%; background-size:24px auto;}
.stUxSide .defaultCate .perCate a .ico.cate06 {background:url(../images/wico_future.svg) no-repeat 50% 50%; background-size:24px auto;}

.stUxSide .moreCate {display:flex; justify-content:space-evenly; align-items:flex-start; flex-direction:column; gap:15px; width:168px; padding:24px 26px; background:rgba(0, 0, 0, 0.7); border-radius:8px;}
.stUxSide .moreCate label.perMore {display:flex; justify-content:space-between; align-items: center; cursor: pointer; color:#FFF; width:100%;}
.stUxSide .moreCate label.perMore:hover span {opacity:1.0;}
.stUxSide .moreCate label.perMore span {color:#FFF; font-size:16px; opacity:0.5;}
.stUxSide .moreCate label.perMore span.on {opacity:1.0;}
.stUxSide .moreCate label.perMore span + [type="checkbox"] {appearance:none; position:relative; border:0; border-radius:50px; width:34px; height:18px; background:#666; transition:.4s all;}
.stUxSide .moreCate label.perMore span + [type="checkbox"]::before {content: ""; position:absolute; left:2px; top:2px; width:14px; height:14px; border-radius:50%; background:#FFF; transition:.4s all;}
.stUxSide .moreCate label.perMore span + [type="checkbox"]:checked {background:#0e56d9;}
.stUxSide .moreCate label.perMore span + [type="checkbox"]:checked::before {left:18px;}

.cateCont {position:absolute; right:24px; top:380px; width:56px; height:56px; border-radius:50%; background:rgba(0, 0, 0, 0.7);}
.cateCont .cateMore a {display:block; width:100%; height:100%; background:url(../images/ico_more.svg) no-repeat 50% 50%; background-size:24px auto;}
.cateCont .cateMore a.close {background:url(../images/ico_cancel.svg) no-repeat 50% 50%; background-size:16px auto;}

.legendCont {position:absolute; z-index:10; right:24px; bottom:24px; width:56px; height:56px; border-radius:50%; background:rgba(0, 0, 0, 0.7);}
.legendCont .legendMore a {display:flex; justify-content:center; align-items:center; width:100%; height:100%; text-align:center; color:#FFF; font-size:14px; line-height:1.1; position:relative; padding:0 10px;}
.legendCont .legendMore a:after {content:'범례 보기'; }
.legendCont .legendMore a.close:after {content:'범례 닫기'; }

.fullSize .legend {position:absolute; right:96px; bottom:-100%; width:calc(100% - 124px); background:rgba(0, 0, 0, 0.7); border-radius:8px; padding:16px 20px; display:flex; justify-content:flex-start; align-items:flex-start; flex-wrap:wrap; gap:20px; transition:.4s all;}
.fullSize .legend.on {bottom:24px;}
.fullSize .legend .legendBox {display:flex; justify-content:flex-start; align-items:stretch; gap:16px; width:60%;}
.fullSize .legend .title {color:#FFF; font-size:14px; padding-bottom:8px; border-bottom:1px solid rgba(255, 255, 255, 0.4);}
.fullSize .legend .legendBox .pointLegend {display:block; flex:0 0 auto; width:calc(100% - 120px);}
.fullSize .legend .legendBox .pointLegend:last-child {width:108px;}
.fullSize .legend .legendBox .pointLegend ul {display:flex; justify-content:flex-start; gap:15px; padding:10px 0; flex-wrap:wrap;}
.fullSize .legend .legendBox .pointLegend ul li {display:flex; justify-content:flex-start; align-items:center; gap:5px; color:#FFF; font-size:14px;}
.fullSize .legend .legendBox .pointLegend ul li .ico {width:16px; height:16px; flex:0 0 auto;}
.fullSize .legend .legendBox .pointLegend ul li .ico img {width:100%;}
.fullSize .legend .graphLegend {display:block;}
.fullSize .legend .graphLegend .imgSec {width:669px; padding-top:10px; overflow-x:auto;}

.fullSize .marker.point {background:url(../images/mark_soo_point.svg) no-repeat 50% 50%; background-size:100%;}
.fullSize .marker.pointCau {background:url(../images/mark_soo_point_cau.svg) no-repeat 50% 50%; background-size:100%;}
.fullSize .marker.pointWarn {background:url(../images/mark_soo_point_warning.svg) no-repeat 50% 50%; background-size:100%;}
.fullSize .marker.upPoint {background:url(../images/mark_soo_point_up.svg) no-repeat 50% 50%; background-size:100%;}
.fullSize .marker.upPointCau {background:url(../images/mark_soo_point_cau_up.svg) no-repeat 50% 50%; background-size:100%;}
.fullSize .marker.upPointWarn {background:url(../images/mark_soo_point_warning_up.svg) no-repeat 50% 50%; background-size:100%;}

.fullSize .marker.downPoint {background:url(../images/mark_soo_point_down.svg) no-repeat 50% 50%; background-size:100%;}
.fullSize .marker.downPointCau {background:url(../images/mark_soo_point_cau_down.svg) no-repeat 50% 50%; background-size:100%;}
.fullSize .marker.downPointWarn {background:url(../images/mark_soo_point_warning_down.svg) no-repeat 50% 50%; background-size:100%;}
.fullSize .marker.dam {background:url(../images/loc_dam.svg) no-repeat 50% 50%; background-size:100%;}
.fullSize .marker.bo {background:url(../images/loc_bo.svg) no-repeat 50% 50%; background-size:100%;}
.fullSize .marker.cctv {background:url(../images/loc_cctv.svg) no-repeat 50% 50%; background-size:100%;}

.fullSize .localInfo {position:absolute; border-radius:5px; overflow:hidden; background:#FFF; border:1px solid #0e56d9; z-index:100;}
.fullSize .localInfo table {padding:0; margin:0; width:100%; table-layout:fixed;}
.fullSize .localInfo table th {background:#0e56d9; text-align:center; color:#FFF; font-size:14px; font-weight:600; padding:8px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
.fullSize .localInfo table td {padding:5px; text-align:left; color:#222; font-size:14px; border-bottom:1px solid #ddd;}
.fullSize .localInfo table td.item {background:#eee; text-align:center;}
.fullSize .localInfo .item {width:35%;}
.fullSize .localInfo .ipCon {width:65%;}

.fullSize .mapType {background:rgba(0, 0, 0, 0.7); border-radius:8px; width:56px; display:flex; justify-content:flex-start; align-items:flex-start; flex-direction:column; position:fixed; gap:8px; right:24px; top:448px; border-radius:56px; padding:20px 0;}
.fullSize .mapType a {display:block; width:100%; color:#FFF; font-size:12px; padding-top:32px; text-align:center; opacity:0.4;}
.fullSize .mapType a.on {opacity:1.0;}
.fullSize .mapType a.satellite {background:url(../images/map_ico_sat.svg) no-repeat 50% 0; background-size:34px auto;}
.fullSize .mapType a.night {background:url(../images/map_ico_night.svg) no-repeat 50% 0; background-size:34px auto;}
.fullSize .mapType a.day {background:url(../images/map_ico_map.svg) no-repeat 50% 0; background-size:34px auto;}


.radarSec {display:block; height:900px; position:relative; overflow:hidden; margin-bottom:60px;}
.radarSec .stUxSide {right:24px; top:24px; max-width:168px; transform:translateX(0); flex-direction:column; z-index:10;}
.radarSec .stUxSide .playerMap {background:rgba(0, 0, 0, 0.7); border-radius:8px; padding:16px 16px 0;}
.radarSec .stUxSide .playerMap .time {text-align:center; color:#FFF; font-size:14px; font-weight:500; padding:0 0 12px 0; border-bottom:1px solid rgba(255, 255, 255, 0.4);}
.radarSec .stUxSide .playerMap .playBtns {display:flex; justify-content:space-between; align-items:center;}
.radarSec .stUxSide .playerMap .playBtns button {width:25%; height:40px; border:0; text-indent:-9999px; position:relative; opacity:0.4;}
.radarSec .stUxSide .playerMap .playBtns button:hover {opacity:1.0;}
.radarSec .stUxSide .playerMap .playBtns button.reverse {background:url(../images/pico_back.svg) no-repeat 50% 50%; background-size:20px;}
.radarSec .stUxSide .playerMap .playBtns button.playPause {background:url(../images/pico_play.svg) no-repeat 50% 50%; background-size:20px;}
.radarSec .stUxSide .playerMap .playBtns button.playPause.pause {background:url(../images/pico_pause.svg) no-repeat 50% 50%; background-size:20px;}
.radarSec .stUxSide .playerMap .playBtns button.stop {background:url(../images/pico_stop.svg) no-repeat 50% 50%; background-size:20px;}
.radarSec .stUxSide .playerMap .playBtns button.playForward {background:url(../images/pico_forward.svg) no-repeat 50% 50%; background-size:20px;}

.radarSec .stUxSide .mapType {width:auto; flex-direction:row; gap:0; right:unset; top:unset; position:relative; background:rgba(0, 0, 0, 0.7); border-radius:8px; padding:16px; display:flex; justify-content:space-evenly; align-items:stretch;}
.radarSec .stUxSide .mapType a {display:block; width:33.3333%; color:#FFF; font-size:12px; padding-top:40px; text-align:center; opacity:0.4;}
.radarSec .stUxSide .mapType a.on {opacity:1.0;}
.radarSec .stUxSide .mapType a.satellite {background:url(../images/map_ico_sat.svg) no-repeat 50% 0; background-size:34px auto;}
.radarSec .stUxSide .mapType a.night {background:url(../images/map_ico_night.svg) no-repeat 50% 0; background-size:34px auto;}
.radarSec .stUxSide .mapType a.day {background:url(../images/map_ico_map.svg) no-repeat 50% 0; background-size:34px auto;}

.radarSec.fullSize .legend {width:100%; max-width:397px;}
.radarSec .legend .graphLegend .imgSec {width:358px;}
.radarSec .legend .graphLegend .imgSec img {height:42px;}

.popCctv .popHead {text-align:center; color:#FFF; font-size:20px; justify-content:center;}
.popVod {position:relative; background:#222;}
/* 팝업창 css 수정을 위해 주석처리
.popVod:after {content:''; display:block; height:auto; padding-bottom:75%;}
*/
.popVod:after {content:''; display:block; height:auto;}
.popVod video, .popCctv .popVod iframe {position:absolute; left:0; top:0; width:100%; height:100%;}
.popVod .relayPlay {position:absolute; left:0; top:50%; transform:translate(0, -50%); text-align:center; width:100%;}
.popVod .relayPlay .title {color:#FFF; font-size:22px; font-weight:500; margin-bottom:20px;}
.popVod .relayPlay a.btn {display:inline-block; width:120px; text-align:center; padding:12px 0; color:#FFF; font-size:16px; font-weight:500; border-radius:10px; margin:0 3px;}
.popVod .relayPlay a.btn.confirm {background:#0e56d9;}
.popVod .relayPlay a.btn.cancel {background:#104096;}
.popCctv .contSec {margin:0;}
.popCctv .contSec h3 {margin-bottom:10px;}
.popCctv .contSec .partBox {padding:20px;}
.popCctv .contSec .partBox .perCont.scroll {padding-left:0; height:100px; overflow:hidden; overflow-y:auto;}
.popCctv .contSec .helpCau {background:#eee; padding:10px 20px; display:flex; justify-content:space-between; align-items:center;}
.popCctv .contSec .helpCau .title {color:#666; font-size:14px;}
.popCctv .contSec .helpCau a {color:#222; font-size:14px; font-weight:700; position:relative; padding-right:20px;}
.popCctv .contSec .helpCau a:after {content:''; position:absolute; right:0; top:50%; transform:translate(0, -50%); width:20px; height:20px; background:url(../images/dir_right.svg) no-repeat 50% 50%; background-size:auto 12px;}

.hanUxTop {position:fixed; left:0; top:0; width:100%; background:#0e56d9; display:flex; justify-content:space-between; align-items:center; padding:16px 24px; z-index:10;}
.hanUxTop .title {color:#FFF; font-size:28px; font-weight:600;}
.hanUxTop .pfBlock .pfItem {color:#FFF; margin-right:10px;}
.hanUxTop .pfBlock .pfItem .item {color:#FFF;}
.hanUxTop .pfBlock .pfItem button.search {background:#449cff;}
.hanUxTop .pfBlock .pfItem .sortBtns {overflow:hidden;}
.hanUxTop .pfBlock .pfItem .sortBtns .sort a {background:#FFF;}
.hanUxTop .pfBlock .pfItem .sortBtns .sort a.on {background:#86CC00;}

.hanUxTop .pfBlock .pfItem label.autoReload {display:flex; justify-content:space-between; align-items: center; cursor: pointer; color:#FFF; margin:0 5px;}
.hanUxTop .pfBlock .pfItem label.autoReload:hover span {opacity:1.0;}
.hanUxTop .pfBlock .pfItem label.autoReload span {color:#FFF; font-size:16px; opacity:0.5; margin-right:5px;}
.hanUxTop .pfBlock .pfItem label.autoReload span.on {opacity:1.0;}
.hanUxTop .pfBlock .pfItem label.autoReload span + [type="checkbox"] {appearance:none; position:relative; border:0; border-radius:50px; width:40px; height:24px; background:#666; transition:.4s all;}
.hanUxTop .pfBlock .pfItem label.autoReload span + [type="checkbox"]::before {content: ""; position:absolute; left:2px; top:2px; width:20px; height:20px; border-radius:50%; background:#FFF; transition:.4s all;}
.hanUxTop .pfBlock .pfItem label.autoReload span + [type="checkbox"]:checked {background:#86cc00;}
.hanUxTop .pfBlock .pfItem label.autoReload span + [type="checkbox"]:checked::before {left:18px;}

.mngWrap {display:flex; justify-content:flex-start; align-items:flex-start; gap:10px; padding:40px 2%;}
.mngWrap .title {padding:14px 12px 14px 40px; background:#0e56d9 url(../images/ico_drop.svg) no-repeat 12px 50%; background-size:auto 20px; position:relative; color:#FFF; font-size:20px; font-weight:700;}
.mngWrap .title span {position:absolute; right:12px; bottom:12px; text-align:right; color:#FFF; font-size:14px; font-weight:400;}
.mngWrap .tableSec {display:block; width:calc(70% - 5px);}
.mngWrap .tableSec .perTable {margin-bottom:10px;}
.mngWrap .refSec {display:flex; justify-content:flex-start; align-items:stretch; width:calc(30% - 5px); gap:10px; flex-direction:column;}
.mngWrap .refSec .refBlock {display:block;}
.mngWrap .refSec .refBlock .refCont {background:#FFF; position:relative;}
.mngWrap .refSec .refBlock .refCont:after {content:''; display:block; height:auto; padding-bottom:120.9756%;}
.mngWrap .refSec .refBlock .refCont .guideMap {position:absolute; left:10px; top:10px; z-index:1;}
.mngWrap .refSec .refBlock .refCont .sideLegend {position:absolute; right:10px; top:10px; z-index:1;}
.mngWrap .refSec .refBlock .refCont .sideLegend img {width:54px;}
.mngWrap .refSec .refBlock .refCont .imgSec img {position:absolute; left:0; top:0; width:100%; height:100%;}
.mngWrap .refSec .refBlock .refCont embed {position:absolute; left:0; top:0; width:100%; height:100%;}

.mngWrap .mngUi {position:relative; overflow:hidden; overflow-x:auto;}
.mngWrap .mngUi ul {position:relative; min-width:1024px;}
.mngWrap .mngUi .thead {display:flex; justify-content:space-evenly; align-items:center;}
.mngWrap .mngUi .tbody {display:flex; justify-content:space-evenly; align-items:center;}
.mngWrap .mngUi li {text-align:center; color:#FFF; font-size:14px; padding:8px; border-right:1px solid rgba(255, 255, 255, 0.2); border-bottom:1px solid rgba(255, 255, 255, 0.2); flex:1 0 auto; position:relative; background:#485767; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.mngWrap .mngUi li:first-child {border-left:1px solid rgba(255, 255, 255, 0.2);}
.mngWrap .mngUi .thead li {height:68px; display:flex; justify-content:center; align-items:center; background:#001a4a;}
.mngWrap .mngUi .tbody li {text-align:right;}
.mngWrap .mngUi .thead li.current {flex-direction:column;}
.mngWrap .mngUi .thead li dl {clear:both; display:block; width:100%;}
.mngWrap .mngUi .thead li dl dd {float:left; padding:5px;}
.mngWrap .mngUi .thead li dl dd.wlevel {width:37.5%;}
.mngWrap .mngUi .thead li dl dd.elevate {width:62.5%;}

.mngWrap .mngUi table {padding:0; margin:0; width:100%; table-layout:fixed; min-width:1024px;}
.mngWrap .mngUi th, .mngWrap .mngUi td {background:#485767; color:#FFF; font-size:14px; padding:8px; text-align:center; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.mngWrap .mngUi th {border:1px solid #33486e; background:#001a4a; vertical-align:middle; font-weight:400;}
.mngWrap .mngUi td {border:1px solid #6d7985; background:#485767;}

.mngWrap .mngUi td .up {display:inline-block; position:relative; margin-left:5px;}
.mngWrap .mngUi td .up:after {content:'▲'; color:#f44747; font-size:12px;}
.mngWrap .mngUi td .down {display:inline-block; position:relative; margin-left:5px;}
.mngWrap .mngUi td .down:after {content:'▼'; color:#53c2e0; font-size:12px;}
.mngWrap .mngUi td .same {display:inline-block; position:relative; margin-left:6px;}
.mngWrap .mngUi td .same:after {content:''; display:inline-block; width:8px; height:2px; background:#ccc; vertical-align:4px; margin-right:2px;}
.mngWrap .mngUi td .normal {color:#1de9bb;}
.mngWrap .mngUi td .attend {color:#fd972a;}
.mngWrap .mngUi td .caution {color:#ea7bf6;}
.mngWrap .mngUi td .warning {color:#e28000;}
.mngWrap .mngUi td.point {background:#1f355e;}

.mngWrap .mngUi li.riverPoint {width:220px; text-align:center;}
.mngWrap .mngUi li.river {width:90px; text-align:center;}
.mngWrap .mngUi li.point {width:130px; text-align:center;}
.mngWrap .mngUi li.waterfall {width:90px; text-align:center;}
.mngWrap .mngUi li.damH {width:90px; text-align:center;}
.mngWrap .mngUi li.time {width:140px; text-align:center;}
.mngWrap .mngUi li.height {width:5%;}
.mngWrap .mngUi li.normal {width:5%;}
.mngWrap .mngUi li.attend {width:5%;}
.mngWrap .mngUi li.caution {width:3%;}
.mngWrap .mngUi li.warning {width:3%;}
.mngWrap .mngUi li.danger {width:5%;}
.mngWrap .mngUi li.wlevel {width:3%;}
.mngWrap .mngUi li.elevate {width:5%;}

.mngWrap .mngUi li.current {width:8%;}
.mngWrap .mngUi li.before {width:3%;}

.mngWrap .mngUi.dam li {width:14%;}
.mngWrap .mngUi li.location {width:16%; text-align:center;}
.mngWrap .mngUi.bo li {width:12%;}
.mngWrap .mngUi.point li {width:12%;}
.mngWrap .mngUi.point li.location {width:24%;}
.mngWrap .mngUi.point li.level {width:12%; text-align:center;}
.mngWrap .mngUi.point li.current {width:16%;}

.mngWrap .mngUi .tbody li.normal {color:#1de9bb;}
.mngWrap .mngUi .tbody li.attend {color:#fd972a;}
.mngWrap .mngUi .tbody li.caution {color:#fbed09;}
.mngWrap .mngUi .tbody li.warning {color:#ea7bf6;}

.mngWrap .mngUi li .up {display:inline-block; position:relative; margin-left:5px;}
.mngWrap .mngUi li .up:after {content:'▲'; color:#f44747; font-size:12px;}
.mngWrap .mngUi li .down {display:inline-block; position:relative; margin-left:5px;}
.mngWrap .mngUi li .down:after {content:'▼'; color:#53c2e0; font-size:12px;}
.mngWrap .mngUi li .same {display:inline-block; position:relative; margin-left:6px;}
.mngWrap .mngUi li .same:after {content:''; display:inline-block; width:8px; height:2px; background:#ccc; vertical-align:4px; margin-right:2px;}

.popLevelWrap {display:flex; justify-content:flex-start; align-items:stretch;}
.popLevelWrap .mapSec {display:block; width:50%; position:relative; overflow:hidden; height:calc(100vh - 88px);}
.popLevelWrap .mapSec .tempMap {position:absolute; left:0; top:0; width:100%; height:100%;}
.popLevelWrap .mapSec .suZoom {position:absolute; z-index:10;}
.popLevelWrap .mapSec .suLevel {position:absolute; left:24px; top:24px; height:auto; z-index:10;}
.popLevelWrap .mapSec .suLevel .btn {display:inline-block;}
.popLevelWrap .mapSec .suLevel .btn a {display:block; border-radius:6px; position:relative; padding:8px 15px; color:#FFF; font-size:16px; margin:0 3px; width:100px;}
.popLevelWrap .mapSec .suLevel .btn a em {position:absolute; right:15px; top:50%; transform:translate(0, -50%); text-align:right; font-weight:600;}
.popLevelWrap .mapSec .suLevel .btn.attend a {background:#46bd0a;}
.popLevelWrap .mapSec .suLevel .btn.caution a {background:#ffbe00;}
.popLevelWrap .mapSec .suLevel .btn.warning a {background:#fc8200;}
.popLevelWrap .mapSec .suLevel .btn.danger a {background:#d21d25;}

.popLevelWrap .levelSec {display:block; width:50%; height:calc(100vh - 88px); overflow:hidden; overflow-y:auto; padding-top:0px;}
.popLevelWrap .levelSec .mngWrap {display:flex; justify-content:flex-start; align-items:flex-start; padding:0; gap:0;}
.popLevelWrap .levelSec .mngWrap .mngUi {width:50%; border:1px solid rgba(255, 255, 255, 0.4);}
.popLevelWrap .levelSec .mngWrap .mngUi .thead li {height:auto;}
.popLevelWrap .levelSec .mngWrap .mngUi li {font-size:12px;}
.popLevelWrap .levelSec .mngWrap .mngUi li a {display:block; position:relative; color:#FFF; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.popLevelWrap .levelSec .mngWrap .mngUi ul {min-width:100%;}
.popLevelWrap .levelSec .mngWrap .mngUi .tbody li {background:#454547;}
.popLevelWrap .levelSec .mngWrap .mngUi .tbody:hover li {background:#666;}
.popLevelWrap .levelSec .mngWrap .mngUi .tbody li.attend {color:#46bd0a;}
.popLevelWrap .levelSec .mngWrap .mngUi .tbody li.caution {color:#ffbe00;}
.popLevelWrap .levelSec .mngWrap .mngUi .tbody li.warning {color:#fc8200;}
.popLevelWrap .levelSec .mngWrap .mngUi .tbody li.danger {color:#d21d25;}

a.sort {display:flex; justify-content:center; align-items:center; gap:5px;}
a.sort:after {content:'▲'; display:inline-block; width:12px; color:#FFF; font-size:8px; text-align:right;}
a.under:after {content:'▼'; display:inline-block; width:12px; color:#FFF; font-size:8px; text-align:right;}

.popCont .popDevice .statSec table th a.sort:after {color:#000; font-size:10px;}
.popCont .popDevice .statSec table th a.under:after {color:#000; font-size:10px;}

.mngWrap .mngUi.point li.level .attend {display:block; width:100%; height:100%; background:#46bd0a;}
.mngWrap .mngUi.point li.level .caution {display:block; width:100%; height:100%; background:#ffbe00;}
.mngWrap .mngUi.point li.level .warning {display:block; width:100%; height:100%; background:#fc8200;}
.mngWrap .mngUi.point li.level .danger {display:block; width:100%; height:100%; background:#d21d25;}

.contSec .midTitle.mt2 {padding-left: 5px;}
.contSec .midTitle.mt2:before {display: none;}
.contSec .midTitle.mt3 {font-weight: 500; margin-top: 20px;}
.contSec .midTitle.mt3:before {display: none;}
.contSec .midTitle.rt {color: #0e56d9; text-align: right; margin-right: 20px; font-weight: 500;}
.contSec .midTitle.rt:before {display: none;}
.contSec .perCont ul li.li {margin-left: 15px; font-size: 14px; color: #8d8d8d;}
.contSec .perCont ul li.li:before {background: #8d8d8d;}
.contSec .pGuideBox.gray .perCont {margin-top: 15px;}
.contSec .pGuideBox.gray.size {margin-bottom: 15px; padding: 15px 25px;}
.contSec.mw .imgSec img {max-width: 1296px;}
.contSec.mw2 .imgSec img {max-width: 1306px;}
.contSec .imgSec .img .ss {float: left; width:50%; max-width: 634px;}
.contSec .imgSec .img .fw {float: right; width: 50%; max-width: 634px;}
.scrollTable.ta table td {text-align: center; padding: 10px; vertical-align: middle;}
.scrollTable.ta table th.sideItem {text-align: center; padding: 0;}
.scrollTable.c030102 table {min-width: 100%;}
.scrollTable.c030102 table tr td {text-align: center; padding: 0; vertical-align: middle;}
.scrollTable.c030104 table tr td {text-align: center; vertical-align: middle; padding: 10px;}
.scrollTable.c030401 table {min-width: 971px;}
.scrollTable.c030401 table tr th span {font-size: 12px;}
.scrollTable.c030401 table tr td {text-align: center; vertical-align: middle; padding: 0;}
.bbsTable .tel {width:15%; flex:0 0 auto;}
.bbsTable .number {width:15%; flex:0 0 auto;}
.bbsTable .cName.wd {width:100px; flex:0 0 auto;}
.bbsTable .cMount.wd {width:160px; flex:0 0 auto;}
.bbsTable.wd .depart {width: 12%;}
.bbsTable.wd .tel {width: 12%;}
.bbsTable.wd .hit {width: 8%;}
.bbsTable.f02 .tbody li span {padding: 10px 0;}
.bbsTable.f02 .tbody .depart {padding: 20px;}
.bbsTable.f02 .tbody .number {padding: 20px;}
.bbsTable.f02 .tbody .subject {padding: 20px;}
.bbsTable .bbsFunc .bbsSearch button.save {background:#0e56d9;}
/*.bbsTable .bbsFunc .bbsSearch select {width: 150px;} css 적용 위해 주석처리(작성자 : 유태균)*/
.schSec button.save {background:#0e56d9;}
.schSec input[type="radio"] {width: 15px; height: 15px; margin-left: 7px; margin-right: 1px; cursor: pointer;}

.bookCategory .perCategory .dataList .yrData.none {background: #eee; border: 1px solid #cfcfcf; cursor: default;}
.bookCategory .perCategory .dataList .yrData.none a {color: #a9a9a9;cursor: default;}
.bookCategory .perCategory .dataList .yrData.none span {opacity: 0.5;}
.bookCategory .perCategory .dataList .yrData.none label {cursor: default;}
.bookCategory .perCategory .dataList .yrData.none input {cursor: default;}
.schSec.f02 .selectBox .dbTitle {font-size: 16px;}
.schSec.f02 .monthBox button {margin-left: 20px;}

.scrollTable.f0201 table thead tr th {font-weight: 700; border-top: 2px solid #222; background: #e9e9e9;}
.scrollTable.f0201 table tr td.pd {padding: 14px 20px;}
.scrollTable.f0201 table tr td a {color: #0e56d9;}
.scrollTable.f0201 table tr td a:hover {text-decoration: underline;}
.contSec.f0201 {margin-top: -20px;}
.contSec.f0201 .btnC {text-align: right; margin-bottom: 10px;}
.contSec.f0201 .btnC button {font-size: 14px; font-weight: 600; padding: 10px 30px; border-radius:4px; background: #0ac097;border: 0; color: #fff;}
.error {font-size: 40px; text-align: center; font-weight: 600; letter-spacing: -1px; background: #fff; width: 600px; margin: 150px auto 0 auto; padding: 50px 25px; box-shadow: 0 0 10px 3px rgba(0,0,0,0.1);}
.error .click {margin-top: 40px; }
.error .click a {font-size: 20px; font-weight: 500; color: #fff; border-radius: 8px; background: #0e56d9; padding: 14px 50px; display: inline-block;}

/* edit 240221 Daover */
.section.sec3 .newsBnr {box-shadow:none; border:0; background:transparent; border-radius:0; display:flex; justify-content:space-between; align-items:stretch; flex-direction:column;}
.section.sec3 .newsBnr .bnrRolling {background:#FFF; border:1px solid #ccc; border-radius:16px; overflow:hidden; height:286px; 
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
}
.section.sec3 .newsBnr .outBnr {height:auto;}
.section.sec3 .newsBnr .waterGuide {display:block; height:286px; border-radius:16px; background:#d6e8ff url(../images/bg_river01.png) no-repeat 50% bottom; background-size: 100% auto;
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.1);
}

.section.sec3 .newsBnr .waterGuide a {display:block; padding:38px 34px; width:100%; height:100%;}
.section.sec3 .newsBnr .waterGuide a p {color:#222;}
.section.sec3 .newsBnr .waterGuide a .title {font-size:26px; font-weight:700; margin-bottom:12px;}
.section.sec3 .newsBnr .waterGuide a .desc {font-size:16px; line-height:1.3;}

.subComnSec .inner .subCont h2 {display:flex; align-items:center; gap:10px;}
.subComnSec .inner .subCont h2 .nuriIco {display:inline-block; width:34px; height:34px; background:url(../images/ico_nurizip.svg) no-repeat 50% 50%; background-size:auto 100%;}

/* edit 240222 */
.deviceBox {display:flex; justify-content:flex-start; align-items:stretch; gap:20px; background:#fafafa; border-radius:0px; padding:25px; margin-top:20px; width:calc(100% + 50px); margin:20px -25px -25px; border-radius:0 0 8px 8px;}
.deviceBox > div {display:block; width:calc(33.33334% - 10px);}

.deviceBox .comnConTitle {color:#222; font-size:18px; font-weight:700; margin-bottom:15px; position:relative; display:flex; justify-content:flex-start; align-items:center; gap:10px;}
.deviceBox .comnConTitle:before {content:''; display:inline-block; width:22px; height:22px;}
.deviceBox .comnConTitle.ico01:before {background:url(../images/ico_b0501.svg) no-repeat 50% 50%; background-size:100%;}
.deviceBox .comnConTitle.ico02:before {background:url(../images/ico_b0502.svg) no-repeat 50% 50%; background-size:100%;}
.deviceBox .comnConTitle.ico03:before {background:url(../images/ico_b0503.svg) no-repeat 50% 50%; background-size:100%;}
.subComnSec .inner .subCont .deviceBox ul {padding:0 0 0 7px;}
.subComnSec .inner .subCont .deviceBox ul.depth02 {padding-left:34px;}
.subComnSec .inner .subCont .deviceBox .historyBox ul:after {left:12px;}
.subComnSec .inner .subCont .deviceBox .historyBox ul li {padding-left:130px !important;}

.paperYrs {display:flex; justify-content:space-between; align-items:center; gap:10px; width:100%;}
.paperYrs a {width:14.285714%; padding:10px; text-align:center; color:#222; font-size:16px; font-weight:500; border:1px solid #ddd; border-radius:100px;}
.paperYrs a.on {background:#0ac097; font-weight:700; color:#FFF; border:1px solid #0ac097;}
.paperYrs a:hover {background:#f0f0f0;}
.paperYrs a.on:hover {background:#0ac097; color:#FFF;}

.levTable {position:absolute; left:6px; top:46px; width:100%; max-width:420px; height:auto; max-height:300px; overflow:hidden; overflow-y:auto; border:1px solid rgba(255, 255, 255, 0.4);}
.levTable ul {min-width:100%; display:flex; justify-content:flex-start; align-items:stretch; border-bottom:1px solid rgba(255, 255, 255, 0.2);}
.levTable ul.thead {background:#001a4a; position:sticky; left:0; top:0; width:100%;}
.levTable ul.thead li {text-align:center;}
.levTable ul.thead li.location a {text-align:left;}
.levTable li {font-size:14px; width:20%; border-right:1px solid rgba(255, 255, 255, 0.2); color:#FFF; padding:8px; text-align:right;}
.levTable li a {display:block; color:#FFF;}
.levTable .tbody li {background:#454547; color:#FFF;}
.levTable .tbody:hover li {background:#666;}
.levTable li.location {width:60%; text-align:left;}

.downListWrap {display:flex; justify-content:space-between; align-items:stretch; gap:18px; flex-wrap:wrap;}
.bookCategory .perCategory {width:calc(25% - 13.5px); flex-direction:column; gap:0; align-items:flex-start; position:relative; border:0;}
.bookCategory .perCategory .ico {width:90px; position:absolute; right:5px; top:5px;}
.bookCategory .perCategory .expCate .cateInfo {flex-direction:column; align-items:flex-start;}
.bookCategory .perCategory .expCate .cateInfo .title {display:flex; align-items:center; height:56px; width:calc(100% - 80px); color:#222; font-weight:900;}
.bookCategory .perCategory .expCate .cateInfo ul {display:flex; justify-content:flex-start; align-items:stretch; gap:8px; flex-wrap:wrap; margin-bottom:15px;}
.bookCategory .perCategory .expCate .cateInfo ul li {width:100%; margin:0; flex:0 1 auto; font-size:14px;}
.bookCategory .perCategory .expCate .cateInfo ul li:after {top:6px;}
.bookCategory .perCategory .dataList .yrData {width:100%; position:relative;}
.bookCategory .perCategory .dataList .yrData .downHit {position:absolute; right:45px; top:50%; transform:translate(0, -50%);}
.bookCategory .perCategory .dataList .yrData.dis .downHit {right:10px;}
.bookCategory .perCategory.colorTy01 {background:#f1f2ff;}
.bookCategory .perCategory.colorTy02 {background:#e1f3ef;}
.bookCategory .perCategory.colorTy03 {background:#e4ecf3;}
.bookCategory .perCategory.colorTy04 {background:#ffe9e8;}

.riverSec {position:absolute; left:0px; bottom:-1px; z-index:100;}
.riverSec li {display:block; margin-bottom:1px;}
.riverSec li .rsBtn a {display:block; padding:6px 8px; color:#FFF; font-size:12px; font-weight:600; background:#444; text-align:center;}
.riverSec li .rsBtn a.on {background:#03ca91;}
.riverSec li:first-child .rsBtn a {border-radius:0 4px 0 0;}

.subComnSec .inner .subCont .contInfoBox.big .title {font-size:22px;}
.subComnSec .inner .subCont .contInfoBox.big .title:after {top:3px;}

.txtDown {color:blue;}