@charset "utf-8";
@import url("./font-awesome/css/font-awesome.min.css");
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&family=Poppins:wght@100;200;300;400;500;600;700&display=swap'); 
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard-dynamic-subset.css');/* regular-400, medium-500, semibold-600, bold-700 */


/* 컬러 변수 셋팅 */
:root{--primary:#2949b2;--black:#121420;--kr-font:'Pretendard';--eng-font:'Inter'}

*{-webkit-text-size-adjust:none}
body{background:#fff;font-size:0.81em;font-family:'Noto Sans KR'}
h1, h2, h3, h4, h5, h6, input, button, textarea, select{font-family:'Noto Sans KR'}

/* 메뉴오픈 - 스크롤막기 */
#sh_wrapper{position:relative;max-width:1920px;width:100%;margin:0 auto}

/* HEADER */
#sh_hd{position:relative;z-index:15;width:100%;font-family:var(--kr-font)}

/* MAIN  */
#main_banner{position:relative;z-index:10;width:100%;height:100vh;overflow:hidden}

/* INDEX */
#sh_section{overflow:hidden;font-size:16px;line-height:1.6;color:#666;font-family:var(--kr-font)}
 
/* CONTAINER */
#sh_container{position:relative;width:100%;z-index:0}
#sh_container_wrapper{position:relative;width:100%;margin:0 auto;zoom:1;background-color:#fff;z-index: 99}
#sh_container_wrapper:after{display:block;visibility:hidden;clear:both;content:""}

/* SNB */
#sh_aside{position:relative;z-index:15;width:100%;font-family:'Noto Sans KR'}
#sh_aside:after{display:block;content:"";position:absolute;left:0;bottom:0;z-index:-1;width:100%;height:1px;background-color:#e1e1e1}
#sh_aside_wrapper{overflow:hidden;position:relative;max-width:1300px;margin:0 auto;zoom:1}

/* CONTENT */
#sh_content{position:relative;z-index:4;width:100%;max-width:1200px;min-height:580px;margin:0 auto;padding:70px 90px}
#sh_content:after{display:block;visibility:hidden;clear:both;content:""}

/* 하단 */
/* 전체 레이아웃 (좌우 배치) */
/* 1. 가장 바깥쪽 박스에 배경색을 줍니다 */
#sh_ft {
    width: 100%;            /* 너비를 100%로 */
    min-width: 100%;        /* 최소 너비도 100% */
    margin: 0;padding: 0;
    /* 혹시 상위 컨테이너 때문에 갇혀있을 경우를 대비한 강제 확장 코드 */
    position: relative; 
    left: 0; background-color:var(--black) /* ★배경색은 여기서 칠합니다★ */
}

/* 2. 안쪽 박스는 내용을 가운데 정렬하는 역할만 합니다 */
#sh_ft_wrapper {
    width: 100%;
    background-color: transparent; /* 배경색 투명하게 (부모 색 따라가게) */
}

/* 3. 실제 내용물 담는 박스 */
#sh_ft_wrapper .inner {
    max-width: 1500px;      /* 내용은 너무 퍼지지 않게 제한 */
    margin: 0 auto;         /* 화면 중앙 정렬 */
    padding: 40px 20px;     /* 안쪽 위아래 여백 */
    
    /* 플렉스 설정 (좌우 배치) */
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

/* [왼쪽] 회사 정보 영역 스타일 */
.ft_left {
    width: 40%; /* 왼쪽이 차지할 너비 */
}

.ft_logo {
    margin-bottom: 40px; /* 로고 아래 여백 */
}
.ft_logo img {
    max-width: 200px; /* 로고 크기 조절 */
}

.ft_info_box p {
    color: #999; /* 글자색 (회색) */
    font-size: 16px;
    line-height: 1.8; /* 줄 간격 */
    margin-bottom: 5px;
}
.ft_info_box strong {
    color: #fff; /* 항목 이름(CEO 등)은 흰색 */
    font-weight: 600;
    margin-right: 5px;
}
.ft_info_box .bar {
    margin: 0 10px; /* 구분선(|) 좌우 여백 */
    color: #555;
}

/* [오른쪽] 메뉴 영역 스타일 */
.ft_right {
    width: 70%; /* 오른쪽이 차지할 너비 */
    padding-top:72px;
}

.ft_menu > ul {
    display: flex;
    /* justify-content: flex-start;  왼쪽부터 나열 */
    justify-content: flex-end;      /* 오른쪽 정렬 */
    gap: 100px; /* 메뉴 기둥 사이 간격 (넓게) */
    flex-wrap: wrap;
}

/* 메인 메뉴 (대분류) 스타일 - ★여기에 선이 들어갑니다★ */
.ft_menu .main_cate {
    min-width: 120px;
}

.ft_menu .main_link {
    display: block;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    /* text-transform: uppercase; 영문일 경우 대문자로 */
    text-decoration: none;
    
    /* 구분선 만들기 */
    border-bottom: 1px solid rgba(255,255,255,0.4); /* 옅은 흰색 선 */
    padding-bottom: 15px; /* 선과 글자 사이 간격 */
    margin-bottom: 20px; /* 선과 소분류 사이 간격 */
}

