@charset "utf-8";/* --------------------------------------------------------
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,img,ins,kbd,
q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,
ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,
tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,
header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video 
{margin:0; padding:0; border:0; font:inherit; font-size:100%; vertical-align:baseline;}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display:block;}
body {font-weight:normal; font-family:"Noto Sans KR", sans-serif; line-height:1;}
ol,
ul {list-style:none;}
blockquote,
q {quotes:none;}
blockquote:before,
blockquote:after,
q:before,
q:after {content:""; content:none;}
a,
u {color:inherit; text-decoration:none;}
table {border-collapse:separate; border-spacing:0;}

legend {position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; border:0; clip:rect(0, 0, 0, 0);}
caption {position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; border:0; clip:rect(0, 0, 0, 0);}
label {cursor:pointer; margin-right: 10px;}

/* --------------------------------------------------------
GLOBAL class
----------------------------------------------------------*/
.fb_x {display:flex; display:-webkit-flex; display:-ms-flexbox; justify-content:center; -webkit-justify-content:center; -ms-flex-pack:center;}
.fb_y {display:flex; display:-webkit-flex; display:-ms-flexbox; align-items:center; -webkit-align-items:center; -ms-flex-align:center;}
.fb_xy {display:flex; display:-webkit-flex; display:-ms-flexbox; justify-content:center; align-items:center; -webkit-justify-content:center; -webkit-align-items:center; -ms-flex-pack:center; -ms-flex-align:center;}
.fb_e {display:flex; display:-webkit-flex; display:-ms-flexbox; justify-content:flex-start; -webkit-justify-content:flex-start; -ms-flex-pack:start;}
.fb_w {display:flex; display:-webkit-flex; display:-ms-flexbox; justify-content:flex-end; -webkit-justify-content:flex-end; -ms-flex-pack:end;}
.fb_ey {display:flex; display:-webkit-flex; display:-ms-flexbox; justify-content:flex-start; align-items:center; -webkit-justify-content:flex-start; -webkit-align-items:center; -ms-flex-pack:start; -ms-flex-align:center;}
.fb_wy {display:flex; display:-webkit-flex; display:-ms-flexbox; justify-content:flex-end; align-items:center; -webkit-justify-content:flex-end; -webkit-align-items:center; -ms-flex-pack:end; -ms-flex-align:center;}
.fb_ew {display:flex; display:-webkit-flex; display:-ms-flexbox; justify-content:space-between; -webkit-justify-content:space-between; -ms-flex-pack:justify;}
.fb_ewy {display:flex; display:-webkit-flex; display:-ms-flexbox; justify-content:space-between; align-items:center; -webkit-justify-content:space-between; -webkit-align-items:center; -ms-flex-pack:justify; -ms-flex-align:center;}
.fb_dir_x {flex-direction:row; -ms-flex-direction:row;}
.fb_dir_y {flex-direction:column; -ms-flex-direction:column;}
.fi_start {align-self:flex-start;}
.fi_end {align-self:flex-end;}
.fi_xy {align-self:center;}

.mgt30 {margin-top:30px;}
.mgl20 {margin-left:20px;}
.mgb0 {margin-bottom:0 !important;}
.mgb30 {margin-bottom:30px;}
.pdb0 {padding-bottom:0 !important;}
.ovhidden {overflow:hidden;}

