/** Filename : style.css color **/
/* ================================== Font ================================== */
@import url(../font/NotoSansKR.css);
/* ================================== Reset ================================== */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, ins, kbd, q, s, samp, small, strike, strong, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, article, aside, canvas, details, embed, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; vertical-align: baseline; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

img, fieldset, form, label, legend, figure, figcaption, input, button { margin: 0; padding: 0; border: 0; vertical-align: middle; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

button::-moz-focus-inner, input[type=button]::-moz-focus-inner, input[type=submit]::-moz-focus-inner, input[type=reset]::-moz-focus-inner { padding: 0; border: 0; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; }

img { line-height: 0; font-size: 0; }

a { text-decoration: none; color: inherit; }

table { border-collapse: collapse; padding: 0; margin: 0; width: 100%; border: 0; }

em, i { font-style: normal; }

/* default.css reset */
body, h1, h2, h3, h4, h5, h6, input, button, textarea, select { font-family: "Noto Sans KR", sans-serif; }

.required, textarea.required { background-image: none !important; }

#container { float: none; margin: 0; font-size: initial; }

#gnb { background: transparent; }

/* ================================== Common ================================== */
a, a:hover, a:focus, a:active { text-decoration: none; }

#skipNav { position: absolute; left: 0; top: 0; width: 100%; z-index: 99999; }
#skipNav a { overflow: hidden; display: block; width: 1px; height: 1px; margin-bottom: -1px; color: #444; font-size: 0; text-decoration: none; }
#skipNav a:hover, #skipNav a:active, #skipNav a:focus { width: 100%; height: auto; padding: 9px 0; background: #303030; font-size: 20px; font-size: 2rem; text-align: center; color: #fff; }

caption, .hidden, legend { position: absolute; left: -10000px; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; }

input[placeholder]::-webkit-input-placeholder { color: #959595; font-size: 14px; font-size: 1.4rem; }
input[placeholder]:-moz-placeholder { color: #959595; font-size: 14px; font-size: 1.4rem; }
input[placeholder]::-moz-placeholder { color: #959595; font-size: 14px; font-size: 1.4rem; }
input[placeholder]:-ms-input-placeholder { color: #959595; font-size: 14px; font-size: 1.4rem; }
input[placeholder].placeholder { color: #959595; font-size: 14px; font-size: 1.4rem; }

html { font-size: 62.5%; /* Sets up the Base 10 stuff */ position: relative; min-height: 100%; overflow-y: auto; }

body { font-family: "Noto Sans KR", sans-serif; font-weight: 400; font-style: normal; font-size: 16px; font-size: 1.6rem; line-height: 1.4; letter-spacing: -0.05em; color: #222; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow-y: hidden; }

html, body { overflow-x: hidden; }

.srOnly { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; }

button { font-family: inherit; cursor: pointer; }

h1, h2, h3, h4, h5, h6 { font-weight: 400; }

table { width: 100%; border: 0; padding: 0; margin: 0; border-collapse: collapse; }

input[type="text"], input[type="password"], textarea { width: 100%; appearance: none; -webkit-appearance: none; -moz-appearance: none; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; border-radius: 0; font-family: inherit; border: 1px solid #d1d1d1; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

input[type="text"], input[type="password"] { padding: 0 10px; height: 32px; line-height: 32px; }

input[type="file"] { width: 100%; font-family: inherit; }

textarea { height: auto; padding: 10px; }

select { height: 32px; line-height: 26px; padding: 4px 5px 4px 5px; font-family: inherit; vertical-align: middle; border: 1px solid #d1d1d1; border-radius: 0px; }

input[type="text"], input[type="password"], input[type="file"], textarea, select { color: #666; font-size: 14px; font-size: 1.4rem; line-height: 1.5; letter-spacing: -0.02em; }

.fileInputBox { position: relative; width: 100%; height: 32px; overflow: hidden; padding-right: 80px; cursor: pointer; }
.fileInputBox .ottBtn { position: absolute; top: 0; right: 0; margin: 0; }
.fileInputBox .ottBtn.btnSm > * { min-width: 78px; }
.fileInputBox input[type="file"] { position: absolute; right: 0px; top: 0px; opacity: 0; height: 32px; line-height: 32px; filter: alpha(opacity=0); -ms-filter: "alpha(opacity=0)"; -khtml-opacity: 0; -moz-opacity: 0; }

/* font color */
.fcRed { color: #e1002a !important; }

.fcOrange { color: #ef7706 !important; }

/* align */
.clear:after { content: ""; display: block; clear: both; }

.fl { float: left !important; }

.fr { float: right !important; }

.fn { float: none !important; }

.cb { clear: both !important; }

.tl { text-align: left !important; }

.tc { text-align: center !important; }

.tr { text-align: right !important; }

.db { display: block !important; }

.dib { display: inline-block !important; }

/* margin */
.mg0 { margin: 0 !important; }

.mgt0 { margin-top: 0px !important; }

.mgb0 { margin-bottom: 0px !important; }

.mgr0 { margin-right: 0px !important; }

.mgl0 { margin-left: 0px !important; }

.mgt5 { margin-top: 5px !important; }

.mgb5 { margin-bottom: 5px !important; }

.mgr5 { margin-right: 5px !important; }

.mgl5 { margin-left: 5px !important; }

.mgt10 { margin-top: 10px !important; }

.mgb10 { margin-bottom: 10px !important; }

.mgr10 { margin-right: 10px !important; }

.mgl10 { margin-left: 10px !important; }

.mgt15 { margin-top: 15px !important; }

.mgb15 { margin-bottom: 15px !important; }

.mgr15 { margin-right: 15px !important; }

.mgl15 { margin-left: 15px !important; }

.mgt20 { margin-top: 20px !important; }

.mgb20 { margin-bottom: 20px !important; }

.mgr20 { margin-right: 20px !important; }

.mgl20 { margin-left: 20px !important; }

.mgt25 { margin-top: 25px !important; }

.mgb25 { margin-bottom: 25px !important; }

.mgr25 { margin-right: 25px !important; }

.mgl25 { margin-left: 25px !important; }

.mgt30 { margin-top: 30px !important; }

.mgb30 { margin-bottom: 30px !important; }

.mgr30 { margin-right: 30px !important; }

.mgl30 { margin-left: 30px !important; }

.mgt35 { margin-top: 35px !important; }

.mgb35 { margin-bottom: 35px !important; }

.mgr35 { margin-right: 35px !important; }

.mgl35 { margin-left: 35px !important; }

.mgt40 { margin-top: 40px !important; }

.mgb40 { margin-bottom: 40px !important; }

.mgr40 { margin-right: 40px !important; }

.mgl40 { margin-left: 40px !important; }

.mgt45 { margin-top: 45px !important; }

.mgb45 { margin-bottom: 45px !important; }

.mgr45 { margin-right: 45px !important; }

.mgl45 { margin-left: 45px !important; }

.mgt50 { margin-top: 50px !important; }

.mgb50 { margin-bottom: 50px !important; }

.mgr50 { margin-right: 50px !important; }

.mgl50 { margin-left: 50px !important; }

/* padding */
.pdtb0 { padding-top: 0 !important; padding-bottom: 0 !important; }

.pdrl0 { padding-right: 0 !important; padding-left: 0 !important; }

.pdt0 { padding-top: 0px !important; }

.pdb0 { padding-bottom: 0px !important; }

.pdr0 { padding-right: 0px !important; }

.pdl0 { padding-left: 0px !important; }

.pdt5 { padding-top: 5px !important; }

.pdb5 { padding-bottom: 5px !important; }

.pdr5 { padding-right: 5px !important; }

.pdl5 { padding-left: 5px !important; }

.pdt10 { padding-top: 10px !important; }

.pdb10 { padding-bottom: 10px !important; }

.pdr10 { padding-right: 10px !important; }

.pdl10 { padding-left: 10px !important; }

.pdt15 { padding-top: 15px !important; }

.pdb15 { padding-bottom: 15px !important; }

.pdr15 { padding-right: 15px !important; }

.pdl15 { padding-left: 15px !important; }

.pdt20 { padding-top: 20px !important; }

.pdb20 { padding-bottom: 20px !important; }

.pdr20 { padding-right: 20px !important; }

.pdl20 { padding-left: 20px !important; }

.pdt25 { padding-top: 25px !important; }

.pdb25 { padding-bottom: 25px !important; }

.pdr25 { padding-right: 25px !important; }

.pdl25 { padding-left: 25px !important; }

.pdt30 { padding-top: 30px !important; }

.pdb30 { padding-bottom: 30px !important; }

.pdr30 { padding-right: 30px !important; }

.pdl30 { padding-left: 30px !important; }

.pdt35 { padding-top: 35px !important; }

.pdb35 { padding-bottom: 35px !important; }

.pdr35 { padding-right: 35px !important; }

.pdl35 { padding-left: 35px !important; }

.pdt40 { padding-top: 40px !important; }

.pdb40 { padding-bottom: 40px !important; }

.pdr40 { padding-right: 40px !important; }

.pdl40 { padding-left: 40px !important; }

.pdt45 { padding-top: 45px !important; }

.pdb45 { padding-bottom: 45px !important; }

.pdr45 { padding-right: 45px !important; }

.pdl45 { padding-left: 45px !important; }

.pdt50 { padding-top: 50px !important; }

.pdb50 { padding-bottom: 50px !important; }

.pdr50 { padding-right: 50px !important; }

.pdl50 { padding-left: 50px !important; }

/* ================================== Layout ================================== */
#wrap { position: relative; }

#container { width: 100%; min-height: 780px; padding-bottom: 80px; -ms-word-break: keep-all; word-break: keep-all; background: #fff; }
#container.bgGray { background: #f0f0f0; }
#container > .inner { position: relative; max-width: 1260px; min-width: 1260px; margin: 0 auto; padding-left: 30px; padding-right: 30px; }
#container > * > .inner { position: relative; max-width: 1260px; min-width: 1260px; margin: 0 auto; padding-left: 30px; padding-right: 30px; }

.title { position: relative; padding: 37px 0 33px; }
.title > .inner { position: relative; max-width: 1260px; min-width: 1260px; margin: 0 auto; padding-left: 30px; padding-right: 30px; }
.title h2 { text-align: center; color: #000; font-size: 40px; font-size: 4rem; font-weight: 700; }
.title .breadclumb { position: absolute; right: 30px; top: 20px; display: block; width: auto; height: auto; }
.title .breadclumb:before, .title .breadclumb:after { content: ""; display: table; }
.title .breadclumb:after { clear: both; }
.title .breadclumb li { position: relative; float: left; padding-left: 21px; color: #333; font-size: 13px; font-size: 1.3rem; }
.title .breadclumb li:before { content: ''; position: absolute; left: 10px; top: 7px; display: block; width: 3px; height: 5px; background: url("../img/common/icon_breadclumb_arrow.png") no-repeat center center; }
.title .breadclumb li:first-child { padding-left: 0; }
.title .breadclumb li:first-child:before { display: none; }
.title .breadclumb li:first-child a { display: block; }
.title .breadclumb li:first-child a:before { content: ''; display: inline-block; width: 15px; height: 15px; vertical-align: top; margin: 1px 4px 0 0; background: url("../img/common/icon_breadclumb_home.png") no-repeat center center; }

/* ================================== Header ================================== */
#header { position: relative; border-bottom: 1px solid #ddd; background: #fff; }
#header > .inner { position: relative; max-width: 1260px; min-width: 1260px; width: 100%; height: 101px; margin: 0 auto; padding: 0 30px; text-align: center; }
#header .headerLogo { position: absolute; left: 31px; top: 18px; display: block; width: auto; height: auto; }
#header .headerLogo a { display: block; width: 131px; height: 61px; background: url("../img/common/logo_header.png") no-repeat center center; background-size: cover; }
#header #gnb { margin-left: 284px; }
#header #gnb .depth1 { display: table; }
#header #gnb .depth1 > li { display: table-cell; }
#header #gnb .depth1 > li > a { display: block; height: 101px; line-height: 101px; padding: 0 50px; text-align: center; color: #000; font-size: 18px; font-size: 1.8rem; font-weight: 500; }
#header #gnb .depth1 > li > a:hover { color: #ef7706; }
#header #gnb .depth1 > li.isActive > a { color: #ef7706; }
#header .utilMenu { position: absolute; right: 17px; top: 42px; display: block; width: auto; height: auto; color: #777; font-size: 13px; font-size: 1.3rem; }
#header .utilMenu:before, #header .utilMenu:after { content: ""; display: table; }
#header .utilMenu:after { clear: both; }
#header .utilMenu li { position: relative; float: left; padding: 0 13px; }
#header .utilMenu li:before { content: ''; position: absolute; left: 0; top: 4px; display: block; width: 1px; height: 11px; background: #c2c2c2; }
#header .utilMenu li:first-child:before { display: none; }

/* ================================== Footer ================================== */
#footer { position: relative; padding: 34px 0 36px; border-top: 1px solid #ddd; background: #fff; }
#footer > .inner { position: relative; max-width: 1260px; min-width: 1260px; width: 100%; margin: 0 auto; padding: 0 30px; }
#footer > .inner:before, #footer > .inner:after { content: ""; display: table; }
#footer > .inner:after { clear: both; }
#footer > .inner > * { float: left; }
#footer .footerLogo { position: absolute; right: 30px; top: -12px; display: block; width: auto; height: auto; }
#footer .footerLogo a { display: block; width: 115px; height: 46px; background: url("../img/common/logo_footer.png") no-repeat center center; background-size: cover; }
#footer address { color: #999; font-size: 13px; font-size: 1.3rem; font-style: normal; }
#footer address > * { padding: 3px 0; }
#footer address .address { display: inline-block; padding-right: 30px; }
#footer address .address em { color: #454545; padding-right: 6px; font-style: normal; }

/* ================================== Layout ================================== */
#loginWrap { position: relative; width: 100%; height: 100vh; background: url("../img/login/bg_login.jpg") no-repeat center center; background-size: cover; }
#loginWrap .headerLogo { position: absolute; left: 50%; top: 77px; display: block; width: auto; height: auto; margin-left: 675px; }
#loginWrap .headerLogo a { display: block; width: 141px; height: 66px; background: url("../img/login/logo_login.png") no-repeat center center; background-size: cover; }

#loginBox { position: absolute; left: 50%; top: 293px; display: block; width: 370px; height: auto; margin-left: 261px; padding: 10px; text-align: center; color: #fff; }
#loginBox .greeting { font-size: 32px; font-size: 3.2rem; font-weight: 300; }
#loginBox .greeting strong { font-weight: 700; }
#loginBox input[type="text"], #loginBox input[type="password"] { height: 46px; line-height: 46px; padding-left: 60px; color: #000; font-size: 16px; font-size: 1.6rem; box-shadow: 1px 2px 2px rgba(67, 93, 97, 0.2) inset; -moz-box-shadow: 1px 2px 2px rgba(67, 93, 97, 0.2) inset; -webkit-box-shadow: 1px 2px 2px rgba(67, 93, 97, 0.2) inset; border-radius: 4px; }
#loginBox .inpId, #loginBox .inpPw { position: relative; margin-top: 10px; }
#loginBox .inpId:before, #loginBox .inpPw:before { content: ''; position: absolute; left: 26px; top: 50%; display: block; width: 22px; height: 22px; margin-top: -11px; }
#loginBox .inpId:before { background: url("../img/login/icon_id.png") no-repeat center center; }
#loginBox .inpPw:before { background: url("../img/login/icon_pw.png") no-repeat center center; }
#loginBox input[type="checkbox"].chkLogin { opacity: 0; position: absolute; width: get-half(56px); height: get-half(56px); margin: 0; }
#loginBox input[type="checkbox"].chkLogin + label { font-size: 14px; font-size: 1.4rem; cursor: pointer; }
#loginBox input[type="checkbox"].chkLogin + label i { position: relative; display: inline-block; width: 17px; height: 17px; margin: -4px 6px 0; vertical-align: middle; border: 1px solid #fff; }
#loginBox input[type="checkbox"].chkLogin + label i:before { display: none; }
#loginBox input[type="checkbox"].chkLogin:checked + label i:before { content: ''; position: absolute; left: 0; top: 1px; display: block; width: 17px; height: 13px; background: url("../img/login/icon_check.png") no-repeat center center; }
#loginBox .saveId { text-align: right; margin-top: 11px; padding-right: 2px; }
#loginBox .btnLogin { position: relative; display: inline-block; width: 100%; vertical-align: top; margin-top: 20px; background: transparent; }
#loginBox .btnLogin > * { display: inline-block; min-width: 100%; text-align: center; color: #fff; height: 51px; line-height: 51px; font-size: 20px; font-size: 2rem; box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.2); -moz-box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.2); border-radius: 4px; background: url("../img/login/btn_login.jpg") no-repeat center center; background-size: cover; cursor: pointer; }
#loginBox .note { margin-top: 30px; font-size: 14px; font-size: 1.4rem; font-weight: 300; line-height: 1.6; }

/* ================================== Main ================================== */
#container.main { padding-bottom: 40px; background: #f0f0f0 url("../img/main/bg_mono.jpg") repeat-y center bottom; background-size: 100% 362px; }

/***** main visual *****/
.visualArea { position: relative; width: 100%; background: url("../img/main/bg_visual.jpg") no-repeat center center; background-size: cover; }
.visualArea > .inner { position: relative; max-width: 1260px; min-width: 1260px; width: 100%; height: 560px; margin: 0 auto; padding: 0 30px; text-align: center; }
.visualArea .slogan { position: absolute; left: 60px; top: 142px; display: block; width: auto; height: auto; text-align: left; color: #fff; font-size: 42px; font-size: 4.2rem; line-height: 1.2; text-shadow: 0 0 10px rgba(0, 0, 0, 0.55); }
.visualArea .slogan strong { font-size: 48px; font-size: 4.8rem; font-weight: 700; }

/***** main content *****/
.mContent { position: relative; width: 100%; }
.mContent > .inner { position: relative; max-width: 1260px; min-width: 1260px; width: 100%; min-height: 362px; margin: 0 auto; padding-left: 30px; padding-right: 30px; }

/* mContCnt */
.mContCnt { position: relative; margin-top: -109px; margin-right: -2000px; height: 260px; background: #f5f5f5; box-shadow: 1px 5px 15px rgba(0, 0, 0, 0.1); -moz-box-shadow: 1px 5px 15px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 1px 5px 15px rgba(0, 0, 0, 0.1); }
.mContCnt:before, .mContCnt:after { content: ""; display: table; }
.mContCnt:after { clear: both; }
.mContCnt > .mConBox { position: relative; float: left; width: 400px; height: 100%; }
.mContCnt > .mConBox.dashboard { padding: 80px 0 0 214px; background: #fff; }
.mContCnt > .mConBox.dashboard:before { content: ''; position: absolute; left: 50px; top: 72px; display: block; width: 133px; height: 133px; border-radius: 50%; }
.mContCnt > .mConBox.dashboard.card:before { background: #ebebeb url("../img/main/icon_dashboard_card.png") no-repeat center center; }
.mContCnt > .mConBox.dashboard.order:before { background: #ebebeb url("../img/main/icon_dashboard_order.png") no-repeat center center; }
.mContCnt > .mConBox.dashboard.order:after { content: ''; position: absolute; left: 0; top: 34px; display: block; width: 1px; height: auto; bottom: 0; background: url("../img/main/dot_dashboard_order.png") repeat-y left top; }
.mContCnt > .mConBox.dashboard h3 { position: absolute; left: 0; top: -13px; display: block; width: 150px; height: 44px; line-height: 44px; padding-right: 19px; text-align: center; color: #fff; font-size: 18px; font-size: 1.8rem; background: url("../img/main/bg_tit_dashboard.png") no-repeat center center; }
.mContCnt > .mConBox.dashboard dl dt { padding-bottom: 2px; color: #333; font-size: 16px; font-size: 1.6rem; font-weight: 500; }
.mContCnt > .mConBox.dashboard dl dd { padding-bottom: 6px; color: #ef7706; font-size: 22px; font-size: 2.2rem; font-weight: 500; }
.mContCnt > .mConBox.dashboard dl dd span { color: #666; font-size: 15px; font-size: 1.5rem; }
.mContCnt > .mConBox.notice { padding: 32px 0 0 30px; }
.mContCnt > .mConBox.notice h3 { color: #1f1f1f; font-size: 22px; font-size: 2.2rem; font-weight: 700; }
.mContCnt > .mConBox.notice ul { margin-top: 16px; }
.mContCnt > .mConBox.notice ul li { position: relative; padding: 4px 84px 4px 0; color: #454545; font-size: 15px; font-size: 1.5rem; }
.mContCnt > .mConBox.notice ul li a { color: #454545; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }
.mContCnt > .mConBox.notice ul li .date { position: absolute; right: 0; top: 50%; display: block; width: auto; height: auto; transform: translate(0, -50%); -ms-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); text-align: right; color: #959595; font-weight: 300; }
.mContCnt > .mConBox.notice .moreBtn { position: absolute; right: -10px; top: 31px; display: block; width: 34px; height: 34px; background: url("../img/main/btn_more.png") no-repeat center center; }

/* useGuide */
.useGuide { position: relative; margin-top: 40px; padding-left: 243px; border: 5px solid #f79609; background: #f79609 url("../img/main/bg_use_guide.png") no-repeat 135px bottom; }
.useGuide h3 { position: absolute; left: 75px; top: 50%; display: block; width: auto; height: auto; margin-top: -18px; color: #fff; font-size: 25px; font-size: 2.5rem; font-weight: 700; }
.useGuide ol { display: table; width: 100%; background: #fff; }
.useGuide ol li { position: relative; display: table-cell; height: 120px; padding-left: 170px; vertical-align: middle; color: #454545; font-size: 15px; font-size: 1.5rem; }
.useGuide ol li:first-child { width: 340px; }
.useGuide ol li:before { content: ''; position: absolute; left: 75px; top: 50%; display: block; width: 70px; height: 42px; margin-top: -21px; background: url("../img/main/num_use_guide.png") no-repeat 0 center; }
.useGuide ol li.num1:before { background-position: 0 center; }
.useGuide ol li.num2:before { background-position: -70px center; }

/* ================================== board Contents ================================== */
.searchBox { margin-bottom: 30px; padding: 24px; text-align: center; border: 1px solid #cdcdcd; background: #f7f7f7; }
.searchBox .inner { position: relative; max-width: 492px; padding-right: 60px; margin: 0 auto; }
.searchBox .inner.inSelect { padding-left: 112px; }
.searchBox .inner.inSelect.inPeriod { max-width: 780px; padding-left: 400px; }
.searchBox .inner.inSelect.inPeriod .period { position: absolute; top: 0; left: 0; width: 266px; }
.searchBox .inner.inSelect.inPeriod .period input { width: auto; }
.searchBox .inner.inSelect.inPeriod select { left: 288px; }
.searchBox select { position: absolute; top: 0; left: 0; width: 110px; }
.searchBox input { width: 100%; }
.searchBox .ottBtn { position: absolute; top: 0; right: 0; display: block; width: 58px; margin: 0; }
.searchBox + .boardTop { margin-top: -11px; }

.boardTop:before, .boardTop:after { content: ""; display: table; }
.boardTop:after { clear: both; }
.boardTop > * { padding: 8px 0; color: #333; font-size: 14px; font-size: 1.4rem; letter-spacing: 0; }
.boardTop > * em { color: #ef7706; }
.boardTop > * i { padding: 0 5px; color: #959595; font-size: 12px; font-size: 1.2rem; font-weight: 300; }
.boardTop > *.legend { font-weight: 300; }
.boardTop > *.legend > *:before { content: ''; display: inline-block; width: 14px; height: 14px; margin: -2px 4px 0 12px; vertical-align: middle; border-radius: 50%; }
.boardTop > *.legend > *.legMod:before { background: #9ad4fe; }
.boardTop > *.legend > *.legDel:before { background: #ffb1c5; }

.boardList { border-top: 2px solid #333; }
.boardList.fix table { table-layout: fixed; }
.boardList th, .boardList td { padding: 14px 10px; text-align: center; color: #666; font-size: 15px; font-size: 1.5rem; border-bottom: 1px solid #cdcdcd; border-left: 1px solid #cdcdcd; }
.boardList th:first-child, .boardList td:first-child { border-left: none; }
.boardList thead th { padding: 14px 10px 15px; color: #333; font-size: 14px; font-size: 1.4rem; font-weight: 500; border-bottom: 1px solid #333; background: #f8f8f8; }
.boardList .subject { padding-left: 40px; padding-right: 40px; text-align: left; }
.boardList .subject a { color: #666; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }
.boardList .inBtn { padding: 4px 10px; }
.boardList .noData { padding-top: 120px; padding-bottom: 120px; text-align: center; background: #f8f8f8; }

.boardWrite { border-top: 2px solid #333; }
.boardWrite table { width: 100%; border: 0; padding: 0; margin: 0; border-collapse: collapse; }
.boardWrite th, .boardWrite td { padding: 8px 24px; text-align: left; color: #666; font-size: 14px; font-size: 1.4rem; border-bottom: 1px solid #cdcdcd; border-left: 1px solid #cdcdcd; background: #fff; }
/* .boardWrite th:first-child, .boardWrite td:first-child { border-left: none; } */
.boardWrite th:first-child, .boardWrite td:first-child { border-left: ; }
.boardWrite th { padding: 13px 10px 14px; text-align: center; vertical-align: middle; color: #333; font-size: 14px; font-size: 1.4rem; font-weight: 500; background: #f8f8f8; }
.boardWrite th label { position: relative; }
.boardWrite th label .required:before { content: '*'; position: absolute; right: -12px; top: 4px; display: block; width: 12px; height: 12px; color: #e1002a; }
.boardWrite td p + p { margin-top: 4px; }
.boardWrite textarea { margin-bottom: -5px; }
.boardWrite input[type="radio"] + label, .boardWrite input[type="checkbox"] + label { padding: 0 8px 0 4px; }
.boardWrite .widHalf { width: 49.8%; }
.boardWrite .widQuarter { width: 24.74%; }

.boardDetail { border-top: 2px solid #333; }
.boardDetail table { width: 100%; border: 0; padding: 0; margin: 0; border-collapse: collapse; }
.boardDetail th, .boardDetail td { padding: 14px 24px; text-align: left; color: #666; font-size: 15px; font-size: 1.5rem; border-bottom: 1px solid #cdcdcd; border-left: 1px solid #cdcdcd; }
.boardDetail th:first-child, .boardDetail td:first-child { border-left: none; }
.boardDetail th { padding: 13px 10px 14px; text-align: center; vertical-align: middle; color: #333; font-size: 14px; font-size: 1.4rem; font-weight: 500; background: #f8f8f8; }
.boardDetail .content { padding: 34px 24px; }

.noticeDetail { border-top: 2px solid #333; }
.noticeDetail h3 { padding: 20px 40px; color: #333; font-size: 20px; font-size: 2rem; font-weight: 500; background: #f8f8f8; border-bottom: 1px solid #cdcdcd; }
.noticeDetail .noticeInfo { padding: 10px 40px; color: #333; font-size: 15px; font-size: 1.5rem; border-bottom: 1px solid #cdcdcd; }
.noticeDetail .noticeInfo:before, .noticeDetail .noticeInfo:after { content: ""; display: table; }
.noticeDetail .noticeInfo:after { clear: both; }
.noticeDetail .detailContent { padding: 40px; color: #666; font-size: 15px; font-size: 1.5rem; border-bottom: 1px solid #cdcdcd; word-break: initial; }
.noticeDetail .atchFile { margin-top: -1px; padding: 0 40px; color: #333; font-size: 15px; font-size: 1.5rem; border-bottom: 1px solid #cdcdcd; }
.noticeDetail .atchFile > * { position: relative; display: block; padding-bottom: 10px; }
.noticeDetail .atchFile > *:first-child { padding-top: 10px; }

.bbsPrevNext { margin-top: 30px; border-top: 1px solid #333; border-bottom: 1px solid #333; }
.bbsPrevNext li { position: relative; padding: 10px 40px 10px 170px; color: #666; font-size: 15px; font-size: 1.5rem; border-top: 1px solid #cdcdcd; }
.bbsPrevNext li:first-child { border-top: none; }
.bbsPrevNext li span { position: absolute; left: 0; top: 11px; display: block; width: 120px; height: auto; text-align: center; color: #333; font-size: 14px; font-size: 1.4rem; font-weight: 500; }
.bbsPrevNext li a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }

.ottButton { margin-top: 20px; text-align: center; }
.ottButton:before, .ottButton:after { content: ""; display: table; }
.ottButton:after { clear: both; }
.ottButton .ottBtn { margin-left: 3px; }
.ottButton .ottBtn:first-child { margin-left: 0; }
.ottButton > .floatL, .ottButton > .floatR { float: left; }
.ottButton > .floatL .ottBtn, .ottButton > .floatR .ottBtn { float: left; }
.ottButton > .floatR { float: right; }

.ottBtn { position: relative; display: inline-block; vertical-align: top; margin: 5px 0; }
.ottBtn > * { display: inline-block; min-width: 130px; height: 42px; line-height: 40px; padding: 0 10px; text-align: center; color: #777; font-size: 15px; font-size: 1.5rem; font-weight: 500; background: #fff; border: 1px solid #bababa; cursor: pointer; }
.ottBtn.btnGray > * { color: #fff; background: #7d7d7d; border: 1px solid #7d7d7d; }
.ottBtn.btnOrange > * { color: #fff; background: #ef7706; border: 1px solid #ef7706; }
.ottBtn.btnDark > * { color: #fff; background: #2b2d33; border: 1px solid #2b2d33; }
.ottBtn.btnLg > * { min-width: 380px; height: 50px; line-height: 48px; font-size: 18px; font-size: 1.8rem; }
.ottBtn.btnMd > * { min-width: 130px; height: 42px; line-height: 40px; font-size: 15px; font-size: 1.5rem; }
.ottBtn.btnSm > * { min-width: 58px; height: 32px; line-height: 30px; font-size: 14px; font-size: 1.4rem; font-weight: 500; }
.ottBtn .inIcon { display: inline-block; width: 20px; height: 20px; vertical-align: middle; margin: -2px 8px 0 0; }
.ottBtn .inIcon.orderEnd { background: url("../img/board/icon_btn_end.png") no-repeat center center; }
.ottBtn .inIcon.orderQuestion { background: url("../img/board/qu_icon.png") no-repeat center center; }

.pagination { overflow: hidden; margin-top: 30px; text-align: center; font-size: 0; }
.pagination:before, .pagination:after { content: ""; display: table; }
.pagination:after { clear: both; }
.pagination li { display: inline-block; }
.pagination li > * { overflow: hidden; display: block; width: 29px; height: 29px; margin-left: -1px; vertical-align: top; color: #666; font-size: 15px; font-size: 1.5rem; line-height: 29px; text-decoration: none; border: 1px solid #fff; background: #fff; }
.pagination li.first > *, .pagination li.prev > *, .pagination li.next > *, .pagination li.last > * { border: 1px solid #bababa; }
.pagination li.first > *:before, .pagination li.prev > *:before, .pagination li.next > *:before, .pagination li.last > *:before { content: ''; display: inline-block; width: 27px; height: 27px; background: #fff url("../img/board/icon_pagination.png") no-repeat 0 center; background-size: auto 100%; }
.pagination li.first { padding-right: 15px; }
.pagination li.first > *:before { background-position: 0px center; }
.pagination li.first + .prev { margin-left: -15px; }
.pagination li.prev { padding-right: 15px; }
.pagination li.prev > *:before { background-position: -30px center; }
.pagination li.next { padding-left: 15px; }
.pagination li.next > *:before { background-position: -60px center; }
.pagination li.next + .last { margin-left: -15px; }
.pagination li.last { padding-left: 15px; }
.pagination li.last > *:before { background-position: -90px center; }
.pagination li.currentPage > * { color: #fff; border: 1px solid #f07605; background: #f07605; }

/* ================================== Contents ================================== */
.modifyBox { width: 620px; margin: 0 auto -30px; padding: 30px 120px 60px; background: #fff; }
.modifyBox label, .modifyBox input { display: block; }
.modifyBox label { padding: 15px 0 6px; color: #333; font-size: 18px; font-size: 1.8rem; font-weight: 500; }
.modifyBox input[type="text"], .modifyBox input[type="password"] { font-size: 16px; font-size: 1.6rem; height: 50px; line-height: 50px; }
.modifyBox input[type="text"]:read-only, .modifyBox input[type="password"]:read-only { background: #f0f0f0; }
.modifyBox .guide { margin-top: 10px; color: #999; font-size: 14px; font-size: 1.4rem; font-weight: 300; }
.modifyBox .guide em { color: #454545; font-weight: 400; }
.modifyBox .ottBtn { width: 100%; margin: 4px 0; margin-left: 0; }
.modifyBox .ottBtn > * { min-width: 100%; }

/* ================================== popup ================================== */
.popupWrap { display: block; position: fixed; left: 0; top: 0; right: 0; bottom: 0; min-width: 100%; min-height: 100%; background: rgba(0, 0, 0, 0.7); z-index: 998; }

.popupBox { position: absolute; left: 50%; top: 50%; display: block; width: auto; height: auto; padding: 50px; border: 1px solid #cdcdcd; background: #f7f7f7; transform: translate(-50%, 0); z-index: 999; }
.popupBox.message { text-align: center; width: 500px; min-height: 360px; margin-top: -180px; }
.popupBox.table { width: 1200px; min-height: 780px; margin-top: -390px; }

.popupClose { position: absolute; right: 10px; top: 10px; display: block; width: 28px; height: 28px; background: url("../img/popup/icon_pop_close.png") no-repeat center center; }

.popupCloseSolo { position: absolute; right: 10px; top: 10px; display: block; width: 28px; height: 28px; background: url("../img/popup/icon_pop_close.png") no-repeat center center; }

.popupContent .note { padding: 30px 0; color: #111; font-size: 20px; font-size: 2rem; }
.popupContent .note.row1 { margin-top: 35px; }
.popupContent .note.row2 { margin-top: 20px; }
.popupContent .note + .fileInputBox { margin-top: -10px; }
.popupContent .fileInputBox + .atch { margin-top: 15px; }
.popupContent .atch { color: #666; font-size: 14px; font-size: 1.4rem; font-weight: 300; }
.popupContent .atch a { color: #ef7706; font-size: 15px; font-size: 1.5rem; font-weight: 500; }
.popupContent .boardWrite { overflow: auto; height: 560px; }

/* ================================== dataTable ================================== */
.dataTable { overflow: auto; height: 560px; border-top: 2px solid #333; background: #e0e0e0; }
.dataTable.fix table { table-layout: fixed; }
.dataTable.wid2x table { width: 200%; }
.dataTable th, .dataTable td { padding: 10px 10px; text-align: center; color: #666; font-size: 13px; font-size: 1.3rem; border-bottom: 1px solid #cdcdcd; border-left: 1px solid #cdcdcd; background: #fff; }
/*.dataTable th:first-child, .dataTable td:first-child { border-left: none; } */
.dataTable th:first-child, .dataTable td:first-child { border-left: ; }
.dataTable thead th { padding: 10px 10px; color: #333; font-size: 14px; font-size: 1.4rem; font-weight: 500; border-top: 1px solid #cdcdcd; border-bottom: none; background: #f8f8f8; }
.dataTable thead tr:first-child > * { border-top: none; }
.dataTable tbody tr:first-child > * { border-top: 1px solid #333; }
.dataTable .modRow > * { background: #def0fd; }
.dataTable .delRow > * { background: #ffe7ed; }
.dataTable .errRow > * { background: #f0f0f0; }
.dataTable .modfLog > * { background: #b3a08f; }
/*.dataTable .errCate { padding: 0; background: #d0d0d0; } */
.dataTable .errCate { padding: 0; background: #d4aeae; }
.dataTable .errCate > * { display: block; width: 100%; height: 57px; }
.dataTable .errCate1 { padding: 0; background: #d4aeae; }
.dataTable .errCate1 > * { display: block; width: 100%; height: 57px; }
.dataTable .required:before { content: '*'; display: inline-block; margin-left: 4px; color: #e1002a; }

/*# sourceMappingURL=style.css.map */