/* add your css Here */
/* default */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700&family=Noto+Serif+KR:wght@200;300;400;500;600;700&display=swap');
html, body, h1, h2, h3, h4, h5, h6, div, p, blockquote, pre, code, address, ul, ol, li, menu, nav, section, article, aside, dl, dt, dd, table, thead, tbody, tfoot, label, caption, th, td, form, fieldset, legend, hr, input, button, textarea, object, figure, figcaption {margin:0; padding:0;}
ul, ol, li {list-style:none;}
a {color:inherit; text-decoration:none; outline:none;}
input, button, select, fieldset, textarea {border-radius: 0; appearance: none; border: 0; font-family: inherit;}
input:focus, select:focus {outline: 0;}
button:focus, a:focus, button, a {outline: none;}
h1, h2, h3, h4, strong, th {font-weight:normal; font-family:inherit; color:inherit;}
em {font-style: normal;}
html, body {font-family: 'freesentation';margin: 0; overflow-x: hidden; width: 100%;}
html.not-scroll, html.not-scroll body {overflow-y: hidden;}
html {color: #fff;}
.skip, legend {overflow: hidden; position: absolute; width: 1px; height: 1px; padding: 0; border: 0; clip: rect(1px, 1px, 1px, 1px);}
* {box-sizing: border-box; word-break: keep-all;}

a:focus, button:focus, input:focus, select:focus {outline:none;}
button {cursor: pointer; background-color: transparent;}
br {font-size: 0;}

/* input type number 에서 화살표 제거 */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

/* 기본 레이아웃 */
body {min-height: 150vh; background-color: #11111A;}
.wrap {overflow-x: hidden;}
.layout {max-width: 1400px; margin: 0 auto;}
@media (max-width:1440px) {
    .layout {padding-left: 20px; padding-right: 20px;}
}
/*@media (max-width:1024px) {*/
/*    body {margin-top: 65px;}*/
/*}*/


/* 상단 헤더 */
.header {position: fixed; top: 0; left: 0; width: 100%; height: 90px; transition: all 0.5s; z-index: 150;}
.header .header-inner {position: relative; text-align: center;}
.header .header-logo {position: absolute; top: 24px;}
.header .header-logo img {display: block;}
.header .header-gnb {display: inline-block;}
.header .header-gnb .gnb-depth-1 {display: flex; text-align: center;}
.header .header-gnb .depth-1 {position: relative;}
.header .header-gnb .depth-1 > .depth-1-link {letter-spacing: 1px;display: flex; align-items: center; height: 90px; padding: 0 65px; font-size: 1.4rem; font-family:'freesentation bold'; color: #fff;}
.header .header-gnb .depth-1 > .depth-1-link > span {position: relative; display: block; line-height: normal;text-shadow: 0 0 12px #000;}
.header .header-gnb .depth-1 > .depth-1-link > span::before {content: ""; display: block; position: absolute; left: -2px; bottom: 0; width: 0; height: 11px; transition: all 0.5s; transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1); z-index: -1; background-color: #EC8E1C;}
.header .header-gnb .depth-1.current > a > span::before {content: ""; display: block; width:calc(100% + 4px);}
.header .header-gnb .depth-1 .depth-item {background-color: #fff; position: absolute; top: 100%; left: 0; width: 100%; height: 0; overflow: hidden; visibility: hidden; opacity: 0; transition: all 0.3s; border-radius:5px;}
.header .header-gnb .depth-1.current .depth-item {visibility: visible; opacity: 1; transition: all 0.5s;}
.header .header-gnb .depth-1 .depth-item .gnb-depth-2 {padding: 5px 0; visibility: hidden; opacity: 0; transition: all 0.3s;}
.header .header-gnb .depth-1.current .depth-item .gnb-depth-2 {visibility: visible; opacity: 1; transition: all 0.5s;}
.header .header-gnb .depth-2 > .depth-2-link {display: block; padding: 15px 0; font-size: 1.2rem; color: #000; transition: color 0.1s;}
.header .header-gnb .depth-2 > .depth-2-link:hover,
.header .header-gnb .depth-2 > .depth-2-link:focus {color: #EC8E1C; font-weight: 500;}
.nav-up {top: -90px;}
.nav-bg {box-shadow: 0 0 10px #000; background: #11111ae0;}

.header .mobile-gnb {display: none;}
.header .mobile-gnb .sidebar-btn {position: relative; width: 65px; height: 65px; z-index: 1;}
.header .mobile-gnb .sidebar-btn span {display: block; position: absolute; left: 20px; width: 24px; height: 2px; background-color: #fff; box-shadow: 0 0 5px #000;}
.header .mobile-gnb .sidebar-btn span:nth-child(1) {top: 22px;}
.header .mobile-gnb .sidebar-btn span:nth-child(2) {top: 32px; transition: opacity 0s 0.15s;}
.header .mobile-gnb .sidebar-btn span:nth-child(3) {top: 42px;}
.header .mobile-gnb .sidebar-btn span:nth-child(1), .header .mobile-gnb .sidebar-btn span:nth-child(3) {transition: top 0.15s 0.15s, transform 0.15s, width 0.15s, left 0.15s;}
.header .mobile-gnb.open .sidebar-btn span:nth-child(2) {opacity: 0; transition: opacity 0.15s;}
.header .mobile-gnb.open .sidebar-btn span:nth-child(1), .header .mobile-gnb.open .sidebar-btn span:nth-child(3) {top: 32px; width: 30px; transition: top 0.15s, transform 0.15s 0.15s, width 0.15s 0.15s, left 0.15s 0.15s;}
.header .mobile-gnb.open .sidebar-btn span:nth-child(1) {left: 18px; transform: rotate(45deg);}
.header .mobile-gnb.open .sidebar-btn span:nth-child(3) {left: 18px; transform: rotate(-45deg);}
.header .mobile-gnb .sidebar-wrap {position: fixed; width: 100%; height: calc(100vh - 65px); top: 70px; left: 0; background-color: rgba(0,0,0,0.7); visibility: hidden; opacity: 0; transition: all 0.5s;}
.header .mobile-gnb.open .sidebar-wrap {visibility: visible; opacity: 1;}
.header .mobile-gnb .sidebar-wrap .sidebar {position: absolute; top: 0; right: 0; width: 100%; max-width: 375px; height: 100%; background-color: #21212E; transform: translateX(100%); transition: all 0.5s;}
.header .mobile-gnb.open .sidebar-wrap .sidebar {transform: translateX(0);}
.header .mobile-gnb .gnb-depth-1 {height: 100%; overflow-y: auto;}
.header .mobile-gnb .depth-1 > .depth-1-link { z-index: 1; display: flex; align-items: center; position: relative; padding: 0 60px 0 25px; height: 60px; font-size: 1.3rem;  cursor: pointer;}
.header .mobile-gnb .depth-1 > .depth-1-link:not(:only-child)::before {content: "▼"; display: block; position: absolute; top: 50%; right: 25px; transform: translateY(-50%); font-size: 10px; color:#fff;}
.header .mobile-gnb .depth-1.open > .depth-1-link:not(:only-child)::before {content: '▲';}
.header .mobile-gnb .depth-1 > .depth-1-link > span {position: relative; display: block; line-height: normal; color:#fff;}
.header .mobile-gnb .depth-1 > .depth-1-link > span::before {content: ""; display: block; position: absolute; left: -2px; bottom: 0; width: 0; height: 9px; transition: all 0.5s; transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1); z-index: -1; background-color: #CB7D00;}
.header .mobile-gnb .depth-1.open > .depth-1-link > span::before {width:calc(100% + 4px);}
.header .mobile-gnb .gnb-depth-2 {max-height: 0; overflow: hidden; padding: 0; background-color: #11111A; text-align: left; box-sizing: content-box; transition: all 0.35s ease-in-out;}
.header .mobile-gnb .depth-1.open .gnb-depth-2 {padding: 10px 0;}
.header .mobile-gnb .depth-2 > .depth-2-link {display: block; visibility: hidden; opacity: 0; padding: 12px 25px; font-size: 1.2em; font-weight: 500; color: #fff; transition: all 0.35s;}
.header .mobile-gnb .depth-2 > .depth-2-link.active {color: #EC8E1C;} /* 현재 페이지 활성화 되어있음을 알리는 active 클래스 */
.header .mobile-gnb .depth-1.open .depth-2 > .depth-2-link {visibility: visible; opacity: 1;}
@media (max-width: 1440px){
    .header-inner.layout {padding-right: 0;}
}
@media (max-width:1240px) {
    .header .header-gnb .depth-1 > .depth-1-link {padding: 0 45px;}
    .header .header-gnb .depth-1 > .depth-1-link {font-size: 18px;}
    .header .header-gnb .depth-2 > .depth-2-link {font-size: 16px;}

}
@media (max-width:1024px) {
    .layout{ padding-left: 0;}
    .header {position: fixed; width: 100%; height: 65px; overflow: visible;}
    .header .open{ background: #21212E;}
    .header .header-inner {text-align: right;}
    .header .header-logo {top: 12px;left: 12px;}
    .header .header-logo img {width: 100px;}
    .header .header-gnb, .contents_01 img{display: none;}
    .header .mobile-gnb {display: block;}
    .h2 br{display: none;}
}
@media (min-width: 992px) {
    .col-lg-2-4 {
        flex: 0 0 auto;
        width: 20%;
    }
}

@media (max-width:500px) {
    html.not-scroll .header .header-logo {opacity: 0;}
    .header .mobile-gnb .sidebar-wrap .sidebar {max-width: 100%;}
}
/* 상단 헤더 End */



/* footer */
#footer { background-color: #21212E; z-index: 9; position: relative; min-height: 30vh;}
.footer_left {padding: 20px 0;}
.footer_left p {color:#656587; padding-left:20px ;}
.footer_right{padding: 20px;}
.footer_table {font-size: 1em; color:#656587; margin-bottom: 4vh;}
.footer_table .th {font-family: 'freesentation bold'; color: #848EAF;}
.btn_gotop {
	display:none;
	position:fixed;
	bottom:30px;
	right:30px;
	z-index:99;
	/* border:1px solid #848EAF; */
	outline:none;
    box-shadow: 5px 5px 5px #000, -5px -5px 5px #676d808c ;
	background-color:#21212E;
	color:#333;
	cursor:pointer;
	padding:10px 15px;
	border-radius:100%;
}


/* 헤딩 */
.h1{color:#fff; font-size:7em; font-family:'freesentation extrabold';}
.h2{color:#fff; font-size:4em; font-family:'freesentation bold';}
.h3{color:#fff; font-size:3em; font-family:'freesentation bold';}
.h4_kr{ color:#EC8E1C; font-size:2em; font-family:'freesentation bold';}
.h4{margin-top: 5rem; color:#EC8E1C; font-size:2em; font-family:'cafe24Ohsquare';}
.desc{color:#848EAF; font-size:1.4em;}
.h5{color:#fff; font-size:1.5em; font-family:'freesentation bold';}
.center_2{display: flex; justify-content: center; align-items: center;}

/* 메인페이지 */
.main_text p:first-child{color:#fff; font-size:7em; font-family:'freesentation extrabold'; line-height: normal;}
.contents_01 {width: 70vw; margin:20vh auto 10vh auto; display:flex; justify-content:space-between; align-items:center; }
.section_bg {min-height: 800px; position: absolute;left: 0;top: 0;right: 0; bottom: 0;}
.section, .top_img_main {min-height:max(100vh, 800px); background:#11111A; display:flex;  flex-direction: column; justify-content: center; color:#fff;}
.section_first {background: linear-gradient(#201D2D 0%,#111119 20%);padding-top: 5vh; justify-content: start;min-height: auto;}
.section_footer{background: none;justify-content: space-between; align-items: flex-end; min-height: 30vh;flex-direction: row;}
.bg_black {background:#0D0202;}
.bg_black::before {content:""; position: absolute; left:0; height:100%; width:20%; background:linear-gradient(90deg,rgba(20, 44, 140, 0.3),rgba(13,2,2,0));}
.bg_black::after {content:""; position: absolute; top:0; right:0; height:100%; width:20%; background:linear-gradient(-90deg,rgba(188,88,0,0.3),rgba(13,2,2,0));}
.bg-box{background:#21212E; box-shadow:0 0 10px 10px rgba(0,0,0,0.3); border-radius:10px; padding:20px; color:#fff;}
.bg-box-center{display: flex; flex-direction: column;align-items: center; justify-content: space-between;min-height:51vh;}    
.bg_gradient{background:radial-gradient(circle,#393B52,#21212E); padding:10vh 0;}
.card{border: none; background: none;}
.btn_detail{margin-left: auto;}
.product_icon{margin: 6vh 0 3vh 0;}
.product_logo{height: 6vh;}
.bg-left{height: 40vh;  padding-right:calc(calc(100% - 1320px) / 2);}
.bg-left img {height: 100%; width: 100%; object-fit: cover;}
.bg-right-img{height: 40vh; padding-left:calc(calc(100% - 1320px) / 2);}
.bg-right-img img {height: 100%; width: 100%; object-fit: cover;background-position: left center;}
.main_bg3{background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0)), url(../images/main_bg3.jpg); height:100vh; display: flex; align-items:center;}
.main_feature{height:13vh; border: 1px solid #848EAF; border-radius: 10px;display: flex ; padding: 10px; text-align: center;align-items: center; justify-content: space-around; font-size: 1.2rem;}
.main_feature img {width: 40px; aspect-ratio: 1;}
.yellow{color: #EC8E1C;}

.bg-box-white{background:#fff;border-radius:10px; padding:1.5rem; display: flex; justify-content:space-between; align-items: center;}
.bg-box-white p{color:#464646;font-size:1.3em;}
.bg-box-white:last-child{margin-right:0;}
.logo-box{background:#fff;border-radius:10px;display: flex; padding:0.5rem 1.5rem; flex-direction: column; min-height: 120px;align-items: center; color: #2e2c3e;justify-content: center;}
.logo-img{display: flex; height: 100%;align-items: center;}

/*상단 이미지*/
.top_img{background-position: center center; display: flex; height: 80vh; align-items: center; padding-top: 90px; max-height:800px;background-attachment: fixed;}
.top_img_prd{background-position: center center; box-shadow: inset 0 100px 90px rgb(0, 0, 0, 0.4);display: flex; height: 80vh; padding-top: 90px; max-height:800px;flex-direction: column; justify-content: center;background-attachment: fixed;}
.top_img1{background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0)),url(../images/main_bg2.png); background-size: cover;}
.top_img2{background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0)),url(../images/top_img2.jpg); background-size: cover;}
.top_img3{background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0)),url(../images/top_img3.png); background-size: cover;}
.top_img4{background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0)),url(../images/top_img4.jpg); background-size: cover;}
.top_img5{background-image:url(../images/top_img5.png); background-size: cover;}
.top_img6{background-image:url(../images/top_img6.png); background-size: cover;}
.top_img7{background-image:url(../images/top_img7.png); background-size: cover;}
.top_img8{background-image:url(../images/top_img8.png); background-size: cover;}

/*오시는길, 문의사항*/
.map {background-image:url(../images/map.png); background-size: cover;}
.map, .inquiry_img{width:60%; height:550px;}
.location_table {font-size: 1.3em; color:#848EAF;width: 100%; height: 100%; }
.location_table tr{border-bottom:1px solid #544E7D ; height: 25%;}
.location_table tr:last-child{border-bottom:none;}
.location_table th {font-family: 'freesentation bold'; color: #fff;background-color: #2e2c3e;width: 30%; vertical-align: middle;}
.location_table tr:first-child th{border-radius: 10px 0 0 0; }
.location_table tr:last-child th{border-radius: 0 0 0 10px; }
.location_table th img{margin-bottom: 5px;}
.location_table td {text-align: start; vertical-align: middle; padding: 20px;}
.container_location .bg-box,.container_inquiry .bg-box{width: 40%;margin-left: 1.5rem;}


/*채용안내*/
.icon_bg1{aspect-ratio: 1 / 1;width:70px; height:70px; background:#3C394F; border-radius:10px;padding: 10px; display: flex;align-items: center; justify-content: center;}
.icon_bg2{width:50%; aspect-ratio: 1 / 1; background:#3C394F;border-radius:180px;box-shadow:0 0 10px 10px rgba(0,0,0,0.3);position: relative; top: 90px;left: 25%; padding: 2em; display: flex; justify-content: center; align-items: center;}
.bg-box-text{height: 310px;display: flex; flex-direction: column; justify-content: flex-end;}
.bg-box-text p{color:#848EAF; font-size:20px; padding-bottom: 25px;}
.bg-box-text p:first-child{color:#fff; font-size:36px; font-family:'freesentation bold';}
.box-recruit{margin-right: 1rem; border-radius: 40px 0 40px 0; padding: 40px 0; font-family: 'freesentation bold'; color:#fff;}
.box-recruit:last-child{margin-right:0;}
.px-12em{padding:0 12em;}
.welfare_row div div{height: 100%;}
.btn_group{padding: 0 12em;}

/* 복리후생 */

.welfare_content {margin-left: 10px;}
.welfare_content p:first-child{font-family: 'freesentation bold'; font-size: 1.5em;}
.welfare_content p:last-child{font-size: 1.2em; margin-top: 5px; color: #848EAF;}

/* 수시모집안내 테이블 */
.recruit_table,.finance_table {border-top: 1px solid #8A85AA; margin-top: 3em; font-size: 1.3em;}
.recruit_table thead th ,.finance_table thead th{ color: #fff; font-family: 'freesentation bold';text-align: center;}
.recruit_table :is(th, td),.finance_table :is(th,td) {background: none;color: #848EAF; border-bottom: 1px solid #8A85AA; padding:20px;}
.recruit_table tbody th ,.finance_table tbody th{background: #21212E; font-family: 'freesentation bold'; text-align: center;}
.recruit_table tbody :is(th, td),.finance_table tbody :is(th, td) {border-right: 1px solid #8A85AA;}
.recruit_table tbody td:last-child , .finance_table tbody td:last-child  {border-right: none;}

/* FAQ */

.accordion{padding:0 50px 50px 50px;}
.accordion-button{font-size:1.3rem;background-color:#E7EBFA;}
.accordion-button:not(.collapsed){color: #11111A; background-color: #C1CCEE;}
.accordion-body{font-size:1.2rem;background-color:#E7EBFA;text-align: start;}
.accordion-item{border: 1px solid #A0ABCF;}
.dns{background-color: #EC8E1C; color: #fff; font-size: 13px; padding: 5px 10px; border-radius: 5px; margin-inline: 7px; font-family: "freesentation bold";}
.dhcp{background-color: #d33d56;color: #fff;font-size: 13px; padding: 5px;border-radius: 5px; margin-inline: 7px; font-family: "freesentation bold";}

/* 고객사 */
.partner_bg .container {padding: 45px 0;height: 100vh;min-height: 660px;display: flex;flex-direction: column;justify-content: center;align-items: center;}
.bg-glass{padding:50px; margin: 10px auto; background-color:rgba(255, 255, 255, 0.25); width: 70%; min-height: 300px;backdrop-filter: blur(10px); border-radius: 10px;text-align: start;}
.bg-glass table {width: 100%;height: 100%;}
.inquiry_title,.inquiry_info {vertical-align: middle;font-size: 1.3em;}
.inquiry_title {width: 130px;font-family: 'freesentation bold';}
.inquiry_title img {margin-right: 10px;}
.btn_inquiry{background-color: #EC8E1C; border-radius: 10px; width: 200px; height: 60px; color:#fff; font-size:1.5em;transition: all 0.2s ;box-shadow: 0px 0px 20px #F8AD54;}
.btn_inquiry:hover{background-color: #BC6700;}
.btn_more{background-color:#3C394F;color: #fff; border-radius: 10px; width: 100%;height: 60px;font-size:1.5em;transition: all 0.2s ;}
.logo-title{text-align: center; width: 100%; white-space: nowrap;font-size: 1.0rem;}

/* 회사소개 */
.vision1 h3:after{content: 'innovation'; font-family: 'freesentation extrabold'; font-size:1.5em; color:#3C394F; position: relative; top:-18px; left:-18px; z-index: -1;}
.vision1 p:after{content: '';  background: url(../images/bg_icon01.png) no-repeat 0px 0px; position: absolute; top:-120px; right: 0; z-index: -1; width: 217px; height: 217px;}
.vision1 , .vision2 {position: relative;    width: 100%;margin-block: 8vh;}
.vision2 h3:after{content: 'integration'; font-family: 'freesentation extrabold'; font-size:1.5em; color:#3C394F; position: relative; top:-18px; left:-18px; z-index: -1;}
.vision2 p:after{content: '';  background: url(../images/bg_icon02.png) no-repeat 0px 0px; position: absolute; top:-120px;  right: 0; z-index: -1; width: 217px; height: 217px;}

.right-box{padding-top: 3em; width:50%;font-family: 'freesentation';}
.strong{font-family: 'freesentation extrabold';}
.bg_wave{background-image:radial-gradient(circle,#393B52,#21212E),url(../images/bg_wave.png); background-size: cover; background-blend-mode: overlay; flex:1;}
.cert_bg{background: #fff; width: 100%; aspect-ratio: 2/3; display: flex; align-items: center; justify-content: center; margin-bottom: 10px;}
.modal {
    display: none;
    z-index: 500;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
}
.modalBox {
    padding: 20px;
    text-align: center;
    top : 15%;
    left : 30%;
    position : sticky;
    & img{height: 75vh;}
}
.cert_bg img:hover{cursor: -webkit-zoom-in;}


/* 타임라인 */
.timeline--horizontal .timeline-divider{background-color: #3C394F;}
.timeline__item:after {background-color: #8A85AA; border: none; box-shadow:0px 0px 15px #8A85AA;}
.timeline__content { background-color: #2B2C3D; border: none; box-shadow:0px 0px 15px #000;}
.timeline__content h2{font-family: 'cafe24Ohsquare bold'; font-size:2.5em; color: #EC8E1C;}
.timeline__content ul li {display: list-item;}
/* .timeline__content ul li.hidden {display: none;}
  .timeline__content ul li.ellipsis {display: list-item;font-style: italic;}
  .timeline__content:hover ul li.hidden {display: list-item;}
  .timeline__content:hover ul li.ellipsis {display: none;}
  .timeline__content {transition: all 0.3s ease-in-out;} */
.timeline--horizontal .timeline__item--top .timeline__content:before , .timeline--horizontal .timeline__item--top .timeline__content:after{border-top: 10px solid #2B2C3D;}
.timeline--horizontal .timeline__item--bottom .timeline__content:before , .timeline--horizontal .timeline__item--bottom .timeline__content:after{border-bottom: 12px solid #2B2C3D;}
.timeline--mobile .timeline__item .timeline__content:before,.timeline--mobile .timeline__item .timeline__content:after{border-right: 12px solid #2B2C3D;}
.timeline--mobile .timeline__wrap {height: 100%;}
.timeline__content ul { position: relative; 
    li{margin:5px 0 0 15px; color: #fff; font-size: 1.1rem;
        ::before{content: ""; position: absolute; left: 5px; width: 2px; height: 2px; border-radius: 100%;  background-color: #8d8d8d;transform: translate(0, 10px);}}}
.timeline-nav-button{background-color: #3C394F; border: none;}
.timeline-nav-button:hover{filter: brightness(1.5);}
.timeline:not(.timeline--horizontal):before{background: linear-gradient(#111119 0%, #2B2C3D 3% 97%,#111119 100%);}
.timeline--mobile:before{ left:26px !important;}

/* 제품소개페이지 */
.prd-header{display: flex; align-items: center; justify-content: space-around;color:#fff; margin: 10vh auto; font-size: 1.5em;}
.bg-right{ margin-top: 2em; padding-left:calc(calc(100% - 1320px) / 2);}
.box-right{padding: 20px; background: #21212E; border-radius: 30px 0 0 30px; width: 100%;}
.box-right .container{height: 65vh;}
.strong_y{color: #EC8E1C;}
.desc_check img{margin-right: 10px;}
.left_icon{width: 20%; display: flex; align-items: center; justify-content: center; padding: 1.5em;}
.section_function {.bg-box{height: 100%;} .row{margin-bottom: 10vh;}}
.right_desc{width: 80%;}
.function_table tbody .td_highlight{background-color: #393B52;}
#pills-tab{width: 30%;}
.nav-pills .nav-link.active, .nav-pills .show>.nav-link {background-color: #EC8E1C; }
.nav-link{color: #EC8E1C;padding: 15px;font-size: 1.2rem;}
.nav-link:focus, .nav-link:hover{ color: #BC6700;}
.tab-content .bg-box{height: 100%;}
.tab_section{justify-content: start; min-height: auto;margin-top: 15vh;}

.slick-initialized .slick-slide{display:flex; justify-content: flex-end; align-items: flex-start;}
.indicator{padding-top: 20px;text-align: end;}
.prevArrow, .nextArrow{margin-left:15px; cursor: pointer; }
.prevArrow:hover, .nextArrow:hover{filter: brightness(1.5);}
/* .slick-initialized .slick-slide{height: 440px;border: 2px solid #656587; border-radius: 25px; display:flex; flex-direction: column; padding: 2.5rem;justify-content: flex-end; align-items: flex-start;margin-left: 20px;}*/
.s2dds-box{border-radius: 5px; border: 1px solid #656587;padding: 5px; text-align: center; font-size: 1.5em;}



/* 반응형 Extra extra large*/
@media (max-width: 1400px){
    .left_icon{padding:0;}
}

/* 반응형 Extra large*/
@media (max-width: 1200px){
    .box-right{border-radius: 0;}
    .contents_01 img{width: 300px;}
    .px-12em{padding: 15px;}
}

/* 반응형 Large*/
@media (max-width: 992px){
    .h3 br {display: none;}
    .container_location,.container_inquiry{flex-direction: column;}
    .map, .inquiry_img{width: 100%;height: auto; margin-bottom: 5vh;}
    .map{height: 500px;}
    .container_location .bg-box,.container_inquiry .bg-box{width: 100%;margin-left:0;}
    .icon_bg2{top:9%;padding: 1.5em;}
    .btn_group{padding: 0;}
    .main_text p:first-child{ font-size:5em;}

    .bg-box-center{align-items: flex-start; min-height: 0;text-align: start;}
    .product_icon {margin: 15px 0; width: 50px;}
    .product_logo {height: 40px;margin-bottom: 10px;}
    .lan_03{flex-direction: column;}
    .lan_03 img{margin: 20px;}

    .vision1 p:after,.vision2 p:after, .vision1 + .h3, .vision1 p br {display: none;}
    .vision1 {margin-bottom: 10vh;}
}

/* 반응형 Medium*/
@media (max-width: 768px){
    html,body {font-size: 12px;}
    .h1{font-size: 5em;font-family: 'freesentation bold';}
    .h2{font-size: 3.5em;}
    .h3{font-size: 2.5em; font-family: 'freesentation';}
    .h4,.h4_kr{font-size: 2em; margin: 10px 0;}
    .contents_01{flex-direction: column-reverse; margin: 12vh auto 10vh auto;}
    .contents_01 img{display: block; width: 200px;margin-bottom: 5vh;}
    .map{height: 250px;}

    .section{padding-top: 9.5vh; }
    .section_first{padding-top: 3vh; }
    /* .section:last-child{padding-bottom: 10vh;} */
    .icon_bg2{display: none;}
    .bg-box-text{height: auto;}
    .bg-box-h1{padding-top: 25px;}
    .bg-right-img, .bg-left{height: 30vh;}
    .bg_gradient{padding: 5vh 0;}
    .top_img{height: 60vh;}
    .main_bg3{height: auto; padding-block: 10vh;}
    .section.justify-content-end{min-height: auto;padding-top: 0;}
    .section.main_customers{padding-top: 9.5vh;}
    .inquiry_title{width: 100px;}
    /* 제품 상세 > 소개 */
    .prd-header {text-align: center;div img {width: 50%;}}
   
    .bg-right .box-right .container {flex-direction: column-reverse; padding: 30px 20px; height: 700px;}
    .bg-right .box-right .container_ipk {flex-direction: column;}
    .bg-right .box-right .container div {width: 100% !important;}
    /* 특허 */
    .right-box{width: 100%;}
    .bg_wave .container{flex-direction: column; align-items: center;}
    
    .welfare_content p:last-child{font-size:1.5em}
    .faq_section{ min-height: auto;}
    .faq_section:last-child{padding-bottom: 10vh;}
    .accordion{padding: 0;}

    .timeline__content ul li {font-size: 1.3rem;}
    /* 인재상 */
    /* .recruit_talent .row{top: -110px; position: relative;}
    .recruit_talent .row .col-12{height: 29vh;} */

    /* bg img 변경  */
    .top_img1{background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0)),url(../images/main_bg2_mobile.png);background-size: cover;}
    .top_img2{background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0)),url(../images/top_img2_mobile.png); background-size: cover;}
    .top_img3{background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0)),url(../images/top_img3_mobile.png);  background-size: cover;}
    .top_img4{background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0)),url(../images/top_img4_mobile.png); background-size: cover;}
    .top_img5{background-image:url(../images/top_img5_mobile.png); background-size: cover;}
    .partner_bg{background-image:url(../images/top_img5.png); background-size: cover;}



}
/* 모바일 */
@media screen and (max-width: 480px){
    html,body {font-size: 13px;}
    .h2{font-size: 3em;}
    .h4, .h4_kr{font-size: 2.2em;margin-top: 3rem;}
    .section{min-height: auto;}

    .container{padding:20px;}
    .timeline--mobile:before {left: 22px !important;}
    .box-recruit{font-size: 1.7em; border-radius: 20px 0 20px 0; padding: 20px 0;}
    .bg-glass{width: auto; margin: 20px;}
    #pills-tab{width: 50%;}
    .recruit_table {
        thead {display: none;}
        tbody {
            td.tg-0lax{border-right: none; display: grid; grid-template-columns: 6rem 1fr; padding: 0; grid-template-rows: minmax(9rem, auto); background: linear-gradient(to right,#21212E, #21212E 6rem, #111119 6rem);
                &::before{align-self: center;text-align: center;}
                &:nth-of-type(2){margin-bottom:15px; &::before{content: '우대사항';}}
                &:nth-of-type(1)::before{content: '주요업무';}
            }
            th {display: block;border-left:none;border-right: none; padding:5px; border-top:1px solid #8A85AA;}
        }
    }
}