/* 소분류 스타일 */
.ft_menu .sub_cate li {
    margin-bottom: 8px;
}
.ft_menu .sub_cate li a {
    color: #888; /* 소분류 글자색 */
    font-size: 16px;
    text-decoration: none;
    transition: color 0.3s;
}
.ft_menu .sub_cate li a:hover {
    color: #fff; /* 마우스 올리면 흰색으로 */
}

/* 최하단 카피라이트 바 */
.copy {
    border-top: 1px solid rgba(255,255,255,0.2); /* 상단 구분선 */
    padding-top: 20px; /* 선과 카피라이트 글자 사이 간격 */
    padding-bottom: 20px;   /* 카피라이트, 화면 맨 밑 사이의 간격 */
    margin-top:0; width:100%;
}
.copy_inner {
    max-width: 1500px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    color: #666;
    font-size: 13px;
    padding:0 20px;
}
.admin_btn {
    color: #555;
    text-decoration: none;
}

/* 반응형 (모바일에서는 세로로 변경) */
@media (max-width: 1024px) {
    #sh_ft_wrapper .inner {
        flex-direction: column; /* 세로 정렬 */
        padding: 50px 20px;
    }
    .ft_left, .ft_right {
        width: 100%; /* 꽉 차게 */
    }
    .ft_left {
        margin-bottom: 50px; /* 위아래 간격 띄우기 */
    }
    .ft_menu > ul {
        gap: 30px; /* 모바일 간격 좁히기 */
    }
}

/* 모바일에서는 2단으로 보이게 조정 */
@media (max-width: 768px) {
    #sh_ft_wrapper .ft_menu > ul {
        display: grid; /* 그리드 방식 사용 */
        grid-template-columns: 1fr 1fr; /* 2열 배치 */
        gap: 20px;
    }
    /* 모바일 폰트 사이즈 미세 조정 */
    .copy_inner {
        flex-direction: column;
        text-align: center;
        gap: 10px;
    }
}

/* 기타 공통 요소 및 하위 호환 */
/* 반응형 하단 버튼 공통 */
#fix_tel{opacity:0;display:none;position:fixed;right:15px;bottom:60px;z-index:101;width:65px;height:65px;margin-right:-10px;border-radius:50%;font-size:30px;text-align:center;line-height:65px;color:#fff;background-color:var(--primary);box-shadow:5px 5px 5px rgba(0,0,0,.2);-webkit-transition:all .2s;transition:all .2s}
#fix_tel.active{opacity:1;margin-right:0}
#sh_ft_btns{display:none;padding:15px}
#sh_ft_btns .btns{overflow:hidden}
#sh_ft_btns .row2 a{width:50%}
#sh_ft_btns a{float:left;display:block;width:100%;height:55px;font-size:16px;line-height:55px;color:#fff;text-align:center;background:var(--primary);font-family:'Noto Sans KR';font-weight:700}
#sh_ft_btns a.tel{font-size:18px;font-weight:700;letter-spacing:0;font-family:'Poppins'}
#sh_ft_btns a i{padding-right:5px;font-size:18px}
#sh_ft_btns a.kakao{font-weight:normal;color:#402325;background-color:#ffe500}

/* 반응형 [s] */
@media (max-width:1500px){
/* #sh_ft_wrapper{padding:0 50px}
#sh_ft_wrapper .inner{max-width:none} 위에서 처리*/
}
@media (max-width:1230px){
#sh_content{max-width:none;padding:70px 50px}
/* #sh_ft_wrapper{padding:0 30px} ft(푸터) 관련 제거 */
}
@media (max-width:1024px){
#sh_section{font-size:15px}
#sh_content{padding:70px 30px}
}
@media (max-width:768px){
/* 반응형 스타일 필수 [s] */
#sh_login, #sh_agree, #sh_register,#sh_mb_confirm, #sh_result{padding:15px;margin:15px auto;border:none}
#sh_login input[type=submit], #sh_agree .btn_wrap input[type=submit], #sh_register .btn_wrap input[type=submit],#sh_find_info input[type=submit], #sh_mb_confirm input[type=submit]{-webkit-appearance:none;appearance:none}
#sh_login .bnr .txt p a{color:#0054a6}
#sh_pw_confirm{width:100%;padding:30px 20px;border:none}
#sh_agree .inner{padding:15px}
#sh_agree .cont{padding:10px}

/* 반응형 스타일 필수 [e] */
#sh_aside{display:none}
#sh_ft_wrapper{font-size:14px}
/* #sh_ft_wrapper .ft_contact li span{display:block}
#sh_ft_wrapper .ft_txt{word-break:keep-all} 기존 푸터 코드 삭제 및 새 디자인 맞게 유지*/
}
@media (max-width:480px){
#sh_section{font-size:14px}
#sh_content{padding:40px 15px}
#fix_tel{display:block}
#sh_ft_btns{display:block}
/* #sh_ft_wrapper{padding:0 15px;font-size:13px}
#sh_ft_wrapper .inner{padding:70px 0 60px}
#sh_ft_wrapper .ft_contact{display:block;margin:25px 0 30px}
#sh_ft_wrapper .ft_contact li span{display:inline-block} */
}
/* @media (max-width:380px){
#sh_ft_wrapper .inner{padding:60px 0 40px}
#sh_ft .copy .copy_inner{display:block;height:auto;padding:10px 0;text-align:center}
#sh_ft .copy ul{justify-content:center}
} */