.loginform {
    max-width: 300px;
    margin: 0 auto;
}

div.login_frame {
    overflow: auto;
    width: 100%;
    max-width: 700px;
    margin: 5px auto;
    padding: 2px;
    text-align: center;
    border: 1px solid #dedede;
    border-radius: 20px;
}
div.login_no_frame {
    overflow: auto;
    width: 100%;
    max-width: 700px;
    margin: 5px auto;
    padding: 2px;
    text-align: center;
    border-radius: 20px;
}
.box {
  padding: 50px 0 !important;
}

.sp_parent{
    border: 0px solid #aaa;
    position: relative;
    height: 100px;
    width: 100%;
}

.sp_inner{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    padding: 0px;
    border: 0px solid #ccc;
    width: max-content;
}

.pc_parent{
    border: 0px solid #aaa;
    position: relative;
    height: 90px;
    width: 100%;
}

.pc_inner{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    padding: 0px;
    border: 0px solid #ccc;
}

.form-control {
    margin: 5px;
    height: 40px !important;
}
.sns {
  width: 100%;
  align-items: center;
}

.sns img {
  width: 300px;
  margin: 5px;
  cursor: pointer;
}

.auid-btn {
    width: 300px;
    margin: 5px;
}

@media screen and (max-width: 320px) {
  .auid-btn {
    margin: 20px;
    width: 80%;
    display: flex;
  }
}
.auidloginerror {
  color: red;
}