@charset "utf-8";
@font-face {font-family: 'Noto Sans';font-style: normal;font-weight: 400;src: url('/font/NotoSansKR-Regular.woff2') format('woff2'),url('/font/NotoSansKR-Regular.woff') format('woff'),url('/font/NotoSansKR-Regular.otf') format('opentype')}


html, body {display: block;height: 100%; line-height: 1}
body, h1, h2, h3, h4, h5, h6, div, p, blockquote, pre, address, ul, ol, li, dl, dt, dd, table, caption, th, td, form, fieldset, legend, hr, label, button {margin:0; padding:0; font-size:14px; color: #454753}
body {font-family:'Noto Sans', 'Malgun Gothic', dotum, gulim, verdana, sans-serif; font-weight:400;}
h1, h2, h3, h4, h5, h6 {font-size:100%; font-family:'Noto Sans', dotum, gulim, verdana, sans-serif; font-weight:400;}
ul, ol, dl {list-style:none;}
table {width:100%; margin:0; padding:0; border-spacing:0; border:0; border-collapse:collapse; word-break:break-word;}
img, button, fieldset, abbr, acronym {border:0;}
address, caption, cite, code, dfn, em, var {font-style:normal; font-weight:normal;}
strong {font-weight:normal;}
q:before, q:after {content:'';}

input[type=text],
input[type=password],
textarea,
select,
.btn {vertical-align:middle; /*background-color:none;*/ font-family:'Noto Sans', 'Malgun Gothic', dotum, gulim, verdana, sans-serif; font-size:14px}
/*
::-webkit-input-placeholder {color:#888}
:-moz-placeholder {color:#888}
::-moz-placeholder {color:#888}
:-ms-input-placeholder {color:#888}
*/
textarea {overflow:auto; padding:10px; line-height:22px;}
input[type=checkbox] {width:13px; height:13px; vertical-align:middle;}
input[type=radio] {width:13px; height:13px; margin-top:-1px; vertical-align:middle;}
label { vertical-align: middle; cursor: pointer; }
button {font-family:'Noto Sans'; font-weight:400; cursor:pointer;}

a {color:#257393;text-decoration:none;}
a:focus, a:hover, a:active {color:#00a4cb}

nav a { color: #fff }

a.skip { position: fixed; left: -9999px; top: -9999px; display: block; line-height: 3em; background: #40b2cd; color: #fff; text-align: center;}
a.skip:hover,
a.skip:focus { position: static; left: 0; top: 0; }
/*
*::selection {background:#5ce2ed; color:#454753}
*::-moz-selection {background:#5ce2ed; color:#454753}
*/


/* 스크롤바 커스텀 */
html * {scrollbar-width: thin;}
html { scrollbar-width: thin; scrollbar-arrow-color: #efefef; scrollbar-Track-Color: #efefef; scrollbar-base-color: #dfdfdf; scrollbar-Face-Color: #dfdfdf; scrollbar-3dLight-Color: #dfdfdf; scrollbar-DarkShadow-Color: #dfdfdf; scrollbar-Highlight-Color: #dfdfdf; scrollbar-Shadow-Color: #dfdfdf; }
/* Chrome, Safari용 스크롤 바 */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment {display: block; width: 12px;height: 12px; background: rgba(0,0,0,.05);}
::-webkit-scrollbar-track { background: rgb(255,255,255); }
::-webkit-scrollbar-thumb { border-radius: 10px; background: rgba(0,0,0,.2);  }


/* layout */
body.no_scroll { overflow: hidden;}
.container { position: relative; min-width: 990px }

.header { background: #262a33; height: 56px;position: fixed; width: 100%; z-index: 500;transition: all 0.2s ease 0s;}
.header,
.header h1,
.top_menu, 
.gnb,
.gnb > ul > li > a,
.gnb > ul > li > a > span {transition: all 0.2s ease 0s;}

.h1 { position: absolute; left: 0;top: 0; color: #3cb3db; transition: all 0.2s ease 0s; width: 140px;height: 56px;background: #40b2cd url("/images/h1_logo0.png") no-repeat center center / 85%; color: #40b2cd;}
.h1_ems {width: 178px; position: absolute; left: 140px ; background: rgba(0,0,0,0.3); transition: all 0.2s ease 0s;}
.h1_ems a { display:block; height: 56px; background: url(/images/h1_ems.png) no-repeat -2px 11px; font-size: 0px;transition: all 0.2s ease 0s; width: 100%; }

.jsHeaderTop .header { height: 60px} 
.jsHeaderTop .header .h1,
.jsHeaderTop .header .h1_ems a  { height: 60px;  }
.jsHeaderTop .header .h1_ems a { background-position: 0 10px}
.jsHeaderTop .top_menu {padding-top: 14px}

.top_menu { text-align: right; float: right; padding:12px 10px 0 0;}
.top_menu a { display: inline-block; padding:14px 10px 14px 0px;color: #d4d4d4; vertical-align: baseline;}
.top_menu a:hover,
.top_menu a:focus { color: #fff }
a.btn_login { background: url(/images/icon_avatar.png) no-repeat 0 0px; padding-left: 24px; overflow: hidden; text-indent: -9999px; font-size: 0}
a.btn_login:hover,
a.btn_login:focus { background-position: 0 -38px; }

strong.login_name { color: #999; padding-right:10px }
strong.login_name .login_name{background: url(/images/icon_avatar.png) no-repeat 0 -76px; color: #40b2cd; font-size: 15px; padding:8px 2px 8px 34px }

strong.login_name span,
a.htn_join,
a.btn_mypage { display: none; vertical-align: middle; }

a.btn_logout { font-size: 0; width: 25px; height: 25px ; padding:0; vertical-align: middle; margin-top: -8px; background: url("../images/iconPower.png") no-repeat center; opacity:0.6}
a.btn_logout:hover,
a.btn_logout:focus { opacity:1}

a.btn_autologout { font-size: 0; width: 25px; height: 25px ; padding:0; vertical-align: middle; margin-top: -8px; opacity:0.6}
a.btn_autologout:hover,
a.btn_autologout:focus { opacity:1}


/* GNB */

.gnb {position:absolute; right: 180px; }
.gnb > ul {}
.gnb > ul:after {content:''; display:block; clear:both;}
.gnb > ul > li {position:relative; float:left; z-index:3;}
.gnb > ul > li.e00 { min-width: 150px}
.gnb > ul > li > a {display:block; width:80px; height: 35px; padding:20px 18px 0 18px; color:#d4d4d4; font-size:15px; font-weight:400;}
.gnb > ul > li > a.b00{/* width: 75px */}
.gnb > ul > li > a.c00{/* width: 70px */}
.gnb > ul > li > a > span { display: inline-block; height: 40px;border-bottom:solid 2px #262a33;}
.gnb > ul > li > a:hover,
.gnb > ul > li > a:focus,
.gnb > ul > li.on > a,
.a00 .gnb > ul > li.a00 > a,
.b00 .gnb > ul > li.b00 > a,
.c00 .gnb > ul > li.c00 > a,
.d00 .gnb > ul > li.d00 > a,
.e00 .gnb > ul > li.e00 > a,
.g00 .gnb > ul > li.e00 > a,
.f00 .gnb > ul > li.f00 > a {color:#28bcdf;z-index:4}

.gnb > ul > li > a:hover span,
.gnb > ul > li > a:focus span,
.gnb > ul > li.on > a span,
.a00 .gnb > ul > li.a00 > a span,
.b00 .gnb > ul > li.b00 > a span,
.c00 .gnb > ul > li.c00 > a span,
.d00 .gnb > ul > li.d00 > a span,
.e00 .gnb > ul > li.e00 > a span,
.g00 .gnb > ul > li.e00 > a span,
.f00 .gnb > ul > li.f00 > a span {border-bottom: solid #28bcdf 2px;}
.gnb > ul > li > ul {display:none; padding:10px 0 0 0; }
.gnb > ul > li > ul > li {position:relative; font-size:0; line-height:0}
.gnb > ul > li > ul > li > a {display:block; color:#333; font-size:14px; font-weight:400; line-height:28px; padding:0 0 0 18px;}
.gnb > ul > li > ul > li > a:hover,
.gnb > ul > li > ul > li > a:focus,
.gnb > ul > li > ul > li.on > a {color:#009fc5;z-index:2;}

.jsHeaderTop .gnb > ul > li > a { padding-top:21px; }
.jsHeaderTop .gnb > ul > li > a > span { height: 33px; }

.bg-banner {position:absolute; display: none; top:56px; left:0; width:100%; height:214px; border-bottom:1px solid #e1e1e1; background: #fff; z-index: 1; box-shadow:0 3px 5px rgba(0,0,0,0.1); }
.jsHeaderTop .bg-banner {top:56px;}
.ie8-sapari .gnb > ul > li > a {min-width:70px; padding:0 35px; letter-spacing:-1px;}


.section{ background: #f7f5f2 }
.section:after { display:block; content: ""; clear: both; }
.section .container { width: 94%; margin: 0 auto; padding:80px 0 40px 0 }

/* 통합모니터링 레이아웃 추가 */
.container1 { position: relative; min-width: 100%; }
.section .container1 { width: 100%; margin: 0 auto; padding:56px 0 40px 0 }
.c40_monitoring .section .container1 { padding-bottom: 0;}

.content_header { border-bottom:#dedcd9 solid 1px;  overflow: hidden; }
.content_header .h3 { float: left;background: url(/images/bg_h3.png) no-repeat 0 0; font-size: 20px; text-indent: 60px; padding: 20px 0;}

#content { padding: 20px 0; }
.a00 .content_header .h3{ background-position: 0 0  }
.b00 .content_header .h3{ background-position: 0 -80px  }
.c00 .content_header .h3{ background-position: 0 -160px  }
.d00 .content_header .h3{ background-position: 0 -236px  }
.e00 .content_header .h3{ background-position: 0 -315px  }
.f00 .content_header .h3{ background-position: 0 -395px  }


.location { float: right; padding: 25px 0 0 0; }
.location li{ display: inline; padding:0 12px; color:#8e8e8e; opacity: 0.5 ;background: url(/images/deco_bar1.gif) no-repeat right 6px; }
.location li:last-child { opacity: 1; padding: 0 0 0 8px; background: none }

.footer { padding: 50px 0; clear: both; }
.foot_h6 { width: 142px; height: 83px; margin: 0 auto 30px auto; background: url(/images/footer_ems_logo.png) no-repeat center 0; text-indent: -9999px; overflow: hidden; }
.copyright { text-align: center;color: #aaa; font-size: 11px; }

.c40_monitoring footer { height: 19px; background: none;border-top:1px #7d8696 solid}
.c40_monitoring .footer {padding: 10px 0 0 0; background: #ededed }
.c40_monitoring .foot_h6 { display: none}

.btn_top { display: block; width: 28px;height: 28px; border-radius: 50%; overflow: hidden; border: #d6d6d6 solid 1px; background: #f3f3f3 url(/images/btn_arrow_top.png) no-repeat center; text-indent: -9999px; position: absolute; right: 2%;top: 0; opacity: 0.7 }
.btn_top:hover,
.btn_top:focus { opacity: 1 }

.c40_monitoring .btn_top { display: none}

.miniMonitor {width: 780px; padding: 20px; overflow: hidden; position: absolute; left: 20px;top: 20px;}
.miniMonitor > div { width: 180px; float: left;}
.miniMonitor .btn_top { display: none}

/* a00 */
/* a10 login */
article.login { width: 590px; margin: 0 auto }
article.login .h4 { width: 590px; background: url(/images/login_bg.png) no-repeat center 0; padding:300px 0 0; margin: 0 auto; font-size: 0; color: #f7f5f2 }

.input_ID,
.input_PW { width: 99.5%; background: #fff url(/images/bg_input_idpw.png) no-repeat 45px 0; border: solid 1px #e1e1e0; font-size: 20px; padding: 15px 0; margin: 4px 0; outline: none; text-indent: 80px}
.input_PW { background-position: 45px -63px }
.id_remeber, .myinfo_find { float: right; padding: 20px 0 0 0 ;  }
.id_remeber, .myinfo_help { color: #999; }
.id_remeber label, .myinfo_find a { color: #999; cursor: pointer; }
.id_remeber input { vertical-align: middle }
.id_remeber { float: left}


.myinfo_find a {padding:0 12px 0 10px; background: url(/images/deco_bar1.gif) no-repeat right 6px;}
.myinfo_find a:last-child { padding: 0 2px 0 7px; background: none}
.myinfo_find a:hover,
.myinfo_find a:focus {color:#115e7e}

a.btn_login2{ display: block;clear: both; width: 50%;margin: 0 auto; color: #fff; text-align: center; line-height: 3.4em; border-radius: 30px; margin-top:100px; font-size:18px}

.myinfo_find_ID label,
.myinfo_find_PW label { width: 15%; display:inline-block; }

.note { padding: 20px 0 0; color: #00B2D9 }
.noteG { color: #999 }

/* a20 */
a.trems_of_use {vertical-align: middle; padding: 2px 15px; color: #fff; border-radius: 5px}
div.trems_of_use { color: #777; background: #f9f9f9; height: 0;transition: all 0.2s ease 0s; overflow-y: auto;}
div.trems_of_use.on { height: 100px;padding: 12px; border: solid 1px #ddd; margin: 10px 0; }
.a20_join .section .container,
.a30_mypage .section .container { width:650px; min-width: 650px; margin: 0 auto }
article.join a.btn_login2{ margin-top:0}

/* b00 */
#intro1 { display: block; height: 180px;  background: url(/images/b00_intro1.png) no-repeat center bottom; font-size: 0 ; color:  #F7F5F2}

#intro1, #intro2, #intro3 {transition: all 0.2s ease 0s;}
.jsHeaderTop #intro1, .jsHeaderTop #intro2, .jsHeaderTop #intro3 {padding: 60px 0 0 0}

.introEMS *{ color: #999898; font-size: 15px; text-align: center; line-height: 1.3em }
.introEMS p { padding: 10px 0}
.intro_h4 { padding:40px 0;text-align: center; }
.intro_h4 span{ font-size: 26px; color: #666; border-bottom: solid 1px #00b2d9; padding:0 0 6px 0; }

.intro_h5 {text-align: center; font-size: 18px; color: #777; background: #fff;  border: #00b2d9 solid 2px; padding: 8px 0; width: 180px; margin:15px auto}

#intro2 ol { width: 892px; height: 900px; background: url(/images/ems_org.png) no-repeat 0 0; margin: 0 auto  }
#intro2 ol li,
#intro2 ol li * { font-size: 0 ; color:  #F7F5F2  }

#intro3 ul { width: 460px; margin: 0 auto; padding: 20px 0 50px 0 }
#intro3 ul li { text-align: left; background: url(/images/deco_dot1.png) no-repeat 0 9px; padding-left: 10px }

#intro3 .table { width: 690px; margin: 0 auto }
#intro3 .table caption span{ color: #ddd }
#intro3 .table caption span strong { color: #fff; font-size: 18px; color: yellow }
#intro3 .table th,
#intro3 .table td { width: 19%;padding: 8px 0; }
#intro3 .table .no { width: 5% }
.ems_org2 { width: 688px; height: 410px; background: url(/images/ems_org2.png) no-repeat center 0; margin: 0 auto; font-size: 0 }


/* c00 */
/* c10 */
.btn_loc1,
.btn_loc2 { background: #dcdcdc url(/images/btn_loc.png) no-repeat center 5px; border:none; width: 34px; height:32px; overflow: hidden;; text-indent: -9999px; vertical-align: middle; margin-left:-36px; border-radius: 0 4px 4px 0; cursor: pointer}
.btn_loc2 { background-position: center -25px }
.btn_loc1:hover,
.btn_loc1:focus,
.btn_loc2:hover,
.btn_loc2:focus { background-color:#ccc; }

div.loc1,
div.loc2 { width: 27px;height: 35px; overflow: hidden;; text-indent: -9999px; background: url(/images/btn_loc.png) no-repeat center -60px; }
div.loc2 { background-position: center -100px; }


.map_loc {overflow: hidden; position: absolute; width: 54px;height: 70px; margin: 0px; padding: 0px; z-index: 1000;cursor:pointer}

div .loc1 { width: 27px;height: 35px; overflow: hidden; background: url(/images/loc_marker1.png) no-repeat center -60px; z-index: 1001; position: relative; display: inline; float: left; cursor:pointer}
div .loc2 { width: 27px;height: 35px; overflow: hidden; background: url(/images/loc_marker2.png) no-repeat center -60px; z-index: 1001; position: relative; display: inline; float: left; cursor:pointer}

.map { background: url(/images/no-map.png) no-repeat center center; height: 280px; }
.c30_history.view .map { height: 200px }
td.map { min-height: 200px}

div.disaster_act_grade,
div.alert_grade { margin: 0; height: 0; opacity: 0; overflow: hidden;transition: all 0.2s ease 0s; }
div.disaster_act_grade.on,
div.alert_grade.on { display: block;margin: 10px 0 0 0; height: auto; opacity: 1}
div.disaster_act_grade li,
div.alert_grade li { background: url(/images/deco_dot1.png) no-repeat 0 7px; padding: 0 0 0 12px;  }

div.disaster_act_grade1 caption,
tbody tr.disaster_act_grade1 th { background:#aaaaaa url(/images/grade_dot.png) no-repeat 99% 17px; color: #fff } /* #5bb6d7 */
tbody tr.disaster_act_grade1 th { background-position: center 55px }
#drlTable tbody tr.disaster_act_grade1 th { background-position: center 65px }

div.disaster_act_grade2 caption,
tbody tr.disaster_act_grade2 th { background:#78c8d2 url(/images/grade_dot.png) no-repeat 99% -79px; color: #fff  } /* #bc7fcd */
tbody tr.disaster_act_grade2 th { background-position: center -42px }
#drlTable tbody tr.disaster_act_grade2 th { background-position: center -32px }

div.disaster_act_grade3 caption,
tbody tr.disaster_act_grade3 th { background:#ed8771 url(/images/grade_dot.png) no-repeat 99% -176px; color: #fff } /* #db4e55 */
tbody tr.disaster_act_grade3 th { background-position: center -139px }
#drlTable tbody tr.disaster_act_grade3 th { background-position: center -129px }

div.disaster_act_grade4 caption,
tbody tr.disaster_act_grade4 th { background:#668198 url(/images/grade_dot.png) no-repeat 99% -273px; color: #fff } /* #13aaa6 */
tbody tr.disaster_act_grade4 th { background-position: center -235px }
#drlTable tbody tr.disaster_act_grade4 th { background-position: center -225px }


/*#183e89*/
div.alert_grade1 caption,
tbody tr.alert_mark1 th { background: #2150a0 url(/images/grade_dot.png) no-repeat 99% 17px; color: #fff}
tbody tr.alert_mark1 th { background-position: center 55px }
#ewlTable tbody tr.alert_mark1 th { background-position: center 65px }

/*#f6af15*/
div.alert_grade2 caption,
tbody tr.alert_mark2 th { background: #f8c31f url(/images/grade_dot.png) no-repeat 99% -79px; color: #fff}
tbody tr.alert_mark2 th { background-position: center -42px }
#ewlTable tbody tr.alert_mark2 th { background-position: center -32px }
/*#f2581c*/
div.alert_grade3 caption,
tbody tr.alert_mark3 th { background: #f56b22 url(/images/grade_dot.png) no-repeat 99% -176px; color: #fff}
tbody tr.alert_mark3 th { background-position: center -139px }
#ewlTable tbody tr.alert_mark3 th { background-position: center -128px }
/*#e51a09*/
div.alert_grade4 caption,
tbody tr.alert_mark4 th { background: #ee3010 url(/images/grade_dot.png) no-repeat 99% -273px; color: #fff}
tbody tr.alert_mark4 th { background-position: center -235px }
#ewlTable tbody tr.alert_mark4 th { background-position: center -226px }


div.alert_mark1, div.alert_mark2, div.alert_mark3, div.alert_mark4 { vertial-align: top; font-size: 12px; color: #fff; }

.c10_setup .table tbody th { text-align: left; width: 10% }
.table tbody td.map_td1 { padding: 0}
.table tbody td.map_td2 { padding: 0; width: 40% }

.disasterAO { padding:5px 0 0}
.disasterAO span {padding: 0 15px 0 0}



/* tab 추가 */
ul.tabs {
    margin: 0;
    padding: 0;
    float: left;
    list-style: none;
    height: 44px; /*--Set height of tabs--*/
    border-bottom: 1px solid #999;
    border-left: 1px solid #999; 
    width: 99.8%;
}
ul.tabs li {
    float: left;
    margin: 0;
    padding: 0;
    height: 43px; /*--Subtract 1px from the height of the unordered list--*/
    line-height: 43px; /*--Vertically aligns the text within the tab--*/
    border: 1px solid #999;
    border-left: none;
    width: 15%;
    text-align: center;
    margin-bottom: -1px; /*--Pull the list item down 1px--*/
    overflow: hidden;
    position: relative;
    background: #e0e0e0;
}
ul.tabs li a {
    text-decoration: none;
    color: #000;
    display: block;
    font-size: 1.2em;
    padding: 0 20px;
    outline: none;
}
ul.tabs li a:hover {
   background: #fff;
}
html ul.tabs li.active, html ul.tabs li.active a:hover  {
	background: #fff;
	border-bottom: 1px solid #fff; 
}

/*Tab Conent CSS*/
.tab_container {
    border: 1px solid #999;
    border-top: none;
    overflow: hidden;
    clear: both;
    float: left; 
    width: 99.8%;
    background: #fff;
}
.tab_content {
    padding: 20px;
    font-size: 1.2em;
}

img.iconEX { vertical-align: middle; margin-bottom: 4px;}


/* c20 */

.c20_monitoring .table tbody td.map_td2 {width: 50%}

.table.c20_status,
.table.c20_status_detail  { border-color: #ccc }
.table.c20_status table,
div.table.c20_status_detail.on{ border-top:#00a2c5 solid 1px; }
.c20_monitoring .c20_org_wrap,
.c30_history .c20_org_wrap{ padding: 10px 0; overflow: hidden; }
.c20_monitoring .c20_org_wrap .c20_status,
.c30_history .c20_org_wrap .c20_status { width: 70%; float: left; }
.c20_monitoring .c20_org_wrap .c20_status_detail,
.c30_history .c20_org_wrap .c20_status_detail { width: 28%; float: right }

.select_div { padding: 10px 0}
.table .select_div label { margin: 0 }
.select_div select { margin-right: 20px }
.c20_status_detail .select_div { padding-top: 44px}
.c20_status_detail{ position: relative; }
.c20_status_detail table { position: relative; z-index: 6; display: none }
.c20_status_detail.on table { display: table }
.c20_status_detail:after { display: block; content: "왼쪽 표의 '행동요령'을 클릭하시면 상세 내용을 볼 수 있습니다.";position: absolute; top: 200px; width: 100%; text-align: center; z-index: 5 }

.movie_popup video {width: 100%; height: auto;}
.movie_popup .jsDiv_container { width: 980px; margin: -300px 0 0 -490px; background: none; border: none; box-shadow: none }
.movie_popup .jsDiv_container h4 { color: #fff; font-size: 20px; padding: 0 0 20px 0; }
.movie_popup .jsDiv_container > a.btn.jsDivClose { top: 0; right: 0; }

.photo_popup .jsDiv_container { width: 96%; height: 96%; margin: 1% 2% 3% 2%; left: 0;top: 0; background: transparent no-repeat center / contain; box-shadow: none }
.table .select_div .input { background-color: #fff }

/* c30 */
.c30_history .search_area {overflow: hidden;}
.c30_history .search_area .table { float: left; width: 90%; margin: 0 0 20px 0  }
.c30_history .search_area>.btn { display: block; width: 10%; float: right; text-align: center; height: 83px; padding: 78px 0 0 0; border-radius: 0 5px 5px 0; font-size: 16px; background-image: url(/images/btn_search1.png); background-position: center center; background-repeat: no-repeat; text-indent: -9999px;overflow: hidden; }

.e30_act_share .search_area { overflow: hidden;  margin: 20px 0 }
.e30_act_share .search_area .table { float: left; width: 90%; margin: 0 }
.e30_act_share .search_area>.btn { display: block; width: 10%; float: right; text-align: center; height: 30px; padding: 78px 0 0 0; border-radius: 0 5px 5px 0; font-size: 16px; background-image: url(/images/btn_search1.png); background-position: center center; background-repeat: no-repeat; text-indent: -9999px;overflow: hidden; }

.btn_calendar {
    background: #dcdcdc url(/images/btn_calendar_icon.png) no-repeat center 5px;
    border:none; width: 34px; height:32px; overflow: hidden; text-indent: -9999px; vertical-align: middle; margin-left:-39px; border-radius: 0 4px 4px 0; cursor: pointer;
}
.btn.btn_calendar_icon {width:32px; height: 32px; padding: 0; display: inline-block; overflow: hidden; text-indent: -9999px; margin: 0 0 0 -35px; border-radius:0 4px 4px 0;  background-image: url(/images/btn_calendar_icon.png); background-position: center center; background-repeat: no-repeat; }

.table .time {text-align: center;}

td.needCheck input[type="checkbox"] + label::before, 
td.needCheck input[type="checkbox"]:checked + label::before{ margin-right:0}
.table td.needCheck label { margin-right: 0}



/* d00 */

.d10_org .table td {width: 25%;}
/*.table tr.on td { background: url(/images/bg_on1.gif)}*/
table tbody tr.mine td{  background:#ffe84b }
/*table tbody tr.mine td:first-child { background:#ffe84b url(/images/bg_mine_i2.png) no-repeat 20px center }*/


/* d20 */

.select1 { display: inline-block; width: 190px; position: relative; text-align: left; vertical-align: middle; margin: 0 0 0 10px}
.select1 label { margin: 0 0 0 -10px }
.select1 > a.btn { display: block; float: inherit !important; line-height: 2.4em; padding: 0; text-indent: 35px; background-image: url(/images/btn_arrow_upNdown.png); background-repeat: no-repeat; background-position: 98% 0px }
.select1.on > a.btn { background-position: 98% -34px; border-radius: 4px 4px 0 0  }
.select1 ul { position: absolute; left: 0;top: 34px; background: rgba(80,80,80,0.9);padding: 10px 3%; width: 97%; border-radius: 0 0 5px 5px; height: 0;padding: 0 0 0 3%; overflow: hidden; transition: all 0.2s ease 0s;}
.select1.on ul {padding: 10px 0 10px 3%; height: auto;}
.select1 ul li{ padding: 2px 0; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #fff}

.d20_guide .br1 { display: block; width: 100%; height: 1px; border-top: rgba(255,255,255,0.3) dotted 1px; margin: 6px 0; }
.d20_guide table.disaster_act_grade1 th.disaster_act_grade1 {background:#aaaaaa url(/images/grade_dot.png) no-repeat center 52px; color: #fff; padding-bottom: 25px;}
.d20_guide table.disaster_act_grade2 th.disaster_act_grade2 {background:#78c8d2 url(/images/grade_dot.png) no-repeat center -45px; color: #fff; padding-bottom: 25px;}
.d20_guide table.disaster_act_grade3 th.disaster_act_grade3 {background:#ed8771 url(/images/grade_dot.png) no-repeat center -142px; color: #fff; padding-bottom: 25px;}
.d20_guide table.disaster_act_grade4 th.disaster_act_grade4 {background:#668198 url(/images/grade_dot.png) no-repeat center -239px; color: #fff; padding-bottom: 25px;}
/*.d20_guide table.disaster_act_grade1 th.disaster_act_grade1:before,
.d20_guide table.disaster_act_grade2 th.disaster_act_grade2:before,
.d20_guide table.disaster_act_grade3 th.disaster_act_grade3:before,
.d20_guide table.disaster_act_grade4 th.disaster_act_grade4:before { display:block; content: "현재단계"; background: rgba(0,0,0,0.2); padding: 5px; position: absolute; left: 0; top: 0; font-size: 12px; border-radius:0 0 3px 3px }
*/
.d20_guide table.disaster_act_grade1 td.disaster_act_grade1 {background: #fcfadf;/* url(/images/td_disaster_act_grade1.png); border-color: #ccc */}
.d20_guide table.disaster_act_grade2 td.disaster_act_grade2 {background: #fcfadf; /* url(/images/td_disaster_act_grade2.png); border-color: #ccc */}
.d20_guide table.disaster_act_grade3 td.disaster_act_grade3 {background: #fcfadf; /* url(/images/td_disaster_act_grade3.png); border-color: #ccc */}
.d20_guide table.disaster_act_grade4 td.disaster_act_grade4 {background: #fcfadf; /* url(/images/td_disaster_act_grade4.png); border-color: #ccc */}


.d20_guide table td.disaster_act_grade1.mine {background-color :#ffe84b}
.d20_guide table td.disaster_act_grade2.mine {background-color :#ffe84b}
.d20_guide table td.disaster_act_grade3.mine {background-color :#ffe84b}
.d20_guide table td.disaster_act_grade4.mine {background-color :#ffe84b}
/*
.d20_guide table td.disaster_act_grade1.mine:before,
.d20_guide table td.disaster_act_grade2.mine:before,
.d20_guide table td.disaster_act_grade3.mine:before,
.d20_guide table td.disaster_act_grade4.mine:before { display: block;width: 38px;height: 25px; content: "내담당"; background: url(/images/bg_mine_i2.png) no-repeat 0 0; float: left; font-size: 0 }
*/

.d20_guide td.disaster_act_grade1, .d20_guide td.disaster_act_grade2, .d20_guide td.disaster_act_grade3, .d20_guide td.disaster_act_grade4 { text-align: left; }

p.mine { text-align: right; margin: -15px 0 5px 0}
p.mine strong { display: inline-block; background:#ffe84b url(/images/bg_mine_i2.png) no-repeat center; width:40px;height: 28px; text-indent: -9999px; overflow: hidden; vertical-align: middle; font-size: 1px; border-radius: 5px; color:#ffe84b}
td strong.mine { display: inline-block; background:#ffe84b url(/images/bg_mine_i2.png) no-repeat center; width:25px;height: 25px; margin: 0 10px 0 0; text-indent: -9999px; overflow: hidden; vertical-align: bottom; font-size: 1px; float: left;; border-radius: 3px}


/* d30 */
.d30_report .btn_area { text-align: center }
.d30_report .btn_area .btn { display: block; padding: 18px 0; }

/* d40 */
.d40_network .search_area2 label { padding:0 5px 0 10px}
.select_send_wrap {overflow:hidden; padding: 10px 0 0 0;}
.select_send_wrap .table { border-top: none }
.select_send_wrap .table caption.caption { padding: 15px 0 10px 0; }
.select_send_wrap .float_l,
.select_send_wrap .float_r { width: 49.5%; padding: 0 0 0 0; }

/*.sms_popup .jsDiv_container {margin-top: -220px }*/
.sms_popup .jsDiv_content { padding:20px 20px 0 20px}

.sms_preview_popup .jsDiv_container { width: 300px; margin: -150px 0 0 -150px;  }
.sms_preview_popup .jsDiv_content {text-align: left;  padding: 25px 15px; line-height: 1.5em; color: #333}

/* e00 */


.table tbody td.disater_grade_alert { min-width: 135px; padding-right: 0 }
 #drlTable tbody td.disater_grade_alert {min-width: 218px;}


/* e10 */
.table_20 tbody td.act_group,
.table_20 tbody td.act_guide { text-align: left; }
.act_list_add .jsDiv_container { width: 690px; margin: 0 0 0 -365px; max-height:86%; overflow: hidden; overflow-y:auto; top:7%}
.act_list_add .jsDiv_content { padding:20px 20px 0 20px }
.act_list_add .jsDiv_content .table { border: none; margin: 0 }
.act_list_add .jsDiv_content .table table { margin-bottom:10px; }
.act_list_add .jsDiv_content .table caption.caption { padding: 10px 0 }
.act_list_add .jsDiv_content .table caption.caption span { padding: 7px 25px; font-size: 15px; border-radius: 17px 0 }
.act_list_add div.table .btn_area{ text-align: right; padding: 0 0 15px 0; border:none;}
.act_list_add div.table .btn { display: inline-block; padding: 8px 14px; line-height: 1.1em }

.org_select2_on,
.org_select1_on { display: none}

.org_select1 .org_select1_on,
.org_select2 .org_select2_on { display: block }

.org_select1 tr.org_select1_on,
.org_select2 tr.org_select2_on { display: table-row; }

th.org_select3{ width: 15% }
th .act_guide { width: 20% }

/* e20 */
.e20_warn_manage .search_area2 { margin-bottom: 20px; }
.e20_warn_manage .table.caption { border-top:none; }
th.td_btn_area { min-width:150px}

/* e30_act_share */
td.share_YN { width: 250px; }
.btn.em_org_select { padding: 3px 5px }

.em_org_select .jsDiv_content label { padding-right: 15px }

.table_sort { background: #bcb9b2; padding: 10px 2%; border:solid 1px #989387; border-bottom: dotted 1px #989387}
.table_sort h5 { display: inline; vertical-align: middle; display: none }
.table_sort label { padding: 0; color: #fff; font-size: 12px }
.table_sort .btn { padding: 10px 10px; float: right; }

.table_sort + .table_20 { border-top:none; }

.table tbody .no td{ background:#f5efe1; color: #888 }
.table tbody .no td.shared_part { color: #d0651e}

/* e40 */
.btn.main_part,
.btn.suport_part,
.btn.co_org,
.btn.part_select { padding: 3px 10px; font-size: 13px; float: right; }

.hwp_content {  margin: 20px 0; outline: #aaa solid 1px; padding: 10px 20px 10px 20px; height: auto; overflow-y: auto; /*box-shadow: 0 2px 8px rgba(0,0,0,0.1) */}
.editor_content {margin: 5px 0; height: 400px; overflow-y: auto;}
.select_li,
.select_li4 { overflow: hidden; margin: 20px 20px 0 20px; text-align: left; }
.select_li li,
.select_li4 li { float: left; width: 33% }
.select_li4 li {width: 25%;}
.select_li li label,
.select_li4 li label {  }

/* e50 */
.board_view_header {border-top: solid 1px #00a2c5; border-bottom: solid 1px #ddd; padding: 15px 0 4px}
.board_view_header h4 {font-size: 19px; float: left; }
.board_view_info { padding:5px 0 10px 0;  text-align: right; }
.board_view_info dt,
.board_view_info dd { display: inline-block; padding: 0 0 0 11px}
.board_view_info dt { color: #666 ; border-left: 1px solid #ddd; }
.board_view_info :first-child { border: none }
.board_view_info :last-child { padding-right:0; }
.board_view_info dd { padding: 0 9px 0 5px; color: #00a2c5 }
.board_view_content { padding: 10px 0; margin: 10px 0; }


.board_attach_file_wrap {border-top: dotted 1px #ddd;  border-bottom: solid 1px #ddd; padding: 12px 0; margin: 15px 0;}
ul.board_attach_wrap li { padding: 4px 0; background: url(/images/icon_link.png) no-repeat 7px center;}
ul.board_attach_wrap li label { font-size: 0; padding-left: 23px }
a.board_attach_file { padding: 0 10px 0 32px;background: url(/images/icon_link.png) no-repeat 7px center }



/* f00 */
/* f10 부서/사용자관리 */
.search_area2 { background: #777; color: #fff; padding: 10px}
.search_area2 .btn { float: right; padding: 10px 40px; border-radius: 4px }
.search_area2 .btn_search { background-image: url(/images/btn_search2.png); background-position: center center; background-repeat: no-repeat; text-indent: -9999px;overflow: hidden;  }
.search_area2 .input {vertical-align: middle;}
.search_area2 label { color: #fff; vertical-align: middle; padding:0 5px 0 10px}

.btn_area span { vertical-align: middle; color: #999; padding: 10px }
.f10_history .btn_area { border-top:solid 1px #ebebeb; padding: 14px 0 }

a.status_Y,
a.status_N { display: inline-block; width: 80px; line-height: 2em; background: #f60; border-radius: 4px; background: #d46d29; color: #fff; opacity: 0.8 }
a.status_Y { background: #4a95a6 }
a.status_Y:hover,
a.status_Y:focus,
a.status_N:hover,
a.status_N:focus { opacity: 1 }
article.jsDiv { width: 100%;height: 100%; position: fixed; left: 0;top: 0;z-index: 5000; background: rgba(0, 0, 0, 0.5); display: none}
article.jsDiv.on { display: block; }
article.jsDiv .h4 { text-align: center; font-size: 18px; padding: 15px 0; border-bottom: solid 1px #ddd; background: #666; border-radius:5px 5px 0 0; color: #fff }
article.jsDiv .input { background: #fff }
.jsDiv_container { width: 560px; position: absolute; left: 50%; top: 180px; margin: -150px 0 0 -300px; background: #fff; border-radius: 8px 8px 5px 5px; box-shadow: 0 2px 6px rgba(0,0,0,0.3) }
.jsDiv_content { padding:25px 0; text-align: center; font-size: 16px; color: #999; background: #f9f9f9 }
.f50_org_manage .jsDiv_content label { display: inline-block; width: 100px; }
.jsDiv_content strong { color: #000; font-size: 20px; vertical-align: baseline; }
.jsDiv_container>a.btn.jsDivClose,
.jsDivContainer a.btn.jsDivClose{ background: #ededed url(/images/btn_close1.gif) no-repeat center center; display: block; width: 28px;height: 28px; padding: 0; position: absolute; right:10px;top: 10px; border: #ddd 1px solid; border-radius:4px; text-indent: -9999px;overflow: hidden; opacity: 0.7 }
.jsDiv_container>a.btn.jsDivClose:hover,
.jsDiv_container>a.btn.jsDivClose:focus,
.jsDivContainer a.btn.jsDivClose:hover,
.jsDivContainer a.btn.jsDivClose:focus  { opacity: 1 }

article.part_correct .jsDiv_container { width: 800px; /*margin:-200px 0 0 -400px*/ }
article.part_correct .jsDiv_container .table { border: none; padding:20px 20px 0 20px; margin: 0; }

.jsDivContainer { position: absolute; left:6%;top: 6%;right: 6%;bottom:6%; background: #fff; overflow-y:auto}

/* f20 */
.dist_div_table td.no {width: 7%;}
.dist_div_table td.no label { padding:0 0 0 10px }

.dist_li_table_wrap { background: #f9f9f9; overflow: hidden;border: solid 1px #ccc; border-top: #00a2c5 solid 1px;}
.dist_li_table {
	/* 코드변경에의하여 5개의 테이블이 4개로 변경됨.*/ 
	width: 25%; 	
	float: left
}
.dist_li_table h4 { background: #E1DFDB; text-align: center; font-size: 15px; padding: 14px 0; border-left: solid 1px #ccc; margin-right:-1px;}
.dist_li_table_wrap div:first-child h4 {border-left:none}
.dist_li_table ul { border-left: solid 1px #ddd;border-right: solid 1px #ddd; margin:0 -1px -1px 0;}
.dist_li_table_wrap div:first-child ul {border-left:none}
.dist_li_table li { padding: 12px; background: #fff; border-bottom: solid 1px #ddd }
.dist_li_table li label,.dist_li_table ul li input, .dist_li_table ul li a {vertical-align: baseline;  display: inline-block;}
.dist_li_table li label { width: 26px; color: #999 }
.dist_li_table li.on { background: rgba(255,156,0,.3)}
.f20_disaster_type_manage .btn_area { padding-top: 20px }

.part1_name, .part2_name, .part3_name, .part0_name { text-align: left !important;}
.btn.part_select1, .btn.part_select2, .btn.part_select3, .btn.part_select0 { padding: 3px 5px; float: right; }


/* f70 */
/*
.code_manage_l { width: 58%; float: left; margin: 0 0 20px }
.code_manage_r { width: 38%; float: right; border-left: 1px solid #ddd; padding:0 0 0 2%; margin: 0 0 20px}
*/
.code_manage_r td .btn,
.code_content .code_tr0 td .btn{ display: block; margin: 2px 0 }

.code_manage_r .btn_area { padding: 10px 0 0; }

.code_content .jsDiv_content .table,
.code_content .jsDiv_content table { border: none; margin: 0; }
.table .code_tr0 td { border-color:#9b9ca5}
.table .code_tr1 th { background: #e1dfdb; border-color:#c1c1c1}
.table .code_tr2 td { background: #f8f8f8 }

.code_content .jsDiv_container { margin-top:0; max-height: 94%;overflow:hidden; overflow-y:auto; top:3% }
.code_content .jsDiv_content{ padding: 0}


/*#code_content { height: 0; overflow: hidden; border: none;opacity: 0; transition: all 0.2s ease 0s}
#code_content.on { height: auto; overflow:inherit; opacity: 1}*/

#code_add { border:none; margin: 0; }

.f70_log_manage .search_area {overflow: hidden;}
.f70_log_manage .search_area .table { float: left; width: 90%; margin: 0 0 20px 0  }
.f70_log_manage .search_area>.btn { display: block; width: 10%; float: right; text-align: center; height: 29px; padding: 78px 0 0 0; border-radius: 0 5px 5px 0; font-size: 16px; background-image: url(/images/btn_search1.png); background-position: center center; background-repeat: no-repeat; text-indent: -9999px;overflow: hidden; }



/* main 180218-새로추가된 메인화면 */
.main_myinfo.table.table_10 tr:last-child td,
.main_myinfo.table.table_10 tr:last-child th { border-bottom: none; }
.main:after { display: block; content: ""; clear: both }
.main > article { width: 48.5%; margin:  0 0.5% 20px 0; float: left; border: #00a2c5 solid 1px; height: 140px; background: #fff } 
.main>:nth-child(even) { float: right;  margin:  0 0 20px 0.5%}
.main>:nth-child(odd) { clear: both }

.main .myAct_wrap { height: 14px; position: relative; border:none	}
.myActContent { border: #00a2c5 solid 1px; float: right; width: 76.5%; min-height: 140px }
.myActContent .h4 { width: 20px; float: left; text-align:center;  padding:15px 10px; height: 111px; font-size: 17px; background: #00a2c5; color: #fff}
.myAct { padding: 10px; overflow: hidden;overflow-y:auto; height: 121px; background: #fff}
.myAct p,
.myAct li { padding: 2px; }
a.my_act_summary, a.do_act_report { position: absolute;top: 0; left: 0; width:22%; height: 20px; padding:48px 0 0 0; display: block; text-align: center; color: #fff; background: #959595 url('../images/btnGuide.png') no-repeat center -11px; border-radius:5px }
a.my_act_summary {}
a.do_act_report {top: 74px; background: #fd7774 url('../images/btnReport.png') no-repeat center -11px;}


.main .board_wrap,
.main .main_disaster_info_wrap { height: 200px }
.board_wrap { position: relative}
.board_wrap .h4 a { display: block;
					/* 
					width: 50.5%;  
					text-align: center;
					padding: 10px 0 0 0;
					*/
					padding: 12px 0 0 15px; 
					height: 28px; font-size: 16px;  position: absolute; right: -1px; top: -1px; color: #fff;  background: #ddd; color: #999; border-bottom:#00a2c5 solid 1px }
.board_wrap .board_notice .h4 a { left: -1px; }
.board_wrap .on .h4 a,
.board_wrap .h4 a:hover,
.board_wrap .h4 a:focus { background: #00a2c5; color: #fff}
.board_wrap ul { display: none; padding:10px; position:absolute; top:45px; left: 0 }
.board_wrap ul li { padding:4px 10px}
.board_wrap ul li span { color: #999; padding-right:10px}
.board_wrap .on ul { display: block}


.main_disaster_info_wrap .table { margin: 0}


.main .main_disaster_type_manual,
.main .main_disaster_type_status { height: 500px; }

.main_disaster_info_wrap .h4,
.main .main_disaster_type_manual .h4,
.main .main_disaster_type_status .h4 { padding: 12px 0 0 15px; height: 30px; font-size: 16px;  background: #00a2c5; color: #fff }




.jsDivContainer h2 { font-size: 18px; padding: 16px 0 0 12px; height:32px; border-bottom: solid 1px #ddd }
.jsDivContainer header label { color: #666;  }
.jsDivContainer .search_area2 { background: #fff;border-bottom: solid 1px #ddd}
.headerBtnArea {padding: 4px 12px;}



#layermask {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 999;
    background-color: #000000;
    display: none; }

.layerpop {
    display: none;
    z-index: 1000;
    border: 2px solid #ccc;
    background: #fff;
    cursor: move; }

.layerpop_area .pop_title {
    padding: 10px 10px 10px 10px;
    border: 0px solid #aaaaaa;
    background: #f1f1f1;
    color: #3eb0ce;
    font-size: 1.3em;
    font-weight: bold;
    line-height: 24px; }

.layerpop_area .layerpop_close {
    width: 25px;
    height: 25px;
    display: block;
    position: absolute;
    top: 10px;
    right: 10px;
}

.layerpop_area .layerpop_close:hover {
    cursor: pointer; }

.layerpop_area .pop_content {
    width: 96%;
    margin: 2%;
    color: #828282;
}


a.btn_extend { display:inline-block; }
a.btn_extend { border:solid 1px #999; padding:4px 12px; border-radius:3px; font-size: 12px; background: none; width: auto; height: auto; margin: 0}
a.btn_excute { display:inline-block; }
a.btn_excute { border:solid 1px #999; padding:4px 12px; border-radius:3px; font-size: 12px; background: none; width: auto; height: auto; margin: 0}

@media ( min-width: 1100px ) {
	.h1_ems {width: 382px; background: none; }
	.h1_ems a { width: inherit; background-position-x: 10% 382px; }

    a.btn_extend { display:inline-block; }
    a.btn_extend { border:solid 1px #999; padding:4px 12px; border-radius:3px; font-size: 12px; background: none; width: auto; height: auto; margin: 0}
    a.btn_excute { display:inline-block; }
    a.btn_excute { border:solid 1px #999; padding:4px 12px; border-radius:3px; font-size: 12px; background: none; width: auto; height: auto; margin: 0}
}

@media ( min-width: 1280px ) {
	.container{width: auto;}
	
	.h1_ems {/* left: 170px; */ width: 382px;}
	.top_menu a { vertical-align: middle }
	a.btn_login {  }
	strong.login_name  { }

	strong.login_name,
	a.htn_join,
	a.btn_logout{ display:inline-block; }
	a.btn_logout { border:solid 1px #999; padding:4px 12px; border-radius:3px; font-size: 12px; background: none; width: auto; height: auto; margin: 0}

    a.btn_autologout{ display:inline-block; }
    a.btn_autologout { border:solid 1px #999; padding:4px 12px; border-radius:3px; font-size: 12px; background: none; width: auto; height: auto; margin: 0}


    a.btn_extend { display:inline-block; }
    a.btn_extend { border:solid 1px #999; padding:4px 12px; border-radius:3px; font-size: 12px; background: none; width: auto; height: auto; margin: 0}
    a.btn_excute { display:inline-block; }
    a.btn_excute { border:solid 1px #999; padding:4px 12px; border-radius:3px; font-size: 12px; background: none; width: auto; height: auto; margin: 0}

	.gnb {right: 280px;}
	.gnb > ul > li > a.b00,
	.gnb > ul > li > a.c00{width: 80px}
	.gnb > ul > li > a { padding-top: 20px;}
	.jsHeaderTop  .gnb > ul > li > a { height: 40px}
	.gnb > ul > li > a > span { height: 55px }

	
	.table_sort h5 { display: inline; }
	.table_sort label { padding:0 0 0 10px; font-size: 14px}

	.c30_history .search_area .table { width: 90%  }
	.c30_history .search_area>.btn { width: 10%; }

	.d20_guide .br1 { display: none; }
	.select1 { width: 170px; margin: 0 0 0 4px }
	.d20_guide .search_area2 .btn_search { padding: 10px 30px; }
	.select1 label { margin: 0 0 0 -20px }

	.e30_act_share .search_area .table { width: 90%}
	.e30_act_share .search_area>.btn { width: 10%}
	.btn.em_org_select { float: right }
	.search_area2 label { padding:0 5px 0 20px}

	.table caption.caption {padding: 30px 0 15px 0;}
	.table caption.caption span{ font-size: 16px; padding: 10px 30px; border-radius: 18px 0 }

}

@media ( min-width: 1331px ) {
	.h1 {width: 170px; width: 74px}
	.h1_ems {left: 170px; width: 382px; left:74px; background: #40b2cd;}

    a.btn_extend { display:inline-block; }
    a.btn_extend { border:solid 1px #999; padding:4px 12px; border-radius:3px; font-size: 12px; background: none; width: auto; height: auto; margin: 0}
    a.btn_excute { display:inline-block; }
    a.btn_excute { border:solid 1px #999; padding:4px 12px; border-radius:3px; font-size: 12px; background: none; width: auto; height: auto; margin: 0}
}

@media ( min-width: 1600px ) {
	.gnb{ right: 350px }
	.gnb > ul > li.e00,
	.gnb > ul > li.g00,
	.gnb > ul > li.f00 { min-width: 165px}
	.gnb > ul > li > a { width: 120px; font-size: 16px }
	.jsHeaderTop  .gnb > ul > li > a { height: 35px }
	.gnb > ul > li > ul > li > a { font-size: 14px ;line-height:28px;}

	a.btn_login { font-size: 15px; width:55px;  background-position: 0 7px}
	a.btn_login:hover,
	a.btn_login:focus { background-position: 0 -31px }


    a.btn_extend { display:inline-block; }
    a.btn_extend { border:solid 1px #999; padding:4px 12px; border-radius:3px; font-size: 12px; background: none; width: auto; height: auto; margin: 0}
    a.btn_excute { display:inline-block; }
    a.btn_excute { border:solid 1px #999; padding:4px 12px; border-radius:3px; font-size: 12px; background: none; width: auto; height: auto; margin: 0}

	strong.login_name span,
	a.btn_mypage { display: inline-block }
	.table_sort label { padding:0 0 0 20px}

	.d20_guide .search_area2 .btn_search { padding: 10px 40px; }
	.d20_guide .select1 { width: 190px; margin: 0 0 0  20px }

}

/* commom */
.hidden,
.none { position: fixed; left: -9999px; }

.float_l { float: left }
.float_r { float: right }


.disaster_act_grade1_bg {background:#aaaaaa; color: #fff;}
.disaster_act_grade2_bg {background:#78c8d2; color: #fff;}
.disaster_act_grade3_bg {background:#ed8771; color: #fff;}
.disaster_act_grade4_bg {background:#668198; color: #fff;}


/* table */
.table {border-top: #00a2c5 solid 1px; margin: 0 0 20px 0}
.table caption { background: #363844; color: #fff; font-size: 15px; text-align: left; padding: 12px 0; text-indent: 15px; font-weight: lighter;border-bottom: #cacac9 solid 1px; }
.table caption.caption { background:none; padding: 30px 0 11px 0; text-indent: 0; border-bottom: #cacac9 solid 1px; }
.table caption.caption span{ background: #363844; color: #fff; font-size: 16px; padding: 6px 20px; border-radius: 16px 0 }
.table thead th { background: #e1dfdb;padding: 10px; border:#ccc solid 1px ; border-top:none; line-height: 1.3em }
.table tbody th,
.table tbody td { border:#e1e1e0 solid 1px ; padding: 8px 12px; background: #fff; line-height: 1.3em; border-top:none;}
.table tbody td.disaster_act_grade1_bg {background:#aaaaaa; color:#fff;}
.table tbody td.disaster_act_grade2_bg {background:#78c8d2; color: #fff;}
.table tbody td.disaster_act_grade3_bg {background:#ed8771; color: #fff;}
.table tbody td.disaster_act_grade4_bg {background:#668198; color: #fff;}
.table tbody td.disaster_act_grade1_bg2 {background: #aaaaaa url(/images/grade_dot.png) no-repeat 99% 17px; color: #fff;}
.table tbody td.disaster_act_grade2_bg2 {background: #78c8d2 url(/images/grade_dot.png) no-repeat 99% -79px; color: #fff;}
.table tbody td.disaster_act_grade3_bg2 {background: #ed8771 url(/images/grade_dot.png) no-repeat 99% -176px; color: #fff;}
.table tbody td.disaster_act_grade4_bg2 {background: #668198 url(/images/grade_dot.png) no-repeat 99% -273px; color: #fff;}
.table tbody th { background:#f0efed; font-weight: normal; color: #777}
.table tbody th label {color: #777}
.table tbody td {  }
.table tbody td.assigned { background:#d0f5a9; font-weight: normal; color: #777}
.table tbody td.no_data { text-align: center; }

.table label { margin-right:10px; }
.table td.title,
.table td.msg_content { text-align: left; }

/* 왼쪽 정렬인 테이블 */
.table_10 tbody th,
.table_10 tbody td { text-align: left; }

/* 가운데 정렬인 테이블 */
.table_20 tbody th,
.table_20 tbody td { text-align: center;}

.text_l{ text-align: left !important; }
.text_r{ text-align: right !important; }
.text_c{ text-align: center !important; }

.search_area2 + .table { border-top:none; }

.page_nav { text-align: center; padding: 0 0 30px 0;position: relative; font-size: 0}
.page_nav a,
.page_nav strong { display: inline-block; height: 26px; width: 38px; padding: 12px 0 0; border: solid 1px #ddd; background: #fff; overflow: hidden; font-size: 14px; margin-left: -1px }
.page_nav a.btn_first,
.page_nav a.btn_before,
.page_nav a.btn_next,
.page_nav a.btn_last{ background: #f0f0f0 url(/images/btn_pagenation.png) no-repeat 0 0; text-indent: -9999px;  }
.page_nav a.btn_before { background-position: -38px 0 }
.page_nav a.btn_next { background-position: -76px 0 }
.page_nav a.btn_last { background-position: -114px 0 }
.page_nav a:hover,
.page_nav a:focus { background-color: #ddd }
.page_nav strong { background: #777; color: #fff; border-color:#777; }
/* 
.page_nav .paging :first-child { border-radius: 8px 0 0 8px }
.page_nav .paging :last-child { border-radius: 0 8px 8px 0} 
*/
.view_quantity { position: absolute; right: 0; }



/* btn */

.btn {background: #777; color: #fff; font-size: 14px; border:none; border-radius: 4px; padding: 5px 30px  }
.btn:hover, .btn:focus {color: #fff; background-color: #666 }
.pri {background:#00b2d9}
.pri:hover, .pri:focus {background-color:#00a2c5}
.wrn {background:#ed8f14}
.wrn:hover, .wrn:focus {background-color:#dc8b22}
.dis { opacity: 0.5; cursor: default; }

.btn_area { text-align: right; padding:0 0 30px 0; clear: both; }
.btn_area .btn { padding:10px 30px; border-radius: 4px; display: inline-block; }

.btn_area_center {padding:40px 0 0; clear: both; text-align: center; }
.btn_area_center .btn {padding: 10px 80px; font-size: 17px; border-radius: 30px}

.c10_setup_list .btn_area { border-bottom: solid 1px #ddd ; margin: 0 0 25px 0}
.c10_setup .btn_area .btn {margin: 0 2px}
.c10_setup_list .btn_area_center { padding: 10px 0 0 0}

article.jsDiv .btn_area { text-align: center;border-top:solid 1px #ebebeb; padding: 14px 0}


.btn2_del { background: #fff url(/images/bg_input.png) no-repeat -60px 0px; border:#00a2c5 solid 1px;  display: inline-block; width: 15px;height: 15px; border-radius: 4px; overflow: hidden; vertical-align: middle; text-indent: -9999px; margin: -2px 12px 0 2px }
.btn2_del:hover,
.btn2_del:focus { background: #00a2c5 url(/images/bg_input.png) no-repeat -60px -60px;}

/* checkbox / radio */





/* bootstrap popover css*/
/*
.tooltip {
	position: absolute;
	z-index: 1070;
	display: block;
	font-family: "Helvetica Neue",
	Helvetica,
	Arial,
	sans-serif;
	font-size: 12px;
	font-weight: 400;
	line-height: 1.4;
	visibility: visible;
	filter: alpha(opacity = 0);
	opacity: 0
}
.tooltip.in {
	filter: alpha(opacity = 90);
	opacity: .9
}
.tooltip.top {
	padding: 5px 0;
	margin-top: -3px
}
.tooltip.right {
	padding: 0 5px;
	margin-left: 3px
}
.tooltip.bottom {
	padding: 5px 0;
	margin-top: 3px
}
.tooltip.left {
	padding: 0 5px;
	margin-left: -3px
}
.tooltip-inner {
	max-width: 200px;
	padding: 3px 8px;
	color:  # fff;
	text-align: center;
	text-decoration: none;
	background-color:  # 000;
	border-radius: 4px
}
.tooltip-arrow {
	position: absolute;
	width: 0;
	height: 0;
	border-color: transparent;
	border-style: solid
}
.tooltip.top.tooltip-arrow {
	bottom: 0;
	left: 50 % ;
	margin-left: -5px;
	border-width: 5px 5px 0;
	border-top-color:  # 000
}
.tooltip.top-left.tooltip-arrow {
	right: 5px;
	bottom: 0;
	margin-bottom: -5px;
	border-width: 5px 5px 0;
	border-top-color:  # 000
}
.tooltip.top-right.tooltip-arrow {
	bottom: 0;
	left: 5px;
	margin-bottom: -5px;
	border-width: 5px 5px 0;
	border-top-color:  # 000
}
.tooltip.right.tooltip-arrow {
	top: 50 % ;
	left: 0;
	margin-top: -5px;
	border-width: 5px 5px 5px 0;
	border-right-color:  # 000
}
.tooltip.left.tooltip-arrow {
	top: 50 % ;
	right: 0;
	margin-top: -5px;
	border-width: 5px 0 5px 5px;
	border-left-color:  # 000
}
.tooltip.bottom.tooltip-arrow {
	top: 0;
	left: 50 % ;
	margin-left: -5px;
	border-width: 0 5px 5px;
	border-bottom-color:  # 000
}
.tooltip.bottom-left.tooltip-arrow {
	top: 0;
	right: 5px;
	margin-top: -5px;
	border-width: 0 5px 5px;
	border-bottom-color:  # 000
}
.tooltip.bottom-right.tooltip-arrow {
	top: 0;
	left: 5px;
	margin-top: -5px;
	border-width: 0 5px 5px;
	border-bottom-color:  # 000
}
.popover {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1060;
	display: none;
	max-width: 276px;
	padding: 1px;
	font-family: "Helvetica Neue",
	Helvetica,
	Arial,
	sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.42857143;
	text-align: left;
	white-space: normal;
	background-color:  # fff;
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
	border: 1px solid # ccc;
	border: 1px solid rgba(0, 0, 0, .2);
	border-radius: 6px;
	-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
	box-shadow: 0 5px 10px rgba(0, 0, 0, .2)
}
.popover.top {
	margin-top: -10px
}
.popover.right {
	margin-left: 10px
}
.popover.bottom {
	margin-top: 10px
}
.popover.left {
	margin-left: -10px
}
.popover-title {
	padding: 8px 14px;
	margin: 0;
	font-size: 14px;
	background-color:  # f7f7f7;
	border-bottom: 1px solid # ebebeb;
	border-radius: 5px 5px 0 0
}
.popover-content {
	padding: 9px 14px
}
.popover > .arrow, .popover > .arrow:
after {
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	border-color: transparent;
	border-style: solid
}
.popover > .arrow {
	border-width: 11px
}
.popover > .arrow:
after {
	content: "";
	border-width: 10px
}
.popover.top > .arrow {
	bottom: -11px;
	left: 50 % ;
	margin-left: -11px;
	border-top-color:  # 999;
	border-top-color: rgba(0, 0, 0, .25);
	border-bottom-width: 0
}
.popover.top > .arrow:
after {
	bottom: 1px;
	margin-left: -10px;
	content: " ";
	border-top-color:  # fff;
	border-bottom-width: 0
}
.popover.right > .arrow {
	top: 50 % ;
	left: -11px;
	margin-top: -11px;
	border-right-color:  # 999;
	border-right-color: rgba(0, 0, 0, .25);
	border-left-width: 0
}
.popover.right > .arrow: after {
	bottom: -10px;
	left: 1px;
	content: " ";
	border-right-color:  # fff;
	border-left-width: 0
}
.popover.bottom > .arrow {
	top: -11px;
	left: 50 % ;
	margin-left: -11px;
	border-top-width: 0;
	border-bottom-color:  # 999;
	border-bottom-color: rgba(0, 0, 0, .25)
}
.popover.bottom > .arrow: after {
	top: 1px;
	margin-left: -10px;
	content: " ";
	border-top-width: 0;
	border-bottom-color:  # fff
}
.popover.left > .arrow {
	top: 50 % ;
	right: -11px;
	margin-top: -11px;
	border-right-width: 0;
	border-left-color:  # 999;
	border-left-color: rgba(0, 0, 0, .25)
}
.popover.left > .arrow: after {
	right: 1px;
	bottom: -10px;
	content: " ";
	border-right-width: 0;
	border-left-color:  # fff
}
*/


.fade {
	opacity: 0;
	-webkit-transition: opacity.15s linear;
	-o-transition: opacity.15s linear;
	transition: opacity.15s linear
}
.fade.in {
	opacity: 1
}
.hide {
	display: none!important
}
.show {
	display: block!important
}
.invisible {
	visibility: hidden
}
.hidden {
	display: none!important;
	visibility: hidden!important
}
.affix {
	position: fixed
}



.clearfix {*zoom:1;}
.clearfix:after {content:""; display:block; clear:both;}

/* table Header 고정 tbody scroll ====================================== */	
.fixed-table-container { /*테이블 고정 container width와 height는 공용으로 사용하기 위해 html단에서 지정 */ 
/*width: 800px;height: 200px;*/
	position: relative;
	padding-top: 50px; /* header-bg height값 */
}
.fixed-table-header-bg { /*헤더(타이틀 영역)*/
	/* border-top:1px solid #3b3f2c; 
	border-bottom:1px solid #3b3f2c; */
	text-align:center;
	color:#666; 
	/* background:#ecf5fc;  */
	font-weight:bold;
	height: 50px; /* header-bg height값 */
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	/*border-bottom: 1px solid #000;*/
    background: #e1dfdb;
   /* padding: 10px;*/
    border: #ccc solid 1px;
    border-top: none;  
}
.fixed-table-wrapper {
    overflow-x: hidden;
    overflow-y: auto;
    height: 100%;
}
table.fixed-table {
    width: 100%;
    border-collapse: collapse;
}
table.fixed-table td {
    border-bottom: 1px solid #DDD;
	height:30px;
	padding:3px 10px 2px;
    text-align:center;
    color:#666;
}
table.fixed-table td + td {
    border-left: 1px solid #DDD;
}
table.fixed-table th {
  padding: 0px;  /* reset */
  background: #e1dfdb;
  /*padding: 10px;*/
  border: #ccc solid 1px;
  border-top: none;        
  line-height: 30px;
}
table.fixed-table .th-text {
    position: absolute;
    top: 0;
    width: inherit;
    line-height: 30px; /* header-bg height값 */
	border-left:1px solid;
	border-color:#3b3f2c #c4c4c4;
    padding: 10px;
    text-align:center;
}
table.fixed-table th:first-child .th-text {
    border-left: none;
}
table.fixed-table tbody tr:last-child td{/* border-bottom:1px solid #3b3f2c; */} 
table.fixed-table tbody tr:nth-child(even) {/* background: #f6f6f6; */}


/* dash table content vertical-align */
.dash_content tbody td { vertical-align: top;}

input[type="checkbox"] {  }
input[type="checkbox"] + label::before,
input[type="checkbox"]:checked + label::before { cursor: pointer; content:""; display:inline-block; width: 18px;height: 18px; background: url("/images/bg_input.png") no-repeat 0 -30px; margin: 0 6px 3px -20px; vertical-align: middle }

input[type="checkbox"]:hover + label::before,
input[type="checkbox"]:focus + label::before {background-position: 0 -60px}
input[type="checkbox"]:hover + label,
input[type="checkbox"]:focus + label { color: #00b2d9 }

input[type="checkbox"]:checked + label::before { background: url("/images/bg_input.png") no-repeat 0 0;  }
input[type="checkbox"]:checked + label { color: #00b2d9 }


input[type="radio"] + label::before,
input[type="radio"]:checked + label::before { cursor: pointer; content:""; display:inline-block; width: 18px;height: 18px; background: url("/images/bg_input.png") no-repeat -30px -30px; margin: 0 6px 3px -20px; vertical-align: middle;  }

input[type="radio"]:hover + label::before,
input[type="radio"]:focus + label::before {background-position: -30px -60px;}
input[type="radio"]:hover + label,
input[type="radio"]:focus + label { color: #00b2d9 }


input[type="radio"]:checked + label::before { background: url("/images/bg_input.png") no-repeat -30px 0;  }
input[type="radio"]:checked + label { color: #00b2d9 }

/* input */
.input { border: solid 1px #e3e3e3; border-radius: 3px; background: #f8f8f8; padding: 0 10px; margin: 2px; height: 32px; line-height: 1em;  box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;}
select.input {padding: 0 0 0 10px; }
textarea.input { height: auto; }
.input:hover,
.input:focus { border-color:#40b2cd; }

/* select.input option[value=""] { background-color: red;}  */

span.caption{
	width: 100%;
    background: #363844;
    color: #fff;
    font-size: 15px;
    text-align: left;
    padding: 12px 0;
    text-indent: 15px;
    font-weight: lighter;
    border-bottom: #cacac9 solid 1px;
}

.input02 { width: 2% }
.input03 { width: 3% }
.input04 { width: 4% }
.input05 { width: 5% }
.input06 { width: 6% }
.input07 { width: 7% }
.input08 { width: 8% }
.input09 { width: 9% }
.input10 { width: 10% }
.input15 { width: 15% }
.input20 { width: 20% }
.input25 { width: 25% }
.input30 { width: 30% }
.input35 { width: 35% }
.input40 { width: 40% }
.input45 { width: 45% }
.input50 { width: 50% }
.input55 { width: 55% }
.input60 { width: 60% }
.input65 { width: 65% }
.input70 { width: 70% }
.input75 { width: 75% }
.input80 { width: 80% }
.input85 { width: 85% }
.input86 { width: 86% }
.input87 { width: 87% }
.input88 { width: 88% }
.input89 { width: 89% }
.input90 { width: 90% }
.input95 { width: 95% }
.input98 { width: 98% }
.input99 { width: 99% }

.width02,
.width03,
.width04,
.width05,
.width06,
.width07,
.width08,
.width09,
.width10,
.width15,
.width20,
.width25,
.width30,
.width35,
.width40,
.width45,
.width50,
.width55,
.width60,
.width65,
.width70,
.width75,
.width80,
.width85,
.width86,
.width87,
.width88,
.width89,
.width90,
.width95,
.width98 { position: relative; margin: 0 auto }

.width02 { width: 2% }
.width03 { width: 3% }
.width04 { width: 4% }
.width05 { width: 5% }
.width06 { width: 6% }
.width07 { width: 7% }
.width08 { width: 8% }
.width09 { width: 9% }
.width10 { width: 10% }
.width15 { width: 15% }
.width20 { width: 20% }
.width25 { width: 25% }
.width30 { width: 30% }
.width35 { width: 35% }
.width40 { width: 40% }
.width45 { width: 45% }
.width50 { width: 50% }
.width55 { width: 55% }
.width60 { width: 60% }
.width65 { width: 65% }
.width70 { width: 70% }
.width75 { width: 75% }
.width80 { width: 80% }
.width85 { width: 85% }
.width86 { width: 86% }
.width87 { width: 87% }
.width88 { width: 88% }
.width89 { width: 89% }
.width90 { width: 90% }
.width95 { width: 95% }
.width98 { width: 98% }

/*※ 필수*/
.compulsory{font-size: 10px; color:#cd0a0a}
.float_mr{float:right; margin-top: 2px;}
.check_location{float: right; margin-bottom: 10px; color :  #5f3f3f}


/* icon 팩 */
.glyph {
    font-size: 11px;
    float: left;
    text-align: center;
    /*background: #eee;*/
    padding: .75em;
    margin: .75em 1.5em .75em 0;
    width: 20px;
    cursor: help;
    /*border-radius: .25em;
    box-shadow: inset 0 0 0 1px #f8f8f8, 0 0 0 1px #CCC;*/
}
.w-main {
    width: 80%;
}
.centered {
    margin-left: auto;
    margin-right: auto;
}
.fs1 {
    font-size: 18px;
    cursor: help;
    width: 20px;
}