/*=================================================================*/
:root { 
    /*font-size: clamp(11px, 0.7vw, 18px); */
    font-size: 1.0vh; /*0.7vw;*/ 
}
html {background-color: whitesmoke;}
body {margin:0; padding:0; font-family: "Nanum Gothic", sans-serif; font-optical-sizing: auto; font-style: normal; font-weight: 400; overflow-x: hidden; 
    -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; user-select:none;} /* 문자열 터치(클릭)시 자동 선택 방지 */  
::-webkit-scrollbar {display:none;} /* 스크롤바 안보이게 */
::-webkit-file-upload-button {cursor: pointer;} /* input type=file의 cursor:pointer 가능하게 */
/*======================================================================================================================*/
/* input 자동완성시 백그라운드 색상 없애기 */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
	-webkit-text-fill-color: #000;
    -webkit-box-shadow: 0 0 0px 1000px #fff inset;
    box-shadow: 0 0 0px 1000px #fff inset;
    transition: background-color 5000s ease-in-out 0s;
}

input:autofill,
input:autofill:hover,
input:autofill:focus,
input:autofill:active {
	-webkit-text-fill-color: #000;
    -webkit-box-shadow: 0 0 0px 1000px #fff inset;
    box-shadow: 0 0 0px 1000px #fff inset;
    transition: background-color 5000s ease-in-out 0s;
}
/*=====================================================================================================================*/
/* 모달 배경 */
.customAlert { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.4); justify-content: center;
    display: none; z-index: 1000;} /* 초기에는 숨김 */
/* 모달 창 */
.alertBox { position: relative; background: whitesmoke; padding: 10px 15px 0 20px; border-radius: 8px; text-align: left; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    width: 325px; height: 140px; margin-top: 12vh;}
/* 버튼 스타일 */
.alertButton { position: absolute; bottom: 15px; left: 50%; transform: translate(-50%, 0); padding: 0 0 2px 0; background-color: #007BFF; color: white;
    border: none; border-radius: 4px; cursor: pointer; font-size: 16px; font-weight: 600; width: 80px; height: 35px; z-index: 1001;}
.alertButton:hover { background-color: #0056b3; }
#alertMessage {font-size: 15px;}
#confirmMessage {font-size: 15px;}
/* 모달 배경 confirm */
#customConfirm { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.4); justify-content: center; display: none; z-index: 1000;} /* 초기에는 숨김 */
/* 모달 창 */
.confirmBox { position: relative; background: whitesmoke; padding: 0 20px 0 20px; border-radius: 8px; text-align:justify; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    width: 330px; height: 160px; margin-top: 12vh; }
/* 버튼 스타일 */
.confirmButton { position: absolute; margin: 0; padding: 0 0 2px 0; border: none; border-radius: 4px; cursor: pointer; bottom: 18px;
    width: 80px; height: 35px; font-size: 16px; font-weight: 600; z-index: 1001;}
.confirmButton.ok { background-color: #007BFF; color: white; right: 52%}
.confirmButton.ok:hover { background-color: #0056b3;}
.confirmButton.cancel { background-color: dimgray; color: white; left: 52%;}
.confirmButton.cancel:hover { background-color: black; opacity: 0.7;}
/*=====================================================================================================================*/