/* BASIC css start */
/* =============================================================================
   ·Î±×ÀÎ login.html
   ========================================================================== */
#login { margin: 0px 20px; }
#login .login-form,
#login .guest-order-form { position: relative;  }
#login .guest-order-form h4 { margin: 0; padding: 5px; font-size: .75em; font-weight: bold; background-color: #dadada; margin-bottom: 5px; }

#login .input-wrap { position: relative;  }
#login .input-wrap .input-comm { display: block; height: 40px; border: 1px solid #d6d6d6; padding: 0 7px; }
#login .input-wrap .input-comm  input { font-size:13px; -webkit-appearance: none; }
#login .input-wrap .login-input { display: block; width: 100%; height: 100%; border: 0 none; padding: 0; }
#login .input-wrap .input-pwd { margin-top: 5px; }
#login .input-wrap .btn-submit { display: block; position: absolute; right: -2px; top: 0; width: 70px; height: 67px; line-height: 67px; }

#login .login-set { overflow: hidden; width: 100%; margin: 12px 0 17px; }
#login .login-set li { list-style-type: none; float: left; margin-right: 15px; font-size: .75em; line-height: 1em; }
#login .login-set .chk-rdo { vertical-align: bottom; margin-right: 5px; border-radius:0; }

#login .loginBtn { display:block; text-align:center; font-size:14px; font-weight:bold; height:45px; line-height:45px; background:#000; color:#fff; }

#login .login-fail { display: block; position: absolute; left: -1px; top: -1px; width: 100%; height: 100%; background: #fff; border: 3px solid #e7e7e7; -webkit-box-shadow: 3px 3px 10px #99a4b3; -moz-box-shadow: 3px 3px 10px #99a4b3; box-shadow: 3px 3px 10px #99a4b3; }
#login .login-fail .fail-content { padding: 20px 20px 10px; color: #222; }
#login .login-fail .fail-content h3 { margin: 0; font-size: .875em; font-weight: bold; }
#login .login-fail .fail-content p { margin: 0; font-size: .75em; color: #222; }
#login .login-fail .btn-ok { display: block; width: 100%; padding: 6px 0; margin-top: 20px; }

#login .txt-nomem { padding:0; font-size:13px; }
#login .txt-nomem dd { margin-top: 5px; letter-spacing: -0.1em; }
#login .txt-nomem .join-btn { margin: 10px 0; text-align: center; padding: 7px 0px; display:flex; justify-content:center; gap:15px;  }
#login .txt-nomem .join-btn > span { color:#aaa; }

#login .cookie-config { border: 1px solid #dadada; padding: 10px 15px; }
#login .cookie-config p { text-align: center; font-size: .75em; }
#login .cookie-config .wrap { margin-top: 10px; }
#login .cookie-config li { list-style-type: none; }
#login .cookie-config .div { margin-bottom: 10px; }
#login .cookie-config .div strong { font-size: .75em; }
#login .cookie-config .div .sub { padding-left: 10px; font-size: .75em; }

#login .btn-keyboard {font-size: .875em; padding: 0 0 10px; text-align: right; display: block;}
#login .keyboard img {max-width: 100%; margin-bottom: 10px;}
#login .btn-keyboard .open {display:inline-block; width:0; height:0; line-height:0; font-size:0; margin-left:3px; border-top: 8px solid #333; border-left:4px solid transparent;  border-right:4px solid transparent}
#login .btn-keyboard .close {display:inline-block; width:0; height:0; line-height:0; font-size:0; margin-left:3px; border-bottom: 8px solid #333; border-left:4px solid transparent;  border-right:4px solid transparent}

/* ÇÑ±ÛÀÚÆÇ */
#login .btn-keyboard {font-size: .875em; padding: 0 0 10px; text-align: right; display: block;}
#login .keyboard img {max-width: 100%; margin-bottom: 10px;}
#login .btn-keyboard .open {display:inline-block; width:0; height:0; line-height:0; font-size:0; margin-left:3px; border-top: 8px solid #333; border-left:4px solid transparent;  border-right:4px solid transparent}
#login .btn-keyboard .close {display:inline-block; width:0; height:0; line-height:0; font-size:0; margin-left:3px; border-bottom: 8px solid #333; border-left:4px solid transparent;  border-right:4px solid transparent}

.sns-login { position: relative; }
.sns-login > h1 { font-weight:normal; font-size:12px; }
.sns-login .sns-title img { width:300px; }
.sns-login ul li { position: relative; margin-top: 10px; height: 45px; line-height: 45px;  border-radius: 4px; list-style: none; font-size:14px; font-weight:bold; background:#ffe812; text-align:center; }
.sns-login ul li a { display: block; color: #000; font-weight: bold;  }
.sns-login ul li span { position: absolute; top: 0; left: 0; width: 50px; height: 40px; }
.sns-login ul li.facebook span { background: url(/images/d3/m_01/icon/ico_sns_facebook.gif) no-repeat 50% 50%; background-size: 12px auto; }
.sns-login ul li.naver span { background: url(/images/d3/m_01/icon/ico_sns_naver.gif) no-repeat 50% 50%; background-size: 18px auto; }
.sns-login ul li.kakaotalk span { background: url(/images/d3/m_01/icon/ico_sns_kakaotalk.gif) no-repeat 50% 50%; background-size: 20px auto; }
.sns-login ul li.kakaotalk i { position:absolute; left:12px; top:10px; font-size:26px; }
.sns-login ul li.apple span { background: url(/images/d3/m_01/icon/ico_sns_apple.gif) no-repeat 50% 50%; background-size: 20px auto; }


.loginComment { text-align:center; color:#999; margin:30px 0; position:relative; font-size:12px;  }
.loginComment:after { content:''; position:absolute; left:0; width:100%; height:1px; top:50%; background:#d9d9d9; }
.loginComment > span { display:inline-block; background:#fff; position:relative; padding:0 10px; z-index:1;  }



/* BASIC css end */

