.loginSetting {
   width: 100%;
   max-width: 980px;
   margin: auto;
}

.loginSetting h2 {
    border-bottom: 0.5px solid #333;
    font-weight: bold;
    padding-bottom: 13px;
    font-size: 26px;
    line-height: 37px;
    height: 37px;
   }

.loginEasy{
    display: flex;
    margin-top: 40px;
    max-height: 176px;
    }

.loginEasyImg{
    max-width: 33%;
    max-height: 100%;
    width: auto;
    height: auto;
    margin-right: 16px;
    }

.loginEasyInner{
    flex: 1;
    }

.loginEasyInner h4{
      font-weight: bold;
      font-size: 22px;
      line-height: 31px;
      }

.loginEasyInner p{
      margin-top: 8px;
      font-size: 16px;
      line-height: 24px;
      height: 48px;
      }

.loginSecurity{
      display: flex;
      margin-top: 24px;
      max-height: 176px;
      }

.loginSecurityInner{
      flex: 1;
      }

.loginSecurityInner h4{
      margin-top: 0;
      font-weight: bold;
      height: 31px;
      font-size: 22px;
      line-height: 30px;
      }

.loginSecurityInner p{
      margin-top: 8px;
      height: 25px;
      font-size: 16px;
      line-height: 24px;
      }

.loginSecurityImg{
      max-width: 33%;
      max-height: 100%;
      width: auto;
      height: auto;
      margin-left: 16px;
      }

.loginQR{
      height: 238px;
      background-color: #FDF6EF;
      margin-top: 24px;
      padding: 26px 40px 23px 40px;
      border-radius: 8px;
      }

.loginQR h4{
      font-weight: bold;
      color: #D23A00;
      font-size: 22px;
      line-height: 24px;
      height: 33px;
      }

.loginQRInner{
      display: flex;
      margin-top: 24px;
      }

.loginQRInner p{
      flex: 1;
      font-size: 16px;
      line-height: 24px;
      }

.loginQRImg{
      max-width: 15%;
      max-height: 128px;
      width: auto;
      height: auto;
      flex-shrink: 0;
      margin-right: 16px;
      }

.loginSpQR{
      display: flex;
      margin-top: 48px;
      border-top: 2px solid #DBDBDB;
      padding-top: 40px;
      }

.loginSpQRInnerImg{
      max-width: 33%;
      max-height: 100%;
      width: auto;
      height: auto;
      margin-right: 24px;
      }

.loginSpQRInner{
      flex: 1;
      }

.loginSpQR h4{
      font-weight: bold;
      font-size: 20px;
      line-height: 30px;
      height: 29px;
      }

.loginSpQRInner p{
      margin-top: 16px;
      font-size: 16px;
      line-height: 24px;
      height: 51px;
      }

.loginSpQRBtn{
      margin-top: 26px;
      }

.loginSpQRBtn a{
      position: relative;
      display: inline-block;
      width: 323px;
      height: 54px;
      padding: 18px 28px;
      border-radius: 8px;
      box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
      font-size: 18px;
      font-weight: bold;
      color: #333;
      border: 1px solid #eee;
      overflow: hidden;
      }

.loginSpQRBtn a:hover{
      color: #676767;
      text-decoration: none;
      }

.loginSpQRBtn a:hover
  .loginSpQRBtnArrow {
      border-right-color: #676767;
      border-bottom-color: #676767;
  }

.loginSpQRBtn a::after{
      content: '';
      display: block;
      position: absolute;
      top: 50%;
      left: 50%;
      width: 20px;
      height: 20px;
      border-radius: 50%;
      background: rgba(0, 0, 0, 0.1);
      transform: translate(-50%, -50%) scale(0);
      }

.loginSpQRBtn a:hover::after {
      transform: translate(-50%, -50%) scale(20);
      opacity: 0;
      transition: .8s;
      }

.loginSpQRBtnArrow{
      display: inline-block;
      width: 10px;
      height: 10px;
      border-right: 2px solid #333;
      border-bottom: 2px solid #333;
      transform: rotate(-45deg);
      vertical-align: 1px;
      }

.loginSettingSp {
      padding: 0 25px;
      }

.loginSettingSp h3{
      color: #1B1B1B;
      border-bottom: 0.5px solid #1B1B1B;
      font-weight: bold;
      font-size: 18px;
      padding-bottom: 15px;
      }

.loginEasySp{
      padding-top: 30%;
      background: url('/webcontent/responsible/image/loginSettings/PC_au ID_website renual_image1.png') no-repeat center top;
      background-size: 70%;
      }

.loginEasyInnerSp {
      margin-top: 20px;
      }

.loginEasyInnerSp h4{
      font-weight: bold;
      font-size: 16px;
      }

.loginEasyInnerSp p{
      position: relative;
      padding-top: 8px;
      line-height: 1.5;
      }

.loginSecuritySp{
      padding-top: 30%;
      background: url('/webcontent/responsible/image/loginSettings/PC_au ID_website renual_image2.png') no-repeat center top;
      background-size: 70%;
      }

.loginSecurityInnerSp {
      margin-top: 20px;
      }

.loginSecurityInnerSp h4{
      font-weight: bold;
      font-size: 16px;
      }

.loginSecurityInnerSp p{
      padding-top: 8px;
      line-height: 1.5;
      }

.fidoSettingBtn {
      margin-top: 8%;
      }


.fidoSettingBtn a{
      display: flex;
      align-items: center;
      justify-content: center;
      height: 48px;
      width: 100%;
      background-color: #D23A00;
      padding: 20px 20px;
      font-size: 18px;
      font-weight: bold;
      text-align: center;
      border-radius: 4px;
      color: #FFFFFF;
      }

.fidoSettingBtn a:hover{
     text-decoration: none;
     background-color: #eb5505;
     color: #FFFFFF;
     }

.inputAuId{
      margin-top: 40px;
      text-align: center;
      font-size: 16px;
      color: #1E6AA1;
      }

.inputAuId a{
      text-decoration: none;
      color: inherit;
      font-size: 14px;
      }

.iconLock {
      display: inline-block;
      vertical-align: middle;
      width: 26px; /* アイコンの実サイズに応じて調整 */
      height: 32px;
      background: url('/webcontent/responsible/image/loginSettings/SP_南京錠.png') no-repeat center;
      background-size: 100%;
      margin-bottom: 5px;
      }