@charset "utf-8";
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, dialog, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent; text-align: left;}
body {line-height:1.8}
article, aside, dialog, figure, footer, header, hgroup, nav, section {display:block}
ul, ol {list-style:none}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after, q:before, q:after {content:'';content:none;}
a {margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline;background:transparent}
ins {background-color:#ff9;color:#000;text-decoration:none}
mark {background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del {text-decoration: line-through}
abbr[title], dfn[title] {border-bottom:1px dotted #000;cursor:help}
table {border-collapse:collapse;border-spacing:0}
hr {display:block;height:1px;border:0;border-top:1px solid #cccccc;margin:1em 0;padding:0}
input, select {vertical-align:middle; height: 32px; border-radius: 2px; padding: 1% 10px; border: 1px solid #cccccc; font-family: 'Noto Sans JP', sans-serif; font-size: 16px;}
img {width: 100%; height: auto;}
/*========================================
BASIC
=======================================*/
html{-webkit-text-size-adjust:100%}
body{font-size:14px;background:#202227; line-height:1.6; margin: 0;font-family: 'Noto Sans JP', sans-serif;}
html,body{min-height: 100%;height: auto !important;height: 100%;}
#wrapper {width:100%; margin: 0 auto;overflow: hidden;}
a {color:#403f3f; text-decoration: none;}
a:hover {}

/*========================================
UserLogin
=======================================*/
#userLogin {width:100%;max-width: 1210px; min-width: 900px; margin: 0 auto;} 
#userLogin .logoBlock {position: absolute;width: 50%;min-height: 100%;height: auto !important; height: 100%;left: 0;}
#userLogin .logoBlock h1 {width: 218px;height: 236.5px; position: absolute;top:0;bottom:0;left: 0;right: 0;margin: auto;}
#userLogin h1 img { width: 100%; height: auto;}

#userLogin .formBlock {position : absolute;right: 0;width: 50%;min-height: 100%;height: auto !important;height: 100%;background:#F0F2F5; box-sizing: border-box;padding:0 30px;}
#userLogin .formBlock .Cnt {position: absolute;margin: auto;top:0;bottom:0;left:0;right: 0;width: 310px;height: 150px;}
#userLogin .formBlock .Cnt h2 {text-align: center;font-size: 23px;font-weight: bold;margin-bottom: 10px}

#userLogin input {font-family: 'Noto Sans JP', sans-serif;margin-bottom: 10px}
#userLogin input[type=text], #userLogin input[type=password]{width: 100%;box-sizing: border-box;height: 40px;text-align:left;font-size:13px;color:#000;border: 1px solid #e4e4e4;padding:12px 15px 12px 50px;}
#userLogin input[type=password]{}
#userLogin input[type=button]{}
#userLogin .usrInput {background:#fff url(../img/login/icon-user.png) no-repeat 15px 50%; background-size: 16px;border-radius: 3px;}
#userLogin .passInput {background:#fff url(../img/login/icon-pass.png) no-repeat 15px 50%; background-size: 16px;border-radius: 3px;}
#userLogin a .loginBtn{box-sizing: border-box; margin: 10px 0 20px; text-align: center; width: 100%;height: 40px; border-radius: 4px; padding: 8px 0; font-size: 14px; letter-spacing: 1px;color: #fff; font-weight: bold;-webkit-transition: 0.3s ease; transition: 0.3s ease;/*box-shadow: 0px 3px 4px rgba(0,0,0,0.3);*/background: #0095DA}
#userLogin a .loginBtn:hover{-webkit-transition: 0.3s ease; transition: 0.3s ease;}

@media only screen and (min-width:855px) and (max-width:1100px) {
#userLogin .formBlock {right: 2%;}
#userLogin .logoBlock {width: 60%;}
}

@media screen and (max-width: 854px) {
#userLogin {width:100%;max-width: 100%; min-width: 100%; margin: 0 auto;} 
#userLogin .logoBlock {position: relative;width: 100%;min-height: auto;height: auto !important;left:inherit;}
#userLogin .logoBlock h1 {position: relative;margin:10% auto;width: 195px;}
#userLogin .formBlock {position : relative;right:inherit;width:100%;min-height: auto;height: auto !important;padding:5% 30px;box-shadow: 0px 5px 7px rgba(0,0,0,0.5);}
#userLogin .formBlock .Cnt {position:relative;margin: auto;top:0;bottom:0;left:0;right: 0;max-width: 100%;width: 100%; min-width: 260px; height: auto;}
#userLogin .formBlock .Cnt h2 {text-align: center;font-size: 23px;font-weight: bold;margin-bottom: 10px}

#userLogin .usrInput {background:#fff url(../img/login/icon-user.png) no-repeat 15px 50%; background-size: 16px;border-top-left-radius: 3px;border-top-right-radius: 3px;}
#userLogin .passInput {background:#fff url(../img/login/icon-pass.png) no-repeat 15px 50%; background-size: 16px;border-bottom-left-radius: 3px;border-bottom-right-radius: 3px;}
#userLogin a .loginBtn{box-sizing: border-box; margin: 25px 0 20px; text-align: center; width: 100%;height: 56px; border-radius: 4px;background: #2D287F;border: 2px solid #2D287F; padding: 15px 0; font-size: 14px; letter-spacing: 1px;color: #fff; font-weight: bold;-webkit-transition: 0.3s ease; transition: 0.3s ease;}
#userLogin a .loginBtn:hover{color: #2D287F;background:#f7f7f7;  border: 2px solid #2D287F;-webkit-transition: 0.3s ease; transition: 0.3s ease;}
}
