@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:300,400,500,700,900|Noto+Sans+KR:300,400,500,700,900|Noto+Sans:400,700&display=swap');
*{margin:0; padding:0;}
body, html {margin:0; padding:0; height:100%; font-family: 'Noto Sans JP', 'Noto Sans', 'Noto Sans KR', sans-serif; font-size: 12px;}
.login-bg{background:url('../img/login_bg.jpg') no-repeat;  background-size:cover; width:100%; height:100%; position:fixed; display:flex;}
.login-box{width:990px; height:626px; background:#fff; border-radius:10px; box-shadow:0 0 15px 0 #c1c0c0; overflow:hidden; margin:auto;}
.login-box .login-box-left, .login-box .login-box-right{float:left; width:50%;}
.login-logo{text-align:right; padding:15px 15px 0;}
.input-box{width:306px; margin:0 auto;}
.login-tit{font-weight:700; font-size:35px; text-align:center; padding-top:45px;}
label{width:100%; display:block; padding-bottom:10px; font-weight:700 !important;}
.idpw-box{padding-top:60px;}
.input-box .idpw-box input{height:40px; width:100%;}
.idpw-box div{padding:0 0 15px;}
.login-btn{padding-top:30px;}
.login-btn div{padding:0 0 20px;}
.login-btn div:nth-child(1n) span button{display:inline-block; border:0; background: linear-gradient( to left, #01cadf, #0184e2 ); color:#fff; border-radius:12px; text-align:center; padding: 18px 0; width:306px; font-size:25px !important; box-shadow:0 0 10px #01aae0;}
.login-btn div:nth-child(2n) span a{display:inline-block; border:0; background: linear-gradient( to left, #01deb7, #01bfe1 ); color:#fff; border-radius:12px; text-align:center; padding: 18px 0; width:306px; font-size:25px !important; box-shadow:0 0 8px #01aae0; text-decoration:none;}
.login-btn div:hover span button, .login-btn div:hover span a{display:inline-block; box-shadow:1px 5px 10px #01aae0; transition:0.3s;}

.message_box{position:relative;}
.message_box label.error{position:absolute; top:2px; left:7px; color:#ff5722;}

/* signup start */
/* radio button start */
.radio {position: relative;}
.radio input[type="radio"]{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0;}
.radio input[type="radio"] + label{display:inline-block; position:relative; padding-left:30px; cursor:pointer; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none;}
.radio input[type="radio"] + label:before{content:''; position:absolute; left:0; top:0; width:13px; height:13px; text-align:center; background:#fafafa; border:1px solid #cacece; border-radius:100%; box-shadow:0px 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05);}
.radio input[type="radio"] + label:active:before, .radio input[type="radio"]:checked + label:active:before{box-shadow:0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);}
.radio input[type="radio"]:checked + label:before{background:#E9ECEE; border-color:#adb8c0;}
.radio input[type="radio"]:checked + label:after{content:''; position:absolute; top:3px; left:3px; width:9px; height:9px; background:#99a1a7; border-radius:100%; box-shadow:inset 0px 0px 10px rgba(0,0,0,0.3);}
/* radio button end */

.input-box2 .login-tit{padding-top:10px; padding-bottom:25px; font-size:25px;}
.input-box2{width:405px; margin:0 auto;}
.input-box2 label{width:33%; display:inline-block; padding-bottom:0; font-weight:700 !important; vertical-align:middle; font-size:13px;}
.input-box2 input::placeholder{font-size:13px; color:#CDCDCD;}
.input-box2 .check label{width:95%; font-weight:100 !important; font-size:13px; line-height:22px;}
.input-box2 .check label a{display:inline-block; background:#00a0e9; color:#fff; padding:0 10px; border-radius:3px; text-decoration:none; margin-left:5px;}
.input-box2 .check input{vertical-align:top; margin-top:6px; width:auto;}
.input-box2 .radio{padding-right:66px;}
.input-box2 .login-btn{width:305px; margin:0 auto;}
form .input-box2 input{border:1px solid #dcdcdc; border-radius:3px; padding:.4em .5em; width:56%;}
form .input-box2 div{padding-bottom:12px;}
.input-box2 .login-btn{padding-top:15px;}
.input-box2 .login-btn div:nth-child(1n) span button{border-radius:6px; padding:10px 0;}
/* signup end */

.tip{padding: 16px 0; position: fixed; top: 0; background: #006cff; width: 100%;}
.tip p{color: #fff; text-align: center; font-size: 17px; font-weight: 300;}
.tip p a{background:#fff; border-radius:100px; padding: 0 12px 2px; margin-left:10px; text-decoration: none; color: #2196F3;}

.jui .ui-autocomplete{position: absolute; top:529px; z-index:6000; display:block; background:#fff; border-radius:0 0 4px 4px; max-height:200px; overflow-y:scroll; box-sizing:border-box; border:1px solid #e5e5e5;}
.jui .ui-autocomplete li{list-style:none; color:#000;}
.jui .ui-autocomplete li div{padding:3px 10px;}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-wtate-active:hover{background:#d6d6d6; color:#000;}
.ui-helper-hidden-accessible{display:none;}