@charset "utf-8";

/* =========================== MAIN */
#mainVisual{overflow:hidden;position:relative;letter-spacing:-.2px;width:100%;height:100vh;min-height:650px;background:#222}
#mainVisual .main_slide{height:100%}
#mainVisual ul li{background:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url(../img/main/main01.jpg) center no-repeat;background-size: cover;background-position: center;background-blend-mode: darken;}
#mainVisual ul li.bg02{background-image:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url(../img/main/main02.jpg)}
#mainVisual ul li.bg03{background-image:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url(../img/main/main03.jpg)}
#mainVisual ul li img{object-fit: cover}
.main a.main_eng_btn {color: #fff;!important;margin-right: 30px;}
/* 텍스트 */
#mainVisual .main_txt{position:absolute;top:50%;left:5%;z-index:101;transform:translateY(-50%);width:max-content;font-size:18px;line-height:1.5;color: rgb(255 255 255 / 81%);font-family: 'Microsoft YaHei', '微软雅黑', sans-serif !important;}
#mainVisual .main_txt .stit{display:block;font-size:16px;font-weight:500;color:var(--primary)}
#mainVisual .main_txt .btit{width:500px;margin:45px 0 30px;font-size:50px;font-weight:700;color:#fff;line-height:1.25;white-space:pre-line;font-family: 'Microsoft YaHei', '微软雅黑', sans-serif !important;}
#mainVisual .main_txt span {font-size: 1.2rem;font-weight: 600;}
/* 컨트롤 */
#mainVisual .controls{display:flex;flex-flow:column;align-items:flex-start;width:max-content;margin-top:100px}
#mainVisual .controls div{display:flex;align-items:center;margin-bottom:20px}
#mainVisual .controls .arr{cursor:pointer;padding-bottom:4px}
#mainVisual .controls .pager{width:75px;margin:0 35px; font-size:0}
#mainVisual .controls .pager span{position:relative;font-size:14px;font-weight:600;color:#fff}
#mainVisual .controls .pager span+span{opacity:.5;margin-left:20px;padding-left:20px}
#mainVisual .controls .pager span:before{content:"0"}
#mainVisual .controls .pager span+span:after{display:block;;content:"";position:absolute;left:0;top:4px;width:1px;height:12px;background:rgba(255,255,255,.4)}
#mainVisual .main_timeline{width:100%;height:auto;margin-right:12px}
#mainVisual .main_timeline span{display:none;position:relative;width:100%;height:2px;border-radius:0;background:#fff;opacity:1}
#mainVisual .main_timeline span.on{display:block}
#mainVisual .main_timeline span:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%}
#mainVisual .main_timeline span.on:before{background:var(--primary);animation:progressbar 4s linear}
@keyframes progressbar{0%{width:0}to{width:100%}}

@media(max-width:1310px){
#mainVisual .main_txt{left:30px;font-size:16px}
#mainVisual .main_txt .btit{font-size:48px}
.main_eng_btn{color: #000;font-weight: 600;}
}
@media(max-width:768px){
#mainVisual{min-height:450px}
#mainVisual .main_txt{width:100%;padding-right:30px;word-break:keep-all}
#mainVisual .main_txt .stit{font-size:14px}
#mainVisual .main_txt .btit{margin:20px 0;font-size:38px}
#mainVisual .controls{margin-top:50px}
#mainVisual .controls div{margin-bottom:10px}
#mainVisual .controls .pager span{font-size:13px}
}
@media(max-width:480px){
#mainVisual .main_txt .btit{white-space:normal;word-break:keep-all}
#mainVisual .main_txt .btit{font-size:32px}
#mainVisual .main_txt {padding: 0 5%; left: 0;}
}

/* =========================== inc01 */
#inc01{display:flex;padding:220px 0 220px 5%;background:url(../img/main/inc01/bg.png) bottom center no-repeat #020305}
#inc01 .tit_area{flex-shrink:0;padding-top:70px}
#inc01 .tit_area p{margin-bottom:25px;font-size:65px;font-weight:700;color:#fff}
#inc01 .tit_area .pl{font-size:17px;white-space:pre-line;line-height:1.8}
#inc01 .controls{display:flex;align-items:center;margin-top:70px;color:#fff}
#inc01 .controls .arr{display:flex;align-items:center;cursor:pointer}
#inc01 .controls .pager{width:76px;margin:0 35px;font-size:0}
#inc01 .controls .pager span{position:relative;font-size:14px;font-weight:600}
#inc01 .controls .pager span+span{opacity:.5;margin-left:20px;padding-left:20px}
#inc01 .controls .pager span:before{content:"0"}
#inc01 .controls .pager span+span:after{display:block;;content:"";position:absolute;left:0;top:4px;width:1px;height:12px;background:rgba(255,255,255,.4)}

#inc01 .inc01_slide {margin-left:18%}
#inc01 ul li{height:526px;overflow:hidden;border-radius:30px;background:url(../img/main/inc01/biz_img.jpg) center no-repeat;background-size:cover}
#inc01 ul li.li02{background-image:url(../img/main/inc01/img02.jpg)}
#inc01 ul li.li03{background-image:url(../img/main/inc01/img03.jpg)}
#inc01 ul li a{position:relative;display:flex;flex-flow:column;align-items:flex-start;height:100%;padding:50px;color:rgba(255,255,255,.7);word-break:keep-all;transition:all .3s}
#inc01 ul li a img{opacity:0;margin-top:15px;transition:all .3s}
#inc01 ul li p{margin:auto 0 15px;font-size:30px;font-weight:600;line-height:1.35;color:#fff}
#inc01 ul li:before{opacity:0;display:block;content:"";position:absolute;left:0;top:0;z-index:0;width:100%;height:100%;background:var(--primary);transition:all .3s}
#inc01 .main_business_bg {background-size: cover;background-position: center;background-blend-mode: darken;}
#inc01 .biz_con {background-image:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url('/img/home/main1/business_biz.png');}
#inc01 .lift_con {background-image:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url('/img/home/main1/business_lift.png');}
#inc01 .tm_con {background-image:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url('/img/home/main1/business_tm.png');}
#inc01 .robot_con {background-image:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url('/img/home/main1/business_robot.png');}
#inc01 .space_con {background-image:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url('/img/home/main1/business_space.png');}
#inc01 .camera_con {background-image:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url('/img/home/main1/business_camera.png');}
#inc01 .infra_con {background-image:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url('/img/home/main1/business_infra.png');}
@media(hover:hover){
#inc01 ul li:hover:before{opacity:.9}
#inc01 ul li:hover a{color:#fff}
#inc01 ul li:hover img{opacity:1;margin:0}
}
@media(max-width:1300px){
#inc01{padding:160px 0 160px 30px}
#inc01 .inc01_slide{margin-left:8%}
#inc01 ul li{height:480px}
#inc01 ul li a{padding:30px}
}
@media(max-width:1024px){
#inc01 .tit_area p{font-size:42px}
#inc01 .tit_area .pl{font-size:16px}
#inc01 ul li{height:420px}
#inc01 ul li p{font-size:26px}
}
@media(max-width:768px){
#inc01{display:block;padding:60px 0}
#inc01 .tit_area{padding:0 20px 25px;text-align:center}
#inc01 .tit_area p{margin-bottom:10px;font-size:32px}
#inc01 .tit_area .pl{white-space:normal;word-break:keep-all}
#inc01 .controls{justify-content:center;margin-top:15px}
#inc01 .inc01_slide{margin-left:20px}
#inc01 ul li{height:380px;border-radius:16px}
#inc01 ul li a{padding:20px}
#inc01 ul li p{font-size:22px;word-break:keep-all}
}
@media(max-width:480px){
#inc01 .inc01_slide{margin-left:0}
}

/* =========================== inc02 */
#inc02{ display:flex;align-items: baseline;height:970px;padding:80px 5% 0;background:url(../img/main/inc02/bg.png) top center no-repeat #020305}
#inc02 .tit_area{flex-shrink:0;padding-top:70px}
#inc02 .tit_area p{margin-bottom:25px;font-size:65px;font-weight:700;color:#fff}
#inc02 .tit_area .pl{font-size:17px;white-space:pre-line;line-height:1.8}

#inc02 ul{display:flex;flex-grow:1;margin-left:250px}
#inc02 ul li{width:33%;text-align:center}
#inc02 ul li span{font-size:65px;font-weight:700;color:#fff;font-family:'Poppins'}
#inc02 ul li p i{font-size:45px;font-weight:700;color:#fff;font-style:normal;font-family:'Poppins'}
#inc02 ul li .tit{margin:5px 0 30px;font-size:30px;font-weight:600;color:#fff}
#inc02 ul li div{white-space:pre-line}
@media(max-width:1500px){
#inc02 ul{margin-left:8%}
}
@media(max-width:1300px){
#inc02{padding:80px 30px}
}
@media(max-width:1024px){
#inc02{height:600px;padding-top:0}
#inc02 .tit_area p{font-size:42px}
#inc02 .tit_area .pl{font-size:16px}
#inc02 ul li span{font-size:40px}
#inc02 ul li .tit{font-size:26px}
#inc02 ul li p i{font-size:26px}
}
@media(max-width:768px){
#inc02{display:block;padding:60px 20px}
#inc02 .tit_area{padding:0 20px 35px;text-align:center}
#inc02 .tit_area p{margin-bottom:10px;font-size:32px}
#inc02 .tit_area .pl{white-space:normal;word-break:keep-all}
#inc02 ul{margin-left:0}
#inc02 ul li span{font-size:32px}
#inc02 ul li .tit{margin-bottom:15px;font-size:22px}
}
@media(max-width:480px){
#inc02{height:auto}
#inc02 ul{display:block}
#inc02 ul li{width:auto}
#inc02 ul li+li{margin-top:25px}
#inc02 ul li span{font-size:26px}
#inc02 ul li p i{font-size:20px}
#inc02 ul li .tit{margin-bottom:10px;font-size:18px}
}

/* =========================== inc03 */
#inc03{display:flex;padding:220px 0 280px 5%;background:url(../img/main/inc03/bg.png) 70% center no-repeat #020305}
#inc03 .tit_area{flex-shrink:0;padding-top:70px}
#inc03 .tit_area p{margin-bottom:25px;font-size:65px;font-weight:700;color:#fff}
#inc03 .tit_area .pl{font-size:17px;white-space:pre-line;line-height:1.8}
#inc03 .controls{display:flex;align-items:center;margin-top:70px;color:#fff}
#inc03 .controls .arr{display:flex;align-items:center;cursor:pointer}
#inc03 .controls .pager{width:76px;margin:0 35px;font-size:0}
#inc03 .controls .pager span{position:relative;font-size:14px;font-weight:600}
#inc03 .controls .pager span+span{opacity:.5;margin-left:20px;padding-left:20px}
#inc03 .controls .pager span:before{content:"0"}
#inc03 .controls .pager span+span:after{display:block;;content:"";position:absolute;left:0;top:4px;width:1px;height:12px;background:rgba(255,255,255,.4)}

#inc03 .inc03_slide{margin-left:18%}
#inc03 ul{padding-top:15px}
#inc03 ul li{height:526px;overflow:hidden;border-radius:30px;background:center no-repeat #fff;background-size:cover;transition:transform .3s}
#inc03 ul li:nth-child(even){margin-top:65px}
#inc03 ul li a{position:relative;display:flex;flex-flow:column;align-items:flex-start;height:100%;padding:100px 50px 80px;color:#777;word-break:keep-all}
#inc03 ul li a img{opacity:0;margin-top:15px;transition:all .3s}
#inc03 ul li p{margin-bottom:25px;font-size:27px;font-weight:600;word-break:keep-all;color:#222;line-height:1.35}
#inc03 ul li span{margin-top:auto;font-size:15px}
#inc03 ul li a.img{color:rgba(255,255,255,.75);background:rgba(0,0,0,.5)}
#inc03 ul li a.img p{color:#fff}

@media(hover:hover){
#inc03 ul li:hover{transform:translateY(-15px)}
}
@media(max-width:1300px){
#inc03{padding:160px 0 160px 30px}
#inc03 .inc03_slide{margin-left:8%}
#inc03 ul li{height:480px}
#inc03 ul li a{padding:30px}
}
@media(max-width:1024px){
#inc03 .tit_area p{font-size:42px}
#inc03 .tit_area .pl{font-size:16px}
#inc03 ul li{height:420px}
#inc03 ul li p{font-size:26px}
}
@media(max-width:768px){
#inc03{display:block;padding:60px 0}
#inc03 .tit_area{padding:0 20px 25px;text-align:center}
#inc03 .tit_area p{margin-bottom:10px;font-size:32px}
#inc03 .tit_area .pl{white-space:normal;word-break:keep-all}
#inc03 .controls{justify-content:center;margin-top:15px}
#inc03 .inc03_slide{margin-left:20px}
#inc03 ul li{height:380px;border-radius:16px}
#inc03 ul li:nth-child(even){margin-top:0}
#inc03 ul li a{padding:20px}
#inc03 ul li p{font-size:20px;word-break:keep-all}
#inc03 ul li span{font-size:13px}
}
@media(max-width:480px){
#inc03 .inc03_slide{margin-left:0}
#inc03 ul li{height:280px}
}

/*퀵메뉴*/
.floating-wrapper{
    position: fixed;
    right: 20px;
    bottom: 290px;
    z-index: 999;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.floating-btn{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    width:64px;
    height:64px;
    padding:0 20px;
    border-radius:50%;
    background:#04264E;
    color:#fff!important;
    font:600 15px/1.4 "Microsoft YaHei",'微软雅黑',sans-serif;
    box-shadow:0 6px 24px rgba(4,38,78,.25);
    overflow:hidden;
    text-decoration:none;
    transition:all .35s cubic-bezier(0.4,0,0.2,1);
    cursor:pointer;
    border:2px solid rgba(255,255,255,.1);
}
.floating-btn .icon{
    position:absolute;
    left:50%;
    transform:translateX(-50%);
    flex:none;
    font-size:28px;
    transition:all .35s cubic-bezier(0.4,0,0.2,1);
}
.floating-btn .label{
    opacity:0;
    white-space:nowrap;
    margin-left: 42px;
    font-size: 1rem;
    font-weight:600;
    letter-spacing:-0.02em;
    transition:opacity .25s .1s ease;
}
.floating-btn:hover{
    width:140px;
    border-radius:32px;
    box-shadow:0 12px 32px rgba(4,38,78,.35);
    transform:translateY(-2px);
    background:#152B53;
}
.floating-btn:hover .icon{
    left:24px;
    transform:translateX(0);
}
.floating-btn:hover .label{
    opacity:1;
}
.floating-btn.chat{
    background:#00BCF2;
}
.floating-btn.chat:hover{
    background:#0090E7;
}
.floating-btn.quote{
    background:#0D5CAB;
}
.floating-btn.quote:hover{
    background:#04264E;
}

/* Baidu Chat Button Styling - 바이두 채널톡 스타일링 */
#banx-menu-root,
#banx-menu-root > div,
#banx-menu-root button {
    /* Position - floating-wrapper 바로 위에 배치 */
    position:fixed !important;
    right:30px !important;
    bottom:174px !important;
    z-index:1000 !important;

    /* Size */
    width:64px !important;
    height:64px !important;
    min-width:64px !important;
    min-height:64px !important;

    /* Style */
    border-radius:50% !important;
    box-shadow:0 6px 24px rgba(0,188,242,.25) !important;
    background:#1E9FFF !important;
    border:2px solid rgba(255,255,255,.1) !important;

    /* Animation */
    transition:all .35s cubic-bezier(0.4,0,0.2,1) !important;
}

#banx-menu-root:hover,
#banx-menu-root > div:hover,
#banx-menu-root button:hover {
    transform:translateY(-2px) !important;
    box-shadow:0 12px 32px rgba(0,188,242,.35) !important;
    background:#0090E7 !important;
}

/* Hide chat button - 퀵메뉴의 채팅 버튼 숨김 */
.floating-btn.chat {
    display:none !important;
}

@media(max-width:768px){
    .floating-wrapper{
        right:20px;
        bottom:20px;
        gap:12px;
    }
    .floating-btn{
        width:56px;
        height:56px;
        box-shadow:0 4px 16px rgba(4,38,78,.2);
    }
    .floating-btn .icon{
        font-size:24px;
    }
    .floating-btn:hover{
        width:56px;
        border-radius:50%;
        box-shadow:0 4px 16px rgba(4,38,78,.2);
        transform:none;
    }
    .floating-btn span.label {
        display:none;
    }
    .floating-btn:hover .icon {
        left:50%;
        transform:translateX(-50%);
    }

    /* Mobile Baidu Chat Position */
    #banx-menu-root,
    #banx-menu-root > div,
    #banx-menu-root button {
        right:20px !important;
        bottom:144px !important;
        width:56px !important;
        height:56px !important;
        min-width:56px !important;
        min-height:56px !important;
    }
}