/* ------ 담당자 주석 표기, 주석 표기 시 가급적 영문표기(언어 설정 에러 시 한글 깨짐), 주요 부분 주석 표기, 사용하지 않는 부분 삭제, 에러 시 오타 확인 ---- */
/* ----------------------------------------------------
--- 1st : 2023.08.21 ch.byeon emro DesignTeam
--- 2st : 2023.10.06 pjsuny emro DesignTeam
---------------------------------------------------- */

@charset "utf-8";
@import url("reset.css");

/** LOGIN LAYOUT **/
body{
  background:#EDF4FB;
}
body.white{
  background:#fff;
}
.wrap {
  display: grid;
  grid-template-rows: 100px 1fr 130px;
  height: 100vh;
}
.header { 
  /* position:absolute;
  transform: translateY(0%); */
  padding: 24px 0;
  width: 100%;
  height: 100px;
  text-align: center;
  background: #fff;
  box-sizing: border-box;
  justify-content: space-between;
  display: flex;
}

/* Developer Area */

.header > div {
    width: 33%
}

.l_sec {
    text-align: left;
    padding: 10px;
    align-self: center;
}

.r_sec {
    text-align: right;
    padding: 10px;
    align-self: center;
}

.userList {
    position: absolute;
    box-shadow: 0px 3px 8px #aaaaaa;
    z-index: 100;
}

.userList table {
    background-color: gray !important;
    border-spacing: 1px !important;
    border-collapse: separate;
    font-size: 12px;
}
.userList table th {
    background-color: bisque  !important;
    padding:2px  !important;
    font-weight: bold;
    text-align: center;
}
.userList table td {
    background-color: white  !important;
    padding:2px  !important;
}
.userList table td:first-child {
    text-align: center !important;
}
.userList table td a {
    color:blue  !important;
    font-weight:bold  !important;
}
.userList .time {
    display: block;
    padding: 10px;
    font-size: 14px;
    font-weight:bold;
}
.userList .link {
    display: block;
    padding: 10px;
    font-size: 14px;
    font-weight:bold;
    color: blue;
    text-decoration: underline !important;
}
.latestUserList {
    height: 400px;
    overflow: auto;
}

.locale {
    align-self: center;
    padding-right: 20px;
}

.main_container { 
  position: relative;
  width: 100%;
  height : calc(100vh - 230px);
  min-height: 100%;
} 
.internal { 
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 1080px; 
  height: 620px;
}
section.content{ 
  display: flex;
}
.footer { 
  position : relative;
  /*transform : translateY(-100%);*/
  padding: 44px 0;
  width: 100%;
  height: 130px;
  font-size: 13px;
  text-align: center;
  color:#8B8B8B;
  background: #454545;
  box-sizing: border-box;
}

