@charset "utf-8";

/* 기본 */
*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Noto Sans KR',sans-serif;
}

body{
background:#f4f7fb;
}
html, body{
height:auto;
overflow-x:hidden;
}

#wrap{
width:100%;
min-height:100vh;
}


/* 헤더 */
#header{
width:100%;
background:#0d3a63;
box-shadow:0 2px 6px rgba(0,0,0,0.15);
}

.headerIn{
max-width:800px;
width:95%;
height:70px;
margin:0 auto;
display:flex;
align-items:center;
}

h2{
color:#fff;
font-size:22px;
font-weight:600;
}

/* 컨테이너 */
#container{
max-width:1100px;
width:95%;
margin:40px auto;
background:#ffffff;
border-radius:10px;
padding:40px 60px;
box-shadow:0 4px 14px rgba(0,0,0,0.08);
}

/* 타이틀 */
.tit{
font-size:22px;
font-weight:700;
color:#222;
border-bottom:2px solid #0d3a63;
padding-bottom:12px;
margin-bottom:20px;
}

.subtxt{
font-size:12px;
color:#888;
}

/* 테이블 */
.tb table{
width:100%;
border-collapse:collapse;
}

.tb table tr{
height:auto;
}

.tb table th{
width:150px;
font-weight:600;
color:#333;
border-bottom:1px solid #eee;
padding:10px 5px;
text-align:left;
}

.tb table td{
border-bottom:1px solid #eee;
padding:10px 0;
}

/* 입력창 */
.input_comm{
width:220px;
height:34px;
border:1px solid #ccc;
border-radius:4px;
padding-left:10px;
transition:0.2s;
}

.input_comm:focus{
border-color:#0d6efd;
outline:none;
box-shadow:0 0 3px rgba(13,110,253,0.2);
}

.input_comm1{
width:80px;
height:34px;
border:1px solid #ccc;
border-radius:4px;
padding-left:6px;
}

/* 버튼 */
.btnGray{
width:90px;
height:34px;
background:#e9ecef;
border:1px solid #ccc;
border-radius:4px;
cursor:pointer;
font-size:13px;
}

.btnGray:hover{
background:#dee2e6;
}

.btnOK{
width:240px;
height:48px;
background:#0d3a63;
border:none;
border-radius:6px;
color:#fff;
font-size:18px;
font-weight:600;
cursor:pointer;
transition:0.2s;
}

.btnOK:hover{
background:#145a8f;
}

/* input + 버튼 */
.input_btn_box{
display:flex;
align-items:center;
gap:8px;
}

.input_btn_box input{
width:260px;
flex:none;
}

.input_btn_box button{
height:34px;
}

/* 약관 영역 */
.agreeBox{
margin-top:30px;
padding:15px 10px;
border-top:2px solid #0d3a63;
border-bottom:2px solid #0d3a63;
background:#fafafa;
}

.h{
font-weight:600;
padding-bottom:8px;
border-bottom:1px solid #eee;
margin-bottom:10px;
}

.agreeBox ul{
list-style:none;
}

.agreeBox ul li{
margin:6px 0;
font-size:14px;
}

.agreeBox ul li a{
color:#0d6efd;
font-size:13px;
margin-left:10px;
}

/* 하단 버튼 */
.btnEnd{
text-align:center;
margin-top:30px;
}

/* 팝업 */
#companyPopup{
position:fixed;
top:0;
left:0;
width:100%;
height:100vh;
background:rgba(0,0,0,0.4);
z-index:9999;
display:none;
}

.companyPopupBox{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
width:420px;
max-height:500px;
background:#fff;
border-radius:8px;
box-shadow:0 10px 30px rgba(0,0,0,0.2);
overflow:hidden;
}
.pwMsg{
font-size:13px;
margin-top:6px;
}

.pwOK{
color:#2e7d32;
}

.pwNO{
color:#d32f2f;
}

.email_box{
display:flex;
align-items:center;
gap:6px;
}

.email_box input{
width:150px;
flex:none;
}

.email_box select{
width:160px;
flex:none;
}

.email_at{
font-size:14px;
}

html, body{
height:100%;
}

#wrap{
min-height:100vh;
display:flex;
flex-direction:column;
}

#container{
flex:1;
}

#alertLayer {
    position: fixed !important;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 9999;
}
.swal2-popup {
    font-size: 14px !important;
}
/* =========================
   모바일
========================= */

@media (max-width:768px){
body{
min-height:auto;
overflow-x:hidden;
}

#container{
margin:20px auto;
padding:20px 15px;
}

.tit{
font-size:20px;
}

/* table 모바일 */
.tb table,
.tb table tbody,
.tb table tr,
.tb table th,
.tb table td{
display:block;
width:100%;
}

.tb table th{
border:none;
padding:10px 0 5px 0;
}

.tb table td{
border-bottom:1px solid #eee;
padding-bottom:15px;
}

/* 입력창 */
.input_comm{
width:100% !important;
height:40px;
}

.input_comm1{
width:32% !important;
height:40px;
}

/* 버튼 */
.input_btn_box{
display:flex;
gap:6px;
}

.input_btn_box input{
flex:1;
width:auto !important;
}

.input_btn_box button{
width:90px;
flex-shrink:0;
}


.btnOK{
width:100%;
font-size:16px;
}

}