@import URL('//fonts.googleapis.com/earlyaccess/nanumgothic.css');

* { border: 0; box-sizing: border-box; margin: 0; outline: 0; padding: 0 }
HTML, BODY { font-size: 14px; margin: 0; padding: 0 }
A, BODY, BUTTON, INPUT, SELECT, TABLE, TEXTAREA { -webkit-text-size-adjust: 100%; color: #444; font-family: 'Nanum Gothic', 'HelveticaNeue-Light', 'AppleSDGothicNeo-Light', 'sans-serif' }
A { text-decoration: none }
A:hover { text-decoration: underline; }
IFRAME { display: block }
UL, OL { list-style: none }

HEADER, FOOTER, MAIN, ADDRESS, SECTION, NAV { display: block }

.b { vertical-align: bottom }
.c { text-align: center }
.l { text-align: left }
.m { vertical-align: middle }
.r { text-align: right }
.t { vertical-align: top }
.bc { display: block; margin-left: auto; margin-right: auto }

.w5 { width: 5% }
.w10 { width: 10% }
.w15 { width: 15% }
.w20 { width: 20% }
.w25 { width: 25% }
.w30 { width: 30% }
.w33 { width: 33.3% }
.w35 { width: 35% }
.w40 { width: 40% }
.w45 { width: 45% }
.w50 { width: 50% }
.w55 { width: 55% }
.w60 { width: 60% }
.w65 { width: 65% }
.w66 { width: 66.6% }
.w70 { width: 70% }
.w75 { width: 75% }
.w80 { width: 80% }
.w85 { width: 85% }
.w90 { width: 90% }
.w100 { width: 100% }

.ui.icon { background-image: url('./image/icon-eap.png'); background-size: auto 2em; color: transparent; display: inline-block; font-size: 1em; height: 1em; user-select: none; vertical-align: middle; width: 1em }
.ui.icon.arrow-down { background-position: -1em 0 }

.ui.button { -moz-appearance: none; -webkit-appearance: none; appearance: none; background-color: transparent; border: 1px solid; cursor: pointer; display: inline-block; font-size: 1.2em; font-weight: 700; line-height: 1em; outline: 0; padding: 1em 2em; text-align: center; text-decoration: none; -webkit-transition: background-color .3s ease-out; transition: background-color .3s ease-out; user-select: none }
.ui.button:hover { background-color: #222; border-color: #222; color: #fff }
.ui.button.positive { color: #24b1b8 }
.ui.button.positive:hover { background-color: #24b1b8; border-color: #24b1b8; color: #fff }
.ui.button.disabled { color: #ddd; cursor: not-allowed }
.ui.button.disabled:hover { background-color: transparent; border-color: #ddd }
.ui.button.dark { color: #fff }
.ui.button.dark:hover { background-color: #fff; border-color: #fff; color: #222 }
.ui.button.dark.positive { color: #f1e890 }
.ui.button.dark.positive:hover { background-color: #f1e890; border-color: #f1e890; color: #222 }
.ui.button.wide { display: block }

.ui.imagebutton { cursor: pointer; display: block; overflow: hidden; text-decoration: none; }
.ui.imagebutton > DIV { overflow: hidden; padding-top: 56.25%; position: relative }
.ui.imagebutton.zoom > DIV:after { background-color: #fff; content: ''; display: block; height: 100%; left: 0; opacity: 0; position: absolute; top: 0; -webkit-transition: opacity .3s ease-out; transition: opacity .3s ease-out; width: 100% }
.ui.imagebutton > DIV > IMG { display: block; height: auto; left: 50%; position: absolute; top: 50%; -webkit-transition: transform .3s ease-out; transition: transform .3s ease-out; width: 100%; -webkit-transform: scale(1, 1) translate(-50%, -50%); transform: scale(1, 1) translate(-50%, -50%); -webkit-transform-origin: 0 0; transform-origin: 0 0 }
.ui.imagebutton.zoom:hover > DIV:after { opacity: .5 }
.ui.imagebutton.zoom:hover > DIV > IMG { -webkit-transform: scale(1.05, 1.05) translate(-50%, -50%); transform: scale(1.05, 1.05) translate(-50%, -50%) }

.ui.iconbutton { cursor: pointer; display: inline-block; font-weight: 800; text-decoration: none; user-select: none }
.ui.iconbutton > DIV { background-color: #ccc; border-radius: 50%; box-sizing: content-box; color: transparent; display: inline-block; font-size: 1.5em; height: 1em; line-height: 1em; overflow: hidden; padding: .66em; -webkit-transition: background-color .3s ease-out; transition: background-color .3s ease-out; user-select: none; vertical-align: middle; width: 1em }
.ui.iconbutton > DIV > .ui.icon { display: block; font-size: 1em }
.ui.iconbutton > SPAN { display: inline-block; margin: 0 1em; vertical-align: middle }
.ui.iconbutton:hover > DIV { background-color: #24b1b8 }

TABLE.ui { border-collapse: COLLAPSE; border-spacing: 0; border-top: 1px SOLID #222; margin-bottom: 2em; width: 100% }
TABLE.ui.fixed { table-layout: fixed }
TABLE.ui.top TD,
TABLE.ui.top TH { vertical-align: top }
TABLE.ui TD,
TABLE.ui TH { border-bottom: 1px SOLID; border-color: #eee; padding: 1em 1em 1em 0; text-align: left }
TABLE.ui TH { font-weight: 800 }
TABLE.ui TD:first-child,
TABLE.ui TH:first-child { border-left: 0 }
TABLE.ui TD:last-child,
TABLE.ui TH:last-child { border-right: 0 }
TABLE.ui TD > EM { display: inline-block; font-style: normal; font-weight: 800; vertical-align: middle }
TABLE.ui TH > STRONG { font-size: 1.5em; font-weight: 800 }
TABLE.ui.hasform TD,
TABLE.ui.hasform TH { border: 0; padding-bottom: 0; padding-top: 0 }
TABLE.ui.hasform TD { padding-right: 0 }
TABLE.ui.hasform TD .ui.form { display: block }
TABLE.ui .ui.tag { background-color: #f7fafd; border: 1px solid #ddd; border-radius: .25em; color: #006EB7; display: inline-block; font-weight: 800; margin: .25em; padding: .5em 1em }
P .ui.button,
TABLE.ui .ui.button { font-size: 1em; padding: .5em 1em }
TABLE.ui.c TD,
TABLE.ui.c TH { text-align: center }

DL.ui {  }
DL.ui > DT { margin: 2em 0 }
DL.ui > DT > HR { background-color: #ccc; display: inline-block; height: 1px; margin-top: 2em; width: 4em }
DL.ui > DT > SPAN { color: #888; display: block; font-weight: 700; margin-bottom: 1em }
DL.ui > DT > DIV { font-size: 2em; font-weight: 300; letter-spacing: -.025em; line-height: 1.25em }
DL.ui > DT > DIV > STRONG { display: block; font-weight: 800 }
DL.ui > DT > P { font-size: 1.2em; font-weight: 800; margin-top: .5em }
DL.ui > DT > EM { display: block; font-style: normal; margin-top: .5em }
DL.ui > DD { line-height: 1.5em }

HR.ui { background-color: #ddd; display: block; height: 1px; }
HR.ui.black { background-color: #444 }

UL.ui { list-style: disc; padding-left: 1.5em }
UL.ui > LI { margin: .5em 0 }
UL.ui > LI > SPAN { display: inline-block; width: 6em }
UL.ui.black { color: #aaa }
UL.ui.black > LI > SPAN { color: #fff; font-weight: 800 }

.ui.colgroup {  }
.ui.colgroup > .ui.row { border-spacing: 0; display: table; table-layout: fixed; width: 100% }
.ui.colgroup > .ui.row > .ui.col { display: table-cell }
.ui.colgroup > .ui.row > .ui.col.left { text-align: left }
.ui.colgroup > .ui.row > .ui.col.center { text-align: center }
.ui.colgroup > .ui.row > .ui.col.right { text-align: right }
.ui.colgroup.auto > .ui.row { table-layout: auto }
.ui.colgroup.bottom > .ui.row > .ui.col { vertical-align: bottom }
.ui.colgroup.middle > .ui.row > .ui.col { vertical-align: middle }
.ui.colgroup.top > .ui.row > .ui.col { vertical-align: top }
.ui.colgroup.p01 { margin-left: -.1em; margin-right: -.1em }
.ui.colgroup.p02 { margin-left: -.2em; margin-right: -.2em }
.ui.colgroup.p05 { margin-left: -.5em; margin-right: -.5em }
.ui.colgroup.p1  { margin-left: -1em; margin-right: -1em }
.ui.colgroup.p2  { margin-left: -2em; margin-right: -2em }
.ui.colgroup.p3  { margin-left: -3em; margin-right: -3em }
.ui.colgroup.p4  { margin-left: -4em; margin-right: -4em }
.ui.colgroup.p5 { margin-left: -5em; margin-right: -5em }
.ui.colgroup.p01 > .ui.row { border-spacing: .1em }
.ui.colgroup.p025 > .ui.row { border-spacing: .25em }
.ui.colgroup.p05 > .ui.row { border-spacing: .5em }
.ui.colgroup.p1 > .ui.row { border-spacing: 1em 0 }
.ui.colgroup.p2 > .ui.row { border-spacing: 2em 0 }
.ui.colgroup.p3 > .ui.row { border-spacing: 3em 0 }
.ui.colgroup.p4 > .ui.row { border-spacing: 4em 0 }
.ui.colgroup.p5 > .ui.row { border-spacing: 5em 0 }

.ui.map { height: 25em }
.ui.map DIV.dvMarkerTitle { color: #24b1b8; font-weight: 800; padding: .5em 1em; text-align: center; width: 15em }

.swiper-container { }
.swiper-container-horizontal>.swiper-pagination-bullets { bottom: 0; width: auto }
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet { background: none; font-size: .8em; height: auto; margin: 0; padding: .5em; width: auto }
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet:before { background-color: #222; content: ''; border-radius: 50%; display: block; height: 1em; line-height: 1em; overflow: hidden; width: 1em }
-.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet-active:before { background-color: #24b1b8 }

.ui.roll IMG { display: none }

.ui.toggle { user-select: none }

.ui.link { cursor: pointer; display: inline-block; font-weight: 800; text-decoration: none; vertical-align: middle }
.ui.link:after { background-image: url('./image/icon.png'); background-position: -1em -1em; background-size: auto 2em; content: ''; display: inline-block; font-size: 1.2em; height: 1em; margin-left: .2em; vertical-align: middle; width: 1em }
.ui.link:hover:after { background-position: -2em -1em }

.ui.form { display: inline-block; line-height: 1em; position: relative }
.ui.form:before,
.ui.form:after { background-color: #ddd; bottom: 0; content: ''; display: block; height: 1px; left: 0; position: absolute; width: 100%; z-index: 1 }
.ui.form:after { background-color: #222; -webkit-transition: width .3s ease-out; transition: width .3s ease-out; width: 0 }
.ui.form.focused:after,
.ui.form:hover:after { width: 100% }

.ui.form.select { min-width: 13em }
.ui.form.select BUTTON { background-color: #fff; cursor: pointer; font-weight: 700; padding: 1.5em 5em 1.5em 0; text-align: left; white-space: nowrap; width: 100% }
.ui.form.select > BUTTON { position: relative }
.ui.form.select > UL { border: 1px solid #24b1b8; display: none; max-height: 15em; overflow-y: auto; position: absolute; top: 0; width: 100%; z-index: 10 }
.ui.form.select > UL > LI > BUTTON { color: #888; overflow: hidden; padding-left: 1.5em; padding-right: 1.5em }
.ui.form.select > UL > LI > BUTTON:hover,
.ui.form.select > UL > LI.selected > BUTTON { color: #222; font-weight: 800 }
.ui.form.select > UL > LI > BUTTON:hover { background-color: #f7f7f7 }
.ui.form.select > BUTTON:after { background-image: url('./image/icon-eap.png'); background-position: -1em 0; background-size: auto 2em; content: ''; display: block; height: 1em; margin-top: -.5em; position: absolute; right: 1.5em; top: 50%; width: 1em }
.ui.form.select.opened > UL { display: block }

.ui.form.date > INPUT,
.ui.form.text > INPUT,
.ui.form.number > INPUT,
.ui.form.tel > INPUT,
.ui.form.password > INPUT { display: block; font-weight: 800; padding: 1.5em 0; width: 100% }
.ui.form.password > INPUT { font-family: 'Malgun Gothic', HelveticaNeue-Light, AppleSDGothicNeo-Light, sans-serif }
.ui.form.text.focused:after,
.ui.form.number.focused:after,
.ui.form.password.focused:after { background-color: #24b1b8 }

.ui.indicator { display: BLOCK; font-size: 4em; height: 1em; left: 50%; margin-left: -.5em; margin-top: -.5em; position: FIXED; top: 50%;  transform: TRANSLATEZ(1px); width: 1em }
.ui.indicator > DIV { animation: indicator-circle 2.4s CUBIC-BEZIER(0, 0.2, 0.8, 1) INFINITE; background-image: url('./image/icon.png'); background-position: 0 0; background-size: auto 2em; border-radius: 50%; display: INLINE-BLOCK; height: 1em; width: 1em }
.ui.indicator > SPAN { color: #24b1b8; display: BLOCK; font-size: .25em; font-weight: 800; left: 50%; margin-left: -10em; position: ABSOLUTE; text-align: CENTER; top: 4.5em; width: 20em }
@keyframes indicator-circle { 0%, 100% { animation-timing-function: CUBIC-BEZIER(0.5, 0, 1, 0.5) } 0% { transform: ROTATEY(0deg) } 50% { transform: ROTATEY(1800deg); animation-timing-function: CUBIC-BEZIER(0, 0.5, 0.5, 1) } 100% { transform: ROTATEY(3600deg) } }

.ui.imagebox { background-color: #f7f7f7; background-position: center; background-size: 100% auto; background-size: cover; padding-top: 40%; margin: 1em 0 }
.ui.imagebox:last-child { margin-bottom: 0 }

.ui.switcher { padding: 0 }
.ui.switcher-content > DIV { display: none }

.ui.window { background-color: #444; background-color: rgba(68, 68, 68, .75); display: table; height: 100%; left: 0; position: fixed; top: 0; width: 100%; z-index: 501 }
.ui.window > DIV { display: table-cell; text-align: center; vertical-align: middle }
.ui.window > DIV > DIV { background-color: #fff; display: none; min-width: 30em; padding: 4em 4em 8em; position: relative; vertical-align: top }
.ui.window > DIV > DIV > BUTTON { background-color: transparent; border-radius: 50%; CURSOR: POINTER; font-size: 1.25em; overflow: hidden; padding: .5em; position: absolute; right: .5em; -webkit-transition: background-color .3s ease-out; transition: background-color .3s ease-out; top: .5em; z-index: 1 }
.ui.window > DIV > DIV > BUTTON:hover { background-color: #eee }

.ui.window > DIV > DIV > .ui.popup-content { min-width: 50em }
.ui.window > DIV > DIV > .ui.popup-content > HEADER { bottom: 3em; font-size: 1.25em; font-weight: 800; left: 12em; overflow: hidden; position: absolute; right: 12em; text-overflow: ellipsis; white-space: nowrap }
.ui.window > DIV > DIV > .ui.popup-content > .ui.iconbutton { bottom: 2.75em; position: absolute }
.ui.window > DIV > DIV > .ui.popup-content > A.aPrevious { left: 4em }
.ui.window > DIV > DIV > .ui.popup-content > A.aNext { right: 4em }

.ui.window.opened > DIV> DIV { display: inline-block }

.ui.hanja { font-family: 'Malgun Gothic' }

.fn.popup { cursor: pointer }

DIV#dvSite > HEADER,
DIV#dvSite > MAIN,
DIV#dvSite > ASIDE,
DIV#dvSite > FOOTER { display: block }
DIV#dvSite > HEADER { background-color: #f7fafd; border-bottom: 1px solid #DDD; position: fixed; width: 100%; z-index: 10 }
DIV#dvSite > HEADER H1,
DIV#dvSite > HEADER NAV { display: inline-block; vertical-align: middle }
DIV#dvSite > HEADER H1 A,
DIV#dvSite > HEADER H1 A IMG { display: block }
DIV#dvSite > HEADER H1 { font-size: 12em; width: 1.25em }
DIV#dvSite > HEADER H1 A { height: .275em; margin: 0 auto; overflow: hidden; padding: .05em; width: 1em }
DIV#dvSite > HEADER H1 A IMG { width: 100% }
DIV#dvSite > HEADER NAV {  }
DIV#dvSite > HEADER NAV UL { margin-bottom: -1px }
DIV#dvSite > HEADER NAV UL LI { display: inline-block; }
DIV#dvSite > HEADER NAV UL LI A { border-bottom: 3px solid transparent; display: block; font-size: 1.1em; font-weight: 800; padding: 1.5em 1em; white-space: nowrap }
DIV#dvSite > HEADER NAV UL LI A:hover { text-decoration: none }
DIV#dvSite > HEADER NAV UL LI.selected A { border-color: #24b1b8; color: #24b1b8; font-weight: 800 }
DIV#dvSite > HEADER DIV#dvControls { margin-top: 1em; position: absolute; right: 1em; top: 50%; transform: translateY(-50%) }
DIV#dvSite > HEADER DIV#dvControls A { background-color: #fff; border-radius: .25em; box-shadow: 0 0 .5em rgba(0, 0, 0, .1); cursor: pointer; display: inline-block; font-weight: 700; padding: .5em 1.5em; text-decoration: none; -webkit-transition: background-color .3s ease-out; transition: background-color .3s ease-out; user-select: none }
DIV#dvSite > HEADER DIV#dvControls A:hover { background-color: #1f5dab; color: #fff }
DIV#dvSite > MAIN { margin: 0 auto; max-width: 1600px; padding: 8em 2em 2em; position: relative }
DIV#dvSite > MAIN > HEADER { font-size: 1.5em; font-weight: 800; margin-bottom: 1em }
DIV#dvSite > MAIN > P { margin-bottom: 1em }
DIV#dvSite > MAIN.hasSide { margin: 0; max-width: none; padding-left: 17em }
DIV#dvSite > MAIN.hasSide > ASIDE { border-right: 1px solid #ddd; height: 100%; left: 0; padding-top: 6.75em; position: fixed; top: 0; width: 15em }
DIV#dvSite > MAIN.hasSide > ASIDE UL { bottom: 0; overflow-y: auto; position: absolute; top: 9em; width: 100% }
DIV#dvSite > MAIN.hasSide > ASIDE UL LI { border-bottom: 1px solid #eee }
DIV#dvSite > MAIN.hasSide > ASIDE UL LI A { cursor: pointer; display: block; padding: 1em; text-decoration: none; white-space: nowrap }
DIV#dvSite > MAIN.hasSide > ASIDE UL LI A STRONG { font-size: .9em; font-weight: 300 }
DIV#dvSite > MAIN.hasSide > ASIDE UL LI A SPAN { font-weight: 800 }
DIV#dvSite > MAIN.hasSide > ASIDE UL LI A EM { color: #888; display: block; font-size: .9em; font-style: normal; margin-top: .5em }
DIV#dvSite > MAIN.hasSide > ASIDE UL LI A EM.activated { color: #24b1b8; font-weight: 800 }
DIV#dvSite > MAIN.hasSide > ASIDE UL LI.liSelected A,
DIV#dvSite > MAIN.hasSide > ASIDE UL LI A:hover { background-color: #f7fafd }
DIV#dvSite > MAIN.hasSide > ASIDE UL LI.liSelected A { border-left: 3px solid; color: #24b1b8 }
DIV#dvSite > MAIN.hasSide > ASIDE UL LI.liSelected A SPAN I { color: #24b1b8 }
DIV#dvSite > MAIN.hasSide > ASIDE > HEADER { background: rgb(36,177,184); background: linear-gradient(0deg, rgba(36,177,184,1) 0%, rgba(0,110,183,1) 100%); color: #fff; font-size: 1em; font-weight: 700; padding: .75em 0; position: relative; text-align: center; z-index: 1 }
DIV#dvSite > MAIN.hasSide > ASIDE.sub { left: 15em }
DIV#dvSite > MAIN.hasSide.double > ASIDE { width: 30em }
DIV#dvSite > MAIN.hasSide.hasSub { padding-left: 32em }
DIV#dvSite > MAIN.hasSide.double { padding-left: 32em }
DIV#dvSite > HEADER > DIV#dvMember { background-color: #1f5dab; color: #fff; line-height: 1em; text-align: right }
DIV#dvSite > HEADER > DIV#dvMember > UL > LI { display: inline-block }
DIV#dvSite > HEADER > DIV#dvMember > UL > LI > A { color: #fff; cursor: pointer; display: inline-block; padding: .5em 1em; text-decoration: none }
DIV#dvSite > HEADER > DIV#dvMember > UL > LI > A.aButton { border: 1px solid; border-radius: .5em; color: #fff; font-size: .9em; font-weight: 800; padding: .25em 1em }
DIV#dvSite > HEADER > DIV#dvMember > UL > LI:before { background-color: rgba(255, 255, 255, .5); content: ''; display: inline-block; height: 1em; margin: 0 .5em; vertical-align: middle; width: 1px }
DIV#dvSite > HEADER > DIV#dvMember > UL > LI:last-child:before,
DIV#dvSite > HEADER > DIV#dvMember > UL > LI:first-child:before { display: none }
DIV#dvSite > HEADER > DIV#dvMember > UL > LI.liLogin > A { background-color: #222; font-weight: 800; padding: .5em 2em }
DIV#dvSite > HEADER > DIV#dvMember > UL > LI.liLogout > A { background-color: #cc0000; font-weight: 800; padding: .5em 2em }

.colHeader { width: 12em }

.ui.controls { text-align: center }

@media only screen and (max-width: 800px) {
    DIV#dvSite > HEADER { border-bottom: 0; box-shadow: 0 0 1em rgba(0, 0, 0, .1); text-align: center }
    DIV#dvSite > HEADER H1 { display: block; font-size: 8em; margin: .1em auto }
    DIV#dvSite > HEADER NAV { display: block }
    DIV#dvSite > HEADER NAV > A { display: none }
    DIV#dvSite > HEADER NAV UL LI A { padding: .5em }
    DIV#dvSite > MAIN { padding: 8em 1em 1em }
    DIV#dvSite > MAIN.hasSide { padding: 1em }
    DIV#dvSite > MAIN.hasSide > ASIDE { height: auto; margin: -1em -1em 2em; padding-top: 9.33em; position: static; width: auto }
    DIV#dvSite > MAIN.hasSide > ASIDE UL { position: static }
    DIV#dvSite > MAIN.hasSide.hasSub { padding: 1em }
    DIV#dvSite > MAIN.hasSide > ASIDE.sub { padding-top: 1em }
    DIV#dvSite > HEADER > DIV#dvMember { display: none }

    TABLE.ui,
    TABLE.ui TBODY,
    TABLE.ui TR,
    TABLE.ui TD,
    TABLE.ui TH { display: block }
    TABLE.ui THEAD { display: none }
    TABLE.ui TBODY { padding-top: 2em }
    TABLE.ui TR { margin-bottom: 2em }
    TABLE.ui TD,
    TABLE.ui TH,
    TABLE.ui.hasform TD,
    TABLE.ui.hasform TH { margin: .5em 0; padding: 0 }
}

@media print {
    DIV#dvSite > HEADER,
    DIV#dvSite > MAIN > ASIDE { display: none }
    DIV#dvSite > MAIN { padding: 1em !important }
}