.animate {transition:all 0.2s cubic-bezier(0.7, 0, 0.3, 1); transform:all 0.2s cubic-bezier(0.7, 0, 0.3, 1);-webkit-transition:all 0.2s cubic-bezier(0.7, 0, 0.3, 1);}
.ellipsis {overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.required {display:inline-block;vertical-align: middle;color: #ff4000;font-size: 19px;}
.ui-tooltip {display:block; position:absolute; z-index:400; padding:0 16px; border-radius:20px; background:rgba(0, 0, 0, 0.6); color:#fff; font-size:14px; line-height:26px;}
.filter_blur6 {filter:blur(6px); -webkit-filter:blur(6px);}
.blind {position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; border:0; clip:rect(0, 0, 0, 0);}

.colorA {color:#419e72;}
.colorB {color:#005daf;}
.colorC {color:#85ad4c;}
.colorD {color:#419e72;}

:root {--main_gold:#f6d75a; --main_navy:#1b2f5c;}

/* selectList */
.selectBox.active {}
.selectBox.active .selectNum {}
.selectBox.active .selectList {display:block;}
.selectBox.active .selectNum:after {transform:rotate(0deg);}
.selectBox {position:relative;}
.selectBox .selectNum {display:block; position:relative; width:100%; height:36px; overflow:hidden; border:1px solid #666; color:#fff; font-size:16px; text-indent:20px; text-overflow:ellipsis; line-height:36px; white-space:nowrap;}
.selectBox .selectNum:after {content:""; position:absolute; top:14px; right:18px; border-right:5px solid transparent; border-bottom:5px solid #fff; border-left:5px solid transparent; transform:rotate(180deg);}
.selectBox .selectNum:focus,
.selectBox .selectNum:hover {color:#fff;}
.selectBox .selectList {display:none; position:absolute; z-index:9; left:0; bottom:37px; width:100%; border:1px solid #666; border-bottom:0; background:#333;}
.selectBox .selectList ul {position:relative; z-index:2; margin:10px 0; box-sizing:border-box;}
.selectBox .selectList li {display:block;}
.selectBox .selectList li a {display:block; width:calc(100% - 40px); height:35px; margin:0 20px; overflow:hidden; color:#fff; font-size:15px; font-weight:300; text-overflow:ellipsis; line-height:35px; white-space:nowrap; box-sizing:border-box;}
.selectBox .selectList li a:hover {text-decoration:underline;}
.selectBox .selectList li:last-child a {border-bottom:1px solid #666;}
.selectBox .selectList li a:focus,
.selectBox .selectList li a:hover {background:#333; color:#fff;}
.selectBox .selectList .selectDim {position:fixed; z-index:1; top:0; left:0; right:0; bottom:0; background:rgba(0, 0, 0, 0);}

/* selection */
::selection {background:#222; color:#fff; text-shadow:none;}
::-webkit-selection {background:#222; color:#fff; text-shadow:none;}

/* ------------------------------------------------------------------
FORM INPUT
------------------------------------------------------------------ */
input[type="text"],
input[type="password"],
input[type="tel"] {height:40px; padding:0 10px; border:0; border:1px solid #ddd; color:#333; font-size:14px; line-height:36px; box-sizing:border-box;}
input[type="password"] {font-family:Arial, Helvetica, sans-serif;}
input[type="text"]:focus,
input[type="password"]:focus {}
input[type="text"]:disabled,
input[type="password"]:disabled {background:#f8f8f8; color:rgba(0, 0, 0, 0.6); text-shadow:1px 1px 0px rgba(255, 255, 255, 1);}
input,
select:focus {outline:none;}
textarea:focus {outline:none;}
input[type="submit"] {margin:0; padding:0; border:none; background:none; color:#2e2e2e; font-size:13px; font-weight:600; cursor:pointer; appearance:none;}
/* old version */
input:focus::-webkit-input-placeholder {color:transparent;}
input:focus::-moz-placeholder {color:transparent;}
input:focus:-ms-input-placeholder {color:transparent;}

/* ms-clear */
input::-ms-clear {display:none;}

/* placeholder */
input:-ms-input-placeholder {color:#a9a9a9;}
input::-webkit-input-placeholder {color:#a9a9a9;}

/* inputFile
-------------------------------------*/
.inputFile {display:inline-block; width:inherit; max-width:380px; vertical-align:middle;}
.inputFile input {position:absolute; z-index:-1; width:0px; height:0px; overflow:hidden; opacity:0;}
.inputFile input:focus + label,
.inputFile input + label:hover {background:#f8f8f8;}
.inputFile input + label {display:inline-block; visibility:visible; position:relative; width:100%; height:36px; padding:0; border:1px solid #dedede; background:#fff; color:#333; cursor:pointer; box-sizing:border-box;}
.inputFile input + label span {display:block; width:calc(100% - 20px); padding:0 10px; overflow:hidden; text-align:left; text-overflow:ellipsis; white-space:nowrap;}
.inputFile input + label strong {display:block; position:absolute; top:0; right:0; padding:0 30px; border-left:1px solid #2c2c2c; background:#2c2c2c; color:#fff;}
.inputFile input + label span,
.inputFile input + label strong {height:35px; font-size:14px; line-height:35px;}
.inputFile input + label strong {margin-right:-118px; font-weight:300;}

/* --------------------------------------------------------
FORM TEXTAREA
----------------------------------------------------------*/
textarea {width:100%; padding:8px; border:1px solid #dedede; color:#2e2e2e; font-size:14px; line-height:20px; box-sizing:border-box; resize:none;}
textarea:disabled {background:#f8f8f8; color:rgba(0, 0, 0, 0.3); text-shadow:1px 1px 0px rgba(255, 255, 255, 1);}

/* --------------------------------------------------------
FORM SELECT
----------------------------------------------------------*/
select::-ms-expand {display:none;}
select {height:40px; padding:0 0 0 10px; border:1px solid #d9d9d9; box-sizing:border-box;}
select:hover {}
select option:hover,
select option[selected] {background:#000; color:#fff;}
select:disabled {background:#f8f8f8; color:rgba(0, 0, 0, 0.3); text-shadow:1px 1px 0px rgba(255, 255, 255, 1);}

/* radio , checkbox
-------------------------------------*/
input[type="checkbox"] + label:before {content:""; display:inline-block; width:12px; height:12px; margin-right:4px; border:3px solid #ffffff; border-radius:2px; box-shadow:0px 0px 0px 1px #a3a3a3; color:#c7c9d1; vertical-align:middle; box-sizing:border-box;}
.opt input[type="radio"] + label:before,
.opt input[type="checkbox"] + label:before {display:inline-block; vertical-align:middle;}
.opt input[type="radio"],
.opt input[type="checkbox"] {display:none;}
.opt input[type="radio"] + label,
.opt input[type="checkbox"] + label {display:inline-block; visibility:visible; position:relative; font-size:14px; vertical-align:middle; cursor:pointer;}
.opt input[type="radio"] + label span.text,
input[type="checkbox"] + label span.text {display:inline-block; margin:0 4px; color:#000; font-size:16px; font-weight:300; vertical-align:middle;}
.opt input[type="radio"] + label:before {content:""; display:inline-block; width:12px; height:12px; margin-right:4px; border:3px solid #ffffff; border-radius:50%; box-shadow:0px 0px 0px 1px #a3a3a3; color:#c7c9d1; vertical-align:middle; box-sizing:border-box;}
.opt input[type="radio"] + label:hover:before,
input[type="checkbox"] + label:hover:before {color:#427bfd;}
.opt input[type="radio"]:disabled + label,
input[type="checkbox"]:disabled + label {cursor:default;}
.opt input[type="radio"]:disabled + label:before,
input[type="checkbox"]:disabled + label:before {color:#ddd;}
.opt input[type="radio"] + label:before {}
.opt input[type="radio"]:checked + label:before {background:#000;}
.opt input[type="checkbox"] + label:before {}
.opt input[type="checkbox"]:checked + label:after {content:"Γ"; position:absolute; top:2px; left:3px; color:#000; font-weight:bold; transform:rotate(225deg);}

@media (max-width:1180px) {
  .opt input[type="radio"] + label span.text,
  input[type="checkbox"] + label span.text {font-size:15px;}
}

.optWrap {margin-bottom:30px;}
.optWrap .opt {margin:0 20px;}

/* --------------------------------------------------------
MODAL
----------------------------------------------------------*/

@keyframes ShowPop {
	0% {opacity:0; transform:translate3d(0, -100px, 0);}
	100% {opacity:1; transform:translate3d(0, 0, 0);}
}

@keyframes HidePop {
	0% {opacity:1; transform:translate3d(0, 0, 0);}
	100% {opacity:0; transform:translate3d(0, -100px, 0);}
}

@keyframes dimShowPop {0% {opacity:0;}
	100% {opacity:1;}
}
@keyframes dimHidePop {0% {opacity:1;}
	100% {opacity:0;}
}

.multiModal.hide {}
.multiModal.hide .modalBox {animation:HidePop 0.3s;}
.multiModal.hide .multiModal:after {animation:dimHidePop 0.3s;}
.multiModal.active {display:flex; flex-wrap:wrap; overflow:auto;}
.multiModal {display:none;position:fixed;z-index: 999;top:0px;left:0px;right:0px;bottom:0px;justify-content:center;align-items:center;-webkit-justify-content:center;-webkit-align-items:center;-ms-flex-pack:center;-ms-flex-align:center;}
.multiModal:after {position:fixed; z-index:1; top:0px; left:0px; right:0px; bottom:0px; background:rgba(0,0,0,0.8); content:''; animation:dimShowPop 0.1s;}
.modalBox {position:relative; z-index:2; width:80%; max-width:540px; border-radius:16px; background:#fff; box-shadow:0 10px 10px rgba(0, 0, 0, 0.2); box-sizing:border-box; animation:ShowPop 0.1s;}
.modalBox.responseHeight {height:100%;}
@media (max-width:768px) {
  .modalBox {width:calc(100% - 40px);}
}

.modalBox .mbHeader {display:flex;justify-content:space-between;align-items:center;padding: 10px 20px;line-height: 26px;border-bottom:1px solid #e5e5e5;}
.modalBox .mbHeader .backBtn {display:none;}
.modalBox .mbHeader .title {display:flex; flex-direction:row; align-items:center;}
.modalBox .mbHeader .title h2 {color: #1b2f5c;font-size:20px;}

.modalBox .mbHeader .tools {display:flex;}
.modalBox .mbHeader .tools button {margin:0 3px;}
.modalBox .mbHeader ~ .mbBody {}
.modalBox .mbBody {padding:10px;}
.modalBox .mbBody::-webkit-scrollbar {height:4px; width:4px}
.modalBox .mbBodyt::-webkit-scrollbar-thumb {border:0px solid transparent; background-color:rgba(0,0,0,0.2); background-clip:padding-box;}
.modalBox .mbBody .mbBodyContents {width:calc(100% - 0px);height:100%;overflow:auto;}
.modalBox .mbBody .mbBodyContents .article {color:#555;font-size: 18px;line-height: 24px;height:100%;margin: 10px;}
.modalBox .mbBody .mbBodyContents .article img {width:100%; max-width:500px;}

.modalBox .buttonWrap {display:flex; align-items:center; justify-content:center; padding:0 10px 20px;}
.modalBox .buttonWrap span {}
.modalBox .buttonWrap button {margin:0 5px; min-width:140px;}


/* --------------------------------------------------------
BUTTON
----------------------------------------------------------*/
button {margin:0; padding:0; border:none; background:none; color:#2e2e2e; font-size:16px; font-weight:500; cursor:pointer; border-radius:20px; appearance:none;}
.button span {position:relative; z-index:1;}
.button {display:inline-block; position:relative; height:40px; padding:0 20px; overflow:hidden; border:none; background:#fff; color:#2e2e2e; line-height:40px; vertical-align:middle; cursor:pointer;}
.button:hover {}
.button:active {}
.button:disabled {border:1px solid rgba(0, 0, 0, 0); background:rgba(0, 0, 0, 0.08) !important; color:rgba(67, 74, 84, 0.3) !important; cursor:default;}
.button:disabled:hover {color:rgba(0, 0, 0, 0.2);}
.button:disabled:hover:after {content:""; display:none;}


/* button color
----------------------------------*/
.button.prime {background:#00529b; color:#fff;}
button.default {background:#fff; font-size:14px; height:40px; padding:0 24px; color:#00529b; box-shadow:inset 0 0 0 2px #00529b; font-weight:600;}
button.default:hover {background:#f1f1f1;}

/* buttonWrap */
.buttonWrap {margin-top:30px;}
.buttonWrap button {margin:0 5px;}

/* button circle */
button.circle {display:inline-block; width:30px; height:30px; padding:0; overflow:hidden; border-radius:50%; color:transparent; font-size:20px; vertical-align:middle;}

/* button link anchor */
.btnALink {display:inline-block; height:28px; padding:0 20px 0 40px; border:1px solid #222222; border-radius:3px; background:url(../img/page/icon_home.png) no-repeat 10px 5px; line-height:28px;}

/* --------------------------------------------------------
PROGRESS
----------------------------------------------------------*/
.progressBox {}
.progressBox .progress {position:relative; height:4px; margin:8px 0;}
.progressBox .progress:after {content:""; display:block; width:100%; height:4px; background:#eee;}
.progressBox .progress .progressbar {display:block; position:absolute; height:4px; background:#427bfd; transition:all 0.08s ease 0s;}
.progressBox .tools {font-size:12px;}

/* --------------------------------------------------------
TABLE
----------------------------------------------------------*/
.tableWrap {}
.tableWrap table {width:100%; color:#464646; font-size:14px;}
.tableWrap table caption {display:none;}
.tableWrap table tbody {}
.tableWrap table tr th,
.tableWrap table tr td {position:relative; height:40px; padding:0 10px; overflow:hidden; border:0; text-align:left; text-overflow:ellipsis; vertical-align:middle; white-space:nowrap;}
.tableWrap table thead tr th {border-bottom:1px solid #dbdbdb; font-size:13px; font-weight:bold;}
.tableWrap table tbody tr td {border-top:1px solid #f0f0f0;}
.tableWrap table tr th.left,
.tableWrap table tr td.left {text-align:left;}
.tableWrap table tr th.center,
.tableWrap table tr td.center {text-align:center;}
.tableWrap table tr th.right,
.tableWrap table tr td.right {text-align:right;}
.tableWrap.fixed table {table-layout:fixed;}
.tableWrap.even table tbody tr:nth-child(even) {background:#fafafa;}
.tableWrap.odd table tbody tr:nth-child(odd) {background:#fafafa;}
.tableWrap.box table {border:1px solid #dbdbdb;}
.tableWrap.line table thead tr th,
.tableWrap.line table tbody tr td {border-left:1px solid #f0f0f0;}
.tableWrap.line table thead tr th:first-child,
.tableWrap.line table tbody tr td:first-child {border-left:0px;}

/* tableResponsive */
.tableResponsive.nonRespons {overflow:hidden;}
.tableResponsive.nonEllipsis {}
.tableResponsive.nonEllipsis table tr td {white-space:inherit;}
.tableResponsive {border-top:1px solid #000; border-bottom:1px solid #000;}
.tableResponsive table {width:100%; max-width:100%; table-layout:initial; color:#464646; font-size:14px; line-height:22px;}
.tableResponsive table tbody {}
.tableResponsive table tr th,
.tableResponsive table tr td {padding:20px 10px; overflow:hidden; border:0; border-bottom:1px solid #ddd; font-size:15px; text-align:center; text-overflow:ellipsis; vertical-align:middle; white-space:nowrap;}
.tableResponsive table tr th {padding:16px 10px; background:#f1f2f7; font-size:17px;}
.tableResponsive table tr td.left {text-align:left;}
.tableResponsive table tr td.leftBorder {border-left:1px solid #ddd !important;}

.tableResponsive.lineBox {}
.tableResponsive.lineBox tr th,
.tableResponsive.lineBox tr td {padding:14px 10px; overflow:hidden; border:0; border-bottom:1px solid #ddd; border-left:1px solid #ddd; font-size:16px; text-align:center; text-overflow:ellipsis; vertical-align:middle; white-space:nowrap;}
.tableResponsive.lineBox tr th:first-child,
.tableResponsive.lineBox tr td:first-child {border-left:0;}
.tableResponsive.lineBox tr th {background:#f6f6f6; font-weight:500;}
.tableResponsive.lineBox tr td {font-weight:300;}

@media (max-width:992px) {
 /* tableResponsive */
  .tableResponsive {width:100%; overflow-x:auto; overflow-y:hidden;}
  .tableResponsive.nonEllipsis table tr th {padding:16px 0px;}
}

/* --------------------------------------------------------
loading
----------------------------------------------------------*/
.loading {position:relative;}
.loading:before {content:""; position:absolute; z-index:9999; top:50%; left:50%; width:30px; height:30px; margin:-15px 0 0 -15px; border:4px solid transparent; border-color:rgba(255, 255, 255, 0.2) #fff rgba(255, 255, 255, 0.2) #fff; border-radius:50%; animation:rotate-loading 1s linear 0s infinite normal; transform-origin:50% 50%;-webkit-animation:rotate-loading 1s linear 0s infinite normal; -webkit-transform-origin:50% 50%;}

.loading:after {content:""; position:absolute; z-index:9998; top:0px; left:0px; right:0px; bottom:0px; background:rgba(0, 0, 0, 0.7);}

.loadingCircle {position:relative;}
.loadingCircle:before {content:""; position:absolute; z-index:9999; top:50%; left:50%; width:50px; height:50px; margin:-25px 0 0 -25px; border:4px solid transparent; border-radius:50%; background:url(../img/loading_spinner.png) no-repeat; animation:rotate-loading 1s linear 0s infinite normal; transform-origin:50% 50%;-webkit-animation:rotate-loading 1s linear 0s infinite normal; -webkit-transform-origin:50% 50%;}

.loadingCircle:after {content:""; position:absolute; z-index:9998; top:0px; left:0px; right:0px; bottom:0px; background:rgba(0, 0, 0, 0.7);}

@keyframes rotate-loading {
  0% {transform:rotate(0deg);-webkit-transform:rotate(0deg); -o-transform:rotate(0deg); -moz-transform:rotate(0deg); -ms-transform:rotate(0deg);}
  100% {transform:rotate(360deg);-webkit-transform:rotate(360deg); -o-transform:rotate(360deg); -moz-transform:rotate(360deg); -ms-transform:rotate(360deg);}
}

@-webkit-keyframes rotate-loading {
  0% {transform:rotate(0deg);-webkit-transform:rotate(0deg); -o-transform:rotate(0deg); -moz-transform:rotate(0deg); -ms-transform:rotate(0deg);}
  100% {transform:rotate(360deg);-webkit-transform:rotate(360deg); -o-transform:rotate(360deg); -moz-transform:rotate(360deg); -ms-transform:rotate(360deg);}
}

@keyframes rotate-loading {
  0% {transform:rotate(0deg);-webkit-transform:rotate(0deg); -o-transform:rotate(0deg); -moz-transform:rotate(0deg); -ms-transform:rotate(0deg);}
  100% {transform:rotate(360deg);-webkit-transform:rotate(360deg); -o-transform:rotate(360deg); -moz-transform:rotate(360deg); -ms-transform:rotate(360deg);}
}

@-webkit-keyframes rotate-loading {
  0% {transform:rotate(0deg);-webkit-transform:rotate(0deg); -o-transform:rotate(0deg); -moz-transform:rotate(0deg); -ms-transform:rotate(0deg);}
  100% {transform:rotate(360deg);-webkit-transform:rotate(360deg); -o-transform:rotate(360deg); -moz-transform:rotate(360deg); -ms-transform:rotate(360deg);}
}