@charset "utf-8";

/* 가장 큰 틀 너비 제시 */
#LOGINBOX {
    width: 1156px;
    height: 850px;
    margin: 90px auto;
    /* position: relative; */
    border: 3px double black;
    display: flex;
    flex-flow: column wrap;
    justify-content: space-around;
    align-items: center;
}

/* 체크 박스에 체크될 시 색 지정 */
input {
    accent-color: rgb(223, 192, 155);
}

/* h2 폰트 설정 */
h2 {
    font-size: 100px;

}


/* 폼 태그 지정 */
#Login {
    width: 500px;
    height: 230px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    flex-flow: column;
    box-sizing: border-box;
    padding: 12px;
}


/* 인풋 속성으로 지정 */
#Login input[type="text"] {
    width: 100%;
    height: 50px;
    border-radius: 10px;
}

#Login input[type="password"] {
    width: 100%;
    height: 50px;
    border-radius: 10px;
}


/* 인풋, 라벨, 버튼 따로 플렉스 속성 지정 */
#Login .EmailBox {
    width: 100%;
    height: 30px;
    align-items: flex-start;
    flex-direction: row;
    margin-bottom: 15px;
}


/* 버튼 크기 및 스타일 지정 */
#Login .EmailBox input[type="button"] {
    width: 100px;
    height: 30px;
    font-size: 15pt;
    float: right;
    border-style: none;
}


/* 버튼 호버 시 효과 지정 */
#Login .EmailBox input[type="button"]:hover {
    text-shadow: -1px 0px greenyellow, 0px 1px greenyellow, 1px 0px greenyellow, 0px -1px greenyellow;
    background-color: rgb(255, 226, 183);
    border-radius: 5px;
}


/* 로그인 및 여러 버튼 지정 */
.log {
    width: 500px;
    height: 32px;
    background-color: beige;
    text-align: center;
    font-size: 15pt;
    padding: 12px 0 0 0;
    border-radius: 15px;
    text-decoration: none;
    color: black;
    text-shadow: 1px 1px 1px greenyellow;
}


/* 버튼 지정 */
.span {
    width: 500px;
    height: 80px;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    margin-bottom: 20px;
}


/* a의 크기 지정 및 속성 추가 */
.span a {
    width: 150px;
    height: 32px;
    background-color: blanchedalmond;
    text-align: center;
    font-size: 15pt;
    padding: 15px 0 0 0;
    border-radius: 15px;
    text-decoration: none;
    color: black;
}


/* a 호버 시 속성 적용 */
.span a:hover {
    color: aliceblue;
    text-shadow: 1px 1px 1px greenyellow;
    background: lightgrey;
}


/* 간편 로그인 폰트 적용 */
.simplelogin > .Qlogin {
    text-align: center;
    font-size: 15pt;
    margin-bottom: 15px;
}


/* 간편 로그인 sns 이미지 적용 */
.simplelogin img {
    width: 40px;
    height: 40px;
    margin-bottom: 15px;
}