@charset "UTF-8";


.main-visual {position: relative; height:100vh; overflow: hidden;}
.main-visual .bg-video { position: absolute; top: 0; left: 0; width: 100%; height: 100%;  z-index: 0;}
.main-visual .bg-video .video { position: absolute; top: 50%;  left: 50%; width:100%; height: 100%; transform: translate(-50%,-50%); object-fit: cover;}
.scroll-down {position:absolute; bottom:30px; left:50%; transform: translateX(-50%); width:90px; text-align:center; z-index:10; }
.scroll-down .mouse {position:relative; height:46px; width:26px; border:2px solid var(--white-color); border-radius: 26px; margin:0 auto 10px;}
.scroll-down .mouse .wheel {position:absolute ;top:10px; left:50%; transform:translateX(-50%); width:8px; height: 8px; background:var(--white-color); border-radius: 100%; animation: wheelMove 1.5s ease-in-out infinite;}
.scroll-down p {font-size:var(--font-size-14); line-height:1.2em; font-weight: 600; color:var(--white-color); letter-spacing:0}

@keyframes wheelMove {
	0% {
		top: 10px;
		opacity: 1;
	}
	50% {
		top: 25px;
		opacity: 1;
	}
	100% {
		top: 10px;
		opacity: 1;
	}
}

@keyframes rotateInfinite {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}

.main-title {margin-bottom: 25px;}
.main-title h2 {font-size:var(--font-size-18); line-height:1.4em; color:var(--primary-color); font-weight: 700; margin-bottom:22px;}
.main-title .title {font-size:var(--font-size-60); line-height:1.17em; font-weight: 800; color:var(--gray-color-22); margin-bottom:8px;}
.main-title .txt {font-size:var(--font-size-20); line-height:1.3em; color:var(--gray-color-66);}

