@charset "utf-8";

/* layout */
body{ background:url(../images/common/bg_left.gif) repeat-y left;}
body.my{ background:#f3f3f3 url(../images/common/bg_left.gif) repeat-y left;}
body.login, body.con-center{ background:none;}
#wrap{height:100%; width:auto; min-width:1280px;}
header{ position:absolute; width:100%; min-width:1098px; height:57px; border-bottom:1px solid #eeeeef; z-index:10; background:#fff;}
#content {min-height:100%; margin: 0 0 -160px;}
.login #content{}
.left{position:absolute; float:left; width:156px;  background:#5394e9; z-index:9;}
.container{margin-left:-156px; padding:96px 62px 381px 372px;}

/* IE Hack */
*html #content {height:100%;}


/* header */
.top-notice{float:left; width:650px; line-height:33px; padding-left:14px;}
.top-notice span{font-weight:bold;}
.top-notice em{font-size:11px; opacity:.6;}
.top-util{float:right; line-height:33px; padding-right:14px; margin-top:12px;}
.top-util li {float:left; background:url(../images/common/ico_bar_header.gif) no-repeat left 4px; padding:0 10px;}
.top-util li:first-child{background:none;}
.top-util li.on a{font-weight:bold;}
.top-util li a:hover{ text-decoration:underline;}
header { box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12); }
header h1{ width:156px; height:58px; text-align:center; display:inline-block; }
header h1 img{ width:90%; margin-top:17px; }

/* left */
.left h1{ text-align:center;}
.left-menu{position:relative; margin-top:57px;}
.left-menu > li > a{display:block; width:132px; background-color:#4A87D3; font-family: 'Noto Sans KR', sans-serif; color:#fff; font-size:14px; border-top:1px solid #4d89d8; padding:16px 0 16px 24px; letter-spacing:-0.5px; transition:.2s;}
.left-menu > li > a:hover, .left-menu > li.active > a{background:#294a74; border-top:1px solid #26446c;}

.left-menu li > ul{border-top:1px solid #4d89d8; background:#457bc2;}
.left-menu li li:first-child{margin-top:0;}
.left-menu li li a{font-family: 'Noto Sans KR', sans-serif; color:#fff; font-size:12px; letter-spacing:-0.5px; background:#5394E9 url(../images/common/blt_arrow.png) no-repeat 26px 17px; padding:12px 0 12px 35px; display:block;}
.left-menu li li a:hover, .left-menu li li.active a{background:#355e95 url(../images/common/blt_arrow.png) no-repeat 26px 17px;}

/* tab */
.tab{display:inline-block;}
.tab button{display:inline-block; width:auto; height:29px; padding:0 10px; line-height:29px; border:1px solid #dcdfe1; border-radius:2px; background:#fff; text-align:center; margin:2px 0;}
.tab button:hover{background:#f4f6f7;}
.tab button.active{border:1px solid #5394e9; background:#5394e9; color:#fff;}

/* content */
h2{font-family: 'Noto Sans KR', sans-serif; font-size:30px; letter-spacing:-0.5px; margin-bottom:24px;}
h3{font-family: 'Noto Sans KR', sans-serif; font-size:20px; letter-spacing:-0.5px; margin-bottom:16px; position:relative;}
h3 span{font-family: dotum; font-size:12px; font-weight:normal; letter-spacing:0; float:right; margin-top:10px; color:#888b93;}
h3 span.sum{ padding:2px 19px 0 11px; height:22px; line-height:22px; background:#5394e9 url(../images/common/blt_arrow2.png) no-repeat right center; color:#fff; font-size:12px; font-weight:bold; margin:3px 0 0 6px; border-radius:16px; position:absolute;}
h3 span.date{margin-top:5px; font-size:14px; font-weight:bold;}
h3 em{font-size:14px; color:#7d8493;}
h4{font-family: dotum; font-size:16px; font-weight:bold; letter-spacing:-0.5px; color:#36393d;}

/* main */
.main-text { margin:50px auto; width:300px; text-align:center; font-size:14px; }
.main-text i { display:block; font-size:65px; margin-bottom:15px; }


.search-wrap .graybox, .step-wrap .graybox, .search-wrap .mybox{ position:relative; background:#f4f7fa; border-radius:2px; border:1px solid #dcdfe1; padding:20px;}
.search-wrap .graybox.padding, .step-wrap .graybox.padding{padding:19px 28px;}
.search-wrap .mybox{padding:0;}
.my .sum-wrap .graybox, .my .search-wrap .mybox, .my .chart-wrap .chart-box{background:#fff;}

.chart-wrap .chart-box{position:relative; background:#f4f7fa; border-radius:2px; border:1px solid #dcdfe1;}
.chart-wrap .chart-box .chart-area{padding-top:100px; background:url(../images/common/bg_dot.png) repeat; width:576px; margin:0 auto; position:relative;}
.chart-wrap .chart-txt{width:576px; margin:10px auto 0; position:relative;}
.chart-wrap .chart-txt span{ position:absolute; font-size:14px; font-weight:bold;}
.chart-wrap .chart-txt span.type1{left:-14px;}
.chart-wrap .chart-txt span.type2{left:120px;}
.chart-wrap .chart-txt span.type3{left:258px;}
.chart-wrap .chart-txt span.type4{left:394px;}
.chart-wrap .chart-txt span.type5{left:530px;}

.mybox ul{ position:relative; display:inline-block; padding:28px 0; border-right:1px solid #dcdfe1; width:31%; overflow:hidden; min-width:272px;}
.mybox li{padding-left:28px; line-height:20px; font-family: 'Noto Sans KR', sans-serif; font-size:23px; line-height:24px; color:#6a7180;}
.mybox li > em{font-size:15px; background:none;}
.mybox li.name{ color:#3f7ebd;}
.mybox li.name > em{ font-size:15px; background:url(../images/common/bg_mybox_bar.gif) no-repeat left; padding-left:6px; color:#5aacff;}
.mybox li:last-child{ font-size:18px;}
.mybox .more{ position:absolute; width:7%; min-width:44px; height:14px; top:45px; right:0; text-align:center; background:url(../images/common/ico_more.png) no-repeat center top; padding-top:38px; font-weight:bold;}

.mybox .circle{
  float:left; display:inline-block; width:72px; height:20px; padding:26px 0; border-radius:50%; background:#9fabb8;
  font-family: 'Noto Sans KR', sans-serif; text-align:center; font-size:20px; line-height:20px; color:#fff;
  margin:0 16px 0 18px;
}
.mybox .circle.com{height:44px; padding:14px 0; line-height:24px; background:#42beb7;}

.color-box{position:relative; height:185px;}
.color-box li{ float:left; width:25%; text-align:center; position:relative; margin:0; height:185px;}
.color-box li a{width:100%; height:151px; display:block; font-size:36px; font-family: 'Noto Sans KR', sans-serif; color:#fff; padding-top:34px;}
.color-box li a p{font-size:60px; line-height:72px;}
.color-box li.color1 a{ background:#428aaf;}
.color-box li.color1 a:hover{ background:#357da2;}
.color-box li.color2 a{ background:#78c9c3;}
.color-box li.color2 a:hover{ background:#62b9b3;}
.color-box li.color3 a{ background:#ff7a5b;}
.color-box li.color3 a:hover{ background:#ec6a4c;}
.color-box li.color4 a{ background:#ffb821;}
.color-box li.color4 a:hover{ background:#efab19;}

.detail-info-wrap { margin-top:0 !important; }
.lang-tab { width:100%; }
.lang-tab ul { /*margin-bottom:40px;*/ border-bottom:2px solid #5394E9; }
.lang-tab.detail ul { margin-bottom:0; border-bottom:1px solid #5394E9; }
.lang-tab ul:after {
  clear:both;
  content:"";
  display:block;
}
.lang-tab ul li {
  float:left;
  width:140px;
  padding:10px 0;
  text-align:center;
  background-color:#e2e2e2;
  margin-right:10px;
  font-weight:bold;
  cursor:pointer;
  transition:all 100ms linear;
}
.lang-tab ul li:hover { background-color:#CFD4D4; transition:all 100ms linear; }
.lang-tab ul li.on { background-color:#5394E9; color:#fff; }

.search-wrap .graybox table { width:auto; }
.search-wrap .graybox th{height:28px; text-align:left; font-size:12px; /* background:url(../images/common/blt_square.png) no-repeat left 14px; padding-left:10px; */}
.search-wrap .graybox tr th, .search-wrap .graybox tr td{padding-bottom:12px;}
.search-wrap .graybox tr td.row{padding-bottom:0; vertical-align:bottom;}
.search-wrap .graybox tr:last-child th, .search-wrap .graybox tr:last-child td{padding-bottom:0;}
.search-wrap .graybox td .select span{ width:341px; height:28px; line-height:26px; font-size:12px; font-weight:normal; box-sizing:border-box;}
.search-wrap .graybox td .select .option{top:28px; width:339px;}
.search-wrap .graybox td input[type="text"]{ width:245px; height:30px; line-height:26px; box-sizing:border-box;}
.search-wrap .graybox td .btn-wrap{ text-align:center; margin:0; padding:0;}
.search-wrap .graybox td .btn-wrap a.search{ border-radius:5px; margin:0 12px 0 0; height:30px; line-height:30px; width: 98px; background: #5394e9 url(../images/common/ico_search.png) no-repeat 24px 8px; box-sizing:border-box;}

.search-wrap .tab button{display:inline-block; width:52px; height:28px; line-height:28px; border:1px solid #dcdfe1; border-radius:2px; background:#fff; text-align:center; margin:2px 0; margin-right:2px; box-sizing:border-box; font-family:dotum; font-weight:normal; letter-spacing:-1px;}
.search-wrap .tab button:last-child{margin-right:0;}
.search-wrap .tab button:hover{background:#f4f6f7;}
.search-wrap .tab button.active{border:1px solid #5394e9; background:#5394e9; color:#fff;}
.search-wrap .tab.third button{width:109px}
.search-wrap .tab.third button:last-child{width:110px}
.search-wrap .tab.fourth button{width:81px}

/*songhyun*/
.search-wrap select {
  min-width:215px;
  max-width:100%;
  margin-right:30px;
  border-radius:5px;
  height:30px;
  background-color:#fff;
  border:1px solid #A6A6A6;
  padding-left:10px;
  font-size:14px;
  color:#333;
}
.search-wrap .search-keyword select { min-width:100px !important; margin-right:0; }
.search-wrap .search-keyword input[type="text"] {
  margin-right:30px;
  background-color:#fff;
  border:1px solid #A6A6A6;
  border-radius:5px;
}

.btn-wrap{text-align:right; margin-top:16px;}
.btn-wrap a{ display:inline-block; width:66px; height:36px; line-height:36px; font-family: 'Noto Sans KR', sans-serif; font-size:13px; border-radius:3px; margin:0 2px; border:1px solid #fff; padding-left:12px; letter-spacing:-0.5px; transition:.2s; text-align:center;}
.btn-wrap .reset{background:url(../images/common/ico_reset.png) no-repeat 10px 9px;}
.btn-wrap .reset:hover{border:1px solid #5394e9;}
.btn-wrap .search{background:#5394e9 url(../images/common/ico_search.png) no-repeat 12px 10px; color:#fff;}
.btn-wrap .search:hover{background:#4e87d2 url(../images/common/ico_search.png) no-repeat 12px 10px;}
.btn-wrap .cancel{background:#5394e9 url(../images/common/ico_cancel.png) no-repeat 12px 10px; color:#fff;}
.btn-wrap .cancel:hover{background:#4e87d2 url(../images/common/ico_cancel.png) no-repeat 12px 10px;}
.btn-wrap .regist{background:url(../images/common/blt_arrow_right.png) no-repeat 74px 12px; border:1px solid #dcdfe1; width:78px; float:left; padding-right:12px; padding-left:0;}
.btn-wrap .regist:hover{background:#f1f7ff url(../images/common/blt_arrow_right.png) no-repeat 74px 12px;}
.btn-wrap .list{border:1px solid #dcdfe1; padding:0 6px; float:left;}
.btn-wrap .list:hover{background:#f1f7ff;}
.btn-wrap .edit{background:#5394e9; padding:0 6px; color:#fff;}
.btn-wrap .edit:hover{background:#4e87d2}

.btn-wrap2{text-align:right; margin-top:30px;}
.btn-wrap2 a{ display:inline-block; width:122px; height:44px; line-height:44px; font-family: 'Noto Sans KR', sans-serif; font-size:13px; border-radius:3px; margin:0 2px; border:1px solid #fff; padding-left:12px; letter-spacing:-0.5px; transition:.2s; text-align:center;}
.btn-wrap2 .edit2{border:1px solid #dcdfe1; padding:0 6px;}
.btn-wrap2 .edit2:hover{background:#f1f7ff;}
.btn-wrap2 .confirm{background:#5394e9; padding:0 6px; color:#fff;}
.btn-wrap2 .confirm:hover{background:#4e87d2}
.btn-wrap2 ul{ float:left; text-align:left; color:#7e818a; margin-top:4px;}
.btn-wrap2 ul li{background:url(../images/common/blt_square.png) no-repeat left 8px; padding-left:8px; line-height:20px;}

.btn-wrap-right{ text-align:right; margin-top:26px;}
.btn-wrap-right a{ display:inline-block; width:66px; height:36px; line-height:36px; font-family: 'Noto Sans KR', sans-serif; font-size:13px; border-radius:3px; margin:0 2px; border:1px solid #fff; padding-left:12px; letter-spacing:-0.5px; transition:.2s; text-align:center;}
.btn-wrap-right .cancel{background:#fff url(../images/common/ico_cancel.png) no-repeat 14px 14px; border:1px solid #5394e9;}
.btn-wrap-right .cancel:hover{background:#f1f7ff url(../images/common/ico_cancel.png) no-repeat 14px 14px;}
.btn-wrap-right .save{background:#5394e9 url(../images/common/ico_confirm.png) no-repeat 12px 12px; color:#fff;}
.btn-wrap-right .save:hover{background:#4e87d2 url(../images/common/ico_confirm.png) no-repeat 12px 12px;}
.btn-wrap-right .list{background:#fff; border:1px solid #dcdfe1; padding:0 6px; float:left;}
.btn-wrap-right .list:hover{background:#f1f3f5;}

.btn-wrap-center{ text-align:center; margin-top:26px;}
.btn-wrap-center a{ display:inline-block; width:66px; height:36px; line-height:36px; font-family: 'Noto Sans KR', sans-serif; font-size:13px; border-radius:3px; margin:0 2px; border:1px solid #fff; padding-left:12px; letter-spacing:-0.5px; transition:.2s; text-align:center;}
.btn-wrap-center .cancel{background:#fff url(../images/common/ico_cancel.png) no-repeat 14px 14px; border:1px solid #5394e9;}
.btn-wrap-center .cancel:hover{background:#f1f7ff url(../images/common/ico_cancel.png) no-repeat 14px 14px;}
.btn-wrap-center .save{background:#5394e9 url(../images/common/ico_confirm.png) no-repeat 12px 12px; color:#fff;}
.btn-wrap-center .save:hover{background:#4e87d2 url(../images/common/ico_confirm.png) no-repeat 12px 12px;}
.btn-wrap-center .list{background:#fff; border:1px solid #dcdfe1; padding:0 6px; float:left;}
.btn-wrap-center .list:hover{background:#f1f3f5;}

.calcul-btn{height:30px; padding:12px 0 0;}
.btn-wrap-right2{ float:right; display:inline-block; text-align:right;}
.btn-wrap-right2 a{ display:inline-block; height:36px; line-height:36px; font-family: 'Noto Sans KR', sans-serif; font-size:13px; border-radius:3px; border:1px solid #fff; padding:0 12px; letter-spacing:-0.5px; transition:.2s; text-align:center;}
.btn-wrap-right2 a:first-child{margin:0 0 5px;}
.btn-wrap-right2 .do{background:#5394e9; color:#fff; border:1px solid #5394e9;}
.btn-wrap-right2 .do:hover{background:#4e87d2;}
.btn-wrap-right2 .cancel{background:#5394e9 url(../images/common/ico_cancel2.png) no-repeat 12px 10px; color:#fff; border:1px solid #5394e9; padding:0 12px 0 36px;}
.btn-wrap-right2 .cancel:hover{background:#4e87d2 url(../images/common/ico_cancel2.png) no-repeat 12px 10px;}

.search-wrap .graybox .state, .search-wrap .graybox .term, .search-wrap .graybox .type, .search-wrap .graybox .srInfo{ text-align:center; font-size:15px; font-weight:bold;}
.search-wrap .graybox .state{color:#317ad9;}
.search-wrap .graybox .term{color:#ff4646;}
.search-wrap .graybox .state, .search-wrap .graybox .type, .search-wrap .graybox .term{background:url(../images/common/ico_bar_body.gif) no-repeat right;}

.result{margin-top:35px;}
.result p{font-size:15px; margin-bottom:22px;}
.result.ret p{font-size:15px; margin-bottom:10px; line-height:36px;}
.result p em{color:#5394e9; font-weight:bold;}
.result thead tr{height:45px; line-height:45px;}
.result tbody tr{ transition:background .2s; cursor:pointer;}
.result.pay tbody tr{cursor:auto;}
.result tbody tr:hover{background:#f2f5f7;}
.result thead{background:#898f97;}
.result thead th{color:#fff; background:url(../images/common/ico_bar_table.gif) no-repeat right; height:45px;}
.result thead th:first-child{background:url(../images/common/bg_table_left.jpg) no-repeat left}
.result thead th:nth-child(2){background:url(../images/common/ico_bar_table.gif) no-repeat right, url(../images/common/ico_bar_table.gif) no-repeat left;}
.result thead th:last-child{background:url(../images/common/bg_table_right.jpg) no-repeat right;}
.result td{padding:16px 12px; border-bottom:1px solid #edeff0;}
.result td em, .result .no-result a{color:#5394e9;}
.result .no-result a{color:#5394e9; text-decoration:underline; margin-top:10px; display:inline-block;}
.result .no-result {padding:66px 0;}
.result .no-result p{font-size:12px; margin-bottom:0px; text-align:center; line-height:20px; color:#80878f;}
.result .no-result p:first-child{font-size:15px; font-weight:bold;}
.result .no-result p img{margin-bottom:18px;}
.result .calender{float:right; }
.result .calender a{ display:block; background:#5394e9 url(../images/common/ico_time.png) no-repeat 14px 12px;
padding-left:20px; width:124px; height:38px; line-height:38px; text-align:center; margin-top:-8px;
box-sizing:border-box; border-radius:3px;
font-family: 'Noto Sans KR', sans-serif; font-size:13px; color:#fff;
}
.result .calender a:hover{background:#4e87d2 url(../images/common/ico_time.png) no-repeat 14px 12px;}

.result .regist a{background:url(../images/common/blt_arrow_right.png) no-repeat right 3px; padding-right:12px;}
.result .regist{float:right;}
.result .regist a{background:#5394E9 url(../images/common/ico_regist.png) no-repeat 14px 10px; padding-left:44px; width:50px; height:34px; line-height:34px; font-family: 'Noto Sans KR', sans-serif; font-size:13px; border-radius:3px; margin:0 2px;  display:block; text-align:left; color:#fff;}

.result .regist a:hover{background:#4e87d2 url(../images/common/ico_regist.png) no-repeat 14px 10px;}
.result .delay{color:#fc5c50;}
.result .default{color:#5394e9;}
.result .nor{color:#a4a6ac; line-height:0;}

.result .unit{ font-size:12px; color:#888; display:block; text-align:right; margin-bottom:6px;}
.result td.blank{ background:#ddd;}
.result td.revision{ background:#fbe5d1;}

.consult-step{ text-align:center; width:818px; margin:0 auto;}
.consult-step > div{ display:inline-block; height:130px; line-height:88px; margin:0; vertical-align:top; position:relative;}
.consult-step .arrow > img{ position:absolute; top:33px;}
.consult-step .step{width:145px; line-height:24px; font-size:16px; font-weight:bold; position:relative;}
.consult-step .step .date, .consult-step .step .txt{font-size:12px; line-height:18px; height:18px; display:block;}
.consult-step .step .date{color:#787c85; font-weight:normal; margin-top:3px;}
.consult-step .step .txt{font-weight:normal;}
.consult-step .step .circle{display:block; width:86px; height:86px; line-height:86px; border-radius:43px; border:2px solid #fff; background:#fff; cursor:pointer; color:#a8aaad; margin:0 auto;}
.consult-step .step .circle a{color:#a8aaad;}
.consult-step .step .circle p:first-child{margin-top:20px; font-family: 'Noto Sans KR', sans-serif; font-size:20px;}
.consult-step .step.on .circle{border:2px solid #5c99e9; color:#5c99e9;}
.consult-step .step.on .date{display:block; color:#787c85;}
.consult-step .step.active .circle{border:2px solid #5c99e9; background:#5c99e9; color:#fff;}
.consult-step .step.active .circle a{color:#fff;}
.consult-step .step.cancel .circle{border:2px solid #5c99e9; background:#5c99e9; color:#fff;}
.consult-step .step.cancel .circle a{color:#fff;}

.consult-step .step .explan{font-size:12px; display:block; font-weight:normal;}

.step-wrap{border:1px solid #dcdfe1; padding:28px 0 24px; background:#eceeef; border-radius:4px;}
.consult-step .step .select{margin-left:10px;}
.consult-step .step .select span{ width:109px; font-size:12px; font-weight:normal; text-align:left; height:23px; line-height:23px; background: #fff url(../images/common/ico_arrow_down3.gif) no-repeat right;}
.consult-step .step .select .option{width:107px; top:25px; overflow:hidden;}
.consult-step .step .select .option li{font-size:12px; text-align:left; font-weight:normal; padding: 3px 0 3px 10px;}

/*
.consult-step2{ text-align:center; overflow:hidden; margin:0 auto;}
.consult-step2 > div{float:left; height:130px; line-height:88px; margin:0; position:relative;}
.consult-step2 .step{}
.consult-step2 .step{
display:block; width:162px; height:115px;
border-radius:0;
border:1px solid transparent;
border-color:#e0e2e4 transparent #e0e2e4 #e0e2e4;
background:#f4f7fa;
font-weight:bold;font-size:12px;color:#ffffff;text-decoration:none;
}
.consult-step2 .step:before{
content:"";z-index:2;
position:absolute;left:15px;top:12px;
}
.consult-step2 .step:after{
content:""; display:block;
position:absolute; left:112px; top:26px; z-index:1;
width:81px; height:82px;
border-radius:2px;
border:1px solid transparent;
border-color:transparent transparent #e0e2e4 #e0e2e4;
background:#f4f7fa;
transform:rotate(225deg) translateY(14px);
-ms-transform:rotate(225deg) translateY(14px);
-webkit-transform:rotate(225deg) translateY(14px);
-moz-transform:rotate(225deg) translateY(14px);
-o-transform:rotate(225deg) translateY(14px);
}
.consult-step2 .step.on, .consult-step2 .step.active{background:#5394e9;}
.consult-step2 .step.on:after, .consult-step2 .step.active:after{background:#5394e9;}

.consult-step2 .step.last, .consult-step2 .step.cancel{border-radius:0 4px 4px 0; width:160px;}
.consult-step2 .step.last:after, .consult-step2 .step.cancel:after{display:none;}
.consult-step2 .step.last{border-radius:0; width:184px;}

.consult-step2 .step.cancel{width:140px; border-color:#e0e2e4;}

.consult-step2 .step .circle{
position:absolute; top:40px; left:; z-index:3;
width:62px; height:31px; line-height:31px; padding-right:4px;
border-radius:16px; border:1px solid #5394e9; font-size:15px;
background:#fff url(../images/common/ico_arrow_step.gif) no-repeat right 12px;
cursor:pointer; color:#5394e9; margin:0 auto;
}
.consult-step2 .cancel .circle{
left:36px;
border:1px solid #ff6060;
background:#fff url(../images/common/ico_step_cancel.jpg) no-repeat left 10px;
color:#ff6060; padding-left:18px; width:48px;
}
.consult-step2 .step .date{
position:absolute; top:70px; left:2px; z-index:4;
width:224px; height:31px; line-height:31px; text-align:center; font-weight:normal;
color:#fff; margin:0 auto;
}
.consult-step2 .step .explan, .consult-step2 .step .txt{
position:absolute; top:96px; left:2px; z-index:4;
width:224px; height:14px; line-height:14px; text-align:center; font-weight:normal;
color:#fff; margin:0 auto;
}
.consult-step2 .step.cancel .explan{width:142px;}

.consult-step2 .step .explan:after{ content:url(" ../images/common/blt_arrow_on.png"); font-size:9px;}
.consult-step2 .step:first-child{border-radius:4px 0 0 4px;}
.consult-step2 .step:first-child .circle{left:50px;}
.consult-step2 .step:first-child .date{left:0px; width:170px;}
.consult-step2 .step.last .circle{left:83px;}
.consult-step2 .step:last-child .date{left:0px; width:142px;}
*/

.commodity-wrap .normal-box{ position:relative; height:37px; line-height:37px; background:#fff; border-radius:2px; border:1px solid #dcdfe1; padding:16px 28px;}
.commodity-wrap .normal-box.col{background:#f4f7fa; padding:28px; height:auto;}
.commodity-wrap .normal-box span{font-size:15px;font-weight:bold;}
.commodity-wrap .normal-box span img{ margin-top:-2px;}
.commodity-wrap .normal-box .item-txt{ margin-left:40px;}
.commodity-wrap .normal-box .state{ margin-left:40px;}
.commodity-wrap .item-date{ display:inline-block; font-weight:normal !important; font-size:12px !important; text-align:right; color:#9b9c9d;}
.commodity-wrap .item-sbj{background: url(../images/common/blt_square.png) no-repeat left 7px; padding-left:8px;}
.commodity-wrap .normal-box .tab{margin-left:40px;}
.commodity-wrap .normal-box button{ font-family:dotum;}

.commodity-wrap .tab{display:inline-block; margin-left:16px;}
.commodity-wrap .tab button{display:inline-block; width:102px; height:29px; line-height:29px; border:1px solid #dcdfe1; border-radius:2px; background:#fff; text-align:center; margin:2px 0; padding:0 !important; letter-spacing:-0.7px;}
.commodity-wrap .tab button:hover{background:#f4f6f7;}
.commodity-wrap .tab button.active{border:1px solid #5394e9; background:#5394e9; color:#fff;}

.calcul-wrap .normal-box{ position:relative; height:auto; line-height:26px; background:#fff; border-radius:2px; border:1px solid #dcdfe1; padding:28px;}
.calcul-wrap .normal-box li{background: url(../images/common/blt_square.png) no-repeat left 12px; padding-left:8px;}
.calcul-wrap .normal-box li strong{ font-weight:bold;}
.calcul-wrap .normal-box li p{margin-left:110px;}
.calcul-wrap .normal-box > ul > span{color:#989da5; line-height:40px;}
.calcul-wrap .normal-box li.no-result{background:none; text-align:center; padding:90px 0; font-family: 'Noto Sans KR', sans-serif; font-size:33px;}

.info-wrap{margin-top:42px;}
.sum-wrap{margin-top:42px; height:196px; position:relative;}
.sum-wrap .sum-wrap-left{ float:left; width:32%; margin-right:2%;}
.sum-wrap .sum-wrap-right{float:left; margin-right:0; width:66%;}
.sum-wrap .sum-wrap-right > div{float:left; width:50%;}
.sum-wrap .sum-right{ float:right; width:49%;}
.sum-wrap .graybox{ position:relative; background:#f4f7fa; border-radius:2px; border:1px solid #dcdfe1; padding:80px 28px 28px; text-align:right;}
.sum-wrap .sum-wrap-right > div:last-child .graybox{border-left:0;}
.sum-wrap span, .sum-wrap a{ font-size:28px; font-weight:bold;}
.sum-wrap h3 a{ font-size:20px;}
.sum-wrap span > em{color:#5394e9; font-weight:bold;}
.sum-wrap .graybox h4{ position:absolute; top:28px; color:#818998; font-size:14px;}
.sum-wrap .graybox h4 img{margin-right:6px; margin-top:-2px;}

.sum-wrap.calculate{margin-top:0; height:101px;}
.sum-wrap.calculate > div{width:100%; margin-right:0;}
.sum-wrap.calculate .graybox{padding:30px 28px 28px; height:100px; box-sizing:border-box;}
.sum-wrap.calculate .graybox h4{top:34px;}
.sum-wrap.calculate .graybox.left{width:50%;}
.sum-wrap.calculate .graybox .account{ font-size:16px; line-height:40px; font-family: 'Noto Sans KR', sans-serif; font-weight:normal;}
.sum-wrap.calculate .graybox .account em{font-size:14px; font-weight:normal; color:#888; display:inline-block; width:60px; text-align:left;}

.explan-box{position:relative; height:45px; line-height:45px; background:#f4f7fa; border-radius:2px; border:1px solid #dcdfe1; padding:5px 5px 5px 18px; margin-top:8px;}
.explan-box .sbj{ float:left; font-size:14px; color:#ff6060; font-weight:bold; margin-right:20px;}
.explan-box .btn-wrap-right{margin:0;}
.explan-box.slide{ display:none;}

.consult-step2 .step .date, .consult-step2 .step .explan, .consult-step2 .step .txt{ display:none;}
.consult-step2 .step.active .date, .consult-step2 .step.active .explan, .consult-step2 .step.active .txt, .consult-step2 .step.on .date, .consult-step2 .step.on .explan, .consult-step2 .step.on .txt{ display:block;}

.allow{letter-spacing:0px; text-indent:0; text-align:left; position:absolute; left:23px; /* transform:translateX(-50%); */ width:140px;}
.allow input[type="text"]{ background:none; border:0 !important; height:14px; width:73px; font-size:12px; padding:0; outline: 0 none !important; text-align:center; cursor:pointer;}

.ui-datepicker{display:block; width:240px; margin:-14px 0 0; background:#fff;}
.ui-datepicker-header{position:relative; height:38px; background:#898f97;}
.ui-datepicker-header a{position:absolute; top:0; width:16px; height:38px; overflow:hidden; cursor:pointer; text-indent:-9999px;}
.ui-datepicker-header select{height:24px; margin:0 3px; border:0; border-radius:2px; background:#fff url(../images/common/blt_arrowSelect.png) no-repeat; -moz-appearance:none; -webkit-appearance:none;}
.ui-datepicker-header .ui-datepicker-year{width:90px; background-position:74px center;}
.ui-datepicker-header .ui-datepicker-month{width:65px; background-position:49px center;}
.ui-datepicker-prev{left:0; background:url(../images/common/btn-prevCalendar.gif) no-repeat right center;}
.ui-datepicker-next{right:0; background:url(../images/common/btn-nextCalendar.gif) no-repeat left center;}
.ui-datepicker-title{padding:6px 0 0; text-align:center;}
.ui-datepicker-calendar{border-left:1px solid #dfdfdf; border-right:1px solid #dfdfdf;}
.ui-datepicker-calendar th{width:14.29%; height:30px; font-weight:normal; background:#f3f3f3;}
.ui-datepicker-calendar th:first-child{color:#e73e41;}
.ui-datepicker-calendar th:last-child{width:14.26%; color:#1f568f;}
.ui-datepicker-calendar td{height:33px; color:#666; text-align:center; border-bottom:1px solid #dfdfdf;}
.ui-datepicker-calendar tr:last-child td{border-bottom:0;}
.ui-datepicker-calendar td a{color:#666;}
.ui-datepicker-calendar td:first-child a{color:#e73e41;}
.ui-datepicker-calendar td:last-child a{color:#1f568f;}
.ui-datepicker-buttonpane{height:24px; line-height:24px; background:#fff; border-right:1px solid #dfdfdf; border-left:1px solid #dfdfdf; border-bottom:1px solid #dfdfdf;}
.ui-datepicker-current{margin:0 0 0 5px; text-decoration:underline;}
.ui-datepicker-close{display:none;}
.ui-datepicker-today{background:#5394e9;}
.ui-datepicker-today a{color:#fff !important;}

/* page-tab */
.tab-line{border-bottom:1px solid #bebebe; height:40px;}
input#page-tab1:checked + label.page-tab, input#page-tab2:checked + label.page-tab{ background:#fff; border:1px solid #bebebe; border-bottom:1px solid #fff;}

input#page-tab1,input#page-tab2{display:none;}
.page-tab{ position:absolute; width:152px; height:39px; font-family: 'Noto Sans KR', sans-serif; font-size:16px; text-align:center; line-height:39px; border:1px solid #9e9e9e; border-bottom:1px solid #bebebe; border-radius:4px 4px 0 0; margin-bottom:-1px; background:#e8e8e8; z-index:10;}
input#page-tab1 + label{left:216px; cursor:pointer;}
input#page-tab2 + label{left:374px; cursor:pointer;}
.page1,.page2{display:none; margin-top:20px;}
input#page-tab1:checked ~ .page1{display:block;}
input#page-tab2:checked ~ .page2{display:block;}

/* center 콘텐츠 */
.center-container{padding:121px 138px 250px;}
.center-container .center-left{width:128px; position:absolute; z-index:30;}
.center-container .center-right{position:relative; padding-left:156px;}
.center-container .photo{ position:relative; width:128px;}
.center-container .photo img{width:128px;}
.center-container .photo span{ position:absolute; bottom:0; left:0; width:100%; height:33px; line-height:33px; background:rgba(0, 0, 0, 0.4); text-align:center; color:#fff; font-weight:bold;}
.center-container .file-wrap{margin:24px 0 10px;}
.center-container .btn-file {position:relative; display:block; overflow:hidden; cursor:pointer; background-image:url(../images/join/btn_file2.jpg); width:101px; height:31px;}
.center-container .btn-file input {position：absolute; filter:alpha(opacity=0); opacity:0; -moz-opacity:0; cursor:pointer; width:101px; height:31px;}
.center-container .file-wrap .btn a{display:block; width:99px; height:29px; border:1px solid #dcdfe1; border-radius:2px; text-align:center; line-height:29px;}
.center-container .file-wrap .btn a:hover{ background:#f4f6f7;}
.center-container .center-left p{ font-size:12px; font-weight:bold; margin:6px 0;}
.center-container .center-left p:last-child{ font-size:11px; font-weight:normal; color:#9b9c9d;}
.center-container .center-right .table-type3{width:100%;}

.error-wrap{ text-align:center; margin-top:80px;}
.error-wrap h3{font-size:20px; margin:0; line-height:20px; font-family: 'Noto Sans KR', sans-serif;}
.error-wrap .error{font-size:26px; line-height:50px; font-family: 'Noto Sans KR', sans-serif;}
.error-wrap .btn-wrap{}
.error-wrap a{margin:24px 0 0 !important; padding:0 !important; width:80px; height:36px; line-height:36px; border:1px solid #dcdfe1; border-radius:2px; background:#fff; font-family: 'Noto Sans KR', sans-serif; font-size:13px;}
.error-wrap a:hover{ background:#f4f6f7;}


/* paging */
.paging {margin:28px auto 0; text-align:center; overflow:hidden;}
.paging ul{display:inline-block; vertical-align:middle;}
.paging ul.num{margin:0 24px;}
.paging li{display:block; height:36px; width:36px; float:left;}
.paging li:first-child{margin-left:0;}
.paging li a{display:inline-block; width:34px; height:34px; margin-left:0; line-height:32px; border-top:1px solid #ebeced; border-right:1px solid #ebeced; border-bottom:1px solid #ebeced; position:relative;}
.paging li a img{ position:absolute; top:13px; left:14px;}
.paging ul li:first-child a{border-left:1px solid #ebeced;}
.paging strong{display:inline-block; width:36px; height:36px; line-height:36px; background:#5394e9; font-weight:bold; color:#fff;}

/* select */
.select{position:relative; float:left; font-weight:normal; height: 28px; }
.select span{display:block; width:213px; height:41px; padding:0 28px 0 6px; cursor:default; line-height:41px; border:1px solid #dcdfe1; border-radius:2px; background:#fff url(../images/common/ico_arrow_down.gif) no-repeat; background-position:right; font-size:14px; font-weight:bold; box-sizing:border-box;}
.select span:hover{border:1px solid #838891;}
.option{position:absolute; top:43px; left:0; display:none; width:211px; padding:0; border-radius:2px; background:#fff; border-left:1px solid #838891; border-bottom:1px solid #838891; border-right:1px solid #838891; z-index:8; max-height:250px; overflow-y:auto;}
.option li{padding:8px 0 8px 10px; cursor:pointer; color:#4f5562; font-size:14px; cursor:pointer; /* border-top:1px solid #dcdfe1; */}
.option li:hover{color:#fff !important; background:#5394e9;}

.select.time span{display:block; width:88px; height:41px; padding:0 0 0 10px; cursor:default; line-height:41px; border:1px solid #dcdfe1; border-radius:2px; background:#fff url(../images/common/ico_arrow_down.gif) no-repeat; background-position:right; font-size:14px;}
.time .option{position:absolute; top:43px; left:0; display:none; width:98px; padding:5px 0; border-radius:2px; background:#fff; border-left:1px solid #dcdfe1; border-bottom:1px solid #dcdfe1; border-right:1px solid #dcdfe1; z-index:8; height:160px; overflow-y:scroll;}
.time .option li{padding:8px 0 8px 10px; cursor:pointer; color:#4f5562; font-size:14px; cursor:pointer;}
.dash {float:left; line-height:43px; font-weight:bold; font-size:15px; color:#9a9da3; margin:0 12px;}

input[type="text"]{width:213px; height:41px; padding:0 0 0 10px; border-radius:2px; border:1px solid #dcdfe1; background:#fff; font-size:14px; color:#e9e9e9 !important;}

/* table */
.table-type2{border-top:1px solid #b8bbbe; border-bottom:1px solid #b8bbbe;}
.table-type2 th, .table-type2 td{font-size:12px; font-weight:normal; height:; line-height:16px; padding:10px 14px;}
.table-type2 .red-line th, .table-type2 .red-line td{border-bottom:1px solid #7092BE;}
.table-type2 th{background:#f4f7fa;border-bottom:1px solid #e8e9eb; text-align:left;}
.table-type2 th em{color:#898d96;}
.table-type2 td{border-bottom:1px solid #f1f1f2; word-break:break-all;}
.table-type2 tr:last-child th, .table-type2 tr:last-child td {border-bottom:none;}
.table-type2 input[type="text"], .table-type2 input[type="password"]{height:30px; padding:0 5px; margin:4px 0; border-radius:2px; border:1px solid #dcdfe1; background:#fff; font-size:14px; color:#4f5562;}
.table-type2 .sum th{font-size:15px; font-weight:bold; text-align:center;}
.table-type2 .input-wide { width:100%; }

.table-type2.size td{font-size:15px; font-weight:normal; text-align:center; height:74px; line-height:74px;}
.table-type2.size th{font-size:15px; font-weight:bold; text-align:center;}

.table-type2 .send a{border: 1px solid #5394e9; background: #5394e9; color: #fff; display: inline-block; width: 72px; height: 29px; line-height: 29px; text-align:center; border-radius: 2px; margin-left:24px; font-family: 'Noto Sans KR', sans-serif;}
.table-type2 .send a:hover{ background:#4e87d2;}
.table-type2 tr.dim td{ opacity:.3;}

.table-type3{border-top:1px solid #b8bbbe; border-bottom:1px solid #b8bbbe;}
.table-type3 th, .table-type3 td{font-size:12px; font-weight:normal; height:; line-height:16px; padding:10px 14px;}
.table-type3 th{background:#f4f7fa;border-bottom:1px solid #e8e9eb; text-align:left; font-weight:bold;}
.table-type3 th em{color:#898d96; font-weight:normal;}
.table-type3 td{border-bottom:1px solid #f1f1f2;}
.table-type3 tr:last-child th, .table-type3 tr:last-child td {border-bottom:none;}
.table-type3 input[type="text"], .table-type3 input[type="password"]{height:36px; padding:0 0 0 10px; margin:4px 0; border-radius:2px; border:1px solid #dcdfe1; background:#fff; font-size:14px; color:#e9e9e9;}

.table-type3 .location .select{ float:none; display: inline-block; text-align:left; margin:0 6px 8px 0;}
.table-type3 .location .select span{display:block; width:180px; font-weight:normal;}
.table-type3 .location .option{width:178px; padding:0 0; height:200px; overflow-y:scroll;}
.table-type3 .location .option li{padding:8px 0 8px 10px; cursor:pointer;}
.table-type3 .location a img{margin-top:-3px;}

.table-type3 textarea{width:100%; height:66px; box-sizing:border-box; margin:6px 0 12px; padding:5px 20px 5px 5px; border:1px solid #dcdfe1; border-radius:2px;}
.table-type3 .memo{ position:relative;}
.table-type3 .memo .value-txt{ text-align:right; color:#b4b6bb;}

.table-type2 .select{position:relative; float:left; margin-right:10px; margin-top:4px;}
.table-type2 .select span{display:block; width:213px; height:30px; padding:0 0 0 10px; cursor:default; line-height:30px; border:1px solid #dcdfe1; border-radius:2px; background:#fff url(../images/common/ico_arrow_down.gif) no-repeat; background-position:right; font-size:12px;}
.table-type2 .select span:hover{border:1px solid #838891;}
.table-type2 .option{width:211px; padding:0; top:30px;}
.table-type2 .option li{font-size:12px; padding:6px 0 6px 10px;}

.table-type2 .select.time{margin-right:0;}
.table-type2 .select.time span{width:100px;}
.table-type2 .time .option{width:98px;}
.table-type2 .time .option li{padding: 8px 0 8px 10px;}

.table-type2 textarea{width:500px; height:46px; box-sizing:border-box; margin:6px 0 12px; padding:5px 20px 5px 5px; border:1px solid #dcdfe1; border-radius:2px;}
.table-type2 .memo{ position:relative;}
.table-type2 .memo .value-txt{ position:absolute; left:14px; bottom:4px; color:#b4b6bb; width:500px; text-align:right;}

/* 고객센터 */
.customer-top .graybox{ position:relative; background:#eceeef; border-radius:2px; border:1px solid #dcdfe1;}
.customer-top .graybox dl{width:49.4%; display:inline-block;}
.customer-top .graybox dl:first-child{border-right:1px solid #dcdfe1; vertical-align:top;}
.customer-top .graybox dt{font-family: 'Noto Sans KR', sans-serif; font-size:16px; letter-spacing:-0.5px; margin:28px 0 14px 28px;}
.customer-top .graybox dd{letter-spacing:-0.5px; margin:0 0 28px 28px; line-height:20px;}

.customer-top .whbox{ position:relative; background:#fff; border-radius:2px; border:1px solid #dcdfe1; padding:23px;}
.customer-top .whbox dl{font-family: 'Noto Sans KR', sans-serif; letter-spacing:-0.5px; vertical-align:middle; position:relative;}
.customer-top .whbox dt, .customer-top .whbox dd{ display:inline-block;}
.customer-top .whbox dd{ margin-left:12px; font-size:14px; color:#7e818a; position:absolute; top:15px; left:84px;}
.customer-top .whbox dd span{ color:#5394e9; font-size:22px; font-weight:bold;}
/* .customer-top .whbox.faq dd{top:4px;} */

.board-wrap{margin:45px 0 0 0; position:relative;}
.board-tab{border-bottom:2px solid #c5c7c9; position:relative; width:100%;}
.board-tab button{font-size:15px; border:0; border-bottom:2px solid #c5c7c9; height:39px; line-height:39px; margin-bottom:-2px; font-weight:bold; color:#666;}
.board-tab button.active{color:#5394e9; border:0; border-bottom:2px solid #5394e9; background:none; outline:0;}
.board-tab button:hover{background:none;}

.board-container dt{height:62px; line-height:62px; font-size:15px; cursor:pointer; border-bottom:1px solid #d7d9da;}
.board-container dt span{font-weight:normal; text-align:left;padding:0 6px; display:inline-block;}
.board-container dt span:first-child{color:#4f5562; text-align:center; width:46px;}
.board-container dt span.type{width:60px; font-weight:normal; font-size:15px; color:#4f5562;}
.board-container dt span.sbj{padding:0 6px;}
.board-container dt span.date{ float:right; margin-right:44px;}
.board-container dd{padding:30px 40px 20px; line-height:24px; border-bottom:1px solid #d7d9da;}
.board-container dd p{padding-bottom:10px;}
.board-container dd a{color:#5394e9; text-decoration:underline;}
.active-header{background:url(../images/common/ico_arrow_up2.gif) no-repeat right;}
.inactive-header{background:url(../images/common/ico_arrow_down2.gif) no-repeat right;}
.inactive-header .sbj{font-weight:normal;}

.active-header .sbj{color:#3e9bf9; font-weight:bold;}
.active-header span:first-child{color:#3e9bf9; font-weight:bold;}
.active-header span.type{color:#3e9bf9; font-weight:bold;}

.board-content{display: none; position:relative; font-size:15px; color:#4f5562; line-height:1.4em !important;}
.active-header span:first-child{color:#5394e9 !important;}

.faq dt span{padding:0 10px 0 0;}
.faq dt span:first-child{padding:0 10px 0 6px;}
.faq dt span.type{width:80px; font-weight:normal; font-size:15px; color:#4f5562; text-align:center;}
.faq dt span.sbj{background:none; padding:0;}
.faq .active-header .sort, .faq .inactive-header .sort, .faq .board-header .sort{text-align:center; width:16px;}
.faq .active-header .sort, .faq .active-header .type, .faq .active-header .sort, .faq .active-header .sbj{color:#5394e9;}
.faq .board-content .sort{float:left; margin-left:-31px; font-weight:bold; font-size:15px; color:#5394e9;}
.faq .board-content p{margin-left:-10px;}

/* login */
.login{min-width: 1280px}
.login .login-container{text-align:center; padding:121px 0 250px;}
.login .login-container .sbj p{font-family: 'Nanum Square'; font-size:30px; letter-spacing:-0.5px; color:#3197ff;}
.login .login-container .sbj h1{font-family: 'Noto Sans KR', sans-serif; text-align:center; width:489px; margin:0 auto;}
.login .login-container .sbj h1 img {width:300px;}
.login .login-box{position:relative; width:488px; margin:28px auto 12px; border-radius:2px; padding:22px 29px 30px; box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);}
.login .login-box h3{font-family: 'Noto Sans KR', sans-serif; font-size:22px; letter-spacing:-0.5px; color:#36393d; margin-bottom:28px; text-align:left;}
.login .login-box h6{ position:absolute; text-align:center; font-size:15px; font-weight:bold; letter-spacing:-0.5px; margin:20px 0 0 -30px; width:100%;}
.login .login-box .hyphen{font-size:16px; font-weight:bold; color:#cbced2;}
.login .login-box p{margin-bottom:20px;display:flex;justify-content:center;align-items:center;}
.login .login-box p.loginInpAuto{margin-top:10px;}
.login .login-box p.loginInpAuto input[type='checkbox']+label{cursor:pointer;}
.login .login-box p.txt{color:#9b9c9d; letter-spacing:-1px;}
.login .login-box p.text{text-align:left; font-size:12px; margin-top:-20px;}
.login .login-box p.text2{text-align:center; font-size:16px; font-family: 'Nanum Square';}
.login .login-box p.text em{ font-family:dotum;}

.login .login-box .select{ float:none; display: inline-block; text-align:left;}
.login .login-box .select span{width:100px; height:43px;}
.login .login-box .select span:hover{border:1px solid #838891;}
.login .login-box .option{position:absolute; top:43px; left:0; display:none; width:98px;}
.login .login-box .option li{padding:8px 0 8px 10px; font-weight:normal; line-height:1.4em; border:0;}
.login .login-box .option li:hover{color:#fff; background:#5394e9;}
.loginBox .loginContent .login-box fieldset .loginInpBox input[type="text"], .login .login-box input[type="password"] {
		color:#4f5562 !important;
    width:427px;
    height:41px;
    padding:0 0 0 0px;
    border:none;
    border-radius:0 !important;
    border-bottom: solid 1px #5394e9;
    background: linear-gradient(to bottom, rgba(255,255,255,0) 96%, #5394e9 4%) ;
    background-position: -427px 0 ;
    background-size: 427px 100%;
    background-repeat: no-repeat;
    font-size:15px;
    margin-top:-3px;
    outline:0;
    -webkit-transition: all 150ms ease-out ;
  	transition:all 150ms ease-out;
		background-image:none !important;
		font-family: 'Noto Sans KR', sans-serif, dotum, Verdana, sans-serif;
}
.loginBox .loginContent .login-box fieldset .loginInpBox input[type="text"]::placeholder, .login .login-box input[type="password"]::placeholder{color:#c1c3d3;}


.login .login-box input[type="password"] {width:427px !important;}

.login .login-box input[type="text"]::-webkit-input-placeholder,
.login .login-box input[type="password"]::-webkit-input-placeholder { 
    -webkit-transition: all 150ms ease-out;
  	transition:all 150ms ease-out; }
.login .login-box input[type="password"]:focus,
.login .login-box input[type="text"]:focus { outline:none !important;border-left:0 !important;border-right:0 !important;border-top:0 !important;border-width:3px !important; background-position:0 0;border-bottom-color:#5394e9 !important; box-shadow:none; }
.login .login-box input[type="password"]:focus::-webkit-input-placeholder,
.login .login-box input[type="text"]:focus::-webkit-input-placeholder {
    color:#5394e9 !important;
    font-size:10px;
    transform:translateY(-20px);
    visibility: visible !important;
    -webkit-transition: all 150ms ease-out;
  	transition:all 150ms ease-out;
}

.login .login-box form{ position:relative; display:inline-block;}

.login .login-box .wt{width:196px !important;}
.login .login-box .wt2{width:314px !important;}
.login .login-box .save{float:left;}
.login .login-box a.reset{float:right; text-decoration:underline;}
.login .login-box .hr{border-top:1px solid #e6e6e6; margin:34px 0 0;}
.loginInpBox input[type="submit"] {font-size:12px !important;font-family: 'Noto Sans KR', sans-serif;font-weight:700;border: 0;margin-top:20px; width:100%; text-align:center; background-color:#5394e9; padding:10px 0; color:#fff; -webkit-transition: all 300ms ease-out';
transition:all 300ms ease-out;cursor:pointer;}
.loginInpBox input[type="submit"]:hover {background-color:#EA6F00; -webkit-transition: all 300ms ease-out;
  	transition:all 300ms ease-out;}
.login .login-box .btn a{display:inline-block; width:429px; height:58px; line-height:58px; background:#5394e9; font-size:15px; color:#fff; border-radius:3px; font-family: 'Noto Sans KR', sans-serif;}
.login .login-box .btn a:hover{background:#4e87d2;}
.login .login-box .btn2 {margin-top:66px;}
.login .login-box .btn2 a{display:block; width:427px; height:56px; line-height:56px; background:#fff; font-size:15px; color:#5394e9; border-radius:3px; border:1px solid #5394e9; font-family: 'Noto Sans KR', sans-serif;}
.login .login-box .btn2 a:hover{background:#f1f7ff;}
.login .login-box .btn a.bt-left{width:206px !important; margin-right:8px; border:1px solid #5394e9; color:#5394e9; background:#fff;}
.login .login-box .btn a:hover.bt-left{background:#f1f7ff;}
.login .login-box .btn a.bt-right{width:206px !important;}

.login .login-box.pw-reset{width:429px; padding:24px 30px 24px; text-align:left}
.login .login-box.pw-reset a{background:#5394e9;}
.login .login-box.pw-reset a:hover{background:#4e87d2;}
.login .login-box.pw-reset .btn-inline{display:inline-block; width:90px; height:43px; line-height:43px; font-size:15px; font-weight:bold; color:#fff; border-radius:3px; text-align:center; margin-left:6px;}
.login .login-box.pw-reset .limit{color:#5394e9; display:inline-block; height:36px;}
.login .login-box.pw-reset .time{font-size:15px; height:36px; line-height:36px; margin-right:14px; color:#9b9c9d;}
.login .login-box.pw-reset .time em{font-weight:bold; color:#5394e9;}
.login .login-box.pw-reset h3{margin-bottom:12px;}
.login .login-box.pw-reset .hr{margin:30px 0;}
.login .login-box .new-pw{width:416px !important;}
.login .login-box .half{width:200px !important;}
.login .login-box.pw-reset .btn {margin-top:10px; text-align:center;}
.login .login-box.pw-reset .btn a{display:inline-block; width:100%;}

.login .login-box.join{width:429px; padding:35px 30px 30px; text-align:left}
.login .login-box.join h6{font-weight:bold; letter-spacing:-1px; position:relative; margin:0; font-size:12px; text-align:left;}
.login .login-box.join h6 .check{ position:absolute; height:20px; top:50%; right:0; transform:translateY(-50%);}
.login .login-box.join .check{float:right;}
.login .login-box.join .check input[type='checkbox']+label{width:48px; margin:0; padding:0; overflow:hidden; text-align:right;}
.login .login-box.join .check.all input[type='checkbox']+label{width:68px; font-family:dotum; font-weight:normal;}
.login .login-box.join .agree-box{margin:18px 0;}
.login .login-box.join .agree-box em{color:#5394e9; font-family:dotum;}
.login .login-box.join .txt-box-scroll{ overflow-y:scroll; height:85px; padding:20px 15px 0; background:#e9edf2; border:1px solid #dcdfe1; border-radius:2px; width:397px; margin:10px 0; line-height:20px; color:#989da5;}
.login .txt-note{width:480px; margin:20px auto 20px; text-align:left; font-size:11px; letter-spacing:-1px; color:#7e818a;}
.login .login-box .txt-note{width:auto; margin:0 auto 20px; text-align:left; font-size:11px; letter-spacing:-1px; color:#7e818a;}
.login .txt-note li{/* background:#fff url(../images/common/blt_square.png) no-repeat 0 8px; */ padding-left:0; line-height:20px; font-size:12px;}

.login .login-box .photo{margin:20px 0; position:relative; border-bottom:1px solid #dcdfe1; padding-bottom:15px;}
.login .login-box .photo .photo-img{display:inline-block; width:134px; height:176px; margin:20px 0; overflow:hidden;}
.login .login-box .photo .photo-img img{width:134px; height:auto;}
.login .login-box .photo .photo-txt{float:right; width:270px; height:80px; padding:20px 0 0 20px; color:#6f7173; margin-top:10px;}
.login .login-box .photo .photo-txt > span{float:left;}
.login .login-box .photo .btn-file { position:absolute; top:110px; left:154px; overflow:hidden; cursor:pointer; background-image:url(../images/join/btn_file.jpg); width:134px; height:31px;}
.login .login-box .photo .btn-file input {position：absolute; filter:alpha(opacity=0); opacity:0; -moz-opacity:0; cursor:pointer; width:134px; height:31px;}
.login .login-box .location{ position:relative; width:423px; display:block;}
.login .login-box .location > a, .login .login-box .location > a:hover{ background:none;}
.login .login-box .location-tlt em{ font-family:dotum;}
.login .login-box .location img{ position:absolute; right:0; top:8px;}

.login .location .select{ float:none; display: inline-block; text-align:left; margin:0 6px 8px 0;}
.login .location .select span{display:block; width:154px; font-weight:normal;}
.login .location .option{width:52px; padding:0 0; height:200px; overflow-y:scroll;}
.login .location .option li{padding:4px 0 4px 10px; cursor:pointer; line-height:26px !important; border:0 !important;}
.login .location > div:nth-child(1).select span{ width:90px;}
.login .location > div:nth-child(1) .option{ width:88px; padding:0;}
.login .location > div:nth-child(2).select span{ width:154px;}
.login .location > div:nth-child(2) .option{ width:152px; padding:0;}
.login .location > div:nth-child(3).select span{ width:130px;}
.login .location > div:nth-child(3) .option{ width:128px; padding:0;}

.login .agency{margin:20px 0 0;}
.login .agency .select{ float:none; display: inline-block; text-align:left; margin:0 6px 8px 0;}
.login .agency .select span{display:block; width:417px; height:41px; padding:0 0 0 10px;  font-weight:normal;}
.login .agency .option{width:415px; padding:0 0; height:200px; overflow-y:scroll;}
.login .agency .option li{padding:8px 0 8px 10px;  font-size:15px; font-weight:normal;}

.login .belong{position:relative; margin:20px 0; height:40px; line-height:40px;}
.login .belong .radio{position:relative; float:none; display:inline;}
.login .belong .belong-sbj{font-size:15px; font-weight:bold; float:left; margin-right:20px;}
.login .belong .radio-area{width:200px;}
.login .belong .belong-input{ position:absolute; top:0; right:0;}
.login .belong .belong-input input[type="text"]{width:220px; background:#fff;}

.login .announce textarea{width:429px; height:80px; padding:14px; box-sizing:border-box; border:1px solid #dcdfe1; border-radius:2px; margin-bottom:40px;}
.login-box .down-wrap{margin:28px 0 18px;}
.login-box .down-wrap li{ text-align:left; font-size:18px;  font-family: 'Noto Sans KR', sans-serif; background:#f4f7fa; height:63px; line-height:63px; margin-bottom:10px; padding-left:18px; position:relative;}
.login-box .down-wrap li:first-child{ height:82px;}
.login-box .down-wrap li span, .login-box .down-wrap li a{ display:inline-block;}
.login-box .down-wrap li span:nth-of-type(2){ width:300px; line-height:1.4em; position:absolute; left:56px; top:50%; transform:translateY(-50%); letter-spacing:-1px;}
.login-box .down-wrap .num{ position:absolute; top:50%; transform:translateY(-50%); background:#5394e9; border-radius:14px; width:27px; height:27px; line-height:28px; text-align:center;  color:#fff; font-size:16px; font-weight:bold;}
/* .login-box .down-wrap li:first-child.num{margin:24px 6px 0 0;} */
.login-box .down-wrap li a.btn_down{ position:absolute; right:0; width:82px; height:82px; line-height:14px; text-align:center; background:#5394e9;}
.login-box .down-wrap li a.btn_down > p{font-size:13px;  font-family: 'Nanum Square'; color:#fff; text-align:center; margin-bottom:4px; margin-top:16px;}
.login-box .down-wrap li a:hover.btn_down{ background:#4e87d2;}

.link-site{margin:20px auto 0; width:429px;}
.link-site li{background: url(../images/common/blt_arrow_right.png) no-repeat 0 7px; padding-left: 12px; text-align:left; font-size:14px; line-height:24px;}
.browser{font-size:12px;font-family: 'Noto Sans KR', sans-serif, dotum, Verdana, sans-serif;display:block; width:490px; height:auto; margin:24px auto 0; letter-spacing:-0.2px; text-align:left;color:#4f5562;}
.browser span{color:#0072bc;}

.login-box h4{font-size:18px; font-family: 'Noto Sans KR', sans-serif;}
.login-box em{color:#5394e9; font-family: 'Noto Sans KR', sans-serif;}

.login .login-box.my-info{width:513px; padding:30px 0 56px; text-align:left}
.login .login-box.my-info > form{ float:left;}
.login .my-info .photo-wrap-left{padding-left:24px; position:relative; display:inline-block; float:left;}
.login .my-info .photo-img{ display:inline-block; width:126px; height:126px; border-radius:50%; overflow:hidden; position:relative; background:#E5E5E5;}
.login .my-info .photo-img img{width:126px; position:absolute; top:50%; left:50%;  /* margin:-63px 0 0; */ transform: translateX(-50%) translateY(-50%);}

.login .my-info .photo-state{position:absolute; display:none; z-index:1; width:100%; background:rgba(0,0,0,.5); text-align:center; color:#fff; height:30px; width:90px; border-radius:15px; line-height:30px; top:50%; left:50%; margin:-15px 0 0 -45px;}

.login .my-info .btn-file {position:absolute; display:block; overflow:hidden; cursor:pointer; background:url(../images/join/btn_photo.png); width:44px; height:44px; top:82px; left:112px;}
.login .my-info .btn-file input {position：absolute; filter:alpha(opacity=0); opacity:0; -moz-opacity:0; cursor:pointer; width:44px; height:44px;}
.login .my-info .photo-txt{width:126px; text-align:center; font-size:16px; font-family: 'Noto Sans KR', sans-serif; color:#6c6d79; margin-top:6px;}
.login .my-info .photo-wrap-right{padding:0 0 0 20px; position:relative; display:inline-block; }
.login .my-info .photo-wrap-right p{margin-top:12px; color:#9b9c9d;}
.login .my-info .photo-wrap-right .apply{ text-align:right; width:100%; display:block; height:38px; margin-top:44px;}
.login .my-info .photo-wrap-right .apply a{ display:block; float:right; width:76px; height:38px; line-height:38px; font-size:14px; font-family: 'Noto Sans KR', sans-serif; color:#fff; background:#5394e9; text-align:center; border-radius:3px; margin-right:53px;}
.login .my-info .photo-wrap-right .apply a:hover{background:#4e87d2;}
.login .my-info .pw-reset{margin:24px 16px 0 16px; border-top:2px solid #e5e5e5;}
.login .my-info .pw-reset a{margin:16px 0 0 12px; display:block; width:94px; height:29px; line-height:29px; padding-left:34px; background:url(../images/join/ico_pw.png) no-repeat; font-size:14px; font-family: 'Noto Sans KR', sans-serif; color:#36393d;}
.login .my-info .hr-bg{ display:block; height:9px; width:100%; background:url(../images/join/bg_hr.gif) repeat-x; border:0; margin-top:16px;}

.login .my-info .myinfo-wrap{padding:30px 24px 0;}
.login .my-info .info-box{padding:40px 20px; border:1px solid #e4e7e8; border-top:2px solid #5394e9; position:relative;}
.login .my-info h4{margin-bottom:18px;}
.login .my-info h4 em{ font-size:14px; color:#a0a9bc;}

.login .my-info .btn-save{width:100%; height:38px; display:block;}
.login .my-info .btn-save a{background:#5394e9 url(../images/common/ico_confirm.png) no-repeat 12px 12px; color:#fff; width:65px; height:38px; line-height:38px; padding-left:12px; display:block; border-radius:3px; text-align:center; font-family: 'Noto Sans KR', sans-serif; font-size: 14px; float:right; margin-right:30px; margin-top:10px;}
.login .my-info .btn-save a:hover{background:#4e87d2 url(../images/common/ico_confirm.png) no-repeat 12px 12px;}
.login .my-info .info-box ul{padding:0 20px;}
.login .my-info .info-box li{border-bottom:1px solid #f1f1f2; line-height:46px; font-size:14px;}
.login .my-info .info-box li:last-child{border-bottom:0;}
.login .my-info .info-box li strong{ display:inline-block; width:160px; color:#0072bc;}

/* 컴포넌트 정의 */
.radio{position:relative; float:left;}
.radio input[type='radio']{position:absolute; top:0; left:0; margin:0; opacity:0; filter:alpha(opacity=0);}
.radio input[type='radio']+label{display:inline-block; height:19px; margin:0 15px 0 0; padding:0 0 0 24px; line-height:19px; background:url(../images/common/ico_radio.png) no-repeat; cursor:pointer;}
.radio input[type='radio']:checked+label{background:url(../images/common/ico_radio.png) no-repeat 0 bottom;}

.check{position:relative; float:left;}
.check input[type='checkbox']{position:absolute; top:0; left:0; margin:0; opacity:0; filter:alpha(opacity=0);}
.check input[type='checkbox']+label{display:inline-block; height:19px; margin:0 15px 0 0; padding:0 0 0 24px; line-height:19px; background:url(../images/common/ico_check.png) no-repeat; cursor:pointer;}
.check input[type='checkbox']:checked+label{background:url(../images/common/ico_check.png) no-repeat 0 bottom;}

.check2{position:relative;}
.check2 input[type='checkbox']{position:absolute; top:0; left:0; margin: 0;}
.check2 input[type='checkbox']+label{width:13px; height:13px; margin:2px 0 -2px 0; padding:0; line-height:13px; background:url(../images/common/ico_check2.png) no-repeat; cursor:pointer;}
.check2 input[type='checkbox']:checked+label{background:url(../images/common/ico_check2.png) no-repeat 0 bottom;}

.check-day{position:relative; float:left;}
.check-day input[type='checkbox']{position:absolute; top:0; left:0; margin:0; opacity:0; filter:alpha(opacity=0);}
.check-day input[type='checkbox']+label{display:inline-block; width:29px; height:29px; line-height:29px !important; background:#fff; border:1px solid #dcdfe1; border-radius:2px; line-height:19px; cursor:pointer; text-align:center; color:#a4a6ac; padding:0; margin:0;}
.check-day input[type='checkbox']:checked+label{background:#5394e9; border:1px solid #5394e9; color:#fff;}

.normal-check{position:relative;}
.normal-check input[type='checkbox']{margin:-1px 4px 0 0;}
.normal-check input[type='checkbox']+label{font-size:15px; font-weight:bold;}

.normal-check2{position:relative;}
.normal-check2 input[type='checkbox']{margin:-1px 2px 0 0;}
.normal-check2 input[type='checkbox']+label{font-size:12px; margin-right:14px;}

input[type='checkbox']+label{ cursor:pointer;}


input[type='checkbox']+label{display:inline-block; height:19px; margin:0 15px 0 0;  line-height:19px; background:url(../images/common/ico_check.png) no-repeat; cursor:pointer;}
input[type='checkbox']:checked+label{background:url(../images/common/ico_check.png) no-repeat 0 bottom;}

.clear-checkbox {position:relative !important;; top:0; left:0; margin:0; opacity:1 !important;; filter:alpha(opacity=1) !important;;}

/* input clear */
.add-clear-span{ height:37px; display:inline-block;}
.add-clear-span a{ background:#fff !important; top:50% !important; transform:translateY(-50%) !important;}
input[type="text"]:-ms-clear {display:none;}

/* footer */
#footer{text-align:center; position:relative; padding:0; margin-left:156px; background:#fff; height:196px;}
#footer.my{margin-left:156px; background:#f3f3f3;}
#footer.join{ color:#777a7b; line-height:20px; border:0; padding:0; margin-left:0; background:#f3f3f3;}
#footer ul{ padding-top:13px;}
#footer li{ display:inline-block;}
#footer li a{display:block; padding:0 20px 0 14px; height:25px; line-height:25px; background:url(../images/common/ico_bar_footer.png) no-repeat right; font-weight:bold; color:#4F5562;}
#footer li:last-child a{ background:none;}
#footer p{margin:12px auto; width:715px; border-bottom:1px solid #d7d7d7; padding-bottom:14px; color:#898989;}
#footer p:last-child{border-bottom:0; font-size:11px;}
#footer span{background:url(../images/common/ico_bar_footer.png) no-repeat right; padding:0 12px 0 6px; font-size:11px; color:#898989;}
#footer span.bg-none{background:none; }
#footer span.bg-none.line{text-decoration:underline;}
#footer span.bg-none.line a{color:#898989;}

/* layer */
.layer{display:none; position:fixed; top:0; left:0; z-index:20; width:100%; height:100%;}
.layer .bg{position:fixed; top:0; left:0; width:100%; height:100%; opacity:.6; filter:alpha(opacity=60); background:#000;}
.layer .inner{position:absolute; top:250px; left:50%; width:460px; height:auto; margin:0 0 0 -230px; border-radius:6px; /* overflow:hidden; */}
.layer-head{height:48px; line-height:48px; background:#5394e9; padding:0 20px; border-radius:6px 6px 0 0;}
.layer-head h2{ display:inline-block; font-size:20px; font-weight:bold; color:#fff;}
.layer-head .close-layer{float:right; width:18px; height:18px; background: url(../images/common/btn_close3.png) no-repeat; text-indent:-100px; overflow:hidden; margin:15px 0 0 0;}
.layer-content{ background:#fff; padding:42px 50px; border-radius:0 0 6px 6px; position:relative;}
.layer-content.wsm{padding:26px;}
.layer-content h5{font-size:17px; font-weight:bold;}
.layer-content ul{margin:24px 0;}
.layer-content strong{font-weight:bold;}

.layer-content th{ font-size:14px; color:#989da5;}
.layer-content th, .layer-content td{padding:4px 0;}
.layer-content .graybox{ position:relative; background:#f4f7fa; border-radius:2px; border:1px solid #dcdfe1; padding:16px;}
.layer-content .graybox > p{ letter-spacing:-0.7px; text-align:center; margin-bottom:24px;}
.layer-content .check-day input[type='checkbox']+label{width:38px; height:38px; line-height:38px !important; font-size:14px; color:#4f5562; font-weight:bold;}
.layer-content .check-day input[type='checkbox']:checked+label{background:#d8e9ff; border:1px solid #76b1ff;}

.layer-content .select.time span{width:122px;}
.layer-content .time .option{width:120px; margin:0; padding:0;}
.layer-content .check{position:relative; float:none; width:100%; margin:16px 0 0; border-top:1px solid #dcdfe1; padding-top:10px;}
.layer-content .normal-check{margin-top:12px;}
.layer-content .normal-check input[type="checkbox"] + label{font-size:12px;}

.dim .check-day input[type='checkbox']+label, .dim .select.time{ opacity:.3;}

.layer .inner.terms{top:50%; width:660px; height:700px; margin:-350px 0 0 -330px; position:relative;}
.terms .layer-content{padding:0 0 42px; position:relative; height:622px;}
.txt-wrap{ position:absolute; height:518px; overflow-y:scroll; padding:42px 77px 0; margin-bottom:24px; width:100%; box-sizing: border-box; }
.txt-wrap h6{font-weight:bold;}

.layer-content h3{font-size:20px; margin:0; line-height:20px; font-family: 'Noto Sans KR', sans-serif;}
.layer-content .error{font-size:26px; line-height:50px; font-family: 'Noto Sans KR', sans-serif;}
.layer-content .txt{ text-align:center; letter-spacing:-1px; color:#989da5; margin-bottom:24px;}

.btn-layer{ display:block; width:100%; text-align:center; margin:0 auto;}
.btn-layer a{ display:inline-block; width:80px; height:36px; line-height:36px; border:1px solid #dcdfe1; border-radius:2px; background:#fff; font-family: 'Noto Sans KR', sans-serif; font-size:13px;}
.btn-layer a:hover{ background:#f4f6f7;}

.terms .btn-layer{ position:absolute; bottom:31px;}

.btn-set{ display:block;; width:100%; text-align:center; margin:0 auto;}
.btn-set a{ display:inline-block; width:132px; height:48px; line-height:48px; border-radius:2px; background:#5394e9; font-family: 'Noto Sans KR', sans-serif; font-size:13px; color:#fff;}
.btn-set a:hover{ background:#4e87d2;}
#WSM04-01-01 .btn-set{margin:16px auto 0;}

.layer-loading{position:fixed; top:0; left:0; z-index:20; width:100%; height:100%;}
.layer-loading .bg{position:fixed; top:0; left:0; width:100%; height:100%; opacity:.6; filter:alpha(opacity=60); background:#000;}
.layer-loading .inner{position:absolute; top:50%; left:50%; width:100px; height:auto; margin:-51px 0 0 -51px; border-radius:6px; /* overflow:hidden; */ background:#fff; text-align:center; overflow:hidden;}
.layer-loading .inner img{width:100px; height:auto;}

#WSM05-01-06.layer{display:none; position:relative; top:0; left:0; z-index:20; width:100%; height:100%;}
#WSM05-01-06 .inner{position:absolute; top:20px; left:50%; width:900px; height:auto; margin-left:-450px; border-radius:6px; background:#fff url(../images/common/bg_pop.gif) repeat-x top; display:block; padding-bottom:20px;}
#WSM05-01-06 .inner h2{font-size:32px; margin:14px 20px; line-height:36px; color:#fff;}
#WSM05-01-06 .txt-box-scroll{ padding:20px 40px; /* overflow-y:scroll; max-height:750px; */}
#WSM05-01-06 .close-layer{float:right; width:18px; height:18px; background: url(../images/common/btn_close3.png) no-repeat; text-indent:-100px; overflow:hidden; margin:8px 0 0 0;}

#WSM07-01-01 .inner{width: 300px; margin:0 0 0 -150px;}
#WSM07-01-01 .layer-content ul{margin:0 0 24px 0;}
#WSM07-01-01 .radio{ float:none; padding:10px 0;}
#WSM07-01-01 a.cancel{width:120px; height:48px; background:#fff; border:1px solid #5394e9; color:#5394e9; box-sizing:border-box;}
#WSM07-01-01 a:hover.cancel{background:#f1f7ff;}
#WSM07-01-01 a.confirm{width:120px; height:48px; border:1px solid #5394e9; box-sizing:border-box;}

/* 공사중 */
.under{ position:absolute; top:40%; left:50%; width:450px; height:160px; margin:-80px 0 0 -225px;}
.under h2{font-family: 'Nanum Square'; font-size:38px; margin-top:48px;}