@charset "UTF-8";
/*****************************************************************
 HN ROBOTICS 풀페이지 메인 전용 CSS (fullpage-main.css)
 - v2: JS 휠 제어 방식 (테마 CSS와 무관하게 동작, 무료)
 - 1025px 이상에서만 스냅 동작, 이하에서는 일반 스크롤
******************************************************************/

/* ===== 공통 ===== */
/* v2: 스크롤 이동은 JS(휠 제어)가 담당. CSS 스냅은 사용하지 않음 */
#wrapper{padding-top:0 !important;padding-bottom:0;background:#fff;}
#container_wr{padding:0;background:#0b0d12;}

.gw-fp-sec{
    position:relative;
    width:100%;
    height:100vh;
    min-height:700px;
    overflow:hidden;
}

/* ===== 우측 도트 네비게이션 ===== */
#gw-fp-nav{position:fixed;top:50%;right:40px;transform:translateY(-50%);z-index:9000;}
#gw-fp-nav ul{display:flex;flex-direction:column;gap:22px; align-items: flex-end;}
#gw-fp-nav button{display:flex;align-items:center;gap:12px;cursor:pointer;}
#gw-fp-nav .gw-fp-nav-label{
    font-family:"Lexend", sans-serif;font-size:11px;letter-spacing:2px;
    color:rgba(255,255,255,0.0);transition:all .3s;white-space:nowrap;
}
#gw-fp-nav .gw-fp-nav-dot{
    display:block;width:10px;height:10px;border-radius:50%;
    background:transparent;border:2px solid rgba(255,255,255,0.5);
    transition:all .3s;
}
#gw-fp-nav button:hover .gw-fp-nav-label{color:rgba(255,255,255,0.6);}
#gw-fp-nav button.active .gw-fp-nav-dot{background:var(--main-color);border-color:var(--main-color);box-shadow:0 0 12px var(--main-color);}
#gw-fp-nav button.active .gw-fp-nav-label{color:#fff;}