/* SECTION */
.left_box{
  width: 756px;
  height: 366px;
}
.main_box{
  height: 366px;
  background: url(../img/main_bg.svg) no-repeat right bottom;
  position: relative;
}
.main_box h2{
  margin-bottom: 12px;
  line-height: 24px;
  font-size: 20px;
  color: #4C4C4E;
  font-weight: 400;
  position: absolute;
  top: -26px;
}
.main_box h3{
  line-height: 36px;
  font-size: 32px;
  color:#003288;
  font-weight: 600;
  position: absolute;
  top: 6px;
}
.en .main_box h2 {
  display: none;
}
.en .main_box h3 {
  font-size: 28px;
  top: -20px;
  line-height: 28px;
}
.right_box{
  width: 388px;
  margin-left: 40px;
}
/* LOGIN */
.login_box{
  /*margin-bottom: 60px;*/
  margin-top: 25px;
  width: 100%;
  height: 386px;
}
.login_box .top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 18px;
}
.login_box h4{
  line-height: 24px;
  color:#003288;
  font-size: 24px;
  font-family: 'Montserrat';
  font-weight: 500;
}
.select_lang,
.toggle_menu {
  display: inline-block;
}
.select_lang> select {
  width: auto;
  height: 22px;
  border-radius: 20px;
  background: #FFFFFF url(../img/btn_down.svg) no-repeat right center;
  border: 1px solid #D6D6D6;
  padding: 0 20px 0 16px;
  color: #003288;
  font-size: 12px;
  font-weight: 500;
  appearance: none;
}
.toggle_menu {
  width: 26px;
  height: 26px;
  margin-left: 16px;
}
.toggle_menu:hover {
  filter: invert(15%) sepia(92%) saturate(7483%) hue-rotate(344deg) brightness(90%) contrast(105%);
}
/* input */
.login_form li input {
  width: 100%;
  height: 48px;
  padding: 0 20px;
  border: 0;
  background: #FAFAFA;
  border: 1px solid #D6D6D6;
  font-family: 'Pretendard', Arial, Helvetica, sans-serif;
  font-size: 14px;
  color: #7B7B7B;
  letter-spacing: 1px;
  box-sizing: border-box;
}
.login_form li {
  margin-bottom: -1px;
}
.login_form li:nth-child(1) input{
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
.login_form li:nth-last-child(1) input{
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}
.login_form li input::placeholder,
.login_form li input::-webkit-input-placeholder,
.login_form li input:-ms-input-placeholder {
  color: #999999;
  letter-spacing: -0.5px;
}
/* option */
.option {
  padding-top: 20px;
  height: 40px;
  font-size: 15px;
  color:#333333;
  letter-spacing: 0;
  box-sizing: border-box;
}
.option .checkBox {
  position: relative;
  display: inline-block;
  line-height: 1;
}
.option .search {
  display: inline-block;
  float: right;
  padding-left: 15px;
}
.option .search a{
  color:#333333;
}
.option .search a:hover {
  color: #7D7D7D;
}
/* btn */
.login_btn{
  margin-top: 30px;
}
.login_btn a {
  width: 100%;
  border-radius: 3px;
  font-size: 20px;
	font-weight: bold;
  color: #fff;
  letter-spacing: -1px;  /* 20230220 */
  vertical-align: middle;
  text-align: center;
  transition: all 0.3s ease;
  overflow: hidden;
}
.login_btn a:hover{
  transition: all 0.5s;
}
.login_btn a.loginbtn{
  margin-bottom:12px;
  height:60px;
  line-height:58px;
  background:#003288;
  border:2px solid #003288;
}
.login_btn a.loginbtn:hover{
  background:transparent;
  color:#003288;
  border:2px solid #003288;
}
.login_btn a.newbtn{
  height:60px;
  line-height:58px;
  background: transparent;
  color:#003288;
  border:2px solid #003288;
  font-size: 19px;
}
.login_btn a.newbtn:hover{
  background:#003288;
  color:#fff;
  border:2px solid #003288;
}
/** INPUT-STYLE **/
/* checkBox */
.checkBox input[type="checkbox"] { /* 실제 체크박스는 화면에서 숨김 */
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip:rect(0,0,0,0);
  border: 0
}
.checkBox input[type="checkbox"] + label {
  display: inline-block;
  position: relative;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}
.checkBox input[type="checkbox"] + label:before {  /* 가짜 체크박스 */
  content: ' ';
  display: inline-block;
  width: 20px;  /* 체크박스의 너비를 지정 */
  height: 20px;  /* 체크박스의 높이를 지정 */
  border-radius: 20px;
  line-height: 13px; /* 세로정렬을 위해 높이값과 일치 */
  margin: -3px 10px 0 0;
  background: #ffffff;
  border: 1px solid #D6D6D6;
  text-align: center;
  vertical-align: middle;
}
.checkBox input[type="checkbox"]:checked + label{ /* 체크박스를 체크했을때 text-color */
  color:#7D7D7D;
}
.checkBox input[type="checkbox"]:checked + label:before {  /* 체크박스를 체크했을때 */
  background: #003288 url(../img/btn_check_on.png) no-repeat 5px;
  border: 1px solid #003288;
}

/** SECTION-CONTENT **/
.flex{
  display: flex;
  justify-content: space-between;
}
.cont_left,
.cont_right{
  width: 534px;
  height: 189px;
}
.cont_right{
  margin-left: 16px;
  background: #fff;
  border-radius: 20px;
  box-shadow: 0px 1px 30px 0px rgba(208,220,237,0.7);
}
.cont_left .flex>a{
  position: relative;
  display: flex;
  align-items: center; 
  justify-content: center;
  width: calc(50% - 8px);
  height: 86px;
  background: #fff;
  color:#333;
  font-size: 18px;
  font-weight: 700;
  border-radius: 20px;
  box-shadow: 0px 1px 30px 0px rgba(208,220,237,0.7);
}
.cont_left .flex>a:hover{
  border:1px solid #003288;
}
.cont_left span.img{
  display: block;
  margin-right: 28px;
  width: 40px;
  height: 40px;
  transition: transform 0.35s ease-in-out;
}
.cont_left .flex>a.menu01>span.img {
  background: url(../img/ico01.svg) no-repeat center;
}
.cont_left .flex>a.menu02>span.img {
  background: url(../img/ico02.svg) no-repeat center;
}
.cont_left .flex>a:hover span.img{
  transform: translate(0, -3px);
}

/* ITEM */
.cont_left .itemBox{
  position: relative;
  margin-top: 16px;
  padding: 0 76px;
  height: 86px;
  background: #fff;
  border-radius: 20px;
  box-shadow: 0px 1px 30px 0px rgba(208,220,237,0.7);
}
.cont_left .itemBox li{
  display: flex;
  align-items: center; 
  justify-content: center;
  padding: 20px;
  width: 138px;
  height: 100%;
  text-align: left;
  box-sizing: border-box;
}
.cont_left .itemBox li a{
  color: #333;
  line-height: 22px;
  font-size: 18px;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
}
.cont_left .itemBox li a:hover{
  color:#003288;
  text-decoration: underline;
}
.slick-slider .slick-track, .slick-slider .slick-list{
  height: 86px;
}

/* arrow */
.itemBox button{
  position: absolute;
  z-index: 10;
  top: 42px;
  transform: translateY(-50%);
  width: 90px;
  height: 20px;
  border: none;
  cursor: pointer;
}
.itemBox button.slick-prev {
  left:0;
  font-size:0;
  color:transparent;
  background: url(../img/arr_left.svg) no-repeat center;
}
.itemBox button.slick-prev:hover,
.itemBox button.slick-next:hover{
  opacity: 0.5;
}
.itemBox button.slick-next {
  right:0;
  font-size:0;
  color:transparent;
  background: url(../img/arr_right.svg) no-repeat center;
}

/* NOTICE */
.main_notice_box{
  padding:25px 40px;
  text-align: left;
}
.main_notice_box .n_title{
  margin-bottom: 20px;
}
.main_notice_box .title_box{
  position: relative;
  width: 100%;
  height: 28px;
  border-bottom: 2px solid #EFEFEF;
}
.main_notice_box .title_box h5{
  position: absolute;
  left: 0;
  padding-bottom: 8px;
  border-bottom: 2px solid #003288;
  color: #000;
  font-size: 18px;
  font-weight: 600;
  font-family:'Pretendard','Malgun Gothic', 맑은 고딕;
  letter-spacing: -0.45px;
}
.main_notice_box .n_title a.plus_btn{
  position: absolute;
  right: 0;
  display: block;
  width: 20px;
  height: 20px;
  background: url(../img/plus_btn.png) no-repeat center;
}
.main_notice_box .n_title a.plus_btn:hover{
  background:#003288 url(../img/plus_btn_over.png) no-repeat center;
  border-radius: 50%;
}
.main_notice_box .notice {
  overflow: hidden;
  box-sizing: border-box;
}
.main_notice_box .notice li {
  padding-left: 10px;
  margin-bottom: 14px;
  height: 20px;
  list-style: none;
  background: url(../img/li_style.png) no-repeat 0 8px;
  font-size: 14px;
}
.main_notice_box .notice li::after {
  content: '';
  display:block;
  clear:both;
}
.main_notice_box .notice li:last-child {
  margin-bottom:0 !important;
  border-bottom:0 ;
}
.main_notice_box .notice li a, .main_notice_box .notice li span {display:inline-block;}
.main_notice_box .notice li a {text-decoration: none;}
.main_notice_box .notice li a:hover {
  text-decoration:underline;
}
.main_notice_box .notice li .text {
  float:left;
  width:80%;
  overflow:hidden;
}
.main_notice_box .notice li .text a.subject {
  float:left;
  overflow:hidden;
  max-width:85%;
  color:#333333;
  white-space:nowrap;
  text-overflow:ellipsis;
  cursor:pointer;
}
.main_notice_box .notice li .text a.subject:hover{
  color:#003288;
}
.main_notice_box .notice li .text i.list_ico_new {
  float: left;
  margin: 2px 0 0 8px;
  width: 15px;
  height: 15px;
  background: url(../img/new.svg) no-repeat center;
  font-size: 0;
  display: inline-block;
  vertical-align: middle;
}
.main_notice_box .notice li span.date {
  float:right;
  width:20%;
  color:#888;
  text-align:right;
  overflow:hidden;
}

/* FOOTER */
.footer ul{
  margin-top: 0px; 
} 
.footer ul li{
  display: inline-block;
  margin: 0 10px; 
}
.footer ul li::before{
  content: '';
  display: block;
  position: relative;
  top: 9px;
  left: -12px; 
  width: 2px;
  height: 2px;
  background: #808080;
}
.footer ul li:nth-child(1)::before{
  display: none;
}
.footer ul li a{
  font-size: 13px;
  color:#A5A5A5;
}
.footer ul li a:hover{
  text-decoration: underline;
}
.footer p{
  margin-top: 8px; 
}
.footer ul li:nth-child(1), footer ul li:nth-child(2){
  font-weight: bold;
}

/** POPUP_PW SEARCH **/
.popupWrap {
  width: 100%;
  height: 100%;
  background: #fff;
 }
.popupWrap .popupHead {
  width: 100%;
  height: 45px;
  background: #003288;
  box-sizing:border-box;
  display: flex;
}
.popupWrap .popupHead b {
  padding-left:20px;
  text-align: left;
  font-size: 18px;
  color:#FFFFFF;
  font-weight: 600;
  line-height: 43px;
  letter-spacing: -1px;
}

.popupWrap .popupHead a {
    color:#FFFFFF;
}

.popupWrap .popupSection {
  padding: 40px;
}
.popupWrap .popupSection .commt {
  margin-bottom: 20px;
  text-align: center;
  font-size: 14px;
  color: #666;
  line-height: 1.8;
}
.popupWrap .popupSection .commt b {
  color: #FF0000;
}
.popupWrap .popupSection .formBox {
  width: 100%;
  height: auto;
  margin: 0 auto;
  padding: 24px;
  background: #f7f7f7;
  box-sizing: border-box;
}
.popupWrap .popupSection .formBox p {
  display: flex;
  justify-content: space-between;
  overflow: hidden;
  padding-bottom: 10px;
  align-items: baseline;
}
.popupWrap .popupSection .formBox p:last-child {
  padding-bottom: 0;
}
.popupWrap .popupSection .formBox label {
  font-size: 14px;
  color: #222;
  vertical-align: middle;
  /*line-height: 2.2;*/
  letter-spacing: -1;
}
.popupWrap .popupSection .formBox input.num {
  padding: 0 10px;
  width: 60px;
  height: 32px;
  background: #fff;
  border: 1px solid #e1e1e1;
  border-radius: 3px;
  vertical-align: middle;
}
.popupWrap .popupSection .formBox input.txt {
  padding: 0 10px;
  width: 300px;
  height: 32px;
  background: #fff;
  border: 1px solid #e1e1e1;
  border-radius: 3px;
  vertical-align: middle;
}
.popupWrap .popupSection .btnArea {
  padding: 40px 0 0 0;
  text-align: center;
}
.popupWrap .popupSection .btnArea a {
  padding: 0px 15px;
  min-width: 110px;
  margin: 0 2px;
  background: #003288;
  border: 1px solid #003288;
  border-radius: 2px;
  text-align: center;
  color: #fff;
  font-size: 16px;
  line-height: 38px;
}
.popupWrap .popupSection .btnArea a:hover {
  background: #FFF;
  border: 1px solid #003288;
  color: #003288;
}

/*** TERMS & PRIVACY ***/
.flex_box{display: flex; justify-content: space-between;}
.blue {color:#0057a6 !important;}
.black {color:#000000 !important;}
.green {color:#8dc345 !important;}
.red{color: #ED3A4B !important;}
.m_n {margin: 0 !important;}
.p_n {padding: 0 !important;}
.m_0{margin: 0 !important;} 
.m_t10{margin-top: 10px !important;}
.m_t30{margin-top: 30px !important;}
.m_t50{margin-top: 50px !important;} 
.m_t70{margin-top: 70px !important;} 
.m_t100{margin-top: 100px !important;} 
.m_t130{margin-top: 130px !important;} 
.m_b30{margin-bottom: 30px !important;}
.f12{font-size: 12px !important;}
.bold{font-weight: bold !important;}
.align_left{text-align: left !important;}
.align_center{text-align: center !important;}

.popupWrap .popupSection .article {
  overflow: hidden;
  overflow-y: auto;
  width: 100%;
  height: 100%;
  max-height: 630px;
  color:#6F6F6F;
}
.popupWrap .popupSection .article>div {
  padding: 20px;
  background: #fafafa;
}
.popupWrap .popupSection .article>div h3 {
  margin-bottom: 15px;
  color: #003288;
  line-height: 18px;
	font-size: 15px;
  font-weight: bold;
}
.popupSection p{
  font-size: 13px;
  color: #575b63;
  line-height: 20px;
}
.popupSection .cont{
  margin-bottom: 50px;
}
.popupWrap .popupSection ul li{
  /* margin-bottom: 10px; */
  padding: 5px 10px;
  font-size: 13px;
  /* line-height: 20px; */
}
.popupWrap .popupSection ol{
  margin-top: 10px;
}
.popupSection2 {
  padding: 40px;
  font-size: 13px;
}
.popupSection2 h1{
  position: relative;
  margin-bottom: 8px;
  padding-left: 8px;
  font-size: 16px;
  font-weight: 600;
}
.popupSection2 h1::before{
  content: '';
  position:absolute;
  display:inline-block;
  top:6px;
  left:0;
  width:3px;
  height:3px;
  background:#006fc1;
}
.popupSection3{
  background:#fff;
}
.popupSection3 .popupheader{
  padding: 30px 40px;
  background-color: #003288; 
}
.popupSection3 .popupheader h1{
  margin: 0;
  padding: 0;
  line-height: 24px;
  font-size: 24px;
  font-weight: bold;
  text-align: left;
  color:#FFFFFF;
}

.popupSection3 .popupCont{
  padding: 10px 40px;
}
.popupSection3 .popupCont h2{
  position: relative;
  margin-bottom: 20px;
  padding-left: 16px;
  font-size: 20px;
  font-weight: bold;
  color: #000;
  text-align: left;
}
.popupSection3 .popupCont h2::before{
  content:'';
  position: absolute;
  top: 5px;
  left: 0;
  background: #EA002C;
  width: 8px;
  height: 8px;
  border-radius: 50%;
}
.popupCont .text_box{
  padding-left: 20px;
  margin-top: 30px;
  text-align: left;
}
.popupCont .text_box h3{
  margin-left: -20px;
  margin-bottom: 12px;
  font-size: 16px;
  font-weight: bold;
}
.popupCont .text_box p{
  margin-bottom: 8px;
  font-size: 14px;
  line-height: 28px;
  color: #555555;
}
.popupCont .list_style li{
  position: relative;
  padding: 0 0 0 10px;
  margin-bottom: 10px;
  line-height: 24px;
  border-bottom: 0;
  color:#555;
  font-size: 14px;
}
.popupCont .list_style li:nth-last-child(1){
  margin-bottom: 0;
}
.popupCont .list_style li::before{
  position: absolute;
  content: ' ';
  top: 10px;
  left: 0;
  width: 3px;
  height: 3px;
  background: #868686;
  border-radius: 25px;
}
.popupCont .comment_box{
  margin-top: 100px;
  padding: 20px 30px;
  background:#F8F8F9;
  border-radius: 10px;
  text-align: left;
}
.popupCont .comment_box h4{
  margin-bottom: 20px;
  color:#585858;
  font-size: 18px;
  font-weight: bold;
}
.popupCont .comment_box ul li{
  position: relative;
  padding: 0 0 0 10px;
  margin-bottom: 14px;
  line-height: 18px;
  border-bottom: 0;
  color:#888;
  font-size: 14px;
} 
.popupCont .comment_box ul li:nth-last-child(1){
  margin-bottom: 0;
}
.popupCont .comment_box ul li::before{
  position: absolute;
  content: ' ';
  top: 6px;
  left: 0;
  width: 3px;
  height: 3px;
  background: #868686;
  border-radius: 25px;
}
.popupCont .comment_box p{
  margin-bottom: 8px;
  color:#333333;
  font-size: 14px;
  font-weight: normal;
  line-height: 22px;
}
.popupCont .comment_box p:nth-last-child(1){
  margin-bottom: 0;
}
.popupCont .list_text ul li{
  position: relative;
  padding: 0 0 0 10px;
  margin-bottom: 14px;
  font-size: 14px;
  line-height: 14px;
  border-bottom: 0;
  color:#555;
}
.popupCont .list_text ul li:nth-last-child(1){
  margin-bottom: 0;
}
.popupCont .list_text ul li::before{
  position: absolute;
  content: ' ';
  top: 6px;
  left: 0;
  width: 3px;
  height: 3px;
  background: #868686;
  border-radius: 25px;
}
.popupCont .lock_box {
  margin: 10px 0 30px 0;
  padding: 3px;
  background: #F0F1F5;
  border-radius: 10px;
}
.popupCont .lock_box ul{
  display: flex;
  justify-content: flex-start;
  background:#fff;
  border-radius: 10px;
}
.popupCont .lock_box ul li{
  padding: 0 0 40px 0;
  width: 25%;
  border-right: 1px solid #F0F1F5;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
}
.popupCont .lock_box ul li .down_btn{
  margin: 20px auto 0;
  width: 100px;
  height: 32px;
  line-height: 30px;
  font-size: 13px;
}
.popupCont .lock_box ul li .down_btn::after{
  right: 20%;
}
.popupCont .lock_box ul li::before{
  content:'';
  display: block;
  margin: 44px auto 50px; 
  width: 150px;
  height: 36px;
}
.popupCont .lock_box ul li.lock_ico_01::before{
  background: url(../img/contents/lock_logo_01.svg) no-repeat center;  
}
.popupCont .lock_box ul li.lock_ico_02::before{
  background: url(../img/contents/lock_logo_02.svg) no-repeat center;  
}
.popupCont .lock_box ul li.lock_ico_03::before{
  background: url(../img/contents/lock_logo_03.svg) no-repeat center;  
}
.popupCont .lock_box ul li.lock_ico_04::before{
  background: url(../img/contents/lock_logo_04.svg) no-repeat center;  
}
.popupCont .lock_box ul li.lock_ico_05::before{
  background: url(../img/contents/lock_logo_05.svg) no-repeat center;  
}
.popupCont .lock_box_text{
  padding: 15px 10px 30px 10px;
}
.popupCont .lock_box_text p{
  text-align: left;
  font-size: 16px;
  line-height: 28px;
}
.popupCont .lock_box ul li.credit_ico_01::before{
  background: url(../img/contents/credit_logo_01.svg) no-repeat center;  
}
.popupCont .lock_box ul li.credit_ico_02::before{
  background: url(../img/contents/credit_logo_02.svg) no-repeat center;  
}
.popupCont .lock_box ul li.credit_ico_03::before{
  background: url(../img/contents/credit_logo_03.svg) no-repeat center;  
}
.popupCont .lock_box ul li.credit_ico_04::before{
  background: url(../img/contents/credit_logo_04.svg) no-repeat center;  
}
.popupCont .lock_box ul li.credit_ico_05::before{
  background: url(../img/contents/credit_logo_05.svg) no-repeat center;  
}
.popupCont .down_btn{
  position: relative;
  margin-top: 20px;
  display: block;
  width: 240px;
  height: 44px;
  line-height: 40px;
  background: #333333;
  border: 1px solid #333;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  border-radius: 25px;
}
.popupCont .down_btn:hover{
  background: transparent;
  color: #333333;
  border: 1px solid #333;
}
.popupCont .down_btn::after{
  content:'';
  position: absolute;
  top: 50%;
  margin-top: -0.1875rem;
  margin-left: 0.5rem;
  width: 0.3rem;
  height: 0.3rem;
  border-top: 0.1rem solid #fff;
  border-right: 0.1rem solid #fff;
  transform: rotate(45deg);
}
.popupCont .down_btn:hover::after{
  border-top: 0.1rem solid #333;
  border-right: 0.1rem solid #333;
}
.popupCont table {
  width:100%;
  box-sizing:border-box;
  white-space:normal;
  text-align:center;
  border-top:1px solid #E1E2E6;
  border-bottom:1px solid #E1E2E6;
}
.popupCont table thead th,
.popupCont table tbody th {
  padding:12px;
  font-size:14px;
  border-right:1px solid #E1E2E6;
  border-bottom:1px solid #E1E2E6;
  font-weight:600; 
  background:#EDEEF3;
}
.popupCont table tbody th, .popupCont table tbody td {
  padding:12px 20px;
  font-size:13px;
  vertical-align:middle;
  border-bottom:1px solid #E1E2E6;
  border-right:1px solid #E1E2E6;
}
.popupCont table thead th:nth-last-child(1), 
.popupCont table tbody th:nth-last-child(1), 
table tbody td:nth-last-child(1){border-right:0;}
/* 
.popupCont table tbody tr:nth-last-child(1) td{border-bottom:0;} */





/** LOGIN SUCCESS & FAIL, ERROR **/
.messageWrap {
  background: #f1f1f1;
}
.messageWrap .wrap {
  position: relative;
  width: 100%;
  height: 100%;
}
.messageWrap .container {
  position: fixed;
  left: 50%;
  top: 50%;
  width: 500px;
  height: 460px;
  margin-top: -280px;
  margin-left: -250px;
  box-shadow: 0px 3px 8px #dadada;
  background: #fff;
  border-radius: 5px;
}
.messageWrap .container2 {
  position: fixed;
  left: 50%;
  top: 50%;
  width: 540px;
  height: 500px;
  margin-top: -300px;
  margin-left: -270px;
  box-shadow: 0px 3px 8px #dadada;
  background: #fff;
  border-radius: 5px;
}
.messageWrap .header {
  width: 100%;
  height: 52px;
  border-radius: 5px 5px 0 0;
  background: #41444e;
  box-sizing: border-box;
}
.messageWrap .header .logo {
  display: inline-block;
  width: 152px;
  height: 34px;
  margin: 20px 0 0 25px;
  background: url(../img/logo_message.png) no-repeat;
  text-indent: -10000px;
}
.messageWrap .section {
  width: 100%;
  box-sizing: border-box;
}
.messageWrap .section .subject {
  overflow: hidden;
  margin: 70px auto 50px;
}
.messageWrap .section .subject b, .messageWrap .section .subject span {
  display: inline-block;
  letter-spacing: -1px;
}
.messageWrap .section .subject b {
  font-size: 80px;
  font-weight: normal;
  vertical-align: top;
  letter-spacing: -6px;
  line-height: 1;
}
.messageWrap .section .subject span {
  padding-top: 10px;
  padding-left: 22px;
  font-size: 28px;
  color: #303030;
  font-weight: bold;
  line-height: 1.2em;
  letter-spacing: -1px;
}
.messageWrap .section .explan {
  width: 330px;
  min-height: 32px;
  margin: 0 auto;
  padding-left: 55px;
  background: url(../img/ico_caution_y.png) no-repeat;
  font-size: 12px;
  color: #7f7f7f;
  line-height: 1.3em;
}
.messageWrap .section .subject2 {
  width: 360px;
  margin: 90px auto 70px;
}
.messageWrap .section .subject2 b {
  display: inline-block;
  min-height: 32px;
  padding-left: 60px;
  padding-top: 7px;
  background: url(../img/ico_caution_y.png) no-repeat;
  font-size: 24px;
  font-weight: bold;
  letter-spacing: -1px;
}
.messageWrap .section .explan2 {
  width: 370px;
  margin: 0 auto;
  font-size: 13px;
  color: #252424;
  line-height: 1.5em;
  text-align: center;
}
.messageWrap .section .subject3 {
  width: 360px;
  margin: 90px auto 70px;
}
.messageWrap .section .subject3 b {
  display: inline-block;
  min-height: 71px;
  padding-left: 100px;
  padding-top: 5px;
  background: url(../img/ico_logout_y.png) no-repeat 38px 16px;
  font-size: 24px;
  font-weight: bold;
  line-height: 1.3em;
  letter-spacing: -1px;
}
.messageWrap .section .hr {
  width: 360px;
  height: 1px;
  margin: 40px auto;
  background: #d4d4d4;
}
.messageWrap .section .hr2 {
  width: 400px;
  height: 1px;
  margin: 40px auto;
  background: #b1b1b1;
}
.messageWrap .section .commt {
  font-size: 15px;
  color: #252424;
  text-align: center;
  line-height: 1.6em;
}
.messageWrap .section .commt b {
  font-weight: normal;
}
.messageWrap .section .btn_bg_msg {
  width: 280px;
  height: 52px;
  padding: 16px 0;
  border: 0;
  background: #003288;
  border: 1px solid #003288;
  text-align: center;
  font-size: 18px;
  color: #fff;
  line-height: 1.3em;
  cursor: pointer;
  border-radius: 5px;
  box-sizing:border-box;
}
.messageWrap .section .btn_bg_msg:hover {
  background: #fff;
  border: 1px solid #003288;
  color: #003288;
  transition: all 0.5s;
}
.messageWrap .section .btn_cnt {
  margin-top: 25px;
  text-align: center;
}


@media (min-width:1280px) and (max-height:720px),
       (min-width:1366px) and (max-height:768px),
       (min-width:1536px) and (max-height:864px){ 
  .header { 
    padding: 24px 0;
    width: 100%;
    height: 100px;
    text-align: center;
    background: #fff;
    box-sizing: border-box; 
  }
  .main_container { 
    width: 100%;
    min-height: 980px;
  }
  .internal{
    height: 654px;
  }
  .login_box {
    margin-bottom: 40px;
  } 
  .footer { 
    padding: 44px 0;
    width: 100%;
    height: 130px;
    font-size: 13px;
    text-align: center;
    color:#8B8B8B;
    background: #454545;
    box-sizing: border-box;
  }
}
@media (min-width:1280px),
       (min-width:1366px),
       (min-width:1536px){
  .login_box {
    /*margin-bottom: 40px;*/
  } 
}