@charset "utf-8";
* {margin:0px;padding:0px;box-sizing:border-box;}
body, html {height:100%;font-family:helvetica,arial,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;}
/*---------------------------------------------*/
a {color:#666666;text-decoration:none; }
a:focus {outline:none !important;}
a:hover {text-decoration:underline;color:#000;}
/*---------------------------------------------*/
input {outline:none;}
input::-webkit-input-placeholder {color:#999999;}
input:-moz-placeholder {color:#999999;}
input::-moz-placeholder {color:#999999;}
input:-ms-input-placeholder {color:#999999;}
/*---------------------------------------------*/
button {outline:none !important;border:none;background:transparent;}
button:hover {cursor:pointer;}

.txt1 {font-size:11px;color:#666;line-height:1.4;letter-spacing:0.08em;font-weight:bold;}
.w-full {width:100%;}
.m-b-25 {margin-bottom:25px;}
.m-b-40 {margin-bottom:40px;}
.p-t-10 {padding-top:10px;}
.p-t-20 {padding-top:20px;}
.text-center {text-align:center;}
/*//////////////////////////////////////////////////////////////////*/
.container-login {width:100%;min-height:100vh;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;padding:15px;background-repeat:no-repeat;background-size:cover;background-position:center;position:relative;z-index:1;}
.wrap-login {width:420px;background:transparent;background:rgba(255,255,255,0.75);padding:80px 50px 70px;
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translateY(-50%) translateX(-50%);
}
/*------------------------------------------------------------------
[ Logo ]*/
.login-form {width:100%;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;justify-content:space-between;flex-wrap:wrap;}
.login-form-logo {width:100%;}
.login-form-logo img {width:100%;max-width:320px;display:inherit;margin: 0 auto;}
/*---------------------------------------------
[ login ]*/
.wrap-input {position:relative;width:100%;max-width:280px;z-index:1;margin-left:auto;margin-right:auto;}
.input {font-size:12px;line-height:1.2;color:#333333;display:block;width:100%;background:#fff;height:30px;border-radius:15px;padding:0 15px;border:1px solid #999; letter-spacing: 0.08em; font-weight: bold;}
.input:focus {border: 1px solid rgba(0,91,234, 0.6);}
/*------------------------------------------------------------------
[ Focus ]*/
.focus-input {display:block;position:absolute;border-radius:15px;bottom:0;left:0;z-index:-1;width:100%;height:100%;box-shadow:0px 0px 0px 0px;color:rgba(0,91,234, 0.6);}
.input:focus + .focus-input {-webkit-animation:anim-shadow 0.5s ease-in-out forwards;animation:anim-shadow 0.5s ease-in-out forwards;}
@-webkit-keyframes anim-shadow {to {box-shadow:0px 0px 80px 30px;opacity:0;}}
@keyframes anim-shadow {to {box-shadow:0px 0px 80px 30px;opacity:0;}}
/*------------------------------------------------------------------
[ Button ]*/
.wrap-btn {width:100%;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;flex-wrap:wrap;justify-content:center;}
.login-form-btn {font-size:12px;line-height:1.5;color:#fff;width:100px;height:30px;border-radius:15px;background:#000;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;justify-content:center;align-items:center;padding:0 15px;-webkit-transition:background 0.4s;-o-transition:background 0.4s;-moz-transition:background 0.4s;transition:background 0.4s;position:relative;z-index:1; font-weight: bold; letter-spacing: 0.1em;}
.login-form-btn::before {content:"";display:block;position:absolute;z-index:-1;width:100%;height:100%;border-radius:15px;top:0;left:0;background:#005bea;background:-webkit-linear-gradient(left, #005bea, #00c6fb);background:-o-linear-gradient(left, #005bea, #00c6fb);background:-moz-linear-gradient(left, #005bea, #00c6fb);background:linear-gradient(left, #005bea, #00c6fb);-webkit-transition:all 0.4s;-o-transition:all 0.4s;-moz-transition:all 0.4s;transition:all 0.4s;opacity:0;}
.login-form-btn:hover {background:transparent;color:#fff;}
.login-form-btn:hover:before {opacity:1;}
/*------------------------------------------------------------------
[ responsive ]*/
@media (max-width : 475.667px ){
  .wrap-login {padding-top:80px;padding-left:15px;padding-right:15px;position: relative;transform:  none;left: inherit;top: inherit;}
}