/* ============================================================
   SECTION 01 : CI 인트로
============================================================ */
#gw-fp-sec1{background:#0b0d12;display:flex;align-items:center;justify-content:center;}
.gw-fp-sec1-bg{position:absolute;inset:0;}
.gw-fp-sec1-bg img{
    width:100%;height:100%;object-fit:cover;opacity:0.45;
    transform:scale(1.12);
    transition:transform 6s cubic-bezier(0.19,1,0.22,1);
}
#gw-fp-sec1.is-view .gw-fp-sec1-bg img{transform:scale(1.0);}
.gw-fp-sec1-overlay{
    position:absolute;
    inset:0;
    background: radial-gradient(ellipse at 50% 120%, rgba(0,0,0,0) 0%, rgba(11,13,18,0.35) 70%),
        linear-gradient(180deg, rgba(11,13,18,0.55) 0%, rgba(11,13,18,0.25) 45%, rgba(11,13,18,0.1) 100%);
}
/* 은은하게 떠다니는 광원 */
.gw-fp-orb{position:absolute;border-radius:50%;filter:blur(90px);opacity:0.35;pointer-events:none;}
.gw-fp-orb01{width:520px;height:520px;left:-120px;top:-120px;background:var(--main-color);animation:gwFpOrb 14s ease-in-out infinite alternate;}
.gw-fp-orb02{width:420px;height:420px;right:-100px;bottom:-100px;background:#2b6cff;animation:gwFpOrb 18s ease-in-out infinite alternate-reverse;}
@keyframes gwFpOrb{
    0%{transform:translate(0,0) scale(1);}
    100%{transform:translate(60px,40px) scale(1.15);}
}

.gw-fp-sec1-content{position:relative;z-index:10;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 20px;}
.gw-fp-ci{max-width:560px;width:60vw;}
.gw-fp-ci img{width:100%;height:auto;
    opacity:0;transform:translateY(30px) scale(0.92);filter:blur(12px);
    transition:opacity 1.2s ease, transform 1.6s cubic-bezier(0.19,1,0.22,1), filter 1.2s ease;
}
#gw-fp-sec1.is-view .gw-fp-ci img{opacity:1;transform:translateY(0) scale(1);filter:blur(0);}

.gw-fp-sec1-line{
    margin:45px 0 30px;width:0;height:1px;background:rgba(255,255,255,0.5);
    transition:width 1.4s cubic-bezier(0.19,1,0.22,1) 0.6s;
}
#gw-fp-sec1.is-view .gw-fp-sec1-line{width:220px;}
.gw-fp-sec1-sub{
    font-family:"Lexend", sans-serif;font-weight:300;
    font-size:20px;letter-spacing:8px;color:rgba(255,255,255,0.85);
    opacity:0;transform:translateY(20px);
    transition:all 1.2s ease 0.9s;
}
#gw-fp-sec1.is-view .gw-fp-sec1-sub{opacity:1;transform:translateY(0);}

/* 스크롤 안내 */
.gw-fp-scroll-guide{
    position:absolute;bottom:40px;left:50%;transform:translateX(-50%);
    z-index:10;display:flex;flex-direction:column;align-items:center;gap:12px;
    color:rgba(255,255,255,0.7);font-family:"Lexend", sans-serif;font-size:11px;letter-spacing:4px;
}
.gw-fp-scroll-bar{position:relative;width:1px;height:60px;background:rgba(255,255,255,0.2);overflow:hidden;}
.gw-fp-scroll-bar:after{
    content:"";position:absolute;top:-40%;left:0;width:100%;height:40%;
    background:#fff;animation:gwFpScroll 1.8s ease-in-out infinite;
}
@keyframes gwFpScroll{
    0%{top:-40%;}
    100%{top:100%;}
}

/* ============================================================
   SECTION 02 : 교수님 & 슬로건
============================================================ */
#gw-fp-sec2{background:#101319;display:flex;align-items:center;justify-content:center;}
.gw-fp-sec2-bg-text{
    position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
    font-family:"Lexend", sans-serif;font-weight:800;
    font-size:22vw;line-height:1;letter-spacing:0.02em;
    color:rgba(255,255,255,0.025);white-space:nowrap;user-select:none;pointer-events:none;
}
.gw-fp-sec2-inner{
    position:relative;z-index:10;margin:0 auto;padding:100px 90px 0;
    width:100%;max-width:1500px;
    display:flex;align-items:center;gap:100px;
}

/* 사진 */
.gw-fp-sec2-photo{position:relative;flex:0 0 420px;height:560px;}
.gw-fp-sec2-photo img{
    position:relative;z-index:2;width:100%;height:100%;object-fit:cover;
    clip-path:inset(0 100% 0 0);
    transition:clip-path 1.4s cubic-bezier(0.19,1,0.22,1) 0.2s;
}
#gw-fp-sec2.is-view .gw-fp-sec2-photo img{clip-path:inset(0 0 0 0);}
.gw-fp-sec2-photo-frame{
    position:absolute;z-index:1;top:-24px;left:-24px;width:100%;height:100%;
    border:1px solid rgba(255,255,255,0.25);
    opacity:0;transform:translate(15px,15px);
    transition:all 1.2s ease 0.9s;
}
#gw-fp-sec2.is-view .gw-fp-sec2-photo-frame{opacity:1;transform:translate(0,0);}

/* 텍스트 */
.gw-fp-sec2-text{flex:1;color:#fff;}
.gw-fp-sec2-eyebrow{
    display:flex;align-items:center;gap:12px;margin-bottom:25px;
    font-family:"Lexend", sans-serif;font-size:14px;letter-spacing:5px;color:#fff;
    opacity:0;transition:opacity 1s ease 0.4s;
}
.gw-fp-sec2-eyebrow:before{content:"";display:block;width:50px;height:1px;background:#fff;}
#gw-fp-sec2.is-view .gw-fp-sec2-eyebrow{opacity:1;}

.gw-fp-sec2-title{font-family:"Lexend", sans-serif;font-weight:700;font-size:56px;line-height:1.2;margin-bottom:30px;}
.gw-fp-reveal-line{display:block;overflow:hidden;}
.gw-fp-reveal-line em{
    display:block;font-style:normal;
    transform:translateY(110%);
    transition:transform 1.1s cubic-bezier(0.19,1,0.22,1);
}
.gw-fp-reveal-line:nth-child(1) em{transition-delay:0.5s;}
.gw-fp-reveal-line:nth-child(2) em{transition-delay:0.65s;}
#gw-fp-sec2.is-view .gw-fp-reveal-line em{transform:translateY(0);}

.gw-fp-sec2-slogan{
    font-family:'NanumSquareNeoExtraBold', sans-serif;
    font-size:26px;margin-bottom:25px;color:#fff;
    opacity:0;transform:translateY(25px);transition:all 1s ease 0.9s;
}
.gw-fp-sec2-desc{
    font-size:17px;line-height:1.9;color:rgba(255,255,255,0.6);word-break:keep-all;margin-bottom:45px;
    opacity:0;transform:translateY(25px);transition:all 1s ease 1.05s;
}
#gw-fp-sec2.is-view .gw-fp-sec2-slogan,
#gw-fp-sec2.is-view .gw-fp-sec2-desc{opacity:1;transform:translateY(0);}

/* 공통 버튼 */
.gw-fp-btn{
    display:inline-flex;align-items:center;gap:14px;
    padding:16px 34px;border:1px solid rgba(255,255,255,0.4);
    color:#fff;font-family:"Lexend", sans-serif;font-size:14px;letter-spacing:3px;
    transition:all .4s;
    opacity:0;transform:translateY(25px);
}
#gw-fp-sec2.is-view .gw-fp-btn{opacity:1;transform:translateY(0);transition:opacity 1s ease 1.2s, transform 1s ease 1.2s, background .4s, border .4s, gap .4s; color:#fff !important;}
.gw-fp-btn:hover{background:var(--main-color);border-color:var(--main-color);color:#fff;gap:22px;}
.gw-fp-btn i{font-size:16px;}

/* ============================================================
   SECTION 03 : 공지사항 (기존 gw_theme04_main_cardlist 스킨 사용)
============================================================ */
#gw-theme04-main-cardlist.gw-fp-sec{
    display:flex;align-items:center;justify-content:center;
    padding:0 !important;               /* .gw-sec 기본 padding 150px 무력화 */
    background:#0b0d12;
}
.gw-fp-cardlist-wrap{
    width:100%;
    padding-top:100px;                  /* 고정 헤더 높이만큼 보정 */
    opacity:0;transform:translateY(50px);
    transition:opacity 1s ease .2s, transform 1s ease .2s;
}
#gw-theme04-main-cardlist.is-view .gw-fp-cardlist-wrap{opacity:1;transform:translateY(0);}

/* ============================================================
   반응형 : 1024px 이하 스냅 해제 + 세로 스택
============================================================ */
@media screen and (max-width:1440px){
    .gw-fp-sec2-inner{padding:100px 40px 0;gap:60px;}
    .gw-fp-sec2-title{font-size:44px;}
    #gw-fp-nav{right:20px;}
}

@media screen and (max-width:1024px){
    #gw-fp-nav{display:none;}
    .gw-fp-sec{height:auto;min-height:0;}

    #gw-fp-sec1{height:100vh;min-height:600px;}
    .gw-fp-ci{width:70vw;}
    .gw-fp-sec1-sub{font-size:15px;letter-spacing:5px;}

    #gw-fp-sec2{padding:100px 0;}
    .gw-fp-sec2-inner{flex-direction:column;padding:0 20px;gap:60px;}
    .gw-fp-sec2-photo{flex:none;width:100%;max-width:420px;height:480px;}
    .gw-fp-sec2-title{font-size:36px;}
    .gw-fp-sec2-slogan{font-size:21px;}
    .gw-fp-sec2-desc br{display:none;}

    #gw-theme04-main-cardlist.gw-fp-sec{padding:80px 0 !important;}
    .gw-fp-cardlist-wrap{padding-top:0;}
}

@media screen and (max-width:576px){
    .gw-fp-sec1-sub{font-size:12px;letter-spacing:3px;}
    .gw-fp-sec2-title{font-size:27px;}
    .gw-fp-sec2-photo{height:400px;}
}


/* ============================================================
   투명 헤더 (메인 전용 - 이 CSS는 메인에서만 로드됨)
============================================================ */
#hd_login_msg{display:none;}
#hd{background:transparent !important;border-bottom:none !important;transition:all .5s;}
#gnb{background:transparent !important;box-shadow:none !important;}
.gnb_1da{color:#fff !important;transition:color .4s;}
#gnb .gnb_1dli:hover > .gnb_1da{color:#fff !important;opacity:0.75;}
#logo img{filter:brightness(0) invert(1);transition:filter .4s;}
#hd_wrapper .hd_login li > a{
    color:#fff !important;
    background:rgba(255,255,255,0.12) !important;
    border:1px solid rgba(255,255,255,0.3) !important;
    transition:all .4s;
}
#hd_wrapper .hd_login li:first-child > a{
    color:#fff !important;background:transparent !important;border:1px solid rgba(255,255,255,0.3) !important;
}
#menu-btn span{background:#fff;}


/* ============================================================
   DMT 모드 : 화면 고정 + 섹션 교체 (데스크탑 전용, JS가 클래스 부여)
============================================================ */
@media screen and (min-width:1025px){
    html.gw-fp-fixed, html.gw-fp-fixed body{height:100%;overflow:hidden;}
    html.gw-fp-fixed #gw-fullpage{position:fixed;inset:0;z-index:1;}

    html.gw-fp-fixed .gw-fp-sec{
        position:absolute;inset:0;
        width:100%;height:100%;min-height:0;
        opacity:0;visibility:hidden;z-index:1;
        transform:scale(1.08);
        transition:opacity 1s ease, visibility 0s linear 1s, transform 1.6s cubic-bezier(0.19,1,0.22,1);
        pointer-events:none;
    }
    html.gw-fp-fixed .gw-fp-sec.gw-active{
        opacity:1;visibility:visible;z-index:2;
        transform:scale(1);
        transition:opacity 1s ease, visibility 0s, transform 1.6s cubic-bezier(0.19,1,0.22,1);
        pointer-events:auto;
    }

    /* 푸터 : 마지막 스텝에서 화면 전체가 푸터 높이만큼 위로 밀리며 자연스럽게 드러남 */
    html.gw-fp-fixed #gw-fullpage{
        transition:transform .9s cubic-bezier(0.19,1,0.22,1);
    }
    html.gw-fp-fixed body.gw-fp-footer-open #gw-fullpage{
        transform:translateY(calc(-1 * var(--gw-ft-h, 300px)));
    }
    html.gw-fp-fixed #ft{
        position:fixed;left:0;right:0;top:100%;z-index:8500;
        transition:transform .9s cubic-bezier(0.19,1,0.22,1);
    }
    html.gw-fp-fixed body.gw-fp-footer-open #ft{
        transform:translateY(calc(-1 * var(--gw-ft-h, 300px)));
    }
}


