/*!
 * css for login.html
 * @author Aaron Jo
 * @date 2017
 */
@charset "utf-8";

/*
    -CSS Selector Description
    #abc > h1 :  직계자식
    #abc h1 : 후손(하위모든자식)
    #abc + h1 : 다음인접
    #abc ~ h1 : 다음형제
*/


/*
* { font-family: sans-serif; }
*/

/* selection */
::-moz-selection { background-color: #2E67D5; color: #fff; }
::selection { background-color: #2E67D5; color: #fff; }

/* scroll */
/*
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track-piece {  background: #eee; }
::-webkit-scrollbar-track-thumb  { background: #888; }
*/

/* tag */
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
    background-color: transparent;
    background-image: none;
    color: rgba(0, 0, 0, 0.0);
}

/* common */
.show { display: block !important; }
.hide { display: none !important; }
.invisible { visibility: hidden !important; }

.txtAC { text-align: center !important; }
.fontWB { font-weight: bold !important; }

.mT20 { margin-top: 20px !important; }
.mT50 { margin-top: 50px !important; }
.mT70 { margin-top: 70px !important; }
.mB20 { margin-bottom: 20px !important; }
.mR5 { margin-right: 5px !important; }

.fc_blue { color: blue !important; }
.fc_red { color: red !important; }
.fc_gray { color: grey !important; }
.fc_black { color: #333 !important; }

/* button */
.inp_btn {
  background-color:#337ab7;
  line-height:30px;
  min-width:60px;
  color:#fff;
  border:1px solid #ccc;
  border-radius:3px;
  padding:0px 10px;
  margin-top:3px;
  margin-bottom:3px;
  letter-spacing:-1px;
  font-size:1em;
}

/* body */
body { overflow-x: auto; overflow-y: auto; }
body { background: #fff; }
/* body { background: #96bb00; } */   /* Apple Green */
/* body { background: #ff715b; } */   /* Bittersweet */
/* body { background: #3c91e6; } */   /* Bleue De France */
/* body { background: #fafffd; } */   /* Ice */
/* body { background: #4c5b5c; } */   /* Feldgrau */
/* body { background: #1c2222; } */   /* Charcoal */

/* header */
.header { width: 100%; height: 80px; background: #f4f4f4; border-bottom: 1px solid #ccc; }
.header .logo { float: left; width: inherit; height: inherit; padding: 15px 30px; }
.header .logo > h1 {
    width: 100%;
    height: 50px;
    background: url('../../common/img/etc/my_pic.png') no-repeat;		/* url('http://tmportal.hi.co.kr/images/pc/logo.png') */
    background-image: url('../../common/img/etc/my_pic.png');
    background-repeat: no-repeat;
    background-position: 0 0;
    -moz-background-size: contain;
    -webkit-background-size: contain;
    -o-background-size: contain;
    background-size: contain;
    text-indent: 80px; /*text-indent: -9999px;*/
    overflow: hidden;
}

/* container */
.container { width: 100%; padding: 25px; margin-right: auto; margin-left: auto; }

/* title */
.title { width: inherit; text-align: center; }
.title_cont { padding:15px 10px; margin: 10px auto 30px auto; text-align: center; }
.title_cont { background-color: #495566; color: #fff; border-radius: 3px; }
.title_cont { max-width: 500px; }
.title_cont > h1 { color: #fff; }

/* login table */
.login { width: 100%; text-align: center; }
.login_icon { width: 100px; height: 100px; display:inline-block; border-radius: 3px; background:url('../../common/img/etc/my_pic.png')  no-repeat center center; -moz-background-size: cover; -webkit-background-size: cover; -o-background-size: cover; background-size: cover; text-indent:-9999em; overflow: hidden; }
.login_cont { max-width: 370px; margin: 0 auto; padding: 20px 0; }
.login_cont table { table-layout: fixed; width: 100%; }
.login_cont table th { text-align: left; padding: 3px 10px 3px 10px; font-size: 15px; color: #242424; word-wrap: break-word; }
.login_cont table td { text-align: center; padding: 3px 0px 3px 0px; }
.login_cont table td { letter-spacing:normal; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }
.login_cont input.inp_text { width: 90%; /*width: 150px;*/ border: 1px solid #d6d6d6; background: rgb(251, 253, 224); font-size: 14px; padding: 4px 5px 6px; margin: 0 0;/*margin: 0 10px;*/ overflow: visible; }
.login_cont input.inp_text:disabled { border: 1px solid #d6d6d6; background: #eee !important; }
.login_cont input.inp_text_disabled { border: 1px solid #d6d6d6; background: #eee !important; }
.login_cont input.inp_btn { width: 100%; /*width: 80px;*/ height: 60px; border: 1px solid #337ab7; background: #337ab7; color: #fff; font-size: 14px; font-weight: bold; overflow: visible; }
.login_cont input.inp_btn:disabled { border: 1px solid #d6d6d6 !important; background: #eee !important; color: #aaa !important; }
.login_cont input.inp_btn_disabled { border: 1px solid #d6d6d6 !important; background: #eee !important; color: #aaa !important; }

/* login desc */
.login_desc { width: 100%; text-align: center; }
.login_desc_cont { max-width: 370px; margin: 0 auto; padding: 5px 0; text-align: center; }

/* step */
.step { width: 100%; text-align: center; }
.step_cont { max-width: 500px; margin: 0 auto; border-spacing:0; border-collapse:collapse; }
.step_cont table { border-top:2px solid #bbc0c7; border-bottom:2px solid #bbc0c7; }
.step_cont table th,.step_cont table td { border-bottom:1px solid #ddd; padding:3px 10px; margin: 0; }
.step_cont table thead th { height:20px; }
.step_cont table th { height:40px; font-size:14px !important; background:#f5f5f5; color:#333; font-weight:bold; text-align:center; }
.step_cont table th~th,.step_cont table td~td,.step_cont table th~td,.step_cont table td~th { border-left:1px solid #ddd; }
.step_cont table td { height:40px; font-size:14px !important; background:#fff; font-weight:bold; letter-spacing:0.1em; }
.step_cont table td { word-break: break-word; word-wrap:break-word; }
.step_cont table .on td { background:#faf5ed; font-weight:bold; }

/* status */
.status { width: 90%; padding-top: 25px; text-align: center; }
.status_cont { width: 350px; margin: 0 auto; font-size: 18px; font-weight: bold; }
/*.status_cont { overflow:scroll; } */

/* cont */
.cont { width: 100%; text-align: center; }
.cont_cont { width: 100%; margin: 0 auto; font-size: 18px; font-weight: normal; }