@charset "utf-8";





.close {
    /*** .modal의 오른쪽 위 ***/
    position: absolute;
    right: 20px;
    top: 20px;
    width: 30px;
    height: 30px;
    cursor: pointer;
}

.close span {
    /*** 흰색 가로 막대 ***/
    position: absolute;
    width: 40px;
    height: 2px;
    background-color: #000;
    top: 14px;
    left: -5px;
}

/*** span 2개를 각각 다른 방향으로 회전 ***/
.close span:nth-child(1) {
    transform: rotate(45deg);
}

.close span:nth-child(2) {
    transform: rotate(-45deg);
}

  body {
background: url(../img/login_back.jpg) center/contain repeat;
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
      margin: 0;
    }

    .login-box {
      background: rgba(255, 255, 255, 0.6);
 
      border-radius: 12px;
      padding: 40px 30px;
      width: 400px;
        height: 400PX;
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
      text-align: center;
    }

    .login-box h2 {
      margin-bottom: 20px;
    }

    .login-box .input-group {
      margin-bottom: 15px;
      text-align: left;
    }

    .login-box label {
      display: block;
      font-size: 14px;
      margin-bottom: 4px;
    }

    .login-box input[type="text"],
    .login-box input[type="password"],
    .login-box button {
      width: 100%;
      padding: 10px;
      border-radius: 6px;
      font-size: 14px;
      box-sizing: border-box;
    }

    .login-box input[type="text"],
    .login-box input[type="password"] {
      border: 1px solid #ccc;
    }

    .login-box button {
      margin-top: 5px;
      background-color: #333;
      color: white;
      border: none;
      font-weight: bold;
      cursor: pointer;
    }

    .login-box button:hover {
      background-color: #555;
    }



    .login-box .social-login {
      margin-top: 20px;
      font-size: 14px;
    }

    .login-box .social-login span {
      font-weight: bold;
      margin: 0 8px;
      color: #333;
      cursor: pointer;
    }

    .login-box .signup {
      margin-top: 20px;
      font-size: 13px;
    }

    .login-box .signup a {
      font-weight: bold;
      text-decoration: none;
      color: #333;
    }