/* scroll */
::-webkit-scrollbar { width:5px; height: 5px; }
::-webkit-scrollbar-track { background:#eee; -moz-border-radius:0; -webkit-border-radius:0; border-radius:0; }
::-webkit-scrollbar-thumb { height:50px; width:50px; background:#000; -moz-border-radius:0px; -webkit-border-radius:0px; border-radius:0px; }
::-webkit-scrollbar-thumb:window-inactive { background:#000; -moz-border-radius:0px; -webkit-border-radius:0px; border-radius:0px; }

.scroll_on { opacity: 0; transition: all 1s;}
.scroll_on.active {opacity: 1 !important;transform: translate(0, 0) !important;}
.scroll_on.type_top {transform: translate(0, -50px);}
.scroll_on.type_bottom {transform: translate(0, 50px);}
.scroll_on.type_left {transform: translate(-50px, 0);}
.scroll_on.type_right {transform: translate(50px, 0);}

.scroll_on02 { opacity: 0; transition: all 1s;}
.scroll_on02.active {opacity: 1 !important; }

.wrap { position: relative; width: 1440px; margin: 0 auto; }
.wrap02 { position: relative; width: 90%; margin: 0 auto; }
.wrap_head { position: relative; width: 95%;  margin: 0 auto; }

/* head */
.head { position: absolute; left: 0; top: 0; z-index: 99; width: 100%; border-bottom: 1px solid rgba(255, 255, 255, 0.2); transition: 0.3s; }
.head.scrolled { position: fixed; background: #fff; border-bottom: none; box-shadow: 0 5px 30px rgba(0, 0, 0, 0.05); }

.head .wrap { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; height: 100px; }
.head .wrap02 { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; height: 100px; }
.logo { margin: 10px 0; }
.head .logo .logo_w { display: inline-block; }
.head .logo .logo_c { display: none; }
.head.scrolled .logo .logo_w { display: none; }
.head.scrolled .logo .logo_c { display: inline-block; }

.menu_inr { display: flex; flex-wrap: wrap; align-items: center; }
.menu_inr li { position: relative; display: inline-flex; flex-wrap: wrap; align-items: center; height: 100px; padding: 0 30px; }
.menu_inr li > a { color: #fff; font-size: 24px; font-weight: 500; transition: 0.3s; }
.head.scrolled .menu_inr li > a { color: #222; }
.menu_inr li a:hover {  }

.smenu_dl { overflow: hidden; position: absolute; left: -20%; top: 90%; padding: 20px 0px; width: 140%; background: #3a8afd; border-radius: 3px; z-index: 999; display: none; }
.smenu_dl dd { margin-bottom: 10px; text-align: center; transition: 0.5s; }
.smenu_dl dd:last-child { margin-bottom: 0px; border-bottom: none; }
.smenu_dl dd:hover {  }
.smenu_dl dd a { display: block; color: rgba(255, 255, 255, 0.8); font-size: 1em; letter-spacing: -0.03em; transition: 0.3s; }
.smenu_dl dd a:hover { color: #fff; text-decoration: underline; }

.mobile_menu { display: none; }

/* footer */
.footer { position: relative; padding: 30px 5%; background: #000; color: #888; font-size: 15px; }
.footer .wrap {  }
.footer_menu { position: absolute; right: 5%; bottom: 0px; display: flex; flex-direction: column; justify-content: center; height: 100%; gap: 15px; }
.footer_menu li  { }
.footer_menu li a { display: block; text-align: right; color: #fff; font-size: 1.1em; font-weight: 600; }
.footer_menu li a:hover { text-decoration: underline; }

.footer_info { line-height: 1.5; }
.footer_info_inr { margin-top: 10px; }
.footer_info_main { margin-top: 0px; margin-bottom: 5px;}
.footer_info_inr strong { margin-right: 20px; color: #fff; }
.footer_info_main strong { display: block; margin-right: 0px; margin-bottom: 5px; color: #fff; }
.footer_info_inr span { position: relative; padding: 0 20px; }
.footer_info_inr span.pl00 { padding-left: 0px; }
.footer_info_inr span:after { content:''; position: absolute; top: 10%; right: 0px; width: 1px; height: 80%; background: rgba(255, 255, 255, 0.5); }
.footer_info_inr span.noline:after { display: none; }
.footer_copyright { margin-top: 20px; }
.footer_copyright a { color: #888; }

/* main */
.swiper { width: 100%; height: 100%; }
.swiper-slide {  }
.swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover; }

.main_vis { position: relative; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; width: 100%; height: 910px; padding-top: 0px; background: #222; background-size: cover; }

.swiper-slide .main_vis_bg { position: absolute; left: 0%; top: 0%; width: 100%; height: 100%; transform: scale(1.1); transition: all 4s; }
.swiper-slide-active .main_vis_bg { transform:scale(1); }

.main_vis_bg01 { background: #222 url('../image/main/main_vis01.jpg') center top no-repeat; background-size: cover; }
.main_vis_bg02 { background: #222 url('../image/main/main_vis02.jpg') center top no-repeat; background-size: cover; }

/* ===========================
   메인 전체 컨테이너
=========================== */
.main_arrow { position: relative; z-index: 98; display: flex; flex-wrap: nowrap; justify-content: center; align-items: center; width: 100%; }
.main_vis .swiper-pagingbox { position: relative; z-index: 1000; display: flex; align-items: center; gap: 15px; }

/* ===========================
   숫자 (현재 / 전체)
=========================== */
.page_num { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; color: rgba(255, 255, 255, 0.5); font-size: 0.9em; font-family: 'Presentation'; }
.page-current, .page-total { text-align: center; width: 24px; height: 24px; line-height: 24px; font-size: 1em; font-weight: 700; }
.page-current { color: rgba(255, 255, 255, 1); }

/* ===========================
   Progressbar (fill div 방식)
=========================== */
.swiper-progress-bar { overflow: hidden; position: relative; width: 130px; height: 2px; background: rgba(255,255,255,0.3); border-radius: 2px; }

/* 채워지는 바 */
.swiper-progress-bar .progress-fill { position: absolute; left: 0; top: 0; height: 100%; width: 0%; background: #fff; transition: width 5s linear; }

/* ===========================
   Prev / Next 버튼
=========================== */
.main_vis .swiper-button-prev, .main_vis .swiper-button-next { position: relative; top: auto; left: auto; right: auto; width: auto; height: auto; margin-top: 0; color: rgba(255,255,255,0.9); }

.main_vis .swiper-button-prev:after, .main_vis .swiper-button-next:after { font-family: 'xeicon' !important; font-size: 24px; }
.main_vis .swiper-button-prev:after { content: "\e93c"; /* < */ }
.main_vis .swiper-button-next:after { content: "\e93f"; /* > */ }

/* ===========================
   Pause / Play 버튼
=========================== */
.swiper-button-pause { position: relative; text-align: center; width: 24px; height: 24px; color: rgba(255,255,255,0.9); line-height: 24px; cursor: pointer; }
.swiper-button-pause:after { font-family: 'xeicon' !important; font-size: 22px; content: "\ea3b"; /* ❚❚ 일시정지 */ }
.swiper-button-pause.playing:after { content: "\ea3e"; /* ▶ 재생 */ }

/* ===========================
   Swiper 기본 Fraction 숨김
=========================== */
.main_vis .swiper-pagination { display: none !important; }

.main_text { position: absolute; top: 0px; left: 0px; z-index: 8; display: flex; flex-direction: column; flex-wrap: wrap; justify-content: center; text-align: center; width: 100%; height: 100%; padding-top: 100px; color: #fff; }
/* .main_text:after { content:''; position: absolute; top: 0px; left: 0px; width: 100%; height: 50%; background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } */
.main_text .wrap > h2 { position: relative; z-index: 9; margin: 0px 0 50px; color: #fff; font-size: 95px; line-height: 1; animation: fadein 1s ease-in-out; }
.main_text .wrap > p { position: relative; z-index: 9; margin-bottom: 100px; color: rgba(255, 255, 255, 1); font-size: 1.5em; line-height: 1.6; animation: fadein 1s ease-in-out; }

@keyframes zoomOut1 {
    0% { background-size: 120% 120%; }
    100% { background-size: 100% 100%; }
}

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

.scrolldown { position: absolute; right: 5%; bottom: 0px; width: 16px; height: 230px; z-index: 99; opacity: 1; transition: 0.5s; }
.scrolldown p { position: absolute; top: 0px; left: 50%; width: 120px; margin-left: 10px; margin-top: 0px; color: #fff; font-size: 14px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; transform: rotate(90deg); transform-origin: 0% 0%; transition: margin 0.3s; }
.scrolldown i { position:absolute; left:50%; bottom:0; overflow:hidden; width:2px; height:100px; border-radius:0; background-color: rgba(255,255,255,0.2); transition:height 0.1s; }
.scrolldown i:after{ position: absolute; top: 50%; left: 0%; display: block; content: ""; width: 100%; height: 30px; background: #fff; border-radius:0; animation: scrollDown 2s infinite; }

@keyframes scrollDown {
    0%{ top: 0; }
	100% { top: 120%; }
}

.main_con { padding: 150px 0; }

.main_con01 { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; padding-bottom: 0px; }
.main_con01 .main_con01_inr { width: 50%; }
.main_con01 .main_con_left { height: 600px; padding-right: 80px; }
.main_con01 .main_con_right {  }
.main_con01 .main_con01_imgbox { width: 0%; height: 100%; background: url('../image/main/main_con01_img01.jpg') center center no-repeat; }
.main_con01 .main_con01_imgbox.active { width: 100%; }
.main_con_textbox { width: 720px; max-width: 100%; }
.main_con_textbox h3 { margin-bottom: 50px; font-size: 52px; font-weight: 800; line-height:1; }
.main_con_textbox h3 span { position: relative; }
.main_con_textbox h3 span:after { content:''; position: absolute; top: 0px; right: -20px; width: 10px; height: 10px; background: #006abc; border-radius: 10px; }
.main_con_textbox p { text-align: justify; color: #555; font-size: 1.1em; line-height: 1.6; word-break: keep-all; }
.main_con_textbox p strong { color: #006abc; font-weight: 700; }

.main_con02 { display: flex; flex-wrap: wrap; justify-content: center; }
.main_con02 .main_con02_inr { width: 50%; }
.main_con02 .main_con_left { display: flex; flex-wrap: wrap; justify-content: flex-end; }
.main_con02 .main_con_right { min-height: 550px; padding-left: 80px; }
.main_con02 .main_con02_imgbox { width: 0%; height: 100%; background: url('../image/main/main_con02_img01.jpg') center center no-repeat; background-size: cover; }
.main_con02 .main_con02_imgbox.active { width: 100%; }

.main_con03 { background: #f7f7f7; }
.main_con03 h3 { margin-bottom: 50px; text-align: center; font-size: 52px; }
.main_con03_list { display: flex; flex-wrap: wrap; gap: 10px; }
.main_con03_list li { position: relative; flex: 1; width: auto;  }
.main_con03_list li:nth-child(even) { margin-top: 50px; }
.main_con03_list li:nth-child(4n+1) { margin-left: 0%; }
.main_con03_list li .main_con03_imgbox { position: relative; height: 550px; box-shadow: 0 0px 10px rgba(0, 0, 0, 0.1); transition: 0.3s; }
.main_con03_list li:hover .main_con03_imgbox { margin-top: -10px; }
.main_con03_list li .main_con03_imgbox img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center center; }
.main_con03_list li .main_con03_textbox { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 50px; text-align: left; color: #fff; }
.main_con03_list li .main_con03_textbox h4 { font-size: 32px; text-shadow: 0 0px 5px rgba(0, 0, 0, 0.5); }
.main_con03_list li .main_con03_textbox h4 .eng { display: block; margin-bottom: 15px; font-size: 15px; font-weight: 600; /* text-transform: uppercase; */}

/* sub */
.sub_vis { overflow: hidden; position: relative; display: flex; flex-wrap: wrap; align-items: center; width: 100%; height: 500px; background: #000; background-size: cover; color: #fff; }
.sub_vis .bg { position: relative; width: 100%; height: 100%; background: #010005; animation: zoomOut 5s ease-out forwards;}

.sub_vis .bg01 { background: #222 url('../image/sub/sub_vis01.jpg') center top no-repeat; background-size: cover; }
.sub_vis .bg02 { background: #222 url('../image/sub/sub_vis02.jpg') center top no-repeat; background-size: cover; }
.sub_vis .bg03 { background: #222 url('../image/sub/sub_vis03.jpg') center top no-repeat; background-size: cover; }

.sub_vis .sub_textbox { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding-top: 100px; text-align: center; color: #fff; animation: fadein 1s ease-in-out; }
.sub_vis .sub_textbox .wrap { position: relative; display: flex; flex-wrap: wrap; align-content: center; justify-content: center; align-items: center; text-align: center; height: 100%; }
.sub_vis .sub_textbox h2 { font-size: 65px; line-height: 1.3; font-weight: 800; }
.sub_vis .sub_textbox p { display: block; width: 100%; margin-top: 30px; color: rgba(255, 255, 255, 1); font-size: 26px; font-weight: 600; line-height: 1.5; }

@keyframes zoomOut {
	0% { transform: scale(1.2); }
	100% { transform: scale(1); /* 원래 크기로 */ }
}

.sub_contents { position: relative; color: #333; font-size: 1.15em; line-height: 1.5; }

.sidebar { position: relative; z-index: 9; display: flex; flex-wrap: wrap; align-items: center; text-align: center; width: 100%; height: 80px; border-bottom: 1px solid #ddd; }
.sidebar_inr { display: inline-flex; flex-wrap: wrap; justify-content: center; align-items: center; width: 100%; padding: 0px; background: #fff; }
.sidebar_inr li { flex: 1; display: inline-flex; flex-wrap: wrap; justify-content: center; align-items: center; border-left: 1px solid #d9e1eb; }
.sidebar_inr.wh02 li { min-width: 250px; }
.sidebar_inr li:first-child { border-left: none; }
.sidebar_inr.sidebar_wh05 li { flex: none; width: 20%; }

.sidebar_inr li a { display: inline-flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 0 5px; width: 100%; min-width: 200px; padding: 0 10px; color: #aaa; font-size: 24px; font-weight: 700; transition: all 0.3s; }
.sidebar_inr li.active a, .sidebar_inr li a:hover { color: #123962; }

.sub_title { text-align: center; margin-bottom: 50px; }
.sub_title h2 { margin-bottom: 20px; font-size: 48px; }
.sub_title p { font-size: 14px; }

.board_wrap { padding: 150px 0; }
.sub_inner { padding: 120px 0; }

.company .wrap { display: flex; flex-wrap: wrap; }
.company_img { width: 55%; height: 680px; }
.company_img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.company_text { display: flex; flex-wrap: wrap; align-content: center; width: 45%; padding-left: 80px; word-break: keep-all; }
.company_text .title { display: block; width: 100%; margin-bottom: 50px; color: #002895; font-size: 2.2em; font-weight: 900; line-height: 1; }

.certificate_list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
    width: 100%;
    margin: 0 auto;
    margin-top: 50px;
}
.certificate_list li { flex: 1; display: flex; flex-wrap: wrap; align-content: center; justify-content: center; align-items: center; border: 1px solid #ccc; }
.certificate_list li img { max-width: 100%; }

.greetings .wrap { display: flex; flex-wrap: wrap; }
.greetings_title { display: block; width: 100%; margin-bottom: 50px; font-size: 1.7em; font-weight: 700; }
.greetings_img { width: 50%; height: 560px; }
.greetings_img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.greetings_text { width: 50%;}

:root {
	--navy: #1a3a5c;
	--blue: #4a7bb5;
	--light: #6e9fd4;
	--bg: #f5f7fa;
	--card: #ffffff;
	--border: #ccc;
	--text: #2c3e50;
	--sub: #7a8fa6;
	--red: #c0392b;
	--line: #ddd;
}

.org-title { text-align: center; font-size: 2.2rem; font-weight: 700; letter-spacing: .06em; color: var(--navy); margin-bottom: 50px; opacity: 0; animation: fadeDown .6s ease .1s forwards; }
.org-wrap { display: flex; flex-direction: column; align-items: center; gap: 0; margin: 0 auto; }

.ceo-row { display: flex; flex-direction: column; align-items: center; opacity: 0; animation: fadeDown .6s ease .25s forwards; }
.ceo-circle { width: 200px; height: 200px; border-radius: 500px; background: #3a8afd; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 1.5em; font-weight: 700; letter-spacing: .08em; box-shadow: 0 8px 28px rgba(74, 123, 181, .45); position: relative; transition: transform .3s, box-shadow .3s; }
/* .ceo-circle:hover { transform: translateY(-4px) scale(1.05); box-shadow: 0 14px 36px rgba(74,123,181,.55); } */
.ceo-line-v { width: 2px; height: 48px; background: var(--line); display: none; }

.h-bar-wrap { width: 100%; display: flex; align-items: flex-start; justify-content: center; position: relative; opacity: 0; animation: fadeUp .6s ease .45s forwards; }
.h-bar { position: absolute; top: 0px; left: calc(100% / 12.5); right: calc(100% / 12.5); height: 2px; background: var(--line); display: none; }

.dept-row { width: 100%; display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; padding-top: 60px; opacity: 0; animation: fadeUp .6s ease .55s forwards; }
.dept-card { display: flex; flex-direction: column; flex-wrap: wrap; justify-content: center; background: var(--card); border: 2px solid var(--border); border-radius: 8px; padding: 30px 10px 30px; text-align: center; position: relative; transition: box-shadow .25s, transform .25s, border-color .25s; cursor: default; }
.dept-card::before { content: ''; display: block; width: 2px; height: 40px; background: var(--line); position: absolute; top: -40px; left: 50%; transform: translateX(-50%); display: none; }
.dept-card:hover { box-shadow: 0 6px 22px rgba(74,123,181,.18); transform: translateY(-4px); border-color: var(--blue); }
.dept-card:hover::before { top: -36px; height: 36px; }
.dept-name { margin-bottom: 10px; font-size: 1.15em; font-weight: 700; line-height: 1; word-break: keep-all; }
.dept-name .red { color: var(--red); }
.dept-email { font-size: 16px; color: var(--sub); word-break: break-all; line-height: 1.5; }
.dept-card.accent { border-color: var(--blue); }
.dept-card.accent .dept-company { font-size: .78rem; font-weight: 700; color: var(--blue); margin: 4px 0 2px; letter-spacing: .03em; }

@keyframes fadeDown { from { opacity: 0; transform: translateY(-18px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeUp { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 860px) {
	.dept-row { grid-template-columns: repeat(3, 1fr); gap: 38px 10px; }
	.h-bar { left: calc(100% / 6); right: calc(100% / 6); }
}

@media (max-width: 540px) { 
	.ceo-row { width: 100%; }
	.ceo-circle { width: 100%; height: 70px; margin-bottom: 30px; }
	.dept-row { grid-template-columns: repeat(2, 1fr); gap: 10px; padding-top: 0; } 
	.h-bar { display: none; }
	.dept-card::before { display: none; }
	.ceo-line-v { height: 28px; display: none; } 
}

.business .sub_inner { padding-top: 0; }
.business_in { display: flex; flex-wrap: wrap; align-items: center; padding: 120px 0 0; }
.business_in h3 { position: relative; width: 100%; margin-bottom: 50px; font-size: 36px; font-weight: 800; line-height: 1; }
.business_in h3 span { display: block; margin-bottom: 10px; font-size: 0.7em; }

.business_imgbox { width: 50%; }
.business_imgbox img { max-width: 100%; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15); }
.business_textbox { width: 50%; padding-left: 80px; }
.business_textbox p {text-align:left; font-size: 0.9em;}
.business_in h4 { position: relative; margin-bottom: 30px; color:#3059c7; font-size: 25px; line-height: 1; }

.business_table01 { border-top: 2px solid #3059c7; }
.business_table01 th, .business_table01 td { text-align: center; padding: 15px 10px; border-bottom: 1px solid #ddd; border-left: 1px solid #ddd; }
.business_table01 th:first-child, .business_table01 td:first-child { border-left: none; }
.business_table01 th { background: #f4f6fb; }
.business_table01 td {}

.business_list { margin-bottom: 50px; }
.business_list:last-child { margin-bottom: 0px; }
.business_list li { position: relative; margin-bottom: 10px; letter-spacing: 0.03em; }
.business_list li:last-child { margin-bottom: 0px; }

.business_list01 li { padding-left: 20px; }
.business_list01 li:after { content:''; position: absolute; top: 10px; left: 0px; width: 8px; height: 8px; border: 2px solid #3059c7; border-radius: 500px; }

.business_list02 { padding-left: 25px; }
.business_list02 li { list-style: auto; }

.business_title { margin-bottom: 50px; padding: 50px; background: #dce3f5; }
.business_title02 { margin-bottom: 50px; font-size: 1.2em; font-weight: 800; }

#business05 .business_title { font-size: 1.05em; }

.contact_inr02 { display: flex; padding: 0; }

.contact_title_text { margin-bottom: 50px; font-size: 28px; font-weight: 600; }
.contact_info { padding: 30px 30px; margin-bottom: 50px; border-top: 1px solid #888; border-bottom: 1px solid #ddd; }
.contact_info li { margin-bottom: 10px; }
.contact_info li:last-child { margin-bottom: 0px; }
.contact_info li span { display: inline-flex; flex-wrap: wrap; align-items: center; width: 130px; font-weight: bold; line-height: 1; }
.contact_info li span i { margin-right: 5px; font-size: 1.1em; }
.contact_info li a { color: #555; font-weight: 400; }

.contact_list { display: flex; flex-wrap: wrap; margin-bottom: 50px; }
.contact_list li { margin-bottom: 15px; }
.contact_list li.wh50 { width: 49%; margin-left: 2%; }
.contact_list li.wh50:nth-child(2n+1) { margin-left: 0%; }
.contact_list li.wh100 { width: 100%; }
.contact_list li:last-child { margin-bottom: 0px; }
.contact_input { width: 100%; height: 60px; padding: 10px; background: #f4f4f4; border: none; font-size: 1em; font-weight: 300; }

.contact_btnbox { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; }
a.contact_btn { display: inline-flex; flex-wrap: wrap; justify-content: center; align-items: center; width: 200px; height: 60px; background: #0092e5; color: #fff; transition: 0.3s; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15); }
a.contact_btn:hover { background: #0057aa; }
a.contact_btn i { margin-right: 5px; }

button.contact_btn { border:none; display: inline-flex; flex-wrap: wrap; justify-content: center; align-items: center; width: 200px; height: 60px; background: #0092e5; color: #fff; transition: 0.3s; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15); }
button.contact_btn:hover { background: #0057aa; }
button.contact_btn i { margin-right: 5px; }