@charset "UTF-8";

/* ==================== 메인 비주얼 ==================== */
.visual{position: relative;}
.main_slide{background-size: cover; background-position: center; background-repeat: no-repeat; position: relative; display: flex; align-items: center; justify-content: center; padding: 370px 0 300px;}

/* 텍스트 */
.main_text{position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; color: #fff;}
.main_text .main_en{font-size: 18px; font-weight: 400; letter-spacing: -0.025em; line-height: 130%;}
.main_text h2{font-size: 52px; font-weight: 600; letter-spacing: -0.025em; line-height: 130%; margin-top: 12px;}
.main_text .main_desc{font-size: 17px; font-weight: 400; letter-spacing: -0.025em; line-height: 140%; margin-top: 28px;}

/* 컨트롤 (페이지네이션 + 일시정지) */
.main_control{position: absolute; z-index: 2; left: 50%; bottom: 25%; transform: translateX(-50%); display: flex; align-items: center; gap: 12px;}
.main_pagination.swiper-pagination{position: static; width: auto; display: flex; align-items: center; gap: 12px;}
.main_pagination .swiper-pagination-bullet{width: 20px; height: 20px; margin: 0 !important; background: transparent; opacity: 1; border-radius: 50%; transition: 0.3s all; position: relative; border: 1px solid transparent;}
.main_pagination .swiper-pagination-bullet::after{content: ''; width: 6px; height: 6px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); border-radius: 50%; background: #fff; opacity: 0.6; transition: 0.3s all;}
.main_pagination .swiper-pagination-bullet-active{border-color: rgba(255,255,255,0.6);}
.main_pagination .swiper-pagination-bullet-active::after{opacity: 1;}
/* 일시정지/재생 버튼 */
.main_pause{display: flex; align-items: center; background: none; border: none; cursor: pointer; padding: 0;}
.main_pause .pause_icon{display: flex; align-items: center; gap: 4px;}
.main_pause .pause_icon i{display: block; width: 1.5px; height: 8px; background: #fff; border-radius: 1px;}

/* 재생 상태 */
.main_pause.playing .pause_icon{display: none;}
.main_pause.playing::after{content: ''; display: block; width: 0; height: 0; border-style: solid; border-width: 5px 0 5px 8px; border-color: transparent transparent transparent #fff;}

/* 좌우 네비게이션 */
.main_prev, .main_next{position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; width: 68px; background: none; border: 1px solid rgba(255,255,255,0.5); border-radius: 100px; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: 0.3s all;}
.main_prev::before, .main_next::before{content: ''; padding-bottom: 100%;}
.main_prev{left: 3.1%;}
.main_next{right: 3.1%;}
.main_prev:hover, .main_next:hover{background: rgba(255,255,255,0.1);}
.main_prev span, .main_next span{font-family: 'SUIT Variable', sans-serif; font-size: 24px; font-weight: 200; color: #fff; line-height: 100%;}

/* 스크롤다운 */
.scroll_down{position: absolute; bottom: 40px; left: 50%; transform: translateX(-50%); z-index: 2; display: flex; flex-direction: column; align-items: center; gap: 8px;}
.scroll_mouse{width: 18px; border: 1.6px solid #F5F5F5; border-radius: 9px; display: flex; justify-content: center; padding: 5px 0 12px;}
.scroll_mouse span{display: block; width: 3px; background: #F5F5F5; border-radius: 2px; animation: scrollWheel 1.5s infinite;}
.scroll_mouse span::before{content: ''; display: block; padding-bottom: 200%;}
.scroll_down p{font-size: 14px; font-weight: 600; color: #fff;}

@keyframes scrollWheel{
    0%{opacity: 1; transform: translateY(0);}
    100%{opacity: 0; transform: translateY(8px);}
}

/* ==================== main1 브랜드 스토리 ==================== */
.main1{position: relative;}

/* 고정 텍스트 배경 */
.main1_bg{position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; padding: 290px 0; background: #fff;}
.main1_bg::before{content: ''; position: absolute; inset: 0; background: url('../img/main1_bg.png') no-repeat center; background-size: 70% auto; opacity: 0.06;}

/* 텍스트 */
.main1_text{position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; text-align: center;}
.main1_text .main1_label{font-size: var(--fs18); font-weight: 600; color: #505050; line-height: 140%;}
.main1_text h2{font-size: 52px; font-weight: 600; color: #111; line-height: 130%; letter-spacing: -0.025em; margin-top: 12px;}
.main1_text .main1_point{font-weight: 700; color: #F9722A;}
.main1_text .main1_desc{font-size: var(--fs20); font-weight: 400; color: #505050; line-height: 140%; letter-spacing: -0.025em; margin-top: 20px;}
.main1_btn{display: flex; align-items: center; justify-content: center; gap: 8px; width: 200px; padding: 20px 0; background: #2A47A1; border-radius: 100px; font-size: var(--fs18); font-weight: 600; color: #fff; line-height: 140%; letter-spacing: -0.025em; margin-top: 40px; text-decoration: none; transition: 0.3s all;}
.main1_btn:hover{opacity: 0.85;}
.main1_btn span{font-family: 'SUIT Variable', sans-serif; font-size: 16px; font-weight: 200; line-height: 100%;}

/* 스크롤 카드 영역 */
.main1_scroll{position: relative; z-index: 2; pointer-events: none;}
.main1_scroll .box_wrap{position: relative;}
.main1_scroll .box_wrap::after{content: ''; display: block; padding-bottom: 79.2%;}

/* 카드 공통 */
.main1 .box{position: absolute; border-radius: 0px; box-shadow: 8px 8px 16px rgba(0,0,0,0.12); background-size: cover; background-position: center; overflow: hidden; pointer-events: auto;}
/* .main1 .box::after{content: ''; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(0,0,0,0) 50%, rgba(0,0,0,0.48) 100%); border-radius: 32px;} */
.main1 .box p{position: absolute; bottom: 40px; left: 40px; z-index: 1; font-size: var(--fs28); font-weight: 700; color: #fff; line-height: 130%; letter-spacing: -0.025em;}

/* 카드 개별 위치/크기 */
.main1_card1{left: 10.4%; top: 13.2%; width: 25%; padding-bottom: 21.9%;}
.main1_card2{left: 12.5%; top: 59.2%; width: 21.9%; padding-bottom: 21.9%;}
.main1_card3{left: 71.4%; top: 36.2%; width: 18.2%; padding-bottom: 21.9%;}

/* ==================== main6 브랜드 소개 ==================== */
.main6{padding: 160px 0; background: #fff; overflow: hidden;}
.main6_wrap{display: flex; align-items: center; gap: 80px;}
.main6_img{width: 55%; flex-shrink: 0; overflow: hidden;}
.main6_img img{width: 100%; display: block;}
.main6_text{flex: 1;}
.main6_label{font-size: var(--fs18); font-weight: 600; color: #505050 !important; line-height: 130%; letter-spacing: -0.025em;}
.main6_text h2{font-size: 45px; font-weight: 600; color: #111; line-height: 140%; letter-spacing: -0.025em; margin-top: 16px;}
.main6_text .main6_point{color: #F9722A; font-weight: 700;}
.main6_desc{font-size: var(--fs28); font-weight: 500; color: #333; line-height: 160%; letter-spacing: -0.025em; margin-top: 28px;}
.main6_detail{margin-top: 28px; padding-top: 28px; border-top: 1px solid #E5E5EC;}
.main6_detail p{font-size: var(--fs18); font-weight: 400; color: #666; line-height: 180%; letter-spacing: -0.025em;}
.main6_detail p + p{margin-top: 12px;}
.main6_detail strong{font-weight: 600; color: var(--color);}
.main6_btn{display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 200px; padding: 20px 0; background: var(--color); border-radius: 100px; font-size: var(--fs18); font-weight: 600; color: #fff; line-height: 140%; letter-spacing: -0.025em; margin-top: 40px; text-decoration: none; transition: 0.3s all;}
.main6_btn:hover{opacity: 0.85;}
.main6_btn span{font-family: 'SUIT Variable', sans-serif; font-size: 16px; font-weight: 200; line-height: 100%;}

/* ==================== main1 플로우 텍스트 ==================== */
.main1_flow{position: relative; z-index: 3; overflow: hidden; background: #fff;}
.main1_flow_track{display: flex; align-items: center; gap: 40px; white-space: nowrap; animation: main1Flow 20s linear infinite;}
.main1_flow_track span{font-size: 90px; font-weight: 600; color: #F5F5F5; line-height: 140%; letter-spacing: -0.025em; flex-shrink: 0;}
.main1_flow_track i{display: block; width: 18px; height: 18px; border-radius: 50%; background: #F5F5F5; flex-shrink: 0;}

@keyframes main1Flow{
    0%{transform: translateX(0);}
    100%{transform: translateX(-50%);}
}

/* ==================== main2 상품 슬라이드 ==================== */
.main2{padding: 140px 0; overflow: hidden;}
.main2_wrap{display: flex; align-items: flex-start; gap: 40px; padding-left: max(4%, calc((100% - 1540px) / 2));}

/* 왼쪽 텍스트 */
.main2_left{width: 480px; flex-shrink: 0; display: flex; flex-direction: column; padding-top: 100px;}
.main2_text{}
.main2_label{font-size: var(--fs18); font-weight: 600; color: #505050; line-height: 140%;}
.main2 h2{font-size: 45px; font-weight: 600; color: #111; line-height: 130%; letter-spacing: -0.025em; margin-top: 12px;}
.main2 .main2_point{color: #F9722A; font-weight: 700;}
.main2_desc{font-size: var(--fs20); font-weight: 400; color: #505050; line-height: 140%; letter-spacing: -0.025em; margin-top: 20px;}
.main2_btn{display: flex; align-items: center; justify-content: center; gap: 8px; width: 200px; padding: 20px 0; background: #2A47A1; border-radius: 100px; font-size: var(--fs18); font-weight: 600; color: #fff; line-height: 140%; letter-spacing: -0.025em; text-decoration: none; transition: 0.3s all; margin-top: 40px;}
.main2_btn:hover{opacity: 0.85;}
.main2_btn span{font-family: 'SUIT Variable', sans-serif; font-size: 16px; font-weight: 200; line-height: 100%;}

/* 오른쪽 슬라이더 */
.main2_right{flex: 1; position: relative; min-width: 0;}
.main2_slider{overflow: hidden;}
.main2Swiper{overflow: visible;}
.main2Swiper .swiper-slide{width: 480px; position: relative; border-radius: 0px; background-size: cover; background-position: center; overflow: hidden; box-shadow: 8px 8px 16px rgba(0,0,0,0.12);}
.main2Swiper .swiper-slide::before{content: ''; display: block; padding-bottom: 100%;}
.main2Swiper .swiper-slide::after{content: ''; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(0,0,0,0) 48%, rgba(0,0,0,0.4) 100%); border-radius: 0px; opacity: 0; transition: opacity 0.4s;}
.main2Swiper .swiper-slide-active::after{opacity: 1;}

/* 슬라이드 텍스트 */
.main2_slide_text{position: absolute; bottom: 40px; left: 40px; z-index: 1; width: 83%; opacity: 0; transition: opacity 0.4s;}
.main2Swiper .swiper-slide-active .main2_slide_text{opacity: 1;}
.main2_slide_text h3{font-size: 26px; font-weight: 500; color: #fff; line-height: 140%; letter-spacing: -0.025em;}
.main2_slide_text p{font-size: var(--fs18); font-weight: 400; color: #fff; line-height: 140%; letter-spacing: -0.025em; margin-top: 12px;}

/* 네비게이션 */
.main2_prev, .main2_next{position: absolute; top: 50%; z-index: 2; width: 52px; background: rgba(255,255,255,0.85); border: none; border-radius: 50%; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: 0.3s all; box-shadow: 0 2px 8px rgba(0,0,0,0.1);}
.main2_prev::before, .main2_next::before{content: ''; padding-bottom: 100%;}
.main2_prev{left: 0; transform: translate(-50%, -50%);}
.main2_next{left: 480px; right: auto; transform: translate(-50%, -50%);}
.main2_prev:hover, .main2_next:hover{background: #fff;}
.main2_prev span, .main2_next span{font-family: 'SUIT Variable', sans-serif; font-size: 20px; font-weight: 200; color: #333; line-height: 100%;}

/*
@media all and (min-width: 1600px){
    .main2_next{left: calc(480px * 2 + 40px);}
}
*/

/* ==================== main3 핵심가치 ==================== */
.main3{padding: 160px 0; background: #FFFCF4;}

/* 타이틀 */
.main3_title{text-align: center;}
.main3_title > span{font-size: var(--fs18); font-weight: 600; color: #505050; line-height: 140%;}
.main3_title h2{font-size: 45px; font-weight: 600; color: #111; line-height: 130%; letter-spacing: -0.025em; margin-top: 12px;}
.main3_title .main3_point{color: #F9722A; font-weight: 700;}
.main3_title > p{font-size: var(--fs20); font-weight: 400; color: #505050; line-height: 140%; letter-spacing: -0.025em; margin-top: 20px; }

/* 카드 영역 */
.main3 .item-box{display: flex; gap: 20px; margin-top: 80px;}
.main3 .item{flex: 1; height: 500px; position: relative; overflow: hidden; background-size: cover; background-position: center; border-radius: 0px; cursor: pointer; opacity: 0; transform: translateY(40px); transition: opacity 0.8s ease, transform 0.8s ease, flex-grow 0.6s ease;}
.main3 .item:nth-child(2){transition-delay: 0.15s;}
.main3 .item:nth-child(3){transition-delay: 0.3s;}
.main3 .item.on{opacity: 1; transform: translateY(0); transition-delay: 0s;}

/* 그라데이션 오버레이 */
.main3 .item::after{content: ''; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(0,0,0,0) 40%, rgba(0,0,0,0.65) 100%); border-radius: inherit;}

/* 호버 확장 */
.main3 .item:hover{flex-grow: 2.5;}

/* 카드 텍스트 */
.main3 .item .text{position: absolute; bottom: 40px; left: 40px; z-index: 1; color: #fff; width: calc(100% - 80px);}
.main3 .main3_en{font-size: 30px; font-weight: 400; line-height: 130%; text-transform: uppercase; font-weight: bold;}
.main3 .item .text strong{display: block; font-size: var(--fs24); font-weight: 600; line-height: 130%; letter-spacing: -0.025em; margin-top: 20px; max-height: 0; opacity: 0; overflow: hidden; transition: max-height 0.4s ease, opacity 0.4s ease;}
.main3 .item .text strong b{font-weight: 700;}
.main3 .item .text > p:last-child{font-size: var(--fs18); font-weight: 500; line-height: 140%; letter-spacing: -0.025em; margin-top: 8px; max-height: 0; opacity: 0; overflow: hidden; transition: max-height 0.4s 0.1s ease, opacity 0.4s 0.1s ease;}
.main3 .item:hover .text strong{max-height: 200px; opacity: 1;}
.main3 .item:hover .text > p:last-child{max-height: 200px; opacity: 1;}

/* ==================== main4 공지사항 ==================== */
.main4{padding: 160px 0;}
.main4_wrap{display: flex; align-items: flex-start; justify-content: space-between;}

/* 왼쪽 타이틀 */
.main4_left{flex-shrink: 0;}
.main4_left > span{font-size: var(--fs18); font-weight: 600; color: #505050; line-height: 130%; letter-spacing: -0.025em;}
.main4_left h2{font-size: 45px; font-weight: 600; color: #111; line-height: 130%; letter-spacing: -0.025em; margin-top: 20px;}
.main4_left h2 b{font-weight: 700; color: #F9722A;}
.main4_btn{display: flex; align-items: center; justify-content: center; gap: 8px; width: 200px; padding: 20px 0; background: #2A47A1; border-radius: 100px; font-size: var(--fs18); font-weight: 600; color: #fff; line-height: 140%; letter-spacing: -0.025em; text-decoration: none; transition: 0.3s all; margin-top: 48px;}
.main4_btn:hover{opacity: 0.85;}
.main4_btn span{font-family: 'SUIT Variable', sans-serif; font-size: 16px; font-weight: 200; line-height: 100%;}

/* 오른쪽 리스트 */
.main4_right{width: 58%;}

/* ==================== main5 CTA ==================== */
.main5{position: relative; padding: 160px 0; background: url('../img/m5_bg.png') no-repeat center / cover;}
.main5::before{content: ''; position: absolute; inset: 0; background: linear-gradient(to right, rgba(0,0,0,0) 18%, rgba(0,0,0,0.48) 69%);}
.main5 .width{position: relative; z-index: 1; display: flex; justify-content: flex-end;}
.main5_text{display: flex; flex-direction: column; align-items: center; text-align: center; color: #fff; width: 50%;}
.main5_text > span{font-size: var(--fs24); font-weight: 400; line-height: 130%;}
.main5_text h2{font-size: 45px; font-weight: 600; line-height: 130%; letter-spacing: -0.025em; margin-top: 20px;}
.main5_text > p{font-size: var(--fs20); font-weight: 400; line-height: 140%; letter-spacing: -0.025em; margin-top: 28px;}
.main5_btn{display: flex; align-items: center; justify-content: center; gap: 8px; width: 200px; padding: 20px 0; background: #2A47A1; border-radius: 100px; font-size: var(--fs18); font-weight: 600; color: #fff; line-height: 140%; letter-spacing: -0.025em; text-decoration: none; transition: 0.3s all; margin-top: 48px;}
.main5_btn:hover{opacity: 0.85;}
.main5_btn span{font-family: 'SUIT Variable', sans-serif; font-size: 16px; font-weight: 200; line-height: 100%;}

/* ==================== footer ==================== */
#ft{background: #fff; border-top: 1px solid #E5E5EC; padding: 0;}
.footer{padding: 60px 0 70px;}
.foot_top{display: flex; flex-direction: column; align-items: flex-start;}
.foot_logo{display: inline-block; width: 10%;}
.foot_logo img{width: 100%;}
.foot_privacy{display: inline-flex; align-items: center; justify-content: center; width: 180px; border: 1px solid #999; border-radius: 100px; padding: 12px 28px; font-size: 15px; font-weight: 500; color: #505050; line-height: 150%; letter-spacing: -0.025em; text-decoration: none; transition: 0.3s all; margin-top: 24px;}
.foot_privacy:hover{border-color: #505050;}
.foot_info{display: flex; align-items: center; flex-wrap: wrap; margin-top: 24px;}
.foot_info span{font-size: 15px; font-weight: 400; color: #505050; line-height: 150%; letter-spacing: -0.025em; margin-right: 40px;}
.foot_info span:last-child{margin-right: 0;}
.foot_info span em{font-style: normal; color: #767676; margin-right: 12px;}
.copyright{margin-top: 16px; text-align: left;}
.copyright span{font-size: 15px; font-weight: 400; color: #111; line-height: 150%; letter-spacing: -0.025em;}

/* ==================== 서브 네비게이션 ==================== */
.sub_nav{width: 100%;}
.subnav{display: flex; align-items: center; justify-content: center; border-bottom: 1px solid #e5e5ec;}
.subnav_list{display: flex; align-items: center; justify-content: center; gap: 40px; list-style: none; margin: 0; padding: 0;}
.subnav_item{height: 70px; display: flex; align-items: center; justify-content: center; position: relative;}
.subnav_item a{font-family: 'Pretendard', sans-serif; font-size: 17px; font-weight: 400; color: #999; letter-spacing: -0.5px; line-height: 140%; text-decoration: none; white-space: nowrap; transition: color 0.3s;}
.subnav_item a:hover{color: #f9722a;}
.subnav_item.active{border-bottom: 2px solid #f9722a;}
.subnav_item.active a{color: #f9722a; font-weight: 600;}
.subnav_dot{display: flex; align-items: center; justify-content: center;}
.subnav_dot span{display: block; width: 4px; height: 4px; border-radius: 50%; background: #d9d9d9;}

/* ==================== a1 CEO 인사말 ==================== */
.a1_sec{background: #f7f7f7; position: relative;}
.a1_sec::before{content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 32%; background: #fff;}
.a1{display: flex; align-items: flex-start; gap: 0 5%;}
.a1_img{width: 35%; flex-shrink: 0;}
.a1_img img{width: 100%; border-radius: 0px;}
.a1_text{flex: 1;}
.a1_title{font-size: 32px; font-weight: 600; color: #F9722A; line-height: 130%; letter-spacing: -0.025em;}
.a1_sub{margin-top: 24px;}
.a1_sub p{font-size: var(--fs28); font-weight: 600; color: #111; line-height: 140%; letter-spacing: -0.025em; }
.a1_content > p{font-size: var(--fs20); font-weight: 400; color: #505050; line-height: 140%; letter-spacing: -0.025em; margin-top: 28px;}
.a1_content > p:first-of-type{margin-top: 28px;}
.a1_sign{display: flex; align-items: center; margin-top: 60px;}
.a1_sign span{font-size: var(--fs20); font-weight: 500; color: #111; line-height: 140%; letter-spacing: -0.025em; margin-right: 20px;}
.a1_sign strong{font-size: var(--fs32); font-weight: 700; color: #111; line-height: 140%; letter-spacing: -0.025em;}

/* ==================== a2 연혁 ==================== */
.a2{padding: 100px 0 160px;}
.a2_title{margin-bottom: 80px;}
.a2_title span{display: block; font-size: var(--fs24); font-weight: 400; color: #999; line-height: 130%;}
.a2_title h2{font-size: 45px; font-weight: 600; color: #000; line-height: 130%; letter-spacing: -1.4px; margin-top: 20px;}
.a2_wrap{display: flex; align-items: flex-start; justify-content: space-between;}
.a2_img{width: 40%; flex-shrink: 0;}
.a2_img img{width: 100%; border-radius: 0px;}
.a2_timeline{width: 50%;}
.a2_year{border-bottom: 1px solid #E5E5EC;}
.a2_year:first-child{padding-bottom: 50px;}
.a2_year + .a2_year{padding: 50px 0;}
.a2_year h3{font-size: 36px; font-weight: 600; color: #111; line-height: 130%; letter-spacing: -1.2px;}
.a2 .box_wrap{display: flex; flex-direction: column; gap: 32px; margin-top: 40px;}
.a2 .box{display: flex; align-items: flex-start; gap: 0 12px;}
.a2_month{display: inline-flex; align-items: center; justify-content: center; width: 54px; flex-shrink: 0; padding: 7px 16px; background: #F9722A; border-radius: 100px; font-size: 16px; font-weight: 600; color: #fff; line-height: 150%; letter-spacing: -0.4px; white-space: nowrap;}
.a2 .box .text{flex: 1; min-width: 0;}
.a2 .box .text strong{display: block; font-size: var(--fs28); font-weight: 500; color: #111; line-height: 140%; letter-spacing: -0.7px;}
.a2 .box .text p{font-size: var(--fs20); font-weight: 400; color: #505050; line-height: 140%; letter-spacing: -0.5px; margin-top: 4px;}

/* ==================== a3 오시는 길 ==================== */
.a3{padding: 100px 0 160px;}

/* 타이틀 */
.a3_title span{display: block; font-size: var(--fs24); font-weight: 400; color: #999; line-height: 130%;}
.a3_title h2{font-size: 45px; font-weight: 600; color: #000; line-height: 130%; letter-spacing: -1.4px; margin-top: 20px;}

/* 정보 */
.a3_info{margin-top: 100px; display: flex; flex-direction: column; gap: 20px;}
.a3_info_row{display: flex; align-items: center; gap: 0 24px;}
.a3_label{display: flex; align-items: center; gap: 0 8px; flex-shrink: 0;}
.a3_label svg{flex-shrink: 0;}
.a3_label strong{font-size: var(--fs20); font-weight: 600; color: #111; line-height: 140%; letter-spacing: -0.5px; white-space: nowrap;}
.a3_info_row > p{font-size: var(--fs20); font-weight: 500; color: #505050; line-height: 140%; letter-spacing: -0.5px;}

/* 지도 */
.a3_map{margin-top: 40px; border-radius: 0px; overflow: hidden;}
.a3_map .root_daum_roughmap{width: 100% !important;}
.root_daum_roughmap .cont .section{display: none;}

/* ==================== a4 CI ==================== */
.a4{padding: 100px 0 160px;}
.a4_title span{display: block; font-size: var(--fs18); font-weight: 600; color: var(--color); line-height: 140%; letter-spacing: -0.025em;}
.a4_title h2{font-size: 45px; font-weight: 600; color: #000; line-height: 130%; letter-spacing: -1.4px; margin-top: 20px;}
.a4_content{margin-top: 80px; border-radius: 28px; padding: 40px;}
.a4_desc{font-size: var(--fs22); font-weight: 600; color: #111; line-height: 160%; letter-spacing: -0.025em;}
.a4_wrap{display: flex; align-items: stretch; justify-content: space-between; margin-top: 60px;}
.a4_logo{width: 45%;}
.a4_logo img{width: 100%;}
.a4_right{width: 50%; display: flex; flex-direction: column;}
.a4 .box_wrap{display: flex; flex-direction: column; gap: 20px; flex: 1; justify-content: center;}
.a4 .box{display: flex; align-items: center; gap: 0 20px; background: #fff; border-radius: 16px; padding: 24px; border: 1px solid #E5E5EC;}
.a4_color{width: 140px; flex-shrink: 0; border-radius: 0px; position: relative;}
.a4_color::before{content: ''; display: block; padding-bottom: 100%;}
.a4 .box .text strong{display: block; font-size: var(--fs18); font-weight: 700; color: #111; line-height: 140%; letter-spacing: -0.025em;}
.a4 .box .text p{font-size: var(--fs14); font-weight: 400; color: #767676; line-height: 170%; letter-spacing: -0.025em; margin-top: 8px;}
.a4_btns{display: flex; align-items: center; justify-content: center; gap: 0 20px; margin-top: 60px;}
.a4_btn{display: flex; align-items: center; justify-content: center; gap: 0 40px; padding: 18px 36px; border: 1px solid #d9d9d9; border-radius: 100px; font-size: var(--fs18); font-weight: 500; color: #505050; line-height: 140%; letter-spacing: -0.025em; text-decoration: none; transition: 0.3s all; background: #fff;}
.a4_btn:hover{border-color: #999;}
.a4_btn img{width: 18px;}

/* ==================== 반응형 ==================== */
@media all and (max-width: 1400px){
    .main_text h2{font-size: 45px;}
    .main_text .main_en{font-size: 16px;}
    .main_text .main_desc{font-size: 15px;}

    .main1_text h2{font-size: 45px;}
    .main1_bg{padding: 240px 0;}

    .main6{padding: 120px 0;}
    .main6_wrap{gap: 60px;}
    .main6_text h2{font-size: 38px;}
    .main6_desc{font-size: 15px;}

    .main1_flow_track span{font-size: 76px;}
    .main1_flow_track i{width: 14px; height: 14px;}

    .main2{padding: 100px 0;}
    .main2_left{width: 380px;}
    .main2 h2{font-size: 38px;}
    .main2Swiper .swiper-slide{width: 400px;}
    .main2_next{left: 400px;}

    .main3{padding: 120px 0;}
    .main3_title h2{font-size: 38px;}
    .main3 .main3_en{font-size: 24px;}
    .main3 .item-box{margin-top: 60px;}
    .main3 .item{height: 450px;}

    .main4{padding: 120px 0;}
    .main4_left h2{font-size: 38px;}
    .main4_btn{margin-top: 40px;}

    .main5{padding: 120px 0;}
    .main5_text h2{font-size: 38px;}

    .a1_title{font-size: 30px;}

    .a2_title h2{font-size: 38px;}
    .a2_img{width: 40%;}
    .a2_year h3{font-size: 32px;}
    .a2 .box .text strong{font-size: var(--fs22);}
    .a2 .box .text p{font-size: 15px;}
    .a2_year:first-child{padding-bottom: 80px;}
    .a2_year + .a2_year{padding: 80px 0;}

    .a3_title h2{font-size: 38px;}

    .a4{padding: 80px 0 120px;}
    .a4_title h2{font-size: 38px;}
    .a4_content{padding: 60px; margin-top: 60px;}

    .sub_visual .sub_top_text h3{font-size: 32px;}
}

@media all and (max-width: 1024px){
    .main_slide{padding: 300px 0 250px;}
    .main_text h2{font-size: 38px;}
    .main_text .main_en{font-size: 15px;}
    .main_text .main_desc{font-size: 14px;}
    .main_prev, .main_next{width: 50px;}
    .main_prev{left: 15px;}
    .main_next{right: 15px;}

    .main1_text h2{font-size: 38px;}
    .main1_text .main1_desc{font-size: 15px;}
    .main1_bg{padding: 180px 0;}
    .main1 .box{border-radius: 24px;}
    .main1 .box::after{border-radius: 24px;}
    .main1 .box p{bottom: 28px; left: 28px; font-size: 18px;}
    .main1_card1{left: 8%; top: 10%; width: 30%; padding-bottom: 26%;}
    .main1_card2{left: 10%; top: 56%; width: 28%; padding-bottom: 28%;}
    .main1_card3{left: 62%; top: 32%; width: 26%; padding-bottom: 26%;}

    .main6{padding: 80px 0;}
    .main6_wrap{gap: 40px;}
    .main6_img{width: 50%;}
    .main6_text h2{font-size: 34px;}
    .main6_desc{font-size: 15px;}
    .main6_btn{width: 170px; padding: 16px 0;}

    .main1_flow_track span{font-size: 64px;}
    .main1_flow_track i{width: 12px; height: 12px;}
    .main1_flow_track{gap: 30px;}

    .main2{padding: 80px 0;}
    .main2_wrap{flex-direction: column; gap: 40px; padding: 0 4%; align-items: stretch;}
    .main2_left{width: 100%; padding-top: 0; flex-direction: row; align-items: flex-end; justify-content: space-between;}
    .main2 h2{font-size: 34px;}
    .main2_desc{font-size: 15px;}
    .main2Swiper .swiper-slide{width: 360px; border-radius: 24px;}
    .main2Swiper .swiper-slide::after{border-radius: 24px;}
    .main2_slide_text{bottom: 32px; left: 32px;}
    .main2_slide_text h3{font-size: 20px;}
    .main2_prev{left: 0;}
    .main2_next{left: 360px;}

    .main3{padding: 80px 0;}
    .main3_title h2{font-size: 34px;}
    .main3_title > p{font-size: 15px;}
    .main3 .main3_en{font-size: 22px;}
    .main3 .item-box{margin-top: 40px; gap: 16px;}
    .main3 .item{height: 400px; border-radius: 16px;}
    .main3 .item .text{bottom: 28px; left: 28px; width: calc(100% - 56px);}
    .main3 .item .text strong{font-size: 16px; margin-top: 16px;}
    .main3 .item .text > p:last-child{font-size: 14px;}

    .main4{padding: 80px 0;}
    .main4_wrap{flex-direction: column; gap: 40px;}
    .main4_left > span{font-size: 16px;}
    .main4_left h2{font-size: 34px;}
    .main4_right{width: 100%;}
    .main4_btn{margin-top: 32px;}

    .main5{padding: 100px 0;}
    .main5_text{width: 60%;}
    .main5_text > span{font-size: 16px;}
    .main5_text h2{font-size: 34px;}
    .main5_text > p{font-size: 15px;}

    .foot_info span{margin-right: 28px;}

    .subnav_list{gap: 24px;}
    .subnav_item a{font-size: 14px;}

    .a1{flex-direction: column;}
    .a1_img{width: 100%;}
    .a1_img img{border-radius: 24px;}
    .a1_text{margin-top: 40px;}
    .a1_title{font-size: 24px;}
    .a1_content > p{font-size: 15px;}
    .a1_sub p{font-size: 18px;}
    .a1_sign span{font-size: 15px;}
    .a1_sign strong{font-size: 22px;}
    .a1_sign{margin-top: 40px;}

    .a2{padding: 80px 0 120px;}
    .a2_title{margin-bottom: 60px;}
    .a2_title span{font-size: var(--fs18);}
    .a2_title h2{font-size: 30px;}
    .a2_wrap{flex-direction: column;}
    .a2_img{width: 100%;}
    .a2_img img{border-radius: 24px;}
    .a2_timeline{width: 100%; margin-top: 60px;}
    .a2_year h3{font-size: 26px;}
    .a2 .box .text strong{font-size: var(--fs20);}
    .a2 .box .text p{font-size: 14px;}
    .a2_year:first-child{padding-bottom: 60px;}
    .a2_year + .a2_year{padding: 60px 0;}
    .a2 .box_wrap{gap: 24px; margin-top: 32px;}

    .a3{padding: 80px 0 120px;}
    .a3_title span{font-size: var(--fs18);}
    .a3_title h2{font-size: 30px;}
    .a3_info{margin-top: 60px;}
    .a3_label strong{font-size: 15px;}
    .a3_info_row > p{font-size: 15px;}
    .a3_map{border-radius: 24px;}

    .a4{padding: 80px 0 100px;}
    .a4_title h2{font-size: 30px;}
    .a4_content{padding: 48px; margin-top: 48px; border-radius: 24px;}
    .a4_desc{font-size: var(--fs18);}
    .a4_wrap{flex-direction: column; align-items: stretch; margin-top: 40px;}
    .a4_logo{width: 100%;}
    .a4_right{width: 100%; margin-top: 32px;}
    .a4 .box_wrap{flex-direction: row; gap: 0 2%;}
    .a4 .box{width: calc(50% - 1%);}
    .a4_btns{margin-top: 48px;}

    .sub_visual .sub_top_text h3{font-size: 22px;}
}

@media all and (max-width: 800px){
    .main3 .item-box{flex-direction: column; gap: 16px;}
    .main3 .item{flex: none !important; height: 300px !important; opacity: 1 !important; transform: none !important;}
    .main3 .item:hover{flex-grow: 1;}
    .main3 .item .text strong{max-height: none; opacity: 1; overflow: visible;}
    .main3 .item .text > p:last-child{max-height: none; opacity: 1; overflow: visible;}
}

@media all and (max-width: 768px){
    .main_slide{padding: 230px 20px 210px;}
    .main_slide1{background-image: url('/theme/nero/img/main_visual1_m.png') !important;}
    .main_slide3{background-image: url('/theme/nero/img/main_visual3_m.png') !important;}
    .main_text h2{font-size: 26px;}
    .main_text .main_en{font-size: 14px;}
    .main_text .main_desc{font-size: 14px;}
    .main_prev, .main_next{display: none;}
    .scroll_down{bottom: 25px;}

    .a1_sec{background: none;}
    .a1_sec::before{display: none;}

    .main1_text h2{font-size: 28px;}
    .main1_bg{padding: 100px 0 60px;}
    .main1_text .main1_desc{font-size: 14px;}
    .main1_btn{width: 150px; padding: 14px 0; font-size: 14px;}

    .main1_scroll{pointer-events: auto;}
    .main1_scroll .box_wrap{display: flex; flex-wrap: wrap; gap: 16px; padding: 0 4% 60px;}
    .main1_scroll .box_wrap::after{display: none;}
    .main1 .box{position: relative; left: auto; top: auto; border-radius: 20px;}
    .main1 .box::after{border-radius: 20px;}
    .main1 .box p{bottom: 16px; left: 16px; font-size: 16px;}
    .main1_card1{width: calc(50% - 8px); padding-bottom: 50%;}
    .main1_card2{width: calc(50% - 8px); padding-bottom: 50%;}
    .main1_card3{width: 100%; padding-bottom: 45%;}

    .main6{padding: 60px 0;}
    .main6_wrap{flex-direction: column; gap: 32px;}
    .main6_img{width: 100%;}
    .main6_text h2{font-size: 26px;}
    .main6_text h2 br{display: none;}
    .main6_desc{font-size: 14px;}
    .main6_desc br{display: none;}
    .main6_detail{margin-top: 20px; padding-top: 20px;}
    .main6_detail p{font-size: 14px;}
    .main6_btn{width: 150px; padding: 14px 0; font-size: 14px; margin-top: 28px;}

    .main1_flow_track span{font-size: 40px;}
    .main1_flow_track i{width: 10px; height: 10px;}
    .main1_flow_track{gap: 24px;}

    .main2{padding: 60px 0;}
    .main2_left{flex-direction: column; align-items: flex-start;}
    .main2 h2{font-size: 26px;}
    .main2 h2 br{display: none;}
    .main2_btn{width: 150px; padding: 14px 0; font-size: 14px;}
    .main2Swiper .swiper-slide{width: 280px; border-radius: 20px;}
    .main2Swiper .swiper-slide::after{border-radius: 20px;}
    .main2_slide_text{bottom: 24px; left: 24px;}
    .main2_slide_text h3{font-size: 18px;}
    .main2_prev, .main2_next{width: 40px;}
    .main2_prev span, .main2_next span{font-size: 16px;}
    .main2_prev{left: 0;}
    .main2_next{left: 280px;}
    .main2Swiper{overflow: hidden; border-radius: 20px;}

    .main3{padding: 60px 0;}
    .main3_title h2{font-size: 26px;}
    .main3_title > p{font-size: 14px;}
    .main3 .main3_en{font-size: 18px;}
    .main3 .item-box{flex-direction: column; gap: 16px; margin-top: 32px;}
    .main3 .item{height: 300px; border-radius: 16px;}
    .main3 .item:hover{flex-grow: 1;}
    .main3 .item .text{bottom: 24px; left: 24px; width: calc(100% - 48px);}
    .main3 .item .text strong{font-size: 16px; margin-top: 12px; max-height: none; opacity: 1; overflow: visible;}
    .main3 .item .text > p:last-child{font-size: 14px; max-height: none; opacity: 1; overflow: visible;}

    .main4{padding: 60px 0;}
    .main4_left > span{font-size: 15px;}
    .main4_left h2{font-size: 26px; margin-top: 12px;}
    .main4_left h2 br{display: none;}
    .main4_btn{width: 150px; padding: 14px 0; font-size: 14px; margin-top: 28px;}

    .main5{padding: 80px 0;}
    .main5::before{background: linear-gradient(to right, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0.55) 50%);}
    .main5 .width{justify-content: center;}
    .main5_text{width: 100%;}
    .main5_text > span{font-size: 15px;}
    .main5_text h2{font-size: 26px; margin-top: 12px;}
    .main5_text > p{font-size: 14px; margin-top: 20px;}
    .main5_btn{width: 150px; padding: 14px 0; font-size: 14px; margin-top: 32px;}

    .footer{padding: 40px 0 50px;}
    .foot_logo{width: 25%;}
    .foot_info{flex-direction: column; align-items: flex-start;}
    .foot_info span{margin-right: 0; margin-bottom: 8px;}
    .foot_info span:last-child{margin-bottom: 0;}
    .foot_privacy{margin-top: 20px;}
    .copyright{margin-top: 20px;}
    .copyright span{font-size: 13px;}

    .subnav_list{gap: 16px; flex-wrap: wrap; padding: 0 20px;}
    .subnav_item{height: 50px;}
    .subnav_item a{font-size: 13px;}

    .a1_img img{border-radius: 20px;}
    .a1_title{font-size: 22px;}
    .a1_content > p{font-size: 15px; margin-top: 20px;}
    .a1_sub p{font-size: 18px;}
    .a1_sub{margin-top: 16px;}
    .a1_sign span{font-size: 14px;}
    .a1_sign{margin-top: 32px;}

    .a2{padding: 60px 0 80px;}
    .a2_title{margin-bottom: 40px;}
    .a2_title span{font-size: var(--fs18);}
    .a2_title h2{font-size: 26px;}
    .a2_img img{border-radius: 20px;}
    .a2_year h3{font-size: 24px;}
    .a2 .box .text strong{font-size: 16px;}
    .a2 .box .text p{font-size: 14px;}
    .a2_month{width: 42px; font-size: 14px; padding: 5px 12px;}
    .a2_year:first-child{padding-bottom: 48px;}
    .a2_year + .a2_year{padding: 48px 0;}
    .a2 .box_wrap{gap: 20px; margin-top: 24px;}

    .a3{padding: 60px 0 80px;}
    .a3_title span{font-size: var(--fs18);}
    .a3_title h2{font-size: 26px;}
    .a3_info{margin-top: 40px; gap: 16px;}
    .a3_info_row{gap: 0 16px;}
    .a3_label strong{font-size: 14px;}
    .a3_info_row > p{font-size: 14px;}
    .a3_map{margin-top: 28px; border-radius: 20px;}
    .root_daum_roughmap .wrap_map{height: 300px !important;}

    .a4{padding: 60px 0 80px;}
    .a4_title h2{font-size: 26px;}
    .a4_content{padding: 0; margin-top: 36px; border-radius: 20px;}
    .a4_desc{font-size: 15px;}
    .a4_wrap{margin-top: 32px;}
    .a4 .box_wrap{flex-direction: column;}
    .a4 .box{width: 100%; margin-bottom: 16px;}
    .a4_color{width: 64px;}
    .a4_btns{flex-direction: column; gap: 12px; margin-top: 36px;}
    .a4_btn{width: 100%; padding: 16px 28px;}

    .sub_visual .sub_top_text h3{font-size: 20px;}
    .sub_visual .sub_top_text p{font-size: 14px;}
}