@charset "utf-8";

/*---  회원관련 내 테이블은 commom.css에서 제어해줌 ---*/

.join_title{margin-bottom:20px;font-size: 20px;color: #333;font-weight: bold;line-height: 50px;border-bottom: 1px solid #666;}
.join_title em{font-size: 14px;line-height: 20px;font-weight: 400;color: #666;}

/* inform box */
.join_inform{margin-bottom:38px;padding-left:20px;font-size:11px;color:#666}

/* 이용약관,개인정보 내용 */
div.box_guide{margin:12px 0;padding:9px 10px;border:1px solid #dbdbdb;border-top:1px solid #444;background-color:#f3f3f3;}
div.box_guide div{overflow-y:scroll;height:212px;padding:18px;border:1px solid #dbdbdb;background-color:#fff;line-height:18px;color:#666}
div.box_guide div strong{color:#000}
div.agree_check{margin-bottom:30px;text-align:right}
div.agree_check input{margin:0 0 0 18px}
div.agree_check label{color:#666}

/* 본인인증 */
.box_verity{margin:12px 0;border-top:1px solid #444;border-bottom:solid 1px #dbdbdb}
.box_verity .type_check{margin:20px 9px 15px;font-size:11px;text-align:left}
.box_verity .type_check input{margin:0 0 0 18px}
.box_verity .type_check label{color:#666}
.box_verity .type_btn{background:#f1f1f1;padding:12px 27px}
.box_verity ul{margin:20px 27px}
.box_verity ul li{color:#888}

/* 아이디찾기, 비밀번호찾기 */
.box_find{margin:0 auto 30px;padding:0 0 0;width:95%}
.box_find .type_check{padding:20px 9px 0;font-size:11px;text-align:left;border-top:1px solid #444;margin:12px 0 0}
.box_find .type_check input{margin:0 0 0 18px}
.box_find .type_check label{color:#666}
.box_find .enter_info{border-top:solid 1px #ddd;border-bottom:solid 1px #ddd;background:#f7f7f7;padding:20px 27px;margin-top:15px}
.box_find .enter_info table{table-layout:fixed}
.box_find .enter_info table th{text-align:left;font-weight:normal;padding:9px 10px 7px;color:#666;background:url(../imgs/icon/bul_red_square.gif) 0 13px no-repeat}
.box_find .enter_info table td{color:#666;text-align:left}
.box_find .enter_info table td button.floatL{margin-left:15px}

/* 로그인 */
#login_box{width:759px;margin:110px auto;overflow:hidden}
#login_box .login_area{float:left;padding:20px 34px 0}
#login_box .login_area .type_select {position: relative;overflow: hidden;margin-bottom: 15px;}
#login_box .login_area .type_select::before {position: absolute;content: '';bottom: 0;left: 0;width: 100%;height: 1px;background-color: #765625;}
#login_box .login_area .type_select a {float: left;border-top: 1px solid #dcdcdc;border-bottom: 1px solid #765625;text-align: center;background-color: #f7f7f7;line-height: 40px;padding: 0 30px;}
#login_box .login_area .type_select a:last-child {border-right: 1px solid #dcdcdc;}
#login_box .login_area .type_select a~a {border-left: 1px solid #dcdcdc}
#login_box .login_area .type_select a.active {position: relative;border: 1px solid #765625;border-bottom: 0;background-color: #FFF;font-weight: bold;}
#login_box .login_area .type_select a.active::before {position: absolute;content: '';bottom: -1px;left: 0;width: 100%;height: 1px;background-color: #FFF;}
#login_box .login_area form{display:block;position:relative;width:340px;height:108px}
#login_box .login_area form .txt{display:block;margin-bottom:10px;width:100%;height:40px;font-size:14px;line-height:40px;font-weight:bold;color:#666;padding:0 10px;border:solid 1px #aaa}
#login_box .login_area form .input_name{background:#fff url(../imgs/member/txt_login_name.png) 14px 13px no-repeat}
#login_box .login_area form .input_order{background:#fff url(../imgs/member/txt_login_order.png) 14px 13px no-repeat}
#login_box .login_area form .focus{width:100%;height:40px;padding-left:9px;padding-right:9px;border:2px solid #765625;background:#fff}
#login_box .login_area form button{width: 100%;line-height: 50px;text-align: center;color: #FFF;font-size: 16px;font-weight: bold;background-color: #765625;}
#login_box .login_area p{padding-bottom:7px;margin-top:10px}
#login_box .login_banner{float:right;width:348px;text-align:center;margin:1px}
#login_box .login_banner img{width:348px;height:316px}
.box_bt_info {overflow: hidden;margin-bottom: 20px;}
.box_bt_info .save_id{float: left;display: inline;}
.box_bt_info .login_txt{float: right;display: inline;}
.box_bt_info .login_txt a{display: inline-block;font-size: 13px;padding: 0 5px;}
.box_bt_info .login_txt a~a{border-left: 1px solid #dcdcdc;}

/*gate*/
#gate_box{margin:200px auto 0;width:550px;text-align:Center}
#gate_box h1{margin-bottom:18px}
#gate_box .login_box{border:solid 1px #b8b8b8;border-bottom:solid 3px #765625;background-color:#f4f4f4;padding:36px 0 28px}
#gate_box form{overflow:hidden;width:270px;text-align:left;position:relative;margin:0 auto}
#gate_box lable{padding:5px 8px 0 0}
#gate_box input{width:160px;height:20px;border-left:solid 1px #ccc;border-top:solid 1px #ccc;border-bottom:solid 1px #e5e5e5;border-right:solid 1px #e5e5e5;margin-bottom:6px}
#gate_box form button{position:absolute;right:0;top:0}
#gate_box .login_box p{margin:20px 0;font-size:11px;line-height:16px;color:#888}
#gate_box .login_box p em{color:#000}

@media (max-width: 500px) {
    #login_box {
        width: 100%;
    }
    #login_box .login_banner {
        display: none;
    }
    #login_box .login_area {
        float: none;
        padding: 0;
    }
    #login_box .login_area .type_select a {
        font-size: 18px;
        line-height: 50px;
    }
    #login_box .login_area form {
        width: 100%;
        height: auto;
    }
    #login_box .login_area form .txt {
        height: 50px;
        line-height: 50px;
        font-size: 18px;
    }
    .box_bt_info, .box_bt_info .login_txt a {
        font-size: 18px;
    }
    #login_box .login_area form button {
        font-size: 18px;
        line-height: 60px;
    }
}
