@charset "utf-8";
@import url('https://fonts.googleapis.com/earlyaccess/notosanskr');
@import url(./reset.css);

/* common */
body { position: relative; min-width: 1400px; font-family: 'NanumSquare','Noto Sans KR', sans-serif; font-size: 12px; background: #dbdbdc url(../img/common/bg_body.png?v180629) repeat-y center top }
body.popup { min-width: initial; background: #fff; }
a { color: #000; text-decoration: none; }
input,
select { font-family: 'NanumSquare'; font-size: 12px; }

.site-wrap { position: relative; margin: 0 auto; width: 1400px; padding-top: 70px; }

/* button */
.btn-save { padding: 7px 10px; border: 0; background: #000000; color: #ffffff; font-family: 'NanumSquare'; font-size: 14px; cursor: pointer }
.btn-delete { padding: 7px 10px; border: 0; background: #f03d3d; color: #fff; font-family: 'NanumSquare'; font-size: 14px; cursor: pointer }
.btn-submit { padding: 7px 10px; border: 0; background: #000000; color: #d7eaee; font-family: 'NanumSquare'; font-size: 14px; cursor: pointer }
.btn-search  { display: inline-block; *display: inline; *zoom: 1; padding: 0 10px; border: 0; background: #000000; color: #ffffff; font-family: 'NanumSquare'; font-size: 12px; line-height: 24px; cursor: pointer }
.btn-common  { display: inline-block; *display: inline; *zoom: 1; padding: 0 10px;
    border: 0; background: #000000; color: #ffffff; font-family: 'NanumSquare'; font-size: 12px; line-height: 24px; cursor: pointer }


/* header */
.header { position: fixed; left: 0; top: 0; z-index: 3000; width: 100%; height: 70px; }
.header-content { position: relative; margin: 0 auto; width: 1400px; height: 70px; background: #000000; }
.header-logo { position: absolute; left: 30px; top: 17.5px; }
.header-navigation { position: absolute; left: 80px; top: 15px; }
.header-navigation li { float: left; }
.header-navigation li a { display: block; padding: 13px 13px; font-size: 15px; color: #ddd; }
.header-navigation li a.on,
.header-navigation li a:hover { color: #fff }

.header-admin { position: absolute; right: 40px; top: 15px; }
.header-admin li a { display: block; padding: 13px 20px; font-size: 15px; color: #ddd; }

/* container */
.container { position: relative; overflow: hidden; }
.container-navigation { position: fixed; left: 50%; top: 70px; bottom: 0; margin-left: -700px; width: 150px; background: #e7f6f0; border-right: 1px solid #e0e0e0; }
.container-navigation > div { padding: 40px; }
.container-navigation li + li { margin-top: 15px; }
.container-navigation li a { display: block; font-size: 14px; }
.container-article { float: right; width: 1230px; }

.content { padding: 40px; }

/* section */
.section { position: relative; }
.section-main h2 { position: relative; overflow: hidden; margin-bottom: 20px; }
.section-main h2 span.title { float: left; font-size: 16px; }
.section-main h2 span.date { float: right; color: #999 }

.section-main ul { position: relative; overflow: hidden; margin: -20px; }
.section-main li { float: left; width: 33.3333333%; }
.section-main li a { display: block; margin: 20px; padding: 20px; border: 1px solid #ddd; -webkit-transition: all .4s; -o-transition: all .4s; transition: all .4s; }
.section-main li a:hover { background: #f9f9f9; }
.section-main li h3 { margin-bottom: 20px; font-size: 20px; }
.section-main li p { font-size: 16px; color: #175c96 }

.section-title { position: relative; overflow: hidden; margin-bottom: 10px; font-size: 14px; }
.section-title .left { float: left; line-height: 34px; }
.section-title .right { float: right; }

.section-search { position: relative; margin-bottom: 20px; padding: 20px; background: #f9f9f9; border: 1px solid #ddd; }
.section-search ul { position: relative; overflow: hidden; }
.section-search li { float: left; }
.section-search li input,
.section-search li select { vertical-align: middle; }
.section-search li select { margin-right: 20px; }
.section-search li.last { float: right; }
.section-search li input.datepicker { width: 80px; }

.section-statistics a.link { text-decoration: underline; color: #3473a8 }

/* section-pagination */
.section-pagination { position: relative; margin-top: 20px; text-align: center; }
.section-pagination ul { display: inline-block; *display: inline; *zoom: 1; }
.section-pagination li { float: left; }
.section-pagination li a { display: block; margin-left: -1px; padding: 0 12px; min-width: 10px; height: 34px; line-height: 34px; color: #999; text-align: center; vertical-align: middle; border: 1px solid #e9e9e9 }
.section-pagination li a.on,
.section-pagination li a:hover { position: relative; border-color: #999; }

.section-title-alone { padding: 10px; text-align: left; font-size: 1.25em; font-weight: bold; border-bottom: 2px solid #383838;}
.section-title-alone-center { padding: 10px; text-align: center; font-size: 1.1em; font-weight: bold;}

/* table */
.section-table table { width: 100%; border-collapse: collapse; border-spacing: 0; border-top: 2px solid #000000; }
.section-table caption { padding: 10px; text-align: left; font-size: 1.25em; font-weight: bold; }
.section-table thead th { padding: 12px 0; border: 1px solid #e9e9e9; color: #383838; font-size: 14px; font-weight: 400; color: #757575; text-align: center; letter-spacing: -0.1em }
/*.section-table thead th + th { border-left: 1px solid #e9e9e9 }*/
.section-table thead a { color: #383838 }
.section-table thead th input { vertical-align: top }

/* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */
/*.section-table tfoot th,
.section-table tfoot td { padding: 10px 0; border-top: 1px solid #c1d1d5; border-bottom: 1px solid #c1d1d5; background: #d7e0e2; text-align: center }*/
.section-table tbody th { padding: 12px 0; border: 1px solid #e9e9e9; color: #383838; font-size: 14px; font-weight: 400; color: #757575; text-align: center; letter-spacing: -0.1em; vertical-align: middle }
.section-table td { padding: 8px 5px; border: 1px solid #e9e9e9; line-height: 1.5em; word-break: break-all; text-align: center; vertical-align: middle; }
.section-table td + td { border-left: 1px solid #e9e9e9 }


/* login */
.section-login { margin: 0 auto; padding: 60px 0; width: 570px; background: #f3f4f3; border: 1px solid #d3d3d3 }
.section-login .section-title { margin-bottom: 40px; font-weight: 700; text-align: center; }
.section-login .section-top { margin-bottom: 40px; text-align: center; }
.section-login .section-top p { margin-top: 10px; font-weight: bold; color: #333; }
.section-login fieldset { position: relative; margin: 0 auto; width: 278px; height: 78px; }
.section-login .input { display: inline-block; width: 175px; height: 28px; padding: 0 5px; outline: none; border: 1px solid #dedede; background: #fff; line-height: 1.6em; font-size: 1em; }
.section-login .input.login-id { border-bottom: 0; }
.section-login .btn-submit { position: absolute; right: 0; top: 0px; display: inline-block; width: 92px; height: 59px; outline: none; border: 1px solid #d3d3d3; background: #fff; font-size: 1em; font-weight: bold; vertical-align: top; cursor: pointer; color: #000 }


/* popup */
.section-popup { width: 300px; }
.section-popup .section-title { margin: 0; padding: 20px; background: #000; font-size: 18px; color: #fff }
.section-popup .section-content { padding: 20px; font-size: 14px; }
.section-popup .section-content .name { margin-bottom: 20px; font-size: 18px; font-weight: 600; }
.section-popup .section-content .list li { position: relative; color: #333 }
.section-popup .section-content .list li + li { margin-top: 10px; }
.section-popup .section-content .list dl { position: relative; padding-left: 100px; }
.section-popup .section-content .list dt { position: absolute; left: 0; top: 0; }

#setting-popup.setting-popup {width: 200px;text-align: center;}
#setting-popup.setting-popup a {padding: 20px 25px;color: #333;background: rgba(255,255,255,0.85);width: 100%;display: block;font-size: 15px;}
#setting-popup.setting-popup a.editpf {margin-bottom: 1px;border-radius: 3px 3px 0 0;}
#setting-popup.setting-popup a.list {margin-bottom: 1px;}
#setting-popup.setting-popup a.b-close {border-radius: 0 0 3px 3px;}
#setting-popup.setting-popup a:hover {text-decoration: none;background: #ffe9eb;}




/* table */
.section-banner table { width: 100%; border-collapse: collapse; border-spacing: 0; border-top: 2px solid #000000; }
.section-banner caption { padding: 10px; text-align: left; font-size: 1.25em; font-weight: bold; }
.section-banner thead th { padding: 12px 0; border: 1px solid #e9e9e9; color: #383838; font-size: 14px; font-weight: 400; color: #757575; text-align: center; letter-spacing: -0.1em }
/*.section-banner thead th + th { border-left: 1px solid #e9e9e9 }*/
.section-banner thead a { color: #383838 }
.section-banner thead th input { vertical-align: top }

/* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */
/*.section-banner tfoot th,
.section-banner tfoot td { padding: 10px 0; border-top: 1px solid #c1d1d5; border-bottom: 1px solid #c1d1d5; background: #d7e0e2; text-align: center }*/
.section-banner tbody th { padding: 12px 15px; border-top: 1px solid #e9e9e9; border: 1px solid #e9e9e9; background: #f9f9f9; vertical-align: middle; }
.section-banner tbody th span { margin-left: 5px; color: red; vertical-align: middle; }
.section-banner td { padding: 12px 15px; border: 1px solid #e9e9e9; line-height: 1.5em; word-break: break-all; vertical-align: middle; }
.section-banner td + td { border-left: 1px solid #e9e9e9 }

.section-banner input,
.section-banner textarea,
.section-banner select { margin: 0; padding: 5px; font-family: 'Noto Sans KR', sans-serif; font-size: 12px; }
.section-banner .field { width: 700px; outline: none; border: 1px solid #999; }

.section-banner .datepicker { width: 100px; border-radius: 0; }
.section-banner .timepicker { width: 50px; }

.section-banner .image { margin-top: 10px; padding-top: 10px; border-top: 1px solid #eee }
.section-banner .image img { display: block; }

.section-banner .button { margin-top: 20px; text-align: center; }
.section-banner .button input { padding: 10px 10px; width: 200px;  font-size: 18px;background: #000000; color: #ffffff }

.button { margin-top: 20px; text-align: center; }
.button input { padding: 10px 10px; width: 200px; font-size: 14px; background: #000000; color: #ffffff }

.th-title {font-size: 1.25em; font-weight: bold;}