
/*서브 비주얼 , 서브 네비게이션 CSS */

.subVisual {width:100%; height:600px; position:relative;}

.subVisual.sv01 {background:url(/img/sub/sv01.jpg) no-repeat center / cover;}
.subVisual.sv02 {background:url(/img/sub/sv02.jpg) no-repeat center / cover;}
.subVisual.sv03 {background:url(/img/sub/sv03.jpg) no-repeat center / cover;}
.subVisual.sv04 {background:url(/img/sub/sv04.jpg) no-repeat center / cover;}
.subVisual.sv05 {background:url(/img/sub/sv05.jpg) no-repeat center / cover;}


.subTit {position:absolute; left:50%; bottom:108px; transform:translateX(-50%); text-align:center; width:100%;}
.subTit h2 {color:#fff; font-size:3.75rem; font-weight:700; letter-spacing:-0.05em;}
.subTit p {color:#fff; font-size:2.5rem; font-weight:500; letter-spacing:-0.05em; line-height:1.3em; margin-top:60px; word-break: keep-all; }

.subNavi {padding:80px 0 80px;}

.subNavi_list {display:flex; gap:72px;}
.subNavi_list li {position:relative;}
.subNavi_list li:first-child::before {display:none;}
.subNavi_list li::before {content:''; position:absolute; left:-36px; top:50%; transform:translateY(-50%); background:url(/img/sub/right_arr.png) no-repeat center / cover; width:9px; height:14px;}
.subNavi_list li a {display:flex; align-items:center; display:block; font-size:1.25rem; font-weight:500; color:#232323; letter-spacing:-0.05em; }
.subNavi_list li:last-child a {font-weight:700;}

.footer_wrap {padding-top:184px;}


/*↓반응형*/
@media screen and ( max-width: 1480px ) { 
.subVisual { height: 550px; }
.subNavi { padding: 128px 0 60px; }
.subTit p { margin-top: 48px; }
}

@media screen and ( max-width: 1280px ) { 
.subVisual { height: 500px; }
.subNavi { padding: 106px 0 60px; }

}

@media screen and ( max-width: 1080px ) { 
.subVisual { height: 450px; }
.subNavi { padding: 83px 0 60px; }
.subTit p { font-size: 22px; margin-top: 33px; }

}

@media screen and ( max-width: 720px ) { 
.subNavi { padding: 60px 0 60px; }
.subVisual { height: 400px; }
.subTit h2 { font-size: 35px; }
.subTit p { font-size: 18px; margin-top: 30px; }
.subTit p br { display: none; }
.subNavi_list { gap: 64px }
.footer_wrap {padding-top:80px;}
}





/*공통 -- 단, 섹션관련*/

.commonTit_box { text-align: center; }
.commonSTit { font-size: 1.875rem/*30px*/; font-weight: 500; letter-spacing: -0.05em; }
.commonTit { display: inline-block; font-size: 3.125rem/*50px*/; font-weight: 500; line-height: 1.6em; letter-spacing: -0.03em; word-break: keep-all; margin-top: 50px; }
.commonTit em { font-size: 4.375rem/*70px*/; font-weight: 500; line-height: 1.3em; letter-spacing: -0.03em; color: #e77b06;  }

.secTit_box { margin-top: 68px; }
.globalSection .secTit_box { width:50%; margin-top: 0;}
.techSection .secTit_box { margin-top: 90px; }
.techSec_box_wrap .secTit_box { text-align: left; }
.secTit { font-size: 1.75rem/*28px*/; font-weight: 600; letter-spacing: -0.07em; margin-bottom: 40px; display: flex; flex-wrap: wrap; align-items: baseline; }
.globalSection .secTit {font-size:1.4rem;margin-bottom:8px;}
.MainSec_box .secTit { margin-bottom: 30px; }

.secTit em { font-size: 1.375rem/*22px*/; font-weight: 600; letter-spacing: -0.05em; margin-left: 16px; color: #686868; }
.globalSection.secTit em { font-size:1.1rem;}
.MainSec_box .secTit em { font-size: 2.3rem; margin-right: 16px; margin-left: 0; opacity: .4; }

.secArt { 
    font-size: 1.5rem/*24px*/; font-weight: 500; line-height: 1.6em;
    word-break: keep-all; letter-spacing: -0.05em; word-break: keep-all;  color: #686868; margin-top:30px;
}
.globalSection .secArt {font-size: 1rem; margin-top:0;}
.MainSec_box.secArt { text-align: center; margin-top: 50px; }

/*↓반응형*/
@media screen and ( max-width: 1080px ) { 


.commonTit { font-size: 2rem; }
.commonTit em { font-size: 2.8rem; }

.secTit_box { margin-top: 50px; }
.techSection .secTit_box { margin-top: 60px; }

.secTit { margin-bottom: 30px; }
.MainSec_box .secTit { margin-bottom: 25px; }

/*.secArt br { display: none; }*/
}

@media screen and ( max-width: 1020px ) { 
.globalSection .secTit_box { margin-top: 25px;}
.globalSection .secTit_box { width:100%;}

}

@media screen and ( max-width: 720px ) { 
.maintenanceSection .commonTit { font-size: 20px; }
/*.commonTit br { display: none; }*/
.maintenanceSection .commonTit br { display: block; }

.commonTit { font-size: 20px; margin-top: 25px; }
.commonTit em { font-size: 28px; }
.maintenanceSection .commonTit em { font-size: 31px; line-height: 1em; } 

.secTit_box { margin-top: 40px; }
.globalSection .secTit_box { margin-top: 18px;text-align: center; }
.techSection .secTit_box { margin-top: 40px; }

.secTit { margin-bottom: 20px; }
.globalSection .secTit { justify-content: center; }

.MainSec_box .secTit { margin-bottom: 20px; }
.secArt { font-weight: 400; font-size:16px; }
.globalSection .secArt {height: 100px; overflow:unset;}

}







/*회사소개 -- 대표인사말*/

.greetingSection { width: 100%; }


.greeting_name em { font-size: 1.375rem/*22px*/; font-weight: 300; margin-right: 25px; letter-spacing: -0.05em; line-height: 4em; }
.greeting_name { font-size: 2.5rem/*40px*/; font-weight: 500; text-align: right; line-height: 1.81em; letter-spacing: 0.4em; vertical-align: baseline; margin-top:60px; }
.greeting_name_en em { font-size: 1.375rem/*22px*/; font-weight: 300; letter-spacing: -0.05em; }
.greeting_name_en { font-size: 2rem/*40px*/; font-weight: 500; text-align: right; letter-spacing: 0.1em; vertical-align: baseline; margin-top:60px; } 
 
.greeting_img { margin: 90px 0 70px 0; }
.greeting_img img { width: 100%;  }


/*↓반응형*/
@media screen and ( max-width: 1480px ) { 
.greeting_img { margin: 80px 0 61px 0; }
}
@media screen and ( max-width: 1280px ) { 
.greeting_img { margin: 65px 0 52px 0; }
}
@media screen and ( max-width: 1080px ) { 
.greeting_img { margin: 50px 0 43px 0; }
}
@media screen and ( max-width: 720px ) { 
.greeting_name { font-size: 30px; }
.greeting_name_en { font-size: 30px; }
.greeting_img { margin: 40px 0 34px 0; }
}







/*회사소개 -- 글로벌 네트워크*/

.globalSection { width: 100%; }
.globalSection_img_box_wrap {display:flex; margin-top: 0; gap:16px; justify-content: space-between;}
.globalSection_img_box { width: 50%; text-align: center; margin-top: 0; }
.globalSection_img img { width: 100%; }
.globalSection_img_info { font-size: 15px; font-weight: 500; color: #686868; letter-spacing: -0.03em; margin-top: 14px;  }
.globalSection_img_info br { display: none; }


.ch_Gmap_box {width: 100%; height: 100%; position:relative; margin-top:90px;}
.ch_Gmap {width:100%;}
.ch_Gmap img {width:100%;}

.pin {z-index:1; position:absolute; display: inline-block; padding: 5px 18px; border-radius:20px;cursor: pointer;box-shadow:0 4px 11px rgba(0, 0, 0, 0.1); border: 1px solid #e77b06; background: #fff; color: #e77b06;  }
.pin.pin_vina { bottom: 38%; left: 35.6%; }
.pin.pin_amer {top: 42%; right: 13%; }
.pin.pin_indi { bottom: 41%; left: 28%; }
.pin.pin_egy {bottom: 44%; left: 14%; }
.pin a {display:flex;align-items:center;gap:14px;font-weight:600;letter-spacing:-0.03em;color:#686868;}
.pin a i::before, .pin a i::after {z-index:-1; content: ""; position: absolute; background: #ffdfcf; margin-left: -26px;margin-top: -5px;width: 50px;height: 50px;border-radius: 50%;animation: pin 3s infinite linear;}
.pin a i::after {opacity: 0; animation: pin 3s 1.5s infinite linear;}
@keyframes pin {
  0% {
    transform: scale(0);
    opacity: 1;
	}	
  100% { 
    transform: scale(3.5);
    opacity: 0;
	}
}
.pin a i img {position:absolute;bottom:-8px;left:9px;width:17px;}
.yujin_pin{position:absolute;top:42%;left: 40.3%;display:flex;align-items:center;justify-content:center;padding:10px;border-radius:50%;aspect-ratio:1;background:linear-gradient(45deg,#e77b06, #fff);animation: yujin_pin_bounce 3s infinite; }
@-webkit-keyframes yujin_pin_bounce {
    0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);}
    40% {-webkit-transform: translateY(-30px) }
    60% {-webkit-transform: translateY(-20px);}
} 
@keyframes yujin_pin_bounce {
    0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
    40% {transform: translateY(-30px);}
    60% {transform: translateY(-20px);}
} 
.yujin_pin i {width:100%;}
.yujin_pin i img{width:45px;}

.temp_wrap {position:relative;}
.tabContentBox {position:absolute; top:50%; transform:translate(-50%, -50%); max-width:1000px; width:92%; left:50%; z-index:10; background: rgba(255, 255, 255, 0.9);}
/* 	.globalBg {position:fixed; width:100%; height:100%; background:rgba(255,255,255, 0.6); left:0; top:0; z-index:9;} */
.tab-content{display:none;position:relative;padding:34px 14px 34px;}
.tab-content.current {display:none;}

.ch_pop_close_btn_box {width:20px;height:20px;position:absolute;right:10px;top:10px;}
.ch_pop_close_btn{width:20px;height:20px;position:relative;}
.ch_pop_close_btn span{position:absolute;width:20px;height:2px;background:#111;z-index:1;transition:transform.3s ease;}
.ch_pop_close_btn span:nth-child(1) {transform: translate(-50%, -50%) rotate(45deg);}
.ch_pop_close_btn span:nth-child(2) {transform: translate(-50%, -50%) rotate(-45deg);}
.ch_pop_close_btn_box:hover .ch_pop_close_btn span:nth-child(1) {transform: translate(-50%, -50%) rotate(0deg);}
.ch_pop_close_btn_box:hover .ch_pop_close_btn span:nth-child(2) {transform: translate(-50%, -50%) rotate(0deg);}

/*↓반응형*/
@media screen and ( max-width: 1480px ) { 
/* .globalSection_img_box { margin-top: 80px; }  */
.globalSection_img_info { margin-top: 18px; }
.ch_Gmap_box {margin-top:80px;}*/
.pin.pin_vina {left: 34.6%; }
.pin.pin_indi { }
}

@media screen and ( max-width: 1280px ) { 
/* .globalSection_img_box { margin-top: 65px; }  */
.globalSection_img_info { margin-top: 14px; }
.ch_Gmap_box {margin-top:70px;}
.yujin_pin{top: 45%;}
.pin.pin_vina { left: 34.6%; bottom: 39%;} 
.pin.pin_indi { left: 27%;}
}
@media screen and ( max-width: 1020px ) { 
/* .globalSection_img_box { margin-top: 50px; }  */
.ch_Gmap_box {margin-top:60px; }
.tabContentBox {max-width: 500px;}
.yujin_pin {padding: 5px;}
.yujin_pin i img { width: 30px; }
.pin.pin_vina { }
.pin.pin_indi { }
.pin {padding: 5px 11px;}
.pin a {font-size: 0.8rem;}
.pin a i img { left:5px; }

.globalSection_img_box_wrap { display:block;}
.globalSection_img_box {width:100%}
.globalSection_img img { width: 88%; }
.globalSection_img_info {  margin-top: 11px;  }

.tab-content { height: 240px; overflow:scroll; overflow-x: hidden;}
.tab-content::-webkit-scrollbar { width: 4px; }
.tab-content::-webkit-scrollbar-track {  background-color: gray; }
.tab-content::-webkit-scrollbar-thumb {  background-color: rgba(255,255,255,0.5); }
.tab-content::-webkit-scrollbar-button { display: none; }
.tab-content::-webkit-scrollbar-corner { display: none; }
}

@media screen and ( max-width: 720px ) { 
/* .globalSection_img_box { margin-top: 40px; }  */
/*.globalSection_img_info { font-size: 13px; margin-top: 8px; }
.ch_Gmap_box {margin:50px 0 20px;}
.pin { padding: 3px 7px; }
.pin a i img {width: 15px;}
.pin.pin_vina { bottom: 40%; left: 33.6%;}
.pin.pin_indi { left: 26%; }
.pin.pin_amer { top: 43%; right: 9%; }
.yujin_pin { top: 46%; left: 38.3%;}
.yujin_pin i img { width: 18px; }*/
.pin { padding: 2px 9px; }
.pin.pin_vina { left: 32.6%;bottom: 41%; }
.pin.pin_amer { top: 37%; right: 8%; }
.pin.pin_indi { bottom: 44%; left: 26%; }
.pin a i img { width:13px;}

.ch_Gmap_box { margin-top: 30px; }

.tab-content {height: auto; padding:20px 0 0;overflow:unset;}
.tab-content.current {display:inherit;}
.tabContentBox { position: unset; transform: unset; max-width:unset; width: 100%; margin: 0 auto; background:#fff; }
.ch_pop_close_btn_box{display:none;}
.globalSection_img_box_wrap { display: unset;}
}

@media screen and ( max-width: 480px ) { 
.yujin_pin { padding: 3px; top: 38%; left: 38.3%;}
.yujin_pin i img {width: 22px;}
.pin a { gap: 12px;}
.pin.pin_amer { top: 31%; right: 1%; }
.globalSection_img_info { font-size: 13px; }
}




/*사업분야 -- 유지보수*/

.maintenanceSection { width: 100%; }

.MainSec_box { width: 100%; padding-top: 90px; }
.MaSecVideo { width: 100%; height: 100%;}

.swiper.chSwip_MT7 { width: 100%; overflow: unset; margin-top: 40px; }
.swiper.chSwip_MT7 .swiper-slide { width: 100%; overflow: hidden; padding: 10px; border-radius: 10px; border: 1px solid rgba(0, 0, 0, 0.1); box-shadow: rgba(0, 0, 0, 0.2) 4px 3px 19px 1px; }

.MainT_img { }
.MainT_img img { width: 100%; }

.video-container { position:relative; height:0; padding-bottom:56.25%;}
.video-container iframe { position:absolute; top:0; left:0; width:100%; height:100%; }

/*↓반응형*/
@media screen and ( max-width: 1480px ) { 
.MainSec_box { padding-top: 80px; }
} 
@media screen and ( max-width: 1280px ) { 
.MainSec_box { padding-top: 70px; }
} 
@media screen and ( max-width: 1080px ) { 
.MainSec_box { padding-top: 60px; }
} 
@media screen and ( max-width: 720px ) { 
.MainSec_box { padding-top: 50px; }
} 




/*고객지원 -- 유지보수*/

.contact_map { padding-top: 90px; height:450px;}
.contact_map iframe { border-radius: 0 30px 0 30px; }

.contact_mapInfo_box { width: 100%; display: flex; justify-content: space-around; gap: 50px; align-items: center; text-align: center;  margin-top: 40px; padding: 20px; border-radius: 20px; border: 1px solid #e1e1e1; }
.contact_mapInfo em { font-size: 1.3rem; font-weight: 600; letter-spacing: -0.05em; color: #e77b06;  }
.contact_mapInfo { font-size: 1rem; font-weight: 500; letter-spacing: -0.03em; display: flex; align-items: center; gap: 10px;  }


.contact_mapInfo_box_en { width: 100%; display: flex; justify-content: space-around; gap: 50px; align-items: center; text-align: center;  margin-top: 40px; padding: 20px; border-radius: 20px; border: 1px solid #e1e1e1; }
.contact_mapInfo_en em { font-size: 1.3rem; font-weight: 600; letter-spacing: -0.05em; color: #e77b06;  }
.contact_mapInfo_en { font-size: 1rem; font-weight: 500; letter-spacing: -0.03em; display: flex; align-items: center; gap: 10px;  }
.contact_mapInfo_box_en p i {display:flex; align-items:center; gap:10px;}


/*↓반응형*/

@media screen and ( max-width: 1480px ) { 
.contact_map { padding-top: 80px; }
} 
@media screen and ( max-width: 1280px ) { 
.contact_map { padding-top: 70px; }
} 

@media screen and ( max-width: 1080px ) { 
.contact_map { padding-top: 60px; }
}

@media screen and ( max-width: 1020px ) { 
.contact_map {height:250px;}
}
@media screen and ( max-width: 990px ) { 
.contact_mapInfo_box_en {text-align:unset;}
.contact_mapInfo_box_en {flex-wrap:wrap; gap:25px; padding: 20px;}
.contact_mapInfo_box_en p {width:100%; flex-wrap:wrap;}
.contact_mapInfo_box_en p i {width:100%;} 
}

@media screen and ( max-width: 960px ) { 
.contact_mapInfo_box {gap:25px;}

.contact_mapInfo {gap:5px;}
.contact_mapInfo em {font-size:16px;}
.contact_mapInfo img{width:18px;}

.contact_mapInfo_en {gap:5px;}
.contact_mapInfo_en em {font-size:16px;}
.contact_mapInfo_en img{width:18px;}
}

@media screen and ( max-width: 810px ) { 
.contact_mapInfo_box {gap:10px; padding:10px;}

}

@media screen and ( max-width: 768px ) {
.contact_mapInfo_box {flex-wrap:wrap; padding: 20px 45px;}
.contact_mapInfo_box p {width:100%;}
 }

@media screen and ( max-width: 720px ) {
.contactSection .commonTit br { display: block; }
.contact_map { padding-top: 40px; }
 }



/*기술소개 -- 유진의 기술*/
.techImg_wrap { width: 100%; display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-end;  }

.techImg img { width: 100%; }

.techSec_box_wrap { text-align: center; }
.techSec_box_wrap a  { display: inline-block; font-size: 1.25rem/*20px*/; font-weight: 600;  padding: 20px 50px; border-radius: 8px; border: 2px solid #333; margin-top: 100px; transition: 0.28s; }
.techSec_box_wrap a:hover { color: #fff; background: #e77b06; border: 2px solid #e77b06; }

/*↓반응형*/
@media screen and ( max-width: 720px ) {
.techSec_box_wrap a { margin-top: 50px; padding: 10px 50px; }
 }




/*사업분야 -- 파트너*/
.partnerSection { width: 100%; border-bottom: 1px solid #bbb; padding-bottom: 80px; }
.partnerSection_img_wrap { display: flex; flex-wrap: wrap;} 
.partnerSection_img_wrap li {width:calc((100% - 20px*3)/4); margin-right:20px;}
.partnerSection_img_wrap li:nth-of-type(4n) {margin-right:0;}
.globalSection_img img { width: 100%; }
.globalSection_img { border: 1px solid #e1e1e1; border-radius:10px; overflow:hidden;}

.partnerSection_box:last-child {margin-top:70px;}



/*↓반응형*/
@media screen and ( max-width: 1020px ) {
.partnerSection_img_wrap li {width:calc((100% - 20px)/2); margin-right:20px;}
.partnerSection_img_wrap li:nth-of-type(n + 3) {margin-top:20px;}
.partnerSection_img_wrap li:nth-of-type(2n) {margin-right:0;}
 }

@media screen and ( max-width: 720px ) {
.partnerSection_box:last-child {margin-top:35px;}
.partnerSection {padding-bottom:60px;}
 }


.commonTit span {display:flex; align-items: baseline; gap:10px;}

@media screen and ( max-width: 720px ) {

.commonTit span { align-items: baseline; gap: 4px;flex-wrap: wrap; /* align-items: center; */ justify-content: center;}

}



/*--이미지 페이드 인·아웃 효과--*/
.overWrapBg {background:url('/img/sub/global_network_cover_02.jpg') no-repeat center / cover; width:100%; height:100vh; position:fixed; left:0; top:0; z-index:99; opacity: 0; transform: scale(1);  transition: opacity 1s ease-out, transform 1s ease-out;}
.overWrapBg.visible {opacity: 1; transform: scale(1);}
.overWrapBg.hidden { opacity: 0; pointer-events: none; transform: scale(1.2);}