.main-more {margin-bottom:60px;}
.main-more a {display:inline-flex; align-items: center; font-size:var(--font-size-16); line-height:1.4em; color:var(--gray-color-66);}
.main-more a .arrow {margin-left: 8px; position: relative; width:50px; height: 50px; border-radius: 100%; border:1px solid var(--gray-color-95); transition: 0.3s;}
.main-more a .arrow:after {content:""; position:absolute; top:50%; left:50%; transform: translate(-50%,-50%) rotate(-45deg); width:8px; height:8px; border-right:2px solid #4a4a4a; border-bottom:2px solid #4a4a4a; transition: 0.3s;}
.main-more a:hover .arrow {background:var(--primary-color) !important; border-color:var(--primary-color) !important}
.main-more a:hover .arrow:after {border-color:var(--white-color) !important}

.main-product-slide {display:flex; align-items: center;}
.main-product-slide .item-box {width:50%; padding:6rem 0;}
.main-product-slide .item-box.item-bg {background:#f1f1f1;}
.main-product-slide .item-info {max-width:700px; margin-left:auto; padding-right:80px; padding-left:20px;}
.main-product-slide .item-slide-info {max-width:700px; margin-right:auto; padding-left:118px; padding-right:20px;}
.main-product-slide .product-nav ul {display:flex; flex-wrap:wrap; margin-left:-20px; margin-bottom:-20px;}
.main-product-slide .product-nav ul li {width:calc(50% - 20px); margin-left:20px; margin-bottom:20px; background:var(--white-color); border-radius: 16px; }
.main-product-slide .product-nav ul li a {display:flex; align-items: center; padding: 15px 15px;}
.main-product-slide .product-nav ul li a .pic {position: relative; width:90px; height:60px; margin-right:20px;}
.main-product-slide .product-nav ul li a .pic img {position: absolute; top:50%; left:50%; width:100%; height: 100%; transform: translate(-50%,-50%); object-fit: contain;}
.main-product-slide .product-nav ul li a .tit {position: relative; font-size:var(--font-size-20); line-height:1.4em; font-weight: 700; color:var(--gray-color-22); padding-right:26px; transition: 0.3s;}
.main-product-slide .product-nav ul li a .tit:after {content:""; position:absolute; top:50%; right:0; transform: translateY(-50%) rotate(-45deg); width:8px; height:8px; opacity:0; transition: 0.3s; border-right:2px solid var(--primary-color); border-bottom:2px solid var(--primary-color); }
.main-product-slide .product-nav ul li a:hover .tit {color:var(--primary-color);}
.main-product-slide .product-nav ul li a:hover .tit:after {opacity:1;}
.main-product-slide .product-nav ul li.active a .tit {color:var(--primary-color);}
.main-product-slide .product-nav ul li.active a .tit:after {opacity:1;}
.main-product-slide .main-prod-slider .pic {margin-bottom: 14px;}
.main-product-slide .main-prod-slider .text-box .title {position: relative; height:123px; display:flex; align-items: center;  margin-bottom:34px;}
.main-product-slide .main-prod-slider .text-box .title h2 {font-size:var(--font-size-48); line-height:1.4em;font-weight: 800; color:var(--gray-color-22); flex:1 1 auto; min-width:0; width:1%; padding-right:40px;}
.main-product-slide .main-prod-slider .text-box .cnt {font-size:var(--font-size-18); line-height:1.67em; color:var(--gray-color-22);}
.main-product-slide .main-prod-slider .text-box .more {width:123px; height: 123px; display:flex; align-items: center; justify-content: center; position: relative;}
.main-product-slide .main-prod-slider .text-box .more:after {content:""; position:absolute; top:0; left:0; width:100%; height: 100%; background:url('../img/main/product_arrow_txt.png') 50% 50% no-repeat; background-size:cover; transition: 0.3s;}
.main-product-slide .main-prod-slider .text-box .more:hover:after {animation: rotateInfinite 4s linear infinite;}
.main-product-slide .main-prod-slider .text-box .more .circle {position: relative; width:92px; height: 92px; background:#ebebeb; border-radius: 100%; transition: 0.3s;}
.main-product-slide .main-prod-slider .text-box .more .circle:after {content:""; position: absolute; top:0; left:0; width:100%; height:100%; background:url('../img/main/product_arrow.png') 50% 50% no-repeat;}

.main-product-inner {position: relative; }
.main-product-inner .inner {height:900px; display:flex; align-items: center;}
.main-product-inner .info {max-width:980px;}
.main-product-inner .main-title {margin-bottom:55px;}
.main-product-inner .main-title h2,
.main-product-inner .main-title .title,
.main-product-inner .main-title .txt {color:var(--white-color);}
.main-product-inner .main-title .title {margin-bottom:55px;}
.main-product-inner .main-more {margin-bottom:0;}
.main-product-inner .main-more a {color:var(--white-color);}
.main-product-inner .main-more a .arrow {border-color:var(--white-color);}
.main-product-inner .main-more a .arrow:after {border-color:var(--white-color)}
.main-product-inner .background {position:absolute; top:0; left:0; width:100%; height:100%; background:url('../img/main/product_bg.jpg') 50% 50% no-repeat; background-size:cover; z-indeX:-1;}

.main-application {position: relative; height: 100vh; display:flex; align-items: center;}
.main-application .main-title {margin-bottom:45px; position: relative;}
.main-application .main-title h2,
.main-application .main-title .title {color:var(--white-color); }
.main-application .main-title .title {margin-bottom:0;}
.main-application .main-more {margin-bottom:0; position:absolute; bottom:10px; right:0;}
.main-application .main-more a {color:var(--white-color);}
.main-application .main-more a .arrow {border-color:var(--white-color);}
.main-application .main-more a .arrow:after {border-color:var(--white-color)}
.main-application .application-slider .swiper-container {overflow:visible;}
.main-application .application-slider .item {width:340px; margin-right:20px;}
.main-application .application-slider .item a {display:block;}
.main-application .application-slider .item .box {border-radius: 14px; overflow:hidden; padding:18px 18px 40px; background:rgba(0,0,0,.20); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); transition: 0.3s;}
.main-application .application-slider .item .pic {position:relative; height:0; padding-bottom: 73.3%; overflow:hidden; border-radius: 12px;}
.main-application .application-slider .item .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.main-application .application-slider .item .pic:after {content:""; position:absolute; top:50%; left:50%; width:67px; height: 47px; transform: translate(-50%,-50%); background:url('../img/main/video_btn.png') 50% 50% no-repeat;}
.main-application .application-slider .item .label {margin: 20px 0; font-size:var(--font-size-16); line-height:1.4em; font-weight: 500; color:var(--gray-color-89);  transition: 0.3s; display:inline-flex; align-items: center; height:30px; padding:0 16px; border-radius: 4px; background:rgba(0,0,0,.60);}
.main-application .application-slider .item .tit {font-size:var(--font-size-18); line-height:1.4em; font-weight: 500; color:var(--white-color);  transition: 0.3s;}
.main-application .application-slider .item a:hover .pic img {transform:translateY(-50%) scale(1.04,1.04); -ms-transform:translateY(-50%) scale(1.04,1.04); -webkit-transform:translateY(-50%) scale(1.04,1.04);}
.main-application .application-slider .item a:hover .box {background:#fff; backdrop-filter: blur(0); -webkit-backdrop-filter: blur(0);}
.main-application .application-slider .item a:hover .label {background:#e5e5e5;}
.main-application .application-slider .item a:hover .tit {color:#272727;}
.main-application .background {position:absolute; top:0; left:0; width:100%; height:100%; background:url('../img/main/app_bg.jpg') 50% 50% no-repeat; background-size:cover; z-indeX:-1;}

.main-ir {background:url('../img/main/ir_bg.jpg') 50% 50% no-repeat; background-size:cover; padding:8rem 0;}
.main-ir .main-title {position: relative; margin-bottom:65px;}
.main-ir .main-title h2 {color:var(--gray-color-22); font-weight: 500;}
.main-ir .main-more {margin-bottom:0; position:absolute; top:50%; transform: translateY(-50%); right:0;}
.main-ir .slick-track {margin-left:0; margin-right:0;}
.main-ir ul {margin:0 -20px;}
.main-ir ul li {width:33.333333%; padding: 0 20px;}
.main-ir ul li a {display:block; border-top:2px solid #464646; border-bottom: 1px solid #d0d0d0; padding:30px 16px;}
.main-ir ul li a .title {font-size:var(--font-size-20); line-height:1.5em; font-weight: 600; transition: 0.3s; margin-bottom:60px; max-height:calc(1.5em * 1 * 2); -webkit-line-clamp:2; line-clamp:2; overflow:hidden; text-overflow:ellipsis; white-space:normal; display:-webkit-box;  -webkit-box-orient:vertical;}
.main-ir ul li a:hover .title {color:var(--primary-color)}
.main-ir ul li a .date-inner {display:flex; align-items: center; justify-content: space-between;}
.main-ir ul li a .date-inner .date {font-size:var(--font-size-16); line-height:1.4em; color:var(--gray-color-95);font-weight: 500;}
.main-ir ul li a .date-inner .more {width:30px; height: 14px; background:url('../img/main/more.png') 50% 50% no-repeat; background-size:contain;}
.main-ir ul li a .list-file--fc {display:none;}



/* #main .pin-spacer {
	z-index: auto !important;
	pointer-events: none !important;
} */



/***************** 2026.09.07 스타일 추가 *******************/

.btn-quote {
    background-color: var(--primary-color);
    width: 11.875rem;
    height: 3.75rem;
    border-radius: 1.875rem;
    -ms-flex-pack: center !important;
    justify-content: center !important;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center !important;
    align-items: center !important;
    gap: 0.875rem;
    position: fixed;
    right: 1.25rem;
    bottom: 1.25rem;
    transition: all 0.6s ease;
    z-index: 50;
}

.btn-quote:hover {
    opacity: 0.8;
}

.btn-quote span {
    font-size: 1.125rem;
    font-weight: 700;
    color: #fff;
}

.btn-quote .ico {
    font-size: 0;
    text-indent: -9999px;
    width: 1.125rem;
    height: 0.875rem;
    background: url(/html/_skin/img/common/ico_get_a_quote.svg) no-repeat center / contain;
    position: relative;
    top: 1px;
}

@media (min-width: 1441px) {
    .btn-quote {
        right: 5rem;
        bottom: 5rem;
    }
}

.main-notice-news {
    background: url(/html/_skin/img/main/bg_main_notice_news.jpg) no-repeat top right / cover;
}

.main-notice-news .inner-body {
    padding: 8.75rem 0;
}

.main-notice-news .con-wrap {
    margin-top: 3.125rem;
}

.latest-layout {
    display: -ms-flexbox;
    display: flex;
    gap: 1.25rem;
}

.latest-layout .left {
    width: calc(100% - 420px - 20px);
}

.latest-layout .right {
    width: 420px;
}

.main-notice-list {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column  !important;
    flex-direction: column !important;
    gap : 1.25rem
}

.main-notice-list > li .box {
    display: block;
    background-color: #fff;
    padding: 1.5625rem 0;
}

.main-notice-list > li .box:hover .ico::before {
    transform: rotate(180deg);
}

.main-notice-list > li .box .box-inner {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center !important;
    align-items: center !important;
}

.main-notice-list > li .box .date {
    width: 8rem;
    text-align: center;
    
}

.main-notice-list > li .box .date .mon-day {
    font-size: var(--font-size-20);
    font-weight: 700;
    color: #c50011;
}

.main-notice-list > li .box .date .year {
    font-size: var(--font-size-16);
    font-weight: 700;
    color: #666666;
}

.main-notice-list > li .box .tit {
    position: relative;
    font-size: var(--font-size-18);
    font-weight: 700;
    color: #000000;
    padding: 0.625rem 1.875rem;
    width: calc(100% - 5.125rem - 8rem);
    border-left: 1px solid #dddddd;
}


.main-notice-list > li .box .ico {
    position: relative;
    width: 5.125rem;
    height: 5.125rem;
}

.main-notice-list > li .box .ico::before {
    content: '';
    display: block;
    width: 1.375rem;
    height: 1.375rem;
    background: url(/html/_skin/img/common/ico_board_plus.png) no-repeat center / contain;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: calc(-1.375rem / 2);
    margin-left: calc(-1.375rem / 2);
    transition: all 0.3s ease;
}

.main-news-list {
    background-color: #fff;
    height: 100%;
    padding: 2.5rem;

    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column  !important;
    flex-direction: column !important;
}

.main-news-list .tit {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
    margin-bottom: 1.25rem;
}

.main-news-list .tit b {
    font-size: var(--font-size-22);
    font-weight: 700;
    color: #111111;
}

.main-news-list .tit a {
    font-size: var(--font-size-14);
    font-weight: 400;
    color: #1a1a1a;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center !important;
    align-items: center !important;
    gap: 0.625rem;
}

.main-news-list .tit a:hover .ico {
    transform: rotate(180deg);
}

.main-news-list .tit a .ico {
    font-size: 0;
    text-indent: -9999px;
    display: block;
    width: 1.375rem;
    height: 1.375rem;
    background: url(/html/_skin/img/common/ico_board_plus.png) no-repeat center / contain;
    transition: all 0.3s ease;
}

.main-news-list .box {
    background-color: #f4f4f4;
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    position: relative;
}

.main-news-list .box figure {
    width: 100%;
    height: auto;
    aspect-ratio : 340 / 220 ;
    background-color: #000000;
}

.main-news-list .box figure img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.main-news-list .box .tit {
    padding: 1.875rem;
}

.main-news-list .box .tit p {
    font-size: var(--font-size-20);
    font-weight: 700;
    color: #111111;
}

@media (max-width: 1199px) {
    .latest-layout {
        display: -ms-flexbox;
        display: flex;
        gap: 1.25rem;
    }

    .latest-layout .left {
        width: calc(100% - 40% - 20px);
    }

    .latest-layout .right {
        width: 40%;
    }
}

@media (max-width: 767px) {
    .latest-layout {
        -ms-flex-direction: column  !important;
        flex-direction: column !important;
    }

    .latest-layout .left {
        width: 100%;
        order: 2;
    }

    .latest-layout .right {
        width: 100%;
        order: 1;
    }

    .main-visual {
        width: 100%;
        height: auto;
        aspect-ratio : 1280 / 720;
    }

    .scroll-down {
        bottom: 10px;
    }

    .scroll-down .mouse {
        width: 20px;
        height: auto;
        aspect-ratio : 26 / 46;
    }

    .scroll-down .mouse .wheel {
        width: 4px;
        height: 4px;
    }

    .scroll-down p {
        font-size:var(--font-size-12);
    }
}

.main-product-slide .main-prod-slider .text-box .cnt > b {
    color: #222222;
    font-weight: 700;
    font-size: var(--font-size-18);
}

.main-product-slide .main-prod-slider .text-box .cnt > .desc {
    color: #222222;
    font-weight: 400;
    font-size: var(--font-size-18);
}

.main-product-slide .main-prod-slider .text-box .cnt > .descb b {
    font-weight: 700;
}