@charset "UTF-8";

/* Page Title */

.login_wrap {width:100%; float:left;}

.login_wrap_50 {width:50%; margin:0 auto;}
.login_wrap_50_bg {width:100%; float:left; background:#fff; }

.login    {width:100%;  float:left; }
.login  table   { width:100%; floaT:left; border:0px solid #ddd; padding:35px;display:block; box-sizing:border-box;}
.login  table  th   {padding:6px; vertical-align:middle; text-align:left; font-size:15px; font-weight:500; color:#333; }
.login  table  td   {padding:6px;vertical-align:middle;  font-size:15px; color:#777; }
.login  table  .input01 {width:100%;}

/*search*/
.searching  {width:100%; margin:0 auto; background-color:#fff; box-sizing:border-box; }
.searching  table   {width:100%;  float:left;  margin-top:10px;}
.searching  table  th   {padding:5px; vertical-align:middle; text-align:left; font-size:15px; font-weight:500; color:#333; }
.searching  table  td   {padding:5px;vertical-align:middle;  font-size:15px; color:#777; }
.searching  table  .input01 {width:100%;}
.searching  .title     {color:#005a96; font-weight:600; font-size:25px;  float:left; width:100%;  }
.searching  .info_text     {line-height:1.3em; color:#777; font-size:15px;}

.s_border_box{width:100%; float:left; border:1px solid #ddd; padding:35px; box-sizing:border-box;}

.left_box {width:52%;   box-sizing:border-box; padding:35px 4%; margin:0 auto; border:0px solid #ddd; box-sizing:border-box; }
.right_box {float:right; width:49%; height:230px;  box-sizing:border-box;  padding:35px 4%;  border:1px solid #ddd; box-sizing:border-box; }



.login  .t     {color:#888;  font-size:0.92em; line-height:1.4em; float:left; width:100%; padding:10px 0px 0px 0;}
.login  .title     {color:#333; font-weight:800; font-size:23px;  float:left; width:100%;  }



.login_btn   { width:100px;  float:right;  font-size:1em;  text-align:Center; border-radius:3px;  background-color:#c66358; border:1px solid #c66358;  }


.login_btn  a {
	display:inline-block;
    text-decoration:none;
	width:100%; line-height:74px; font-weight:500;
	}

.login_btn a:link	{  color:#fff;}
.login_btn a:hover	{color:#fff;}
.login_btn a:active	{ color:#fff;}
.login_btn a:visited	{ color:#fff;}


.login  .login_bottom_box   {width:50%; background-color:#f7f7f7;
							margin:0 auto; padding:15px 20px 15px 20px; color:#666;
                            font-size:16px; line-height:1.6em;
							box-sizing: border-box;
							text-align:left;
							-webkit-box-sizing: border-box;
							-moz-box-sizing: border-box;
							}

.login  .login_bottom_box a:link	{ color:#333; font-weight:bold; vertical-align:top;}
.login  .login_bottom_box a:hover	{ color:#333; font-weight:bold; vertical-align:top;}
.login  .login_bottom_box a:active	{ color:#333; font-weight:bold; vertical-align:top;}
.login  .login_bottom_box a:visited	{ color:#333; font-weight:bold; vertical-align:top;}


.login_bottom_box2   {width:100%; background-color:#f7f7f7;
							float:left; padding:15px 10px 15px 10px; color:#666;
                            font-size:16px; line-height:1.6em;
							box-sizing: border-box;
							text-align:center;
							-webkit-box-sizing: border-box;
							-moz-box-sizing: border-box;
							}

.login_bottom_box2 a:link	{ color:#333; font-weight:bold; vertical-align:top;}
.login_bottom_box2 a:hover	{ color:#333; font-weight:bold; vertical-align:top;}
.login_bottom_box2 a:active	{ color:#333; font-weight:bold; vertical-align:top;}
.login_bottom_box2 a:visited	{ color:#333; font-weight:bold; vertical-align:top;}

/* 회원가입 */
.join_check      {width:100%; float:left; color:#555; font-size:0.88em;  text-align:right; padding:12px 0 12px 0;  font-weight:400;  }
.join_area  	 { font-family:'Noto Sans KR',"NanumGothic",NanumGothic,verdana,'Malgun Gothic',맑은고딕,sans-serif; width:100%; box-sizing:border-box;
                float:left; color:#777; font-weight:300;   font-size:14px;  height:210px; line-height:1.6em; border:1px solid #ddd; padding:10px;}


.check_btn   { width:28%; text-align:center; font-size:0.82em; line-height:32px; vertical-align:-3px; background-color:#666;  float:right; border-radius:3px;}


p.join_notice{color:#666;}

.login-page {width: 100%; float:left; border:1px solid #ddd;}
.login-page .mem_tab {width: 100%; float:left;}


.form {
  position: relative;
  z-index: 1;
  background: #FFF;
  max-width: 45%;
  margin: 0 auto;
  padding: 60px;
  text-align: center;
}

.form input {
  outline: 0;
  background: #f2f2f2;
  width: 100%;
  border: 0;
  margin: 0 0 15px;
  padding: 15px;
  box-sizing: border-box;
  font-size: 16px;
}
.form button {
  text-transform: uppercase;
  outline: 0;
  background: #435ca5;
  width: 100%;
  border: 0;
  padding: 16px;
  color: #FFFFFF;
  font-size: 15px;
  letter-spacing:0.5px;
  -webkit-transition: all 0.3 ease;
  transition: all 0.3 ease;
  cursor: pointer;
}
.form button:hover,.form button:active,.form button:focus {
  background: #5973bc;
  text-decoration:underline;
}



.form .message {
  margin: 15px 0 0;
  color: #999;
  font-size: 16px;
}
.form .message a {
  color: #333;
  text-decoration: none;
}
.form .register-form {
  display: none;
}



/* 아이디/비밀번호찾기 */
.form2 {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  max-width: 100%;
  float:left;
  margin: 0 auto;
  padding: 50px;
  box-sizing:border-box;
  text-align: center;
}
.form2 input {
  outline: 0;
  background: #f2f2f2;
  width: 100%;
  border: 0;
  margin: 0 0 15px;
  padding: 15px;
  box-sizing: border-box;
  font-size: 16px;
}
.form2 button {
  text-transform: uppercase;
  outline: 0;
  background: #435ca5;
  width: 100%;
  border: 0;
  padding: 15px;
  color: #FFFFFF;
  font-size: 16px;
  letter-spacing:0.5px;
  -webkit-transition: all 0.3 ease;
  transition: all 0.3 ease;
  cursor: pointer;
}
.form2 button:hover,.form2 button:active,.form2 button:focus {
  background: #5973bc;
  text-decoration:underline;
}

.form2 .message {  margin: 15px 0 0;  color: #999;  font-size: 16px;}
.form2 .message a {  color: #333;  text-decoration: none;}





/* */
input.input_login {border:1px solid #ddd; color:#666; font-size:13px; padding:0 6px; height:36px; line-height:36px; vertical-align:middle;}
input.input_idpw {border:1px solid #ddd; color:#666; font-size:13px; padding:0 6px; height:36px; line-height:36px; vertical-align:middle;}
input[type=checkbox] {width:16px; height:16px; margin:0; font-size:13px; color:#777; vertical-align:middle; margin-right:3px;}

input[type=radio] {width:16px; height:16px; color:#999 !important; font-size:13px; vertical-align:middle;}

/*
input[type=text], input[type=password] {border:1px solid #ddd; color:#666; font-size:13px; padding:0 6px; height:36px; line-height:36px; vertical-align:middle;}
input.input_num {width:25%;}
input.add_num {max-width:60px;}
input.input_date {width:28px;}
input.input_resno {width:132px;}
input.input_file {width:100%; box-sizing:border-box; background:none; font-size:13px;}
input.input_100 {width:100%; box-sizing:border-box;}
*/

/*****  ****/
.cont_title {color:#333}

#login {position:relative; padding:10px 0 0; font-size:0.9em;}
#login .login_ex  {padding-bottom:30px; width:100%; float:left;}
#login .login_order {border-top:1px dashed #ccc; padding:30px 0;}
#login .login_orderlist {border-top:1px dashed #ccc; padding-top:30px;}
#login fieldset {}
#login ul {width:100%; margin:0 auto 10px auto;}
#login li {margin-bottom:5px;}
#login li input[type=text], #login li input[type=password] {width:100%; box-sizing:border-box;}

#login .login_checkbox {padding-bottom:10px; font-size:0.9em; color:#555 !important; }
#login .btn_b {width:100%; height:45px; line-height:45px; font-size:1.2em; font-weight:800 !important; background:#555; color:#fff;}

#login .login_bt {text-align:center; padding:5px 0;}
#login .login_bt a:link,
#login .login_bt a:visited {position:relative; padding:0 10px; font-size:0.98em; font-weight:500;}
#login .login_bt a:before {position:absolute; top:2px; left:0; width:1px; height:14px; background:#dedede;content:""}
#login .login_bt a:first-child:before {display:none}
#login h2 {color:#333; font-size:16px; padding-bottom:5px;}
#login span {color:#666; display:block; padding-bottom:10px; font-size:13px;}
#login .btn_g, #login .btn_wb  {width:40%; height:42px; line-height:42px; font-size:v; font-weight:500;}



#container{
   width: 100%;
	float:left;
   height: 400px;
}

#form{
  width: 100%;
  height: 400px;
  position: absolute;
}

 #sign-in{
  width: 65%;
  height: 450px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  text-align: center;
}

#info{
  color: rgba(255,255,255,0.7);
  font-size: 12px;
  margin-bottom: 30px;
}
#error{
  font-size: 11px;
}
input{
  background: white;
  width: 100%;
  height: 40px;
  margin: 4px 0;
  border: none;
  outline: none;
  text-indent: 7px;
  font-size: 14px;
border:1px solid #ddd;
}
::placeholder{
  color: #999;
}
#submit{
  margin-top: 20px;
}
#submit,#signup{
  font-weight: bold;
  cursor: pointer;
}

/* this is home page*/

#home-container{
  display: none;
  width: 300px;
  height: 300px;
  position: absolute;
}
h4,#bio,time{
  color: white;
  line-height: 1.4;
}
#bio{
  font-size: 15px;
}
time{
  font-size: 13px;
}
 #home-page{
  background: #ee5d5d;
  width: 100%;
  height: 45%;
  text-align: center;
}

#box-container{
  display: inline-block;
  background: white;
  width: 99.5%;
  height: 55%;
  border: 1px solid #ccc;
  border-top: none;
  text-align: center;
}
h5{
  display: inline-block;
  margin: 15px;
  font-size: 16px;
  font-weight: bold;
}
#boxes{
  background: #ccc;
  width: 60px;
  height: 50px;
  margin: 30px 0 0 13px;
  box-shadow: 70px 0 0 0 #ccc,
    140px 0 0 0 #ccc,
    210px 0 0 0 #ccc,
    0px 60px 0 0 #ccc,
    70px 60px 0 0 #ccc,
    140px 60px 0 0 #ccc,
    210px 60px 0 0 #ccc,
    0px 120px 0 0 #ccc,
    70px 120px 0 0 #ccc,
    140px 120px 0 0 #ccc,
    210px 120px 0 0 #ccc;
}
/* sign up container */

#signup-container{
  display: none;
  background: #ee5d5d;
  width: 300px;
  height: 500px;
  position: absolute;
}
#sign-up-form{
  width: 76%;
  height: 300px;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  text-align: center;
  position:absolute;
}
h1{
  margin: 24px;
}
#sign-up-form input{
  margin: 10px 0;
}
#biodata{
  height: 50px;
}
.blind {display:none;}

/**/
.id_search   {width:100%;  float:left; padding:20px;  border-radius:5px; box-sizing:border-box; border:1px solid #ddd; }
.id_search h3   {font-size:1.1em;}

.id_search  table   {width:100%;  float:left; margin-top:10px;  }
.id_search table  td   {padding:0px 0; vertical-align:middle;  font-size:0.92em; color:#777; }
.id_search  input {vertical-align:middle; margin-right:5px;}
.id_search .t_input {float:left; margin-right:10px;  border:1px solid #ddd; color:#999; height:36px;  width:100%;  margin-top:-1px; box-sizing:border-box; padding-left:10px; font-size:0.92em; }

.id_search table td .btn { width:100%; margin-top:10px; line-height:45px; display:inline-block; background-color:#3f7aba; color:#fff; text-align:Center; font-size:1em; font-weight:500;  border-radius:3px; box-shadow:1px 1px 3px #ddd;   }



