@charset "utf-8";
@import url("common.css");
@import url("jquery-ui.min.css");


/* wrap ====================*/
.wrap { position:relative; width:100%; height:100%; min-width:1200px; padding-top:134px; box-sizing:border-box; z-index:0;}
.wrap .header {position:absolute; left:0; top:0; right:0; width:100%; background:#fff; z-index:1;}
.section-center {position:relative;  width:1200px; margin:0 auto; box-sizing:border-box;}
.section-center:after {content:""; display:block; clear:both;}


/* header-popup ====================*/
.header-popup {position:relative; background:#35784c; z-index:1;}
.header-popup .layer-table > .col {padding:20px 20px; background:url("../images/section-center-bg.png") no-repeat 0px -50px;}
.header-popup .layer-table > .col:first-child {padding:20px;}
.header-popup .layer-table > .col p.title {font-size:22px; line-height:24px; color:#ffff99;}
.header-popup .layer-table > .col p.txt {font-size:13px; line-height:14px; color:#fff;}
.header-popup .close-area {position:absolute; right:0; top:5px; overflow:hidden; color:#fff;}
.header-popup .close-area a {float:left; color:#fff; line-height:15px; padding-right:15px; background:url("../images/pop-icon.png") no-repeat right 0 top 3px; background-size:25%;}
.header-popup .close-area label {float:left; padding-right:10px; margin-right:10px; background:url("../images/dan-icon.png") no-repeat right 0 top 3px; background-size:1px 10px;}
.header-popup > .section-center > i {position:absolute; right:0; bottom:-20px; display:block; padding:5px 20px 8px 20px; background:#35784c; border-radius: 0 0 3px 3px; cursor: pointer;}
.header-popup > .section-center > i > span {display:block; width:10px; height:7px; background:url("../images/header-popup-icon.png") no-repeat 0 0px; transition:all 0.4s ease; transform: rotate(180deg); transform-origin:center center;}

.header-popup > .section-center > .layer-table {display:none;}
.header-popup > .section-center > .close-area {display:none;}
.header-popup.on > .section-center > .layer-table {display:table;}
.header-popup.on > .section-center > .close-area {display:block;}
.header-popup.on > .section-center > i span,
.header-popup.on > .section-center > i:hover span {transform: rotate(0deg); transform-origin:center center;}


/* header-area ====================*/
.header-area {position:relative; border-bottom:1px solid #ddd; z-index:1;}

/* header-area - header-box */
.header-area .section-center {height:82px; }
.header-area h1 {position:absolute; left:0; top:25px; }
.header-area h1 a {display:block; }

/* header-area - header-utility */
.header-area ul.header-utility {position:absolute; right:0; top:25px; font-size:14px;}
.header-area ul.header-utility li {float:left;}
.header-area ul.header-utility li > a {display:block; padding:0 17px; line-height:30px; color:#333; background:url("../images/dot22_b3.gif") no-repeat 0px 15px; }
.header-area ul.header-utility li > a.remote {margin-left:20px; padding:0; width:98px; height:30px; text-align:center; border-radius:5px; border:1px solid #ddd; background:none;}
.header-area ul.header-utility li > a.remote span {padding-left:22px; background:url("../images/remote-icon.png") no-repeat 0px 3px;}
.header-area ul.header-utility li:first-child > a {padding-left:0px; background:none;}

/* header-area - header-utility - Hover */
.header-area ul.header-utility li > a:hover {color:#01b552;}
.header-area ul.header-utility li > a.remote:hover {border-color:#01b552;}
.header-area ul.header-utility li > a.remote:hover span {color:#333;}


/* gnb-area ====================*/
.gnb-area {position:relative; height:50px; border-bottom:1px solid #ddd; z-index:1;}

/* gnb-area - gnb */
.gnb-area ul.gnb {}
.gnb-area ul.gnb:after {content:""; display:block; clear:both;}
.gnb-area ul.gnb > li {position:relative; float:left; height:50px; line-height:50px; text-align:center; }
.gnb-area ul.gnb > li:first-child {margin:0;}
.gnb-area ul.gnb > li > a {position:relative; display:block; width:143px; font-size:18px; color:#444; font-weight:500;}

/* gnb-area - gnb - depth02 */
.gnb-area ul.gnb > li > ul.depth02 {display:none; position:absolute; left:0; top:50px; width:100%; padding:7px 0; background:#fff; border:1px solid #ddd;}
.gnb-area ul.gnb > li > ul.depth02 > li {padding:0 8px; text-align:left; }
.gnb-area ul.gnb > li > ul.depth02 > li:first-child {}
.gnb-area ul.gnb > li > ul.depth02 > li > a {display:block; height:27px; line-height:27px; padding:0 10px; color:#666; font-size:13px;}

/* gnb-area - gnb - Hover */
.gnb-area ul.gnb > li.on a,
.gnb-area ul.gnb > li:hover > a {color:#01b552;}
.gnb-area ul.gnb > li.on > a:after,
.gnb-area ul.gnb > li:hover > a:after {content:''; display:block; position:absolute; left:13px; bottom:-1px; width:114px; height:5px; background:#01b552;}

.gnb-area ul.gnb > li:hover > .depth02 {display:block;}
.gnb-area ul.gnb > li > ul.depth02 > li.on a,
.gnb-area ul.gnb > li > ul.depth02 > li:hover a {color:#fff; background:url("../images/gnb-check-icon.png") no-repeat right 10px top 8px #01b552;}

/* gnb-area - btn-open-menus */
.gnb-area a.btn-open-menus {position:absolute; right:0; top:-1px;  border:1px solid #ddd; width:50px; height:52px; z-index:1;}
.gnb-area a.btn-open-menus span {position:absolute; left:14px; top:24px; display:block; width:22px; height:4px; background:#000; }
.gnb-area a.btn-open-menus span:after,
.gnb-area a.btn-open-menus span:before {content:''; display:block; position:absolute; width:22px; height:4px; background:#000;  }
.gnb-area a.btn-open-menus span:after {right:0; bottom:-10px;}
.gnb-area a.btn-open-menus span:before {left:0; top:-10px;}

.gnb-area a.btn-open-menus:hover {border:1px solid #01b552;}
.gnb-area a.btn-open-menus:hover span,
.gnb-area a.btn-open-menus:hover span:after,
.gnb-area a.btn-open-menus:hover span:before {background:#01b552;}
.gnb-area a.btn-open-menus.on:hover span {height:0;}
.gnb-area a.btn-open-menus.on:hover span:after {right:0; bottom:-3px; transform: rotate(-45deg);}
.gnb-area a.btn-open-menus.on:hover span:before {left:0; top:-1px; transform: rotate(45deg);}

/* gnb-area - open-menus */
.gnb-area > .open-menus {display:none;}
.gnb-area > .open-menus {position:absolute; left:0px; right:0px; top:0px; background:#fff; border-bottom: 1px solid #ddd; z-index:1;}
.gnb-area > .open-menus > ul {display:table; table-layout:fixed; width:1200px; margin:0 auto; padding-right:50px; box-sizing:border-box;}
.gnb-area > .open-menus > ul > li {display:table-cell; height:50px; line-height:50px; border-right:1px solid #ddd;  text-align:center; font-size: 18px;color: #444; font-weight: 500;}
.gnb-area > .open-menus > ul > li:first-child {border-left:1px solid #ddd;}
.gnb-area > .open-menus > ul > li > span {display:inline-block; position:relative;}

.gnb-area > .open-menus > ul > li > ul.depth02 {font-size: 14px; color: #666; font-weight: 400; text-align:left; border-top:1px solid #ddd; padding:7px 0;}
.gnb-area > .open-menus > ul > li > ul.depth02 > li {text-align:left;}
.gnb-area > .open-menus > ul > li > ul.depth02 > li > a {display:block; height:27px; line-height:27px; padding:0 10px; color:#666; font-size:13px;}

.gnb-area > .open-menus > ul > li span.on,
.gnb-area > .open-menus > ul > li:hover span{color:#01b552;}
.gnb-area > .open-menus > ul > li span.on:after,
.gnb-area > .open-menus > ul > li:hover span:after {content:''; display:block; position:absolute; left:-10px; bottom:-1px; width:100%; height:5px; padding:0 10px; background:#01b552;}
.gnb-area > .open-menus > ul > li > ul.depth02 > li:hover a {color:#fff; background:url("../images/gnb-check-icon.png") no-repeat right 10px top 8px #01b552;}


/* container ====================*/
.container {position:relative; width:100%; background:#f4f4f4; z-index:0;}
.container > .section-center {padding:30px 140px 60px 200px; z-index:1; }


/* container - main ====================*/
.container.main > .section-center {padding:40px 0;}
.container.main .layer-table {margin-bottom:20px;}
.container.main .layer-table .col {padding-left:20px;}
.container.main .layer-table .col:first-child {padding:0;}
.container.main .layer-table .col .visual {overflow:hidden; position:relative; height: 401px; border:1px solid #ccc; box-sizing:border-box;}
.container.main .layer-table .col .visual .visual-txt {position:absolute; top:50px; left:0; right:0; display:inline-block; text-align:center;}
.container.main .layer-table .col .visual .visual-txt p.title {font-size:48px; line-height:50px; color:#444; font-weight:700; margin-bottom:20px;}
.container.main .layer-table .col .visual .visual-txt p.subtxt {font-size:14px; letter-spacing: 0px;}
.container.main .layer-table .col .visual img {/*width:100%;*/ }
/* main - login-area */
.container.main .login-area {padding:20px; margin-bottom:20px; background:#fff; border:1px solid #ccc;}
.container.main .login-area p.title {margin-bottom:10px; font-size:16px; line-height:20px; font-weight:500;}
.container.main .login-area .login {width:100%; padding-right:75px; margin-bottom:5px; box-sizing:border-box;}
.container.main .login-area .login > input {height:33px;}
.container.main .login-area .login > input:first-child {margin-bottom:-1px;}
.container.main .login-area .login a.login-btn {width:65px; height:65px; line-height:65px; padding:0; border-radius:0;}
.container.main .login-area ul.login-utility {}
.container.main .login-area ul.login-utility li {display:inline; margin-left:5px; padding-left:5px; background:url("../images/dan-icon.png") no-repeat 0 5px; background-size:1px 10px;}
.container.main .login-area ul.login-utility li:first-child {margin-left:0; padding-left:0; background:none;}
.container.main .login-area ul.login-utility li a {color:#777;}
.container.main .login-area ul.login-utility li a:hover {color:#01b552; text-decoration:underline;}


/* main - myview-area */
.container.main .myview-area {padding:17px 20px 16px 20px; margin-bottom:13px; background:#fff; border:1px solid #ccc;}
.container.main .myview-area p.title {color:#01b552; border-bottom:1px solid #fff; margin-bottom:10px; font-size:16px; line-height:20px; font-weight:500;}
.container.main .myview-area a.more {display:block; position:absolute; right:0px; top:40px; overflow:hidden; width:46px; height:46px; background:url("../images/btn-notice-more.png") no-repeat 14px 14px; text-indent:-999px; border:1px solid #ccc; }
.container.main .myview-area a.more:hover {border:1px solid #01b552;}
.container.main .myview-area > dl {margin-top:5px;}
.container.main .myview-area > p + dl {margin-top:0px;}
.container.main .myview-area > dl:after {content:""; display:block; clear:both;}
.container.main .myview-area > dl > dt {float:left; width:50px; font-weight:700; font-size:14px; line-height:15px; color:#444;}
.container.main .myview-area > dl > dt > span {display:block; font-weight:300; font-size:12px; line-height:12px; color:#999;}
.container.main .myview-area > dl > dd {text-indent:3px; float:left; width:calc(100% - 50px);}
.container.main .myview-area > dl > dd > a {display:block; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; width:100%; color:#666; line-height:15px; box-sizing:border-box; }
.container.main .myview-area > dl > dd > a > strong {display:block; color:#444; font-size:14px;}
.container.main .myview-area > dl:hover > dt {color:#01b552;}
.container.main .myview-area > dl:hover > dd > a > strong {color:#01b552;}


/*
.container.main .myview-area ul.notice {}
.container.main .myview-area ul.notice li {font-size:14px; padding-left:8px; margin-top:4px; background:url("../images/dot22_b3.gif") no-repeat 0 9px;}
.container.main .myview-area ul.notice li:first-child {margin-top:0px;}
.container.main .myview-area ul.notice li a {display:block; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; width:100%; box-sizing:border-box;}
.container.main .myview-area ul.notice li:hover a {color:#01b552; text-decoration:underline;}
*/

/* main - tab-area */
.container.main .tab-area {background:#fff; border:1px solid #ccc;}
.container.main .tab-area ul.tab-manu li {position:relative; width:93px; line-height:46px; padding:0; font-size:16px; font-weight:500; color:#777; background:#fff; border:0; border-right:1px solid #ddd; border-bottom:1px solid #ddd;}
.container.main .tab-area ul.tab-manu li.active {color:#01b552; border-bottom:1px solid #fff;}
				
.container.main .tab-area .tab-contents {padding:20px;  border-top:1px solid #ddd;}
.container.main .tab-area .tab-contents a.more {display:block; position:absolute; right:-1px; top:-1px; overflow:hidden; width:46px; height:46px; background:url("../images/btn-notice-more.png") no-repeat 14px 14px; text-indent:-999px; border:1px solid #ccc; }
.container.main .tab-area .tab-contents a.more:hover {border:1px solid #01b552;}
.container.main .tab-area .tab-contents ul.notice {}
.container.main .tab-area .tab-contents ul.notice li {font-size:14px; padding-left:8px; margin-top:8px; background:url("../images/dot22_b3.gif") no-repeat 0 9px;}
.container.main .tab-area .tab-contents ul.notice li:first-child {margin-top:0px;}
.container.main .tab-area .tab-contents ul.notice li a {display:block; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; width:100%; box-sizing:border-box;}
.container.main .tab-area .tab-contents ul.notice li:hover a {color:#01b552; text-decoration:underline;}

.container.main dl.banner-main {display:table; table-layout:fixed; width:100%; height:170px; text-align:center; background:#fff; border:1px solid #ddd; box-sizing:border-box;}
.container.main dl.banner-main dt {display:table-cell; width:240px; padding:40px 0 0 141px; text-align:left; background:url("../images/banner-main-icon.png") no-repeat 0 -574px #01b552; box-sizing:border-box;}
.container.main dl.banner-main dt span {color:#fff; font-size:16px; line-height:18px;}
.container.main dl.banner-main dt span strong {display:block; font-size:24px; line-height:25px;}
.container.main dl.banner-main dd {display:table-cell; vertical-align: middle; background:url("../images/dan-icon.png") no-repeat 0 26px;}
.container.main dl.banner-main dd:first-child {background:none;}
.container.main dl.banner-main dd a {display:block; font-size:14px; line-height:18px;}
.container.main dl.banner-main dd:hover a {color:#01b552; text-decoration:underline;}
.container.main dl.banner-main dd.icon01 a {padding-top:52px; background:url("../images/banner-main-icon.png") no-repeat 55px 0px;}
.container.main dl.banner-main dd.icon02 a {padding-top:52px; background:url("../images/banner-main-icon.png") no-repeat 55px -124px;}
.container.main dl.banner-main dd.icon03 a {padding-top:52px; background:url("../images/banner-main-icon.png") no-repeat 55px -206px;}
.container.main dl.banner-main dd.icon04 a {padding-top:52px; background:url("../images/banner-main-icon.png") no-repeat 55px -285px;}
.container.main dl.banner-main dd.icon05 a {padding-top:52px; background:url("../images/banner-main-icon.png") no-repeat 55px -368px;}
.container.main dl.banner-main dd.icon06 a {padding-top:52px; background:url("../images/banner-main-icon.png") no-repeat 55px -455px;}



/* lnb-area ====================*/
.lnb-area {position:absolute; left:0; top:30px; width:190px; box-sizing:border-box; background:#fff; border:1px solid #ddd;} 
.lnb-area h2 {height:100px; line-height:100px;  font-size:25px; text-align:center; color:#fff; background:#01b552;}
.lnb-area ul.lnb {}
.lnb-area ul.lnb li {border-top:1px solid #ddd;}
.lnb-area ul.lnb li:first-child {border-top:0;}
.lnb-area ul.lnb li a {display:block; font-size:15px; height:46px; line-height:46px; padding:0 30px 0 18px; color:#333; font-weight:500;}
.lnb-area ul.lnb li.on a,
.lnb-area ul.lnb li:hover a {color:#01b552;}


/* contents-area ====================*/
.contents-area {min-height:700px; padding:35px 30px;  box-sizing:border-box; border:1px solid #dddd; background:#fff;}
/* contents-area - contents-title */
.contents-area .contents-title { position:relative; height:65px; margin-bottom:30px;}
.contents-area .contents-title:after {content:""; display:block; position:absolute; left:0; right:0; bottom:0; height:11px; background:url("../images/bg_path_wrap.png") repeat-x 0 0;}
.contents-area .contents-title h3.title {float:left; font-size:30px; line-height:30px; font-weight:500;}
.contents-area .contents-title ul.path {float:right; margin-top:20px;}
.contents-area .contents-title ul.path:after {content:""; display:block; clear:both;}
.contents-area .contents-title ul.path li {float:left; font-size:12px; margin-left:10px; padding-left:10px; color:#909090; background:url("../images/location_arrow.gif") no-repeat -6px 2px;}
.contents-area .contents-title ul.path li:first-child {overflow:hidden; width:13px; height:18px; margin-left:0px; padding:0; background:url("../images/icon_home.gif") no-repeat 0 2px; text-indent:-99999px;}
.contents-area .contents-title ul.path li:last-child {color:#333;}
/* contents-area - contents */
.contents-area .contents {}


/* snb-links ====================*/
.snb-links {position:absolute; right:0; top:30px; width:130px; box-sizing:border-box; }

/* snb-links - site-lins */
.snb-links .site-lins {background:#fff; border:1px solid #ddd;}
.snb-links .site-lins p.title {height:34px; line-height:34px; text-align:center; font-size:13px; color:#fff; background:#01b552;}
.snb-links .site-lins > ul {}
.snb-links .site-lins > ul > li {display:table; width:100%; border-top:1px solid #ddd;}
.snb-links .site-lins > ul > li:first-child {border-top:0;}
.snb-links .site-lins > ul > li > a {display:table-cell; height:40px; padding-left:38px; line-height:14px; vertical-align: middle; font-size:12px; font-weight:500; color:#777; }
.snb-links .site-lins > ul > li > a.site01 {background:url("../images/links-icons.png") no-repeat 11px 13px;}
.snb-links .site-lins > ul > li > a.site02 {background:url("../images/links-icons.png") no-repeat 11px -33px;}
.snb-links .site-lins > ul > li > a.site03 {background:url("../images/links-icons.png") no-repeat 11px -80px;}
.snb-links .site-lins > ul > li > a.site04 {background:url("../images/links-icons.png") no-repeat 11px -126px;}
.snb-links .site-lins > ul > li > a.site05 {background:url("../images/links-icons.png") no-repeat 11px -175px;}
.snb-links .site-lins > ul > li > a.site06 {background:url("../images/links-icons.png") no-repeat 11px -221px;}
.snb-links .site-lins > ul > li > a.site07 {background:url("../images/links-icons.png") no-repeat 11px -268px;}
.snb-links .site-lins > ul > li > a.site08 {background:url("../images/links-icons.png") no-repeat 11px -314px;}
.snb-links .site-lins > ul > li > a.site09 {background:url("../images/links-icons.png") no-repeat 11px -362px;}
.snb-links .site-lins > ul > li > a.site10 {background:url("../images/links-icons.png") no-repeat 11px -410px;}
/* snb-links - site-lins - Hover */
.snb-links .site-lins > ul > li:hover a {color:#01b552;}

/* snb-links - page-top  */
.snb-links p.page-top {display:block; width:56px; height:56px; margin:20px auto 0 auto; border-radius: 30px; background:#999; text-align:center; }
.snb-links p.page-top a {display:block; height:100%; line-height:66px; font-size:12px; font-weight:500; color:#fff; background:url("../images/pagTop-icon.png") no-repeat 23px 14px;}
.snb-links p.page-top:hover {background:#01b552;}


/* footer-top ====================*/
.footer-top {border-top:1px solid #ddd; border-bottom:1px solid #ddd;}
.footer-top ul.footer-utility {}
.footer-top ul.footer-utility:after {content:""; display:block; clear:both;}
.footer-top ul.footer-utility li {float:left; height:47px; line-height:47px; font-size:14px; margin-left:50px;}
.footer-top ul.footer-utility li:first-child {margin-left:0px; }
.footer-top ul.footer-utility li:first-child a {color:#ff3300;}
.footer-top a.family-Site {position:absolute; right:0; top:-1px; display:block; height:47px; line-height:47px; padding:0 30px 0 16px; font-size:14px; background:url("../images/familysite_arrow.png") no-repeat right 10px top 17px; border:1px solid #ddd;}
.footer-top ul.family-Site-list {display:none; position:absolute; right:0; top:-221px; padding:; border:1px solid #ddd; background:#fff;}
.footer-top ul.family-Site-list li a {display:block; width:155px; padding:5px 10px 5px 10px;box-sizing:border-box;}

/* footer-top - Hover */
.footer-top ul.footer-utility li:hover a {color:#01b552;}
.footer-top a.family-Site:hover {border:1px solid #01b552;}
.footer-top ul.family-Site-list li:hover a {color:#fff; background:#01b552; }


/* footer-bottom ====================*/
.footer-bottom {padding:20px 0;}
.footer-bottom .footer-logo {position:absolute; left:0px; top:3px;}
.footer-bottom .footer-logo a {display:block;}
.footer-bottom p.address {margin-left:200px; font-size:12px; color:#666;}
.footer-bottom p.copyright {margin-left:200px; font-size:12px; color:#999;}
.footer-bottom ul.mark {position:absolute; right:0px; top:-6px;}
.footer-bottom ul.mark li {float:left; margin-left: 17px;}
.footer-bottom ul.mark li img {height:48px; }


/* form ====================*/
p.txt {margin-top:5px;}
span.txt {display:inline-block; height:25px; line-height:25px; vertical-align: middle;}
input[type=text],
input[type="password"] {width:100%; height:28px; padding:0 5px; background:#fff; border:1px solid #ccc; box-sizing:border-box;}

select {width:100%; height:28px; line-height:27px; padding:0 18px 0 3px; background: url("../images/select-icon.png") no-repeat right 5px  top 9px #fff; border:1px solid #ccc; -webkit-appearance: none;  -moz-appearance: none; appearance: none; }
select::-ms-expand {display: none;}

label.radio,
label.checkbox {display:block;}
label:after {content:""; display:block; clear:both;}
label > input[type="checkbox"] {float:left; margin:1px 3px 0 0;}
label > span {float:left; line-height:15px;}

label > input[type="radio"] {float:left; margin:1px 3px 0 0;}
label > span {float:left; line-height:15px;}

textarea {width:100%; min-height:25px; border:1px solid #ddd; box-sizing:border-box; resize:none; font-family:"Noto Sans KR", "Arial", "Apple SD Gothic Neo", "Dotum", DotumChe, 돋움, 돋움체;}

.datepicker-box {position:relative; border:1px solid #ddd;}
.datepicker-box:after {content:''; display:block; clear:both;}
.datepicker-box input.datepicker {border:0; padding:0 24px 0 5px}
.datepicker-box img.ui-datepicker-trigger {position:absolute; right:0px; top:0px; padding:5px; }

/* etc ====================*/
.contents-center {position:relative;  width:670px; margin:0 auto; box-sizing:border-box;}
.contents.pop {padding:20px 30px;}
.contents p.tit:first-child {margin-top:0;}
.contents p.tit {min-height:20px; line-height:20px; margin-top:40px; font-size:20px; color:#333; font-weight:700;}
.contents hr {height:1px; margin:30px 0; border:0; background:#ddd;}
.contents .box {margin-top:12px; border:1px solid #ddd;}
.contents .box.color01 {border:1px solid #b7dec4;}

.contents .hide {display:none;}
.contents .relative {position:relative !important;}
.contents .scrollx {overflow-y:none; overflow-x:auto;}
.contents .scrolly {overflow-y:auto; overflow-x:none;}

.contents .txt:first-child,
.contents .box:first-child,
.contents .sort-area:first-child, 
.contents .search-area:first-child {margin-top:0;}


/* errer-area ====================*/
.errer-area {display:table; width:100%; height:100%; box-sizing:border-box;}
.errer-area .middle {display:table-cell; vertical-align: middle; text-align:center;}
.errer-area .middle > .errer {display:inline-block; padding:20px;}
.errer-area .middle > .errer h1 {margin-bottom:10px;}
.errer-area .middle > .errer .notice-box {padding:50px;}
.errer-area .middle > .errer .notice-box .notice {text-align:left; padding:15px 0 15px 100px; background:url("../images/errer-area-icon.png") no-repeat 0 0;}
.errer-area .middle > .errer .notice-box .notice p.title {font-size:32px; line-height:34px; font-weight:700;}
.errer-area .middle > .errer .notice-box .notice p.txt {font-size:16px; line-height:16px;}
.errer-area .middle > .errer .notice-box .notice.no-bg {padding:15px 0 15px 0; background:none;}

.errer-area .middle > .errer .notice-box .alarm {text-align:left; padding:15px 0 15px 0px; }
.errer-area .middle > .errer .notice-box .alarm p.title {text-align:center; font-size:32px; line-height:34px; font-weight:700;}
.errer-area .middle > .errer .notice-box .alarm p.txt {font-size:16px; line-height:16px;}
.errer-area .middle > .errer .notice-box .alarm.no-bg {padding:15px 0 15px 0; background:none;}

/* font ====================*/
.color01 {color:#333 !important;}
.color02 {color:#ff3300 !important;}
.color03 {color:#666 !important;}
.color04 {color:#01b552 !important;}

.f14 {font-size:14px; line-height:15px;}
.f13 {font-size:13px; line-height:15px;}

.bu {padding-left:14px; background:url("../images/bu-icon.png") no-repeat 0 2px;}
.bu.info {background:url("../images/bu-icon.png") no-repeat 0 -46px;}
.req {padding-left:11px; background:url("../images/req-icon.png") no-repeat 0 4px;}
.bold {font-weight:500;}
.ellipsis {display:block; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; width:100%; box-sizing:border-box;}
p.h1 {margin-bottom:20px; font-size:30px; line-height:30px; font-weight:700;}
p.h4 {margin-bottom:5px; font-size:18px; line-height:30px; font-weight:700;}

ul.txt-list {margin-top:10px; font-size:14px; }


/* formbox ====================*/
.formbox:after {content:""; display:block; clear:both;}

dl.formbox {margin-top:10px;}
dl.formbox:first-child {margin-top:0px;}
dl.formbox dt {float:left; line-height:28px; margin-right:10px; font-size:14px; font-weight:500; text-align:right; }
dl.formbox dd {float:left;}
dl.formbox dd > span.txt {height:28px; line-height:28px;}
dl.formbox dd > label.radio > input[type="radio"],
dl.formbox dd > label.checkbox > input[type="checkbox"] { margin:8px 3px 0 0;}
dl.formbox dd > label.radio > span,
dl.formbox dd > label.checkbox > span {line-height:28px;}
dl.formbox dd > label.radio,
dl.formbox dd > label.checkbox {margin-left:15px;}

.formbox a,
.formbox input,
.formbox select,
.formbox span.txt,
.formbox .filebox,
.formbox label.radio,
.formbox label.checkbox,
.formbox .datepicker-box {float:left; margin-left:10px;}
		 
.formbox a:first-child,
.formbox input:first-child,
.formbox select:first-child,
.formbox span.txt:first-child,
.formbox .filebox:first-child,
.formbox label.radio:first-child,
.formbox label.checkbox:first-child,
.formbox .datepicker-box:first-child {margin-left:0px;}

/* tab-menu ====================*/
.tab-area {position:relative; width:100%; }
.tab-area > ul.tab-manu { overflow: hidden; padding:0; border:0; background:none; text-align:center;}
.tab-area > ul.tab-manu > li {float:left; width:140px; padding:7px 0; font-size:16px; font-weight:500; color:#666; background:#efefef; border:1px solid #ddd; z-index:1; cursor:pointer;}
.tab-area > ul.tab-manu > li.active {color:#fff; background:#01b552; border:1px solid #019945; z-index:2;}

.tab-area .tab-contents {display:none; margin-top:-1px; padding:0;}
.tab-area .tab-contents.focus {display:block;}


/* 테이블박스 ====================*/
.layer-table {display:table;table-layout:fixed;width:100%;}
.layer-table > .col {display:table-cell; padding-left:10px; vertical-align:middle;}
.layer-table > .col:first-child {padding-left:0px;}


/* notice-box ====================*/
.notice-box {padding:30px; border: 1px solid #ddd; box-sizing:border-box;}
.notice-box .notice {margin:0 auto; }
.notice-box .notice p.title {margin-bottom:10px; line-height:20px; text-align:center; font-size:18px;  font-weight:500; }


/* button ====================*/
a[class*="btn"] {display:inline-block; padding:0 20px; height:36px; line-height:34px; font-size:16px; font-weight:500; text-align:center; border:1px solid #999; box-sizing:border-box;}
a.btn { color:#333; border-radius:3px; }
a.btn:hover {color:#01b552; border-color:#01b552;}
a[class*="btnSmall"] {display:inline-block; padding:0 10px; height:20px; line-height:16px; font-size:14px; font-weight:300; text-align:center; border:1px solid #999; box-sizing:border-box;}
a.btnSmall { color:#333; border-radius:3px; }
a.btnSmall:hover {color:#01b552; border-color:#01b552;}


a[class*="btn-green"] {border:1px solid transparent; border-radius:3px; box-sizing:border-box;}
a.btn-green1 { color:#fff; background:#01b552;}
a.btn-green2 { color:#fff; background:#077c3c;}
a.btn-green1:hover,
a.btn-green2:hover {border:1px solid #034e25; box-shadow: 0px 0px 10px 1px #ddd;}

a.btn-tb {height:28px; line-height:26px; font-size:13px; font-weight:500; border-radius:3px; background-color:#fff;}
a.btn-tb:hover {color:#01b552; border-color:#01b552;}
a.btn-tb.icon01 {padding:0 10px 0 20px; text-align:left; background:url("../images/btn-tb-icons.png") no-repeat 10px 9px;}
a.btn-tb.icon02 {padding:0 10px 0 20px; text-align:left; background:url("../images/btn-tb-icons.png") no-repeat 7px -33px;}
a.btn-tb.icon03 {padding:0 10px 0 20px; text-align:left; background:url("../images/btn-tb-icons.png") no-repeat 6px -72px;}
a.btn-tb.icon04 {padding:0 10px 0 22px; text-align:left; background:url("../images/btn-tb-icons.png") no-repeat 6px -274px;}

a.btn-tb.type01 {color:#fff; background:#666; border:1px solid #555;}
a.btn-tb.type02 {padding:0 7px; color:#009933; background:#f3f8f5; border:1px solid #8cc8a7;}
a.btn-tb.type02:hover {color:#fff; background:#009933; border:1px solid #009933; text-decoration:none;}
a.btn-tb.find {overflow:hidden; width:30px; height:28px; padding:0; text-indent:-99999px; vertical-align:middle; background:url("../images/btn-tb-icons.png") no-repeat 6px -234px;}
a.btn-tb.type03 {padding:0 7px; color:#fff; background:#009933; border:1px solid #8cc8a7;}
a.btn-tb.type04 {padding:0 7px; color:#fff; background:#FF5A5A; border:1px solid #8cc8a7;}

a.btn.up-down1,
a.btn.up-down2 {height:28px; line-height:28px; padding:0 10px 0 20px; text-align:left; }
a.btn.up-down1 {background:url("../images/btn-tb-icons.png") no-repeat 10px -112px;}
a.btn.up-down2 {background:url("../images/btn-tb-icons.png") no-repeat 10px -152px;}

/* 정렬영역 ====================*/
.sort-area {margin-top:10px; text-align: center;}
.sort-area:after {content:""; display:block; clear:both;}
.sort-area .center {display:inline-block; text-align:left;}
.sort-area .left {float:left; text-align:left;}
.sort-area .left > * {float:left; margin-left:10px;}
.sort-area .left > *:first-child {margin-left:0px;}
.sort-area .right {float:right; text-align:left;}
.sort-area .right > * {float:left; margin-left:10px;}
.sort-area .right > *:first-child {margin-left:0px;}


/* table ====================*/
table.table {width:100%; table-layout: fixed; margin-top:5px; border-top:2px solid #333333;}
table.table + table.table {margin-top:20px;}

table.table th,
table.table td {height:40px; padding:5px 10px; font-size:14px;  border-bottom:1px solid #ddd; vertical-align:middle; box-sizing:border-box;}
table.table th {font-weight:500; background:#f9f9f9;}
table.table th[rowspan] {border-right:1px solid #ddd;}
table.table td span.txt {height:28px; line-height:28px; color:#666;}

table.table a.link {/*display:block; float:none; margin:5px 0 0 0;*/}
table.table a.link:hover {color:#01b552; text-decoration:underline;}
table.table a.link:first-child {margin-top:0;}

table.table td a,
table.table td input,
table.table td select,
table.table td span.txt,
table.table td #egovComFileList {margin-left:5px;}

table.table td a:first-child,
table.table td input:first-child,
table.table td select:first-child,
table.table td span.txt:first-child,
table.table td #egovComFileList:first-child {margin-left:0px;}

/* table - cols */
table.table.cols {font-size:14px;}
table.table.cols thead th,
table.table.cols tbody td {text-align:center; border-left:1px solid #ddd;}
table.table.cols thead th:first-child,
table.table.cols tbody td:first-child {border-left:1;}

table.table.cols tbody tr:nth-child(even) {background:#f9fffc;}
table.table.cols tbody a.top-link {padding-left:40px; background:url("../images/top-link-icon.png") no-repeat 0px 1px;}
table.table.cols tbody a.lock-link {padding-left:20px; background:url("../images/lock.gif") no-repeat 0px 1px;}
.cols a:hover {text-decoration:underline;}

/* table - 상단고정 */
.hfixed-table {position:relative; padding-top:40px; margin-top:5px; border-bottom:1px solid #ddd;}
.hfixed-table .thead {position:absolute; left:0; top:0; right:0;}
.hfixed-table .thead > table {margin:0;}
.hfixed-table .tbody {overflow-y:scroll; overflow-x:hidden; height:100%;}
.hfixed-table .tbody > table {margin:0;}


/* 페이징 ====================*/
.paging-area {text-align:center; margin-top:20px;}
.paging-area ul {overflow:hidden; display:inline-block;}
.paging-area ul li {float:left; position:relative; margin-left:5px; width:25px; height:25px; border:1px solid #ddd; z-index:0;}
.paging-area ul li:first-child {margin-left:0px;}
.paging-area ul li a {overflow:hidden; display:block; line-height:25px; font-size:12px;}
/* 페이징 - hover */
.paging-area ul li.on,
.paging-area ul li:hover {background:#01b552; border:1px solid #01b552;}
.paging-area ul li.on a,
.paging-area ul li:hover a{color:#fff;}
.paging-area ul li[class*="page-"]:hover {border:1px solid #01b552; z-index:1;}
/* 페이징 - 좌우버튼 */
.paging-area ul li[class*="page-"] a {text-indent:-9999px;}
.paging-area ul li.page-prev2 {background:url("../images/pageing-icon.png") no-repeat 8px -20px;}
.paging-area ul li.page-prev {background:url("../images/pageing-icon.png") no-repeat  -34px -20px;}
.paging-area ul li.page-next {background:url("../images/pageing-icon.png") no-repeat  -71px -20px;}
.paging-area ul li.page-next2 {background:url("../images/pageing-icon.png") no-repeat -112px -20px;}
.paging-area ul li.page-prev2:hover {background:url("../images/pageing-icon.png") no-repeat 8px 7px;}
.paging-area ul li.page-prev:hover {background:url("../images/pageing-icon.png") no-repeat  -34px 7px;}
.paging-area ul li.page-next:hover {background:url("../images/pageing-icon.png") no-repeat  -71px 7px;}
.paging-area ul li.page-next2:hover {background:url("../images/pageing-icon.png") no-repeat -112px 7px;}


/* login-area ====================*/
.login-area {padding:50px 0;}
.login-area .login {position:relative; width:480px; margin:0 auto; font-size:14px; font-weight:500;}
.login-area .login label {display:block; margin-top:7px;}
.login-area .login label:after {content:""; display:block; clear:both;}
.login-area .login label span {display:block; float:left; width:52px; height:40px; margin-right:16px; line-height:40px; text-align:right; }
.login-area .login label input {float:left; width:300px; height:40px; padding:0 5px; background:#f8f8f8; border:1px solid #999;}
.login-area .login a.login-btn {position:absolute; right:0; top:0; display:block; width:103px; height:88px; line-height:88px; text-align:center; font-size:16px; color:#fff; background:#01b552; border:1px solid #01b552;  border-radius:3px; box-sizing:border-box;}
.login-area .login a.login-btn:hover {border:1px solid #009744; box-shadow: 0px 0px 10px 1px #ddd;}


/* 약관 ====================*/
textarea.terms {height:130px; padding:25px; margin-top:14px; font-size:12px; line-height:16px;}


/* 본인확인 ====================*/
.identification-area {}
.identification-area .box {padding:30px 25px; font-size:14px; line-height:18px;}
.identification-area .box {padding:30px 25px; font-size:14px; line-height:18px;}
.identification-area .info {background:url("../images/identification-icon.png") no-repeat 30px 30px;}
.identification-area .info dl {margin-left:128px;}
.identification-area .info dl dt {line-height:26px; font-size:24px; color:#01b552; margin-bottom:10px;}
.identification-area .info dl dd {}


/* 아이디찾기, 비밀번호찾기 ====================*/
.idpw-find {padding:50px;}
.idpw-find .form-find {width:402px; margin:0 auto;}
.idpw-find .form-find dl.formbox dt {width:72px; margin-right:30px; }


/* 조회영역 ====================*/
.search-area {position:relative; overflow:hidden; padding:10px 89px 10px 10px; margin:5px 0 20px 0; border:1px solid #e6e6e6; background:#f9f9f9;}
.search-area .row {margin-top:10px;}
.search-area .row:first-child {margin-top:0;}
.search-area .row:after {content:''; display:block; clear:both;}
.search-area .row .formbox {float:left; margin:0 0 0 20px; }
.search-area .row .formbox:first-child {margin:0px;} 
.search-area .btn-area {position:absolute; right:10px; top:10px; }
.search-area .btn-area a.btn-search {height:28px; line-height:25px; color:#fff; background:#333; border-radius:3px;}

.search-area.case01 {padding:10px;}

/* 메뉴관리 ====================*/
.menu-control {border:1px solid #ddd;}
.menu-control .menu-list:first-child {padding:20px;}

.menu-control .depth-menu {padding:20px; border-bottom:1px solid #ddd;}

.menu-control .menu-list p.title {margin-bottom:20px; text-align:center; font-weight:500; font-size:18px; line-height:20px;}
.menu-control .menu-list ul {}
.menu-control .menu-list ul li {position:relative; margin-top:-1px; border:1px solid #ddd; z-index:0;}
.menu-control .menu-list ul li a {display:block; padding:12px 20px 12px 20px; font-size:14px;}

.menu-control .menu-list ul li.on,
.menu-control .menu-list ul li:hover {background:url("../images/btn-tb-icons.png") no-repeat right 20px top -184px #f5faf7; border:1px solid #01b552;  z-index:1;}

.menu-control .menu-info {padding:60px 40px 40px 30px; border-left:1px solid #ddd;}
.menu-control .menu-info dt {width:60px; margin-right:20px;}


/* 댓글 ====================*/
.comment-area {margin-top:40px; }
.comment-area dl.comment {padding:20px 0; font-size:14px; border-top:1px solid #ddd;}
.comment-area dl.comment dt {margin-bottom:10px; font-weight:500;}
.comment-area dl.comment dt span.date {margin-left:5px; color:#666; font-weight:300;}
.comment-area dl.comment dt a.btn-tb {height:20px; line-height:18px; padding:0 5px; margin-left:5px;}
.comment-area dl.comment dd {line-height:18px; color:#333;}
.comment-area dl.comment dd:after {content:''; display:block; clear:both;}
.comment-area dl.comment dd textarea {float:left; width:calc(100% - 94px); padding:8px; box-sizing:border-box;}
.comment-area dl.comment .btn-comment {float:left; width:84px; height:56px; line-height:56px; padding:0; margin-left:10px; color:#fff; background:#01b552; border:1px solid #01b552; border-radius: 3px;}
.comment-area dl.comment .btn-comment:hover {border:1px solid #000;}

.comment-area .comment-input {overflow:hidden; padding:20px; background:#fafafa; border:1px solid #ddd;}
.comment-area .comment-input textarea {float:left; width:calc(100% - 104px); height:61px; margin-right:20px;}
.comment-area .comment-input .btn-comment {float:left; width:84px; height:61px; line-height:61px; padding:0; color:#fff; background:#666; border:1px solid #666; border-radius: 3px;}
.comment-area .comment-input .btn-comment:hover {border:1px solid #000;}


/* 파일업로드 ====================*/
.filebox input[type="file"] {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0; }
.filebox label {display: inline-block; padding: .5em .75em; color: #999; font-size: inherit; line-height: normal; vertical-align: middle; background-color: #fdfdfd; cursor: pointer; border: 1px solid #ebebeb; border-bottom-color: #e2e2e2; border-radius:3px;}
.filebox .upload-name { display: inline-block; padding: .5em .75em; font-size: inherit; font-family: inherit; line-height: normal; vertical-align: middle; background-color: #f5f5f5; border: 1px solid #ebebeb; border-bottom-color: #e2e2e2; border-radius:3px; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
/* 추가부분 */
.filebox input[type="file"] { position: absolute; width: 0; height: 0; padding: 0; overflow: hidden; border: 0; }
.filebox label {display: inline-block; height:23px; line-height:25px; padding:0 20px; color:#656565; vertical-align: middle; background-color: #fdfdfd; cursor: pointer; border: 1px solid #aaa; }
.filebox .upload-name {display: inline-block; height: 25px; width:350px; line-height:25px; font-size:12px;  padding: 0 10px; vertical-align: middle; background-color: #f5f5f5; border: 1px solid #aaa;}
.filebox.bs3-primary label {margin-left:5px; color: #fff; background-color: #01b552; border-color: #01b552; }
.filebox.bs3-primary label:hover {border-color:#034e25;}
#egovComFileList {display:inline-block;}
#egovComFileList:after {content:""; display:block; clear:both;}
#egovComFileList .file_add {line-height:28px; }
#egovComFileList .file_add:first-child {margin-left:0px;}
#egovComFileList .file_add span {float:left;}
#egovComFileList .file_add input[type="button"] {margin:0 0 0 5px !important;}


/* 게시판 신규 등록 알람 설정 ====================*/
.notice-alarm {}
.notice-alarm .info {background:url("../images/info-icon.png") no-repeat 48px 17px;}
.notice-alarm .info dl {margin-left:100px; padding: 30px 25px;}
.notice-alarm .info dl dt {line-height:26px; font-size:24px; color:#01b552; margin-bottom:10px;}
.notice-alarm .info dl dd {font-size:14px; line-height:23px;}


/* 공통코드관리 ====================*/
.code-management {border: 1px solid #ddd;}
.code-management .depth-code {padding:20px; border-bottom:1px solid #ddd;}
.code-management .col:first-child {padding:20px; border-right:1px solid #ddd;}
.code-management .col {padding:20px; }


/* 공통코드관리 ====================*/
.address-area {font-size:14px;}
.address-area .address-search {position:relative; margin-top:10px; border-bottom:1px solid #ddd;}
.address-area .address-search input {border:0; width:100%; padding-right:33fpx; box-sizing:border-box;}
.address-area .address-search a.search {position:absolute; right:0; top:0; display:block; width:28px; height:28px; background:url("../images/btn-tb-icons.png") no-repeat 6px -317px; text-indent:-99999px;}
.address-area dl.tip-list {margin-top:20px; }
.address-area dl.tip-list dt.tip {margin-top:0; font-weight:700;}
.address-area dl.tip-list dt.tip + dt {margin-top:0;}
.address-area dl.tip-list dt {margin-top:20px}
.address-area dl.tip-list dd {color:#01b552;}

/* 상세주소팝업 ====================*/
#add_pop { position:absolute; z-index:1; top:142px; left:137px; width:68%; height:180px; padding:10px; border:2px solid #b8d2e6; background-color:#ffffff; } 

.loadingImg {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100px;
    height: 100px;
    margin: -50px 0 0 -50px; /* width와 height의 절반만큼 이동 */
}
.text01{position:relative;color:#115DA4;background: url(../images/ico01.gif) no-repeat left center;padding:5px 0 5px 20px;text-align:left;font-size:19px;letter-spacing:-0.05em;font-weight:normal;font-family:NotoKR-Medium !important;}
.alignC{text-align: center !important;}
.alignL{text-align: left !important;}
.alignR{text-align: right !important;}

/* top */
.paTop15{padding-top:15px !important;}
.mgTop06{margin-top:6px !important;}
.mgTop12{margin-top:12px !important;}
.mgTop16{margin-top:16px !important;}
.mgTop18{margin-top:18px !important;}
.mgTop20{margin-top:20px !important;}
.mgTop30{margin-top:30px !important;}
.mgTop40{margin-top:40px !important;}
.mgTop50{margin-top:50px !important;}