* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  font-family: 'Source Sans Pro','Helvetica Neue',Helvetica,Arial,sans-serif!important;
}
html {
    height: 100%;
}
body {
    height: 100%;
    margin: 0;
}
.login-table > p{
  font-size:12px;
  color: #11C8F1;
  padding:10px;
}
@media all and (min-width:769px){
  .login-container{
    width:100%;
    height:100%;
    background: #ffffff;
    position: relative;
  }
  .login-cover{
    padding-top: 10%;
    position: relative;
    width:100%;
    max-width:380px;
    height:auto;
    margin:0 auto;
  }
  .login-logo{
    width: 280px;
    height: auto;
    margin: 0 auto;
  }
  .login-logo img{
    width:100%;
    height:auto;
  }
  .login-table{
    width: 100%;
    max-width: 380px;
    height: auto;
    margin: 0 auto;
    border-radius: 20px;
    border: #11C8F1 3px solid;
    margin-top: 18px;
  }
  .login-table-inner{
    margin-top: 37px;
    width: 100%;
  }
  .login-email{
    border: #aaa 0px solid;
        padding: 0px;
        padding-left: 25px;
        padding-right: 25px;
        position: relative;
  }
  ::-webkit-input-placeholder {
      color: #11C8F1;
  }

  input[type=email]{
    font-size: 12px;
    line-height: 21px;
    color: #444;
    border: 1px solid #e1e1e1;
    width: 100%;
    max-width: 100%;
    height: 34px;
    padding: 3px 9px;
  }
  .login-email input[type=email]{
    width: 100%;
    height: 54px;
    border: #11C8F1 2px solid;
    border-radius: 10px;
    color: #11C8F1;
    padding-left: 42px;
  }

  .icon-email{
    width: 25px;
    height: auto;
    position: absolute;
    top: 14px;
    left: 40px;
    z-index: 9999;
  }
  .icon-email img{
    width:100%;
    height:auto;
  }
  .login-password{
    border: #aaa 0px solid;
        padding: 0px;
        padding-left: 25px;
        padding-right: 25px;
        position: relative;
  }
  input[type=password]{
    font-size: 12px;
    line-height: 21px;
    color: #444;
    border: 1px solid #e1e1e1;
    width: 100%;
    max-width: 100%;
    height: 34px;
    padding: 3px 9px;
  }
  .login-password input[type=password]{
    width: 100%;
        height: 54px;
        border: #11C8F1 2px solid;
        border-radius: 10px;
        margin-bottom: 0px;
        margin-top: 25px;
        color: #11C8F1;
        padding-left: 42px;
  }

  .icon-password{
    width: 25px;
    height: auto;
    position: absolute;
    top: 38px;
    left: 40px;
    z-index: 9999;
  }
  .icon-password img{
    width:100%;
    height:auto;
  }
  .login-check{
    text-align: center;
    font-size: 14px;
    margin-top: 20px;
    color: #11C8F1;
  }
  .login-check input[type="checkbox"]{
    border:#11C8F1 1px solid;
  }
  .login-remember{
    text-align: center;
    font-size: 14px;
    margin-top: 20px;
    margin-bottom:10px;
  }
  .login-remember a{
    text-decoration: none;
    color: #11C8F1;
  }
  .login-submit{
    text-align: center;
  }
  .login-submit button{
    -webkit-appearance: none;
    cursor: pointer;
    background: #11C8F1;
    color: #fff;
    border-radius: 30px;
    font-size: 28px;
    width: 200px;
    border: #11C8F1 1px solid;
    margin-top: 40px;
    margin-bottom: 20px;
    height: 62px;
  }
  .login-submit button:hover{
    background: #fff;
    color:#ff666e;
  }
  .reset-exp{
    padding: 10px;
    padding-top: 0px;
  }
  .reset-exp h3{
    font-size: 14px;
    color: #11C8F1;
    line-height: 30px;
    margin-top: 27px;
    margin-bottom: 17px;
    text-align: center;
    font-weight: 400;
  }
  .reset-alert{
    color: #11C8F1;
    font-size:14px
    padding:10px;
  }
  /* チェックボックス */
  /*  DEMO 01 CHECKBOX */
  .label_list {
    max-width: 900px;
    padding-left:0px;
  }
  .label_list::after {
    display: block;
    content: '';
    clear: both;
  }
  .label_list_item {
    display: inline-block;
  }
  .label_list_item label {
    position: relative;
    display: block;
    word-break: break-all;
  }
  .label_list_item label input[type="checkbox"] + span,
  .label_list_item label input[type="radio"] + span {
    position: relative;
    padding: 0 0 0 23px;
  }
  .label_list{
    list-style-type: none;
  }

   .label_list:nth-of-type(1) label input[type="checkbox"] + span::before {
    border-color: #11C8F1;
  }
   .label_list:nth-of-type(1) label input[type="checkbox"]:checked + span::before {
    background-color: #11C8F1;
  }
   .label_list:nth-of-type(2) label input[type="checkbox"] + span::before {
    border-color: #11C8F1;
  }
   .label_list:nth-of-type(2) label input[type="checkbox"]:checked + span::before {
    background-color: #11C8F1;
  }
   .label_list label span {
    display: inline-block;
  }
   .label_list label input[type="checkbox"] {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
  }
   .label_list label input[type="checkbox"] + span::before,  label input[type="checkbox"] + span::after {
    position: absolute;
    top: 1.5px;
    left: 0;
    display: inline-block;
    content: '';
    box-sizing: border-box;
  }
   .label_list label input[type="checkbox"] + span::before {
    z-index: 0;
    background-color: transparent;
    width: 17px;
    height: 17px;
    border: 2px #616161 solid;
    border-radius: 5px;
  }
   .label_list label input[type="checkbox"] + span::after {
    z-index: 1;
    margin: 3.5px 6px;
    width: 6px;
    height: 9px;
  }
   .label_list label input[type="checkbox"]:checked + span::before {
    background-color: #616161;
  }
   .label_list label input[type="checkbox"]:checked + span::after {
    border: 2px solid #fff;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
            transform: rotate(45deg);
  }
  /* チェックボックス */
}
@media all and (max-width:768px){
  .login-container{
    width:100%;
    height:100%;
    background: #ffffff;
    position: relative;
  }
  .login-cover{
    padding-top: 15%;
    position: relative;
    width:100%;
    max-width:380px;
    height:auto;
    margin:0 auto;
    padding-left:15px;
    padding-right: 15px;
  }
  .login-logo{
    width: 240px;
    height: auto;
    margin: 0 auto;
  }
  .login-logo img{
    width:100%;
    height:auto;
  }
  .login-table{
    width: 100%;
    max-width: 380px;
    height: auto;
    margin: 0 auto;
    border-radius: 20px;
    border: #11C8F1 3px solid;
    margin-top: 25px;
  }
  .login-table-inner{
    margin-top: 37px;
    width: 100%;
  }
  .login-email{
    border: #aaa 0px solid;
        padding: 0px;
        padding-left: 25px;
        padding-right: 25px;
        position: relative;
  }
  ::-webkit-input-placeholder {
      color: #11C8F1;
  }

  input[type=email]{
    font-size: 12px;
    line-height: 21px;
    color: #444;
    border: 1px solid #e1e1e1;
    width: 100%;
    max-width: 100%;
    height: 34px;
    padding: 3px 9px;
  }
  .login-email input[type=email]{
    width: 100%;
    height: 54px;
    border: #11C8F1 2px solid;
    border-radius: 10px;
    color: #11C8F1;
    padding-left: 42px;
  }

  .icon-email{
    width: 25px;
    height: auto;
    position: absolute;
    top: 14px;
    left: 40px;
    z-index: 9999;
  }
  .icon-email img{
    width:100%;
    height:auto;
  }
  .login-password{
    border: #aaa 0px solid;
        padding: 0px;
        padding-left: 25px;
        padding-right: 25px;
        position: relative;
  }
  input[type=password]{
    font-size: 12px;
    line-height: 21px;
    color: #444;
    border: 1px solid #e1e1e1;
    width: 100%;
    max-width: 100%;
    height: 34px;
    padding: 3px 9px;
  }
  .login-password input[type=password]{
    width: 100%;
        height: 54px;
        border: #11C8F1 2px solid;
        border-radius: 10px;
        margin-bottom: 0px;
        margin-top: 25px;
        color: #11C8F1;
        padding-left: 42px;
  }

  .icon-password{
    width: 25px;
    height: auto;
    position: absolute;
    top: 38px;
    left: 40px;
    z-index: 9999;
  }
  .icon-password img{
    width:100%;
    height:auto;
  }
  .login-check{
    text-align: center;
    font-size: 14px;
    margin-top: 20px;
    color: #11C8F1;
  }
  .login-check input[type="checkbox"]{
    border:#11C8F1 1px solid;
  }
  .login-remember{
    text-align: center;
    font-size: 14px;
    margin-top: 20px;
    margin-bottom:10px;
  }
  .login-remember a{
    text-decoration: none;
    color: #11C8F1;
  }
  .login-submit{
    text-align: center;
  }
  .login-submit button{
    -webkit-appearance: none;
    cursor: pointer;
    background: #11C8F1;
    color: #fff;
    border-radius: 30px;
    font-size: 28px;
    width: 200px;
    border: #11C8F1 1px solid;
    margin-top: 40px;
    margin-bottom: 20px;
    height: 62px;
  }
  .reset-exp{
    padding: 10px;
    padding-top: 0px;
  }
  .reset-exp h3{
    font-size: 14px;
    color: #11C8F1;
    line-height: 30px;
    margin-top: 27px;
    margin-bottom: 17px;
    text-align: center;
    font-weight: 400;
  }
  .reset-alert{
    color: #11C8F1;
    font-size:14px
    padding:10px;
  }
  /* チェックボックス */
  /*  DEMO 01 CHECKBOX */
  .label_list {
    max-width: 900px;
    padding-left:0px;
  }
  .label_list::after {
    display: block;
    content: '';
    clear: both;
  }
  .label_list_item {
    display: inline-block;
  }
  .label_list_item label {
    position: relative;
    display: block;
    word-break: break-all;
  }
  .label_list_item label input[type="checkbox"] + span,
  .label_list_item label input[type="radio"] + span {
    position: relative;
    padding: 0 0 0 23px;
  }
  .label_list{
    list-style-type: none;
  }

   .label_list:nth-of-type(1) label input[type="checkbox"] + span::before {
    border-color: #11C8F1;
  }
   .label_list:nth-of-type(1) label input[type="checkbox"]:checked + span::before {
    background-color: #11C8F1;
  }
   .label_list:nth-of-type(2) label input[type="checkbox"] + span::before {
    border-color: #11C8F1;
  }
   .label_list:nth-of-type(2) label input[type="checkbox"]:checked + span::before {
    background-color: #11C8F1;
  }
   .label_list label span {
    display: inline-block;
  }
   .label_list label input[type="checkbox"] {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
  }
   .label_list label input[type="checkbox"] + span::before,  label input[type="checkbox"] + span::after {
    position: absolute;
    top: 1.5px;
    left: 0;
    display: inline-block;
    content: '';
    box-sizing: border-box;
  }
   .label_list label input[type="checkbox"] + span::before {
    z-index: 0;
    background-color: transparent;
    width: 17px;
    height: 17px;
    border: 2px #616161 solid;
    border-radius: 5px;
  }
   .label_list label input[type="checkbox"] + span::after {
    z-index: 1;
    margin: 3.5px 6px;
    width: 6px;
    height: 9px;
  }
   .label_list label input[type="checkbox"]:checked + span::before {
    background-color: #616161;
  }
   .label_list label input[type="checkbox"]:checked + span::after {
    border: 2px solid #fff;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
            transform: rotate(45deg);
  }
  /* チェックボックス */
}