/* ============================================================
   섹션 공용 배경 이미지 (섹션2, 섹션3)
============================================================ */
.gw-fp-secbg{position:absolute;inset:0;z-index:0;}
.gw-fp-secbg img{
    width:100%;height:100%;object-fit:cover;opacity:0.4;
    transform:scale(1.1);
    transition:transform 6s cubic-bezier(0.19,1,0.22,1);
}
.gw-fp-sec.is-view .gw-fp-secbg img{transform:scale(1.0);}
.gw-fp-secbg-overlay{
    position:absolute;inset:0;z-index:1;
    background:linear-gradient(180deg, rgba(11,13,18,0.75) 0%, rgba(11,13,18,0.45) 50%, rgba(11,13,18,0.85) 100%);
}
#gw-fp-sec2 .gw-fp-sec2-bg-text{z-index:2;}
#gw-fp-sec2 .gw-fp-sec2-inner{z-index:10;}
.gw-fp-cardlist-wrap{position:relative;z-index:10;}

/* ============================================================
   공지사항(cardlist 스킨) 다크 테마 오버라이드
============================================================ */
#gw-theme04-main-cardlist .gw-sec-sub-title{color:rgba(255,255,255,0.85);}
#gw-theme04-main-cardlist .gw-sec-title a{color:#fff;}
#gw-theme04-main-cardlist .gw-theme04-title-container{
    background:rgba(15,40,89,0.85);
    backdrop-filter:blur(6px);
    border:1px solid rgba(255,255,255,0.1);
    border-radius:10px;
}
#gw-theme04-main-cardlist .gw-theme04-card-slider .slick-slide{
    background:rgba(255,255,255,0.06) !important;
    border:1px solid rgba(255,255,255,0.12);
    backdrop-filter:blur(6px);
}
#gw-theme04-main-cardlist .gw-theme04-card-slider .slick-slide:hover{
    background:rgba(255,255,255,0.1) !important;
    box-shadow:0 20px 40px rgba(0,0,0,0.4);
}
#gw-theme04-main-cardlist .gw-theme04-card-slider .gw-title{color:#fff;}
#gw-theme04-main-cardlist .gw-theme04-card-slider .gw-text{color:rgba(255,255,255,0.55);}
#gw-theme04-main-cardlist .gw-theme04-card-slider .gw-bottom{border-top:1px solid rgba(255,255,255,0.15);}
#gw-theme04-main-cardlist .gw-theme04-card-slider .gw-main-btn04{color:rgba(255,255,255,0.75);}
#gw-theme04-main-cardlist .gw-theme04-card-slider .gw-plus-btn{border-color:rgba(255,255,255,0.3);}
#gw-theme04-main-cardlist .gw-theme04-card-slider .gw-plus-btn i{color:#fff;}
#gw-theme04-main-cardlist .gw-empty{color:rgba(255,255,255,0.5);}
#gw-theme04-main-cardlist .gw-empty h3{color:rgba(255,255,255,0.6);font-weight:400;}
#gw-theme04-main-cardlist .gw-circle-rotate:before{filter:brightness(0) invert(1);opacity:0.35;}