@charset "utf-8";

@import url('reset.css');
@import url('swiper.min.css');
@import url('layout.css');

@media (min-width: 1201px) {
	.total_inner{width: 100%;position: absolute;height: 100%}

	#gnb{display: flex;align-items: center;justify-content: space-between;gap: 0;}
	#gnb > li{position: relative;padding: 0 10px}
	#gnb a{white-space: nowrap}
	#gnb .depth{display: none;position: absolute; top: var(--headH); left: 50%; transform: translateX(-50%);min-width: 100%;padding: 25px 0;text-align: center;}
	#gnb .sub li{margin-bottom: 7px}
	#gnb .sub li:last-child{margin-bottom: 0}
	#gnb .sub a{font-size: 18px;color: #464C53;display: block;padding: 5px 0}
	#gnb .sub a:hover{color: #214478;font-weight: 700}
	
	#header.is_open:after{display: block;content: '';width: 100%;height: 1px;background-color: rgba(201, 201, 201, 0.77);position: absolute;bottom: 0;left:0}
	#header.is_open .header_bg{background: #fff;}
	#header #gnb .depth{height: 340px;}
	#header.is_open .header_bg,
	#header.is_open .total_inner{height: calc(var(--headH) + 340px)}
	.header_bg{position:absolute;/*top:calc(var(--headH) + 1px);*/top:0;left:0;width:100%;height:0;border-top: 1px solid transparent;border-bottom: 1px solid transparent;transition:height .3s cubic-bezier(.19, 1, .22, 1);z-index:-1;overflow:hidden;}
	#header.is_open .header_bg{border-bottom: 1px solid rgba(255, 255, 255, 0.05);box-shadow:0 10px 20px rgba(0,0,0,.05)}
}

@media (min-width: 1024px) {
	.sitemap > li > a{font-family: 'Gmarket Sans', sans-serif; font-size: 24px;font-weight: 700;color: #fff}
	.sitemap .sub > li{margin-bottom: 8px;}
	.sitemap .sub > li > a{font-size: 19px;color: rgba(255,255,255,0.6);}
}

@media (max-width: 1023px) and (min-width: 768px) {
}

@media (min-width: 768px) {
	.lnb{display:flex !important}
}

@media (max-width: 1920px) {
}

@media (max-width: 1640px) {
	.total_nav{max-width: 740px;}
}

@media (max-width: 1200px) {
	.total_nav{position:fixed;top:0;left:0;width:100%;max-width:100%;height:100%;background-color:#fff;z-index:1050;transform:translateY(-20px);opacity:0;overflow-y:auto;visibility:hidden;pointer-events:none;margin-left: 0;}
	.total_inner{min-height: 100%;display: flex;align-items: center;justify-content: center;padding: 0 0 50px;overflow-y:auto;}
	#header.is_open .total_nav{transform:translateY(0);opacity:1;visibility:visible;pointer-events:auto;transition:transform .5s cubic-bezier(.19, 1, .22, 1),opacity .4s,visibility .5s;}
	.total_nav .util_area{display: flex !important;padding: 29px var(--leftRightMargin);justify-content: end;}
	.total_nav .util_area .bar{top: -1px}
	#gnb > li{opacity:0;transform:translateY(15px);transition: all 1s cubic-bezier(0.19, 1, 0.22, 1);margin: 32px 0}
	#gnb > li > a{justify-content: center;padding: 0 var(--leftRightMargin);height: auto;background: url(../images/bul02.svg) no-repeat right var(--leftRightMargin) top 50%;color: #000 !important;font-size: 26px;text-align: center;font-weight: 500}
	#gnb > li.has_sub > a{background-image: url(../images/bul01.svg)}
	#gnb .depth{padding: 12px var(--leftRightMargin) 0;display: none}
	#gnb .sub li{margin-bottom: 0;text-align: center}
	#gnb .sub a{display: flex;align-items: center;justify-content: center;height: 52px;color: #898989;text-align: center;font-weight: 600;font-size: 18px;}
	
	#header.is_open #gnb > li{opacity:1;transform:translateY(0)}
	#header.is_open #gnb > li:first-child{transition-delay:0.1s}
	#header.is_open #gnb > li:nth-child(2){transition-delay:0.15s}
	#header.is_open #gnb > li:nth-child(3){transition-delay:0.2s}
	#header.is_open #gnb > li:nth-child(4){transition-delay:0.25s}
	#header.is_open #gnb > li:nth-child(5){transition-delay:0.3s}
	#header.is_open #gnb > li:nth-child(6){transition-delay:0.35s}
	
	.hamburger.show .btn_total,
	.hamburger.show .btn_total:before, 
	.hamburger.show .btn_total:after{background:#1B1B1B;}
	
	.sitemap > li > a{font-size: 22px;}
	.sitemap .sub > li > a{font-size: 18px}
	
	.greetings_area .logo_box{width: 260px;}
	.greetings_area .core_values{margin-left: 280px}
	.text_area{display: block}
	.greetings_area .text_area .text_left{line-height: 1.6;margin-bottom: 30px;font-size: 28px}
	.greetings_area .text_area .text_left br{display: none}
	
	.organization_chart .line-h-group {width: calc(80% + 9px);}
	.organization_chart .bottom-nodes{gap:10px}
	
	.viewType2 .top .leftBox {min-width: 450px;width: 450px; }
}

@media (max-width: 1023px) {
	.is_sitemap #header{z-index: 901;border-bottom: 1px solid rgba(201, 201, 201, 0.77)}
	.is_sitemap #header.scrolled{background-color: #fff;}
	.is_sitemap #header .logo a{background-image: url(../images/logo_bk.png) !important}
	.sitemap_overlay{background-color: #fff}
	.sitemap_area .resp_inner{align-items: flex-start;padding: calc(var(--headH) + 22px) 50px 40px;min-height: 100%;height: auto}
	.sitemap_area .title03{display: none}
	.sitemap{display: block;text-align: left}
	.sitemap > li > a{font-weight: 500;display: flex;align-items: center;height: 66px;position: relative}
	.sitemap > li.has_sub > a:after{display: block;content: '';width: 14px;height: 8px;background: url(../images/bul02.svg) no-repeat 0 0;position: absolute;top:50%;right:0;margin-top: -4px;transition: 0.2s}
	.sitemap > li.has_sub.on > a:after{transform: rotate(-180deg);}
	.sitemap .depth {padding-top: 1px;padding-bottom: 0;display: none}
	.sitemap .sub > li {margin-bottom: 5px;}
	.sitemap .sub > li > a{padding: 6px 0;padding-left: 15px;}
	.sitemap > ul a{display: block;text-align: left}
	.sitemap_area .btn_close{display: none}
	.sitemap_area .lang{display: block;margin-top: 15px}
	.sitemap_area .lang .depth{left: 22px;right: auto;}
	
	.stats-wrap{justify-content: center;row-gap: 30px;}
	.stat-item {flex: 0 0 30%; }
	
	.product_section .proj_cont{display: block;padding-top: 86px;}
    .product_section .title02,
    .product_section .proj_cont .col{text-align: left}
    .product_section .title02 {margin-bottom: 23px;}
    
    .partner_section .resp_inner{padding-left: 0;padding-right: 0}
    
    /* SUB */
   .greetings_area .intro_box{padding-bottom: 56px;}
   .greetings_area .title_box{padding-bottom: 0}
   .greetings_area .core_values{margin-left: 0;}
   .greetings_area .img_box{height: 320px}
   .greetings_area .text_area { gap: 40px; }
   .greetings_area .text_area .text_left h3 { font-size: 1.5rem; }
   
   .history-sidebar {width: 240px;}
   .historySwiper .title{font-size: 24px}
   
   .capabilities_dashed{max-width: 509px}
   .capability_flex{flex-direction:column;gap:20px;max-width:460px}
   .capability_flex .capability-card{width:100%;max-width: 460px;}
   .capability_flex .card-en-title{font-size:36px;}
   .capability_flex .card-kr-desc{font-size:24px;}
   .capability_flex .capability-card .cont{padding-top: 0;justify-content: center;}
   .capability_flex .card-icon-badge{height: 32.136%;}
   .capability_flex .card-icon-badge img {height: 40px;}
   
   .process_category { flex-wrap: wrap; }
   .category-col { flex: 0 0 calc(33.333% - 12px); }
   
   .certList ul li {width: calc(33.3333% - 13.33px);}
   
   .photoList ul {grid-template-columns:repeat(2,1fr);}
   
   .lnb{gap:20px}
   .lnb a{font-size: 18px}
   
   .viewType2 .top {display: block; }
   .viewType2 .top .leftBox { min-width: 100%; overflow:hidden; width: 100%; margin-bottom: 20px;}
   
   .personalWrap {padding:4rem 2rem;}
}

@media (max-width: 767px) {
	.pc,
	.pc.inline{display: none !important;}
	.mo{display: block !important;}
	.mo.inline{display: inline !important;}
	.mo.iblock{display: inline-block !important;}
	.mo.iflex{display: inline-flex !important;}
	
	colgroup.pc,
	col.pc,
	th.pc,
	td.pc{display: none !important;}
	
	colgroup.mo{display: table-column-group !important;}
	
	:root {
	  --headH: 80px;
	}
	
	#wrap{font-size: 1.8rem}
	
	#header .lang{display: none}
	.hamburger{position: absolute;top:50%;right: var(--leftRightMargin);transform: translateY(-50%);}
	
	.scroll{bottom: 10px}
	.hero_section .swiper_opt,
	.hero_section .cont{text-align: center}
	.hero_section .swiper_opt{bottom: 150px}
	.hero_section .cont{bottom: 215px;}
	
	.title01{font-size: 24px}
	.title02{font-size: 16px}
	
	.company_section .info_area{padding-top: 70px;padding-bottom: 20px;}
	.stats-wrap {gap: 20px;margin-top: 40px;margin-bottom: 40px;}
    .stat-item { flex: 40%; }
    .stat-num .num{font-size: 28px;}
    .stat-num{font-size: 14px}
    .stat-label{font-size: 18px;margin-bottom: 8px;}
    .stat-icon{margin-bottom: 10px}
    .company_section{padding-bottom: 230px;}
    
    .news-list a { flex-direction: column; align-items: flex-start; gap: 10px; }
    
    .product_section {padding-top: 45px;padding-bottom: 45px;}
    .product_section .proj_img{height: 180px}
    .product_section .proj_cont{padding-top: 40px}
    .product_section .point,
    .technology_section .point{font-size: 26px;margin-top: 8px;margin-bottom: 15px;line-height: 1.25}
    .technology_swiper{padding-bottom: 40px}
    .tech_card h4{font-size: 20px;margin-bottom: 5px;line-height: 1.2}
    .tech_card .en{font-size: 14px}
    .tech_card .box{font-size: 15px;min-width: 160px;height: 36px;margin-bottom: 25px;}
    .tech_card .card-more{font-size: 14px;right: 20px;bottom: 18px;}
    .tech_card {padding: 32px 0 10px;}
    .technology_section .title02{margin-bottom: 0}
    .technology_section .resp_inner{padding-bottom: 45px}
    
    .develop_section{background-position: 50% 0;padding-top: 40px;}
    .develop_section .btns{height: 84px;}
    .develop_section .btns:after{right: 20px}
    .develop_section .btns .tit{font-size: 20px;margin-bottom: 2px;}
    .develop_section .dev_img{position: relative;top:auto;right:auto;transform: translateY(0);width: 100%;text-align: right;padding-left: 20px}
    .develop_section .dev_img img{max-width: 457px}
    .develop_section ul{width: 100%}
    
    .news_section{padding-top: 130px;padding-bottom: 65px}
    .news_section .title02 {margin-bottom: 0;}
    .news-list a{gap: 5px;padding: 18px 0;}
    .news-list .date{font-size: 16px}
    
    #footer{padding: 40px 0}
    #footer .resp_inner{display: block}
    #footer .logo{margin-bottom: 30px}
    
    /* SUB */
   .sub_container.pd01 {padding: 60px 0 60px;}
   
    .sub_visual{height: 300px;padding-bottom: 35px;}
    .sub_visual .title{font-size: 36px}
    .breadcrumb{margin-bottom: 12px;font-size: 14px;}
    .breadcrumb .home{display: none}
    .breadcrumb .bul{margin: 0 4px;}
    
    .title03 {font-size: 32px;margin-bottom: 40px;}
    .title04 {font-size: 30px;padding-left: 30px;}
    .title04:before{width: 4px}
    
    .lnb_area{background:#fff;}
    .lnb_area .resp_inner{padding: 0}
    .lnb_area .select_btn{width: 100%;display:flex;justify-content:space-between;align-items:center;height:58px;padding:0 20px;font-size:18px;font-weight:700;color:var(--primaryColor);cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.05)}
    .lnb,
    .lnb a.active span::after{display:none}
    .lnb_area .select_btn i{transition:transform .3s;display: block;width: 14px;height: 8px;margin-top: 1px;background: url("data:image/svg+xml,%3Csvg width='14' height='8' viewBox='0 0 14 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.25 1.18733C0.25 0.899833 0.362499 0.612333 0.575 0.387333C0.785834 0.17742 1.07124 0.0595698 1.36875 0.0595698C1.66626 0.0595698 1.95166 0.17742 2.1625 0.387333L7 5.22483L11.825 0.387334C12.0358 0.177421 12.3212 0.0595703 12.6188 0.0595703C12.9163 0.0595703 13.2017 0.177421 13.4125 0.387334C13.6224 0.598169 13.7403 0.883569 13.7403 1.18108C13.7403 1.4786 13.6224 1.764 13.4125 1.97483L7.7875 7.59983C7.57667 7.80975 7.29126 7.9276 6.99375 7.9276C6.69624 7.9276 6.41083 7.80975 6.2 7.59983L0.575 1.97483C0.362499 1.76233 0.25 1.47483 0.25 1.18733Z' fill='%230394D6'/%3E%3C/svg%3E%0A") no-repeat 0 0;}
    .lnb_area .select_btn.open i{transform:rotate(180deg)}
    .lnb{width:calc(100% - 16px);position:absolute;top:calc(100% + 8px);left: 50%;transform: translateX(-50%);border:1px solid #ddd;border-radius:8px;box-shadow:0 8px 20px rgba(0,0,0,.12);z-index:90;overflow:hidden;flex-direction:column;background-color: #fff}
    .lnb li{width:100%;max-width:100%;border-bottom:1px solid #f0f0f0}
    .lnb li:last-child{border-bottom:none}
    .lnb a span{height:52px;justify-content:flex-start;padding:0 20px;font-size:16px;color:#444}
    .lnb a.active,
    .lnb a:hover{font-weight: 400}
    
	.greetings_area {padding: 80px 0 80px;}
   	.greetings_area .info_area{margin-bottom: 50px;}
   	.greetings_area .intro_box{display: block;padding-bottom: 36px;}
   	.greetings_area .logo_box{width: 100%;margin-bottom: 25px}
   	.greetings_area .logo_box img{width: 120px}
   	.greetings_area .title_box h2{font-size: 30px}
   	.greetings_area .title_box p{font-size: 20px}
   	.greetings_area .core_values{flex-wrap:wrap;gap:20px 0;padding-top: 36px}
   	.greetings_area .core_values .item{flex:0 0 50%;font-size: 20px;padding-left: 20px;}
   	.greetings_area .core_values .item strong{font-size: 20px}
   	.greetings_area .img_box {height: 240px;border-radius:30px;margin-bottom: 40px;}
   	.greetings_area .text_area{flex-direction:column;gap:20px}
   	.greetings_area .text_area .text_left{flex:auto;line-height: 1.5;margin-bottom: 0;font-size: 20px;}
   	.greetings_area .text_area .text_right{flex:auto;padding-top:0}
   	.greetings_area .text_area .text_right p{font-size: 16px;margin-bottom: 15px;line-height: 1.65;}
   
   	.history_area{padding:60px 0 30px}
   	.history-layout{flex-direction:column;gap:30px}
   	.history-sidebar{width:100%;position:static;display:flex;display:none;gap:20px;border-bottom:1px solid #e5e5e5;padding-bottom:15px}
   	.history-sidebar .sidebar-item{font-size:16px;margin-bottom:0;white-space:nowrap}
   	.history-row{flex-direction:column;gap:1px;margin-bottom: 15px;}
   	.history-year{width:100%}
   	.history-year{font-size: 18px}
   	.history-desc{font-size: 17px}
   	.history-group{margin-bottom: 34px;padding-bottom: 38px;}
   	.history-group .year_mob{display: block;font-weight: 700;font-size: 24px;color: var(--primaryColor);margin-bottom: 18px}
   	.history-content{padding-top: 0;width: 100%;}
   	.history_gallery {padding: 50px 0 39px;}
   	.historySwiper {padding-bottom: 25px;}
   	.historySwiper .gallery-img {margin-bottom: 20px;}
   	.historySwiper .year{margin-bottom: 10px}
   	.historySwiper .title {font-size: 18px;}
   	.historySwiper .gallery-text{padding-bottom: 10px}
   
   	.timeline_area{padding:15px 0;margin-bottom: 5px;}
   	.timeline-nav{gap:5px}
   	
   	.organization_chart {padding: 60px 0 70px;}
   	.organization_chart .node-ceo{width:200px;height:200px;}
   	.organization_chart .node-bottom,
   	.organization_chart .node-middle{max-width:280px}
   	.organization_chart .line-v-node{height:20px}
   	.organization_chart .t-1,
   	.organization_chart .t-2{height:50px}
   	.organization_chart .tier-branch{flex-direction:column;align-items:center}
   	.organization_chart .branch-center,
   	.organization_chart .branch-left,
   	.organization_chart .line-h-group,
   	.organization_chart .line-h-middle,
   	.organization_chart .node-wrap:first-child .line-v-node{display:none}
   	.organization_chart .branch-right{flex-direction:column;width:100%}
   	.organization_chart .node-middle{width:100%;}
   	.organization_chart .bottom-nodes{flex-direction:column;align-items:center;gap:0}
   	.organization_chart .node-wrap{width:100%}
   	.organization_chart .bottom-nodes{gap:0}
   	.organization_chart .node-box{font-size: 20px;height: 60px;}
   	
   	.capabilities_area{padding: 60px 0 80px;}
   	.capabilities_dashed{padding: 20px;}
   	.capability_flex .card-icon-badge{margin-bottom: 12px}
   	.capability_flex .card-en-title{font-size:25px;margin-bottom: 12px;}
   	.capability_flex .card-kr-desc{font-size:16px;line-height: 1.45}
   	
   	.process_area{padding: 60px 0 80px;}
   	.process_img{margin-top: 20px;margin-bottom: 70px;}
   	.process_category {gap: 28px;}
   	.process_category .category-col {flex: 0 0 100%; gap: 8px;}
   	.process_category .cat-box {margin-bottom: 15px;}
   	.process_category .cat-header {height: 54px;font-size: 18px}
   	.process_category .cat-arrow-down{margin: 0}
   	.process_category .cat-box h5{font-size: 18px;margin-bottom: 14px;padding-bottom: 12px;}
   	
   	.certList ul li {width: calc(50% - 10px);}
   	
   	.location_area .map_box{margin-bottom: 30px}
   	.root_daum_roughmap .wrap_map{height: 300px !important}
   	.location_area .info_box{padding-top: 15px;font-size: 16px;line-height: 1.7;}
	.location_area .tit01{font-size: 20px}
	
	.search_area .search-group,
	.search_area{flex-direction:column;align-items:stretch}
	.search_area .filter-group{justify-content:space-between}
	.search_area .filter-group select{flex:1;width:auto}
	.search_area .search-group select{width:100%}
	.search_area .search-input-wrap{width:100%;display:flex}
	.search_area .search-input-wrap input{flex:1}
	 
	.viewType2 .top {display: block; gap:20px; margin-bottom: 35px;}
	.viewType2 .top .img { min-width: 100%; overflow:hidden; width: 100%; margin-bottom: 20px; }
	.viewType2 .top .img .mySwiper2{border:1px solid #dcdcdc; margin-bottom: 10px;}
	.viewType2 .top .img .mySwiper2 img {height: auto;width: 100%;}
	.viewType2 .top .img .mySwiper1 .swiper-slide{border:1px solid #dcdcdc; cursor:pointer;}
	.viewType2 .top .rightBox {width: 100%;}
	.viewType2 .top .btnRight {margin-top: 15px;}
	.viewType2 .top .btnRight a {width: 100%;}
	.viewType2 .bottom .descBox {border:1px solid #dcdcdc; padding:15px; font-size: 14px; color:#aaaaaa; min-height:280px;}
	.viewType2 .bottom .descBox > div {display: none;}
	.viewType2 .bottom .descBox > div.active {display: block;}
	.viewType2 .mySwiper1 {}

	.tbBox {border-top: 2px solid #3a3a3a;}
	.tbBox .tr {display: flex; border-bottom: 1px solid #e6e6e6;}
	.tbBox .tr .th {min-width:100px !important; font-size: 14px; line-height: 18px; color:#434343; font-weight: 700;  padding:5px; min-height:45px; display: block; padding-top: 13px; flex-direction:column; justify-content: center;}
	.tbBox .tr .th .info {color:#c9c9c9; font-weight: 400; margin-top:5px; display: inline-block; margin-left: 10px;}
	.tbBox .tr .td {font-size: 14px; color:#888888;  padding:8px 0; display: flex; align-items: center; width: 100%;}
	.tbBox .tr .td .radio {display: flex; align-items: center; gap:10px;}
	.tbBox .tr .td textarea {width: 100%; border:1px solid #e8e8e8; height: 86px; resize:none;}
	.tbBox .tr.block {display: block;}
	
	.tabType1 { display: flex;  align-items: center; width: 100%; margin-bottom: 20px; border-bottom:2px solid #191919; }
	.tabType1 li{flex:1;height:100%;   max-width:230px; margin-bottom:-2px;}
	.tabType1 li,.tab_elem{display:flex;align-items:center;justify-content:center;height:100%;font-size:14px;font-weight:400;cursor:pointer;box-sizing:border-box;border:0;gap:6px; width: 100%; color:#212121; height: 40px;}
	.tabType1.border_top li .tab_elem{color:#1e1e1e;  border-bottom:1px solid #191919; background: #f8f8f8; text-align: center; word-break:keep-all; line-height: 18px;}
	.tabType1.border_top li:nth-child(n+2) .tab_elem{margin-left:-1px}
	.tabType1.border_top li.active .tab_elem{color:#191919; border:1px solid #191919;border-bottom:0;background-color:#fff;container-type:inline-size;font-weight:500;position:relative}
	
	.btns.t2{font-size: 18px; height: 58px;}
	.btns.t3{font-size: 18px; height: 50px;}
	
	.photoList.t1 ul li .img{height: 100px;padding: 5px; }
	.photoList.t1 ul li .text{padding: 10px;}
	.photoList.t1 ul li .text .tit{font-size: 16px;}
	
	.board_list01 > table .pc,
	.board_list01.chg > table colgroup,
	.board_list01.chg > table thead{display: none !important}
	.board_list01 > table th, 
	.board_list01 > table td{padding:0.5rem;font-size: 1.6rem;height: 46px}
	.board_list01.chg > table th, 
	.board_list01.chg > table td{height: auto;font-size: 1.5rem;}
    .board_list01.chg > table tr{display:block;padding:12px 0 15px;width:100%;border-bottom:1px solid #dfdfdf;}
    .board_list01.chg > table td{display:block;border:none;text-align:left;}
    .board_list01.chg > table td.number:before{content:attr(data-name)'.';display:inline-block;vertical-align:top;}
    .board_list01.chg > table td a:hover{text-decoration:none;}
    .board_list01.chg > table td.title{font-size:1.8rem;}
    .board_list01 > table td .ellipsis{max-width: 80%}
    .board_list01 > table td .icn_new{top: 0;font-size: 11px;}
    
    .detail_view .header_box .post_title{font-size: 22px;margin-bottom: 15px;}
    .detail_view .content_box{font-size: 18px}
    .detail_view .header_box .meta_info,
    .detail_view .header_box .file_info{font-size: 14px}
    
    .nav_post_row{font-size: 16px;padding: 13px 15px;}
    
    .personalWrap {padding:4rem 2rem;}
}

@media (max-width: 500px) {
	.certList ul li {width: 100%;}
	.certList ul li .text{font-size: 18px}
}