@charset "utf-8";

/* 버튼 기본 스타일 ------------------------------- */
.btns {display:inline-block; padding:0 15px; height:40px; line-height:40px; font-weight:400; font-size:13px; text-align:center; vertical-align:middle; border-radius:0px; border:1px solid transparent; /* white-space:nowrap; */}
.btns:hover, .btns:focus {opacity:0.9;}
a.btns, button.btns {cursor:pointer;}
/* 스타일 */
.btn_st1 {background:#555; color:#fff;} /* darkgray */
.btn_bdr1 {background:#fff; border-color:#555; color:#555;}

.btn_set {text-align:center; margin:20px 0; overflow:hidden;}

/* 사이즈 구분 */
.btns.primary {height:32px; line-height:30px; padding:0 10px; background:#fff; border:1px solid #b7b7b7; border-radius:3px;}
.btn_mid {height:33px; line-height:33px;}
.btn_xs {padding:0 7px; height:24px; line-height:24px; font-size:12px;}
.btnW40 {min-width:40px;}
.btnW50 {min-width:50px;}
.btnW60 {min-width:60px;}
.btnW70 {min-width:70px;}

/* input[readonly], select[readonly], textarea[readonly], .readonly, input[disabled], select[disabled], textarea[disabled], .disabled {background:#f4f4f4; border-color:#ddd;} */ /* 입력불가 */
/* select */
.select_script {position:relative; width:100%; height:64px; line-height:64px; background:#fff; border:1px solid #ccc; border-radius:10px; text-transform:uppercase; text-align:left;}
.select_script label {position:absolute; top:0; left:0; width:100%; font-size:18px; color:#777; padding:0 35px 0 15px;}
.select_script.on label {color:#111;}
.select_script label:after {content:''; background-position:-316px 0; width:14px; height:8px; position:absolute; top:50%; right:15px; margin-top:-4px;}
.select_script select {width:100%; height:64px; opacity:0; filter:alpha(opacity=0); -ms-filter:alpha(opacity=0)/* IE 8 */;}
/* checkbox */
.chkbox {position:relative; padding-left:25px; display:inline-block; color:#333;}
.chkbox input[type="checkbox"], .chkbox i {position:absolute; top:2px; left:0px; width:19px; height:19px;}
.chkbox input[type="checkbox"] {opacity:0; cursor:pointer; z-index:5;}
.chkbox i {display:inline-block; border:1px solid #ccc; background-color:#fff; z-index:3;}
.chkbox input:checked+i:after {background-position:-295px 0; width:15px; height:16px; position:absolute; top:-2px; left:3px;}

/* 로그인 ------------------------------- */
#login_wrap * {font-family:'NanumSquareRound', Arial, tahoma, Helvetica, sans-serif, Dotum;}
#login_wrap {width:100%; height:100%; position:relative; padding-bottom:450px; box-sizing:border-box;}
#login_box {position:absolute; top:50%; left:0; margin:-200px 0 0 0; width:100%; height:450px; text-align:center; z-index:2;}
#login_box h2 {font-size:18px; font-weight:500; color:#fff; line-height:1.2; position:relative; background:none;}
#login_box h2 img {width:22%; max-width:160px;}
#login_box h2 i {display:block; font-size:10px; color:#fff; font-weight:300;}
#login_box h2 + p {font-size:42px; color:#fff;}
#login_box h2 + p i {font-weight:bold; font-family:Arial, Helvetica, sans-serif, Dotum; font-weight:bold;}
#login_box h2 + p > span {display:block; font-size:24px; color:#222; font-weight:bold;}
#login_box .login_con {margin:30px 0 0; background:#f7f7f7; padding:40px 15px;}
#login_box .login_con .innerwrap {max-width:480px; margin:0 auto;}
#login_box .login_input ul li {margin-top:8px;}
#login_box .login_input ul li:first-child {margin-top:0;}
#login_box .login_input ul li input {background:#fff; border:1px solid #e4e4e4; margin:0; font-size:18px; padding:0px 15px; border-radius:50px; width:100%; height:55px;}
#login_box .login_btn {background:#ff6600; border:0; width:100%; height:60px; line-height:60px; font-size:18px; font-weight:700; color:#fff; text-align:center; margin:20px 0 0; border-radius:50px;}
#login_box .join_btn {background:#596065; border:0; width:100%; height:60px; line-height:60px; font-size:18px; font-weight:700; color:#fff; text-align:center; margin:5px 0 0; border-radius:50px;}
#login_box .login_input ul li input::-webkit-input-placeholder {color:#999; font-size:16px;}/* Webkit */
#login_box .login_input ul li input::-moz-placeholder {color:#999; font-size:16px;}/* moz */
#login_box .login_input ul li input::-ms-input-placeholder {color:#999; font-size:16px;}/* IE10+ */
#login_box .login_input .id_chk {margin:15px 0 0;}
#login_wrap .add_menu {margin-top:20px; text-align:center;}
#login_wrap .add_menu > a {display:inline-block; font-size:15px; color:#888; position:relative; padding:0 10px;}
#login_wrap .add_menu > a:before {content:''; background:#e3e3e3; width:1px; height:17px; position:absolute; top:0; left:0;}
#login_wrap .add_menu > a:first-child:before {display:none;}
#login_wrap .copyright {color:#888; position:absolute; bottom:30px; width:100%; text-align:center; display:none;}
#login_wrap h3 {text-align:left; font-size:20px !important; position:relative; padding-left:10px;}
#login_wrap h3:before {content:''; background:#ff6600; width:4px; height:20px; position:absolute; top:5px; left:0;}
#login_wrap .link_goback {position:fixed; bottom:0; left:0; width:100%; height:60px; background:#aaa; text-align:center;}
#login_wrap .link_goback a {display:block; position:relative; top:50%; transform:translateY(-50%); color:#fff; text-transform:uppercase;}
#login_wrap .idinfo {background:#fff; border-top:2px solid #555; border-bottom:1px solid #555; padding:30px 0; margin-top:20px;}
#login_wrap .idinfo strong {color:#ff6600;}

.mem_input {max-width:480px; margin:0 auto;}
.mem_input ul li + li {margin-top:8px;}
.mem_input ul li input {background:#fff; border:1px solid #e4e4e4; margin:0; font-size:18px; padding:0px 15px; border-radius:50px; width:100%; height:55px;}
.mem_input .login_btn {background:#555; border:0; width:100%; height:60px; line-height:60px; font-size:18px; font-weight:700; color:#fff; text-align:center; margin:20px 0 0; border-radius:50px;}

@media screen and (max-width:1024px) {
/* select */
.select_script {height:48px; line-height:48px; border-radius:5px;}
.select_script label {font-size:15px;}
.select_script select {height:48px;}
}

@media screen and (max-width:768px) {
/* 로그인 ------------------------------- */
#login_box .login_input ul li input, .mem_input ul li input {font-size:16px; height:45px;}
#login_box .login_btn, #login_box .join_btn, .mem_input .login_btn {height:50px; line-height:50px; font-size:16px;}

}