@charset "utf-8";

#sub{max-width:100%; overflow: hidden;}
.sub-visual {position: relative; height:513px;  box-sizing: border-box; overflow: hidden; z-index: 20;}
.sub-visual > img{width: 100%; height: 100%; object-fit:cover;}
.sub-visual > .box{position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; flex-direction: column; align-items:center; text-align: center; justify-content: center; gap:24px; z-index: 10; box-sizing: border-box; padding-top: 10px;}
.sub-visual > .box h4{color: #FFF; text-align: center; font-size: 50px; font-weight: 700; line-height: 120%; /* margin-bottom: 24px; */}
.sub-visual > .box p{font-size: 20px; color: #fff; font-weight: 400; text-align: center; line-height: 1.5; margin-top: 20px;}
.sub-visual > .box .speed{display: flex; align-items:center;justify-content: center; gap:12px; }
.sub-visual > .box .speed > li{display: flex; align-items:center; gap:12px; ;color: #FFF; text-align: center; font-size: 20px; font-weight: 400; line-height: 160%; }
.sub-visual > .box .speed > li:last-child {font-weight: 700;}
.sub-visual > .box .speed > li:last-child svg{display: none;}

/* sub-common */
.lnb-wrap{position: relative; background: #fff;  z-index: 10; border-bottom: 1px solid #EEE; margin-bottom: 122px;}
.lnb b{display: none;}
.lnb > ul{display: flex; justify-content: center; margin: 0 auto; width: 100%; box-sizing: border-box; }
.lnb > ul > li{position: relative; flex:1; max-width:374px;}
/* .lnb > ul > li:not(:last-child):before{position: absolute; content: ''; width: 1px; height: 12px; background: #eee; right: -1px; top: 50%; margin-top: -6px;} */
.lnb > ul > li:after{position: absolute; content: ''; width: 100%; height: 2px; background: #1A55B5; left: 0%;bottom: 0; opacity: 0;  transition:.3s;}
.lnb > ul > li > a{display: flex; align-items:center; justify-content: center; width: 100%; height: 76px; color: #444; text-align: center; font-size: 20px; font-weight: 400; line-height: 160%; transition:.3s;}
.lnb > ul > li.current{
	&:after{opacity: 1;	}
	> a{color: #1A55B5; font-weight: 700;}
}

.sub-txt.null{margin-top: 152px;}
.sub-txt{position: relative; z-index: 15; display: flex; flex-direction: column; text-align: center; margin-bottom: 102px; }
.sub-txt b{color: #222; font-size: 50px; font-weight: 700; line-height: 120%; }

#sub section{margin-bottom: 400px;}

.tit-b{display: flex; flex-direction: column; justify-content: center; text-align: center;}
.tit-b b{position: relative; color: #222;  font-size: 44px; font-weight: 700; line-height: 160%; padding-bottom: 20px; margin-bottom: 20px;}
.tit-b b:after{position: absolute; content: ''; width: 46px; height: 1px; background: #002AB2; left: 50%; bottom: 0; translate:-50% 0;}
.tit-b p{color: #666;  font-size: 24px; font-weight: 600; line-height: 160%; }

.tab-wrap{text-align: center;}
.tab-write{display: inline-flex; flex-wrap:wrap; border-radius: 8px; overflow: hidden; justify-content: center; margin-bottom: 40px; }
.tab-write > li{position: relative; width: 200px;}

.tab-write > li > a{display: flex; align-items:center; justify-content: center; height: 60px; background: #ECF3FF; font-size: 20px; }
.tab-write > li.current > a{background: #1A55B5; color: #fff;}




/* overview 회사개요 */
.overview{margin-bottom: 0 !important;}

.overview .arti1-wrap{position: relative; z-index: 10;}
.overview .arti1-wrap:before{position: absolute; content: ''; width: 100%; height: 100%; background: url(../img/sub/overview-bg1.jpg) right top no-repeat; right: -7px; top: -207px;  z-index: -1;} 
.overview .arti1{display: flex; flex-wrap:wrap; justify-content: space-between; gap:15px;  padding-bottom: 198px;}
.overview .arti1 .tbx{display: flex; flex-direction: column; gap:63px;}
.overview .arti1 .tbx > b{display: flex; flex-direction: column; gap:11px; color: #222; font-size: 48px; font-weight: 200; line-height: 120%; letter-spacing: 0.01em;}
.overview .arti1 .tbx > b span{font-weight: 700; letter-spacing: 0;}
.overview .arti1 .tbx > .p-box{display: flex; flex-direction: column; gap:1.6em; color: #444; font-size: 24px; font-weight: 400; line-height: 160%; }
.overview .arti1 figure{text-align: right; flex:1;}
.overview .arti1 figure img{border-radius: 20px; border: 1px solid #FFF; box-shadow: 10px 10px 15.5px 0 rgba(10, 57, 133, 0.25);}
.overview .arti2-wrap{position: relative; z-index: 15; padding-bottom: 200px;}
.overview .arti2-wrap:before{position: absolute; content: ''; width: 100%; height: 120%; background: url(../img/sub/overview-bg2.jpg) left top no-repeat; left: -8px; top: -54px;   z-index: 1;} 
.overview .arti2 {position: relative; z-index: 15;}
.overview .arti2 .flex{display: flex; flex-wrap:wrap; gap:30px; margin-top: 100px; max-width:1233px; margin: 100px auto 0;}
.overview .arti2 .flex .box{flex:1; display: flex; flex-direction: column; justify-content: flex-start;; border-radius: 20px; border: 1px solid rgba(26, 85, 181, 0.34); background: #FFF; box-shadow: 0 0 10px 0 rgba(26, 85, 181, 0.16); padding: 50px 10px 42px 10px; text-align: center; height: 434px;}
.overview .arti2 .flex .box .tbx{display: flex; flex-direction: column; margin-top: 25px;}
.overview .arti2 .flex .box .tbx small{color: #1A55B5; font-size: 26px; font-weight: 700; line-height: 160%; }
.overview .arti2 .flex .box .tbx b{color: #444; font-size: 22px; font-weight: 700; line-height: 160%; margin: 16px 0 6px;}
.overview .arti2 .flex .box .tbx p{color: #444; font-size: 18px; font-weight: 400; line-height: 160%; }
.overview .arti3{position: relative; z-index: 30;}
.overview .arti3 .flex{display: flex; flex-wrap:wrap; gap:79px 0; margin-left: -45px; margin-top: 66px;}
.overview .arti3 .flex .box{width: calc(33.33% - 45px); margin-left: 45px; display: flex; flex-direction: column; gap:12px;}
.overview .arti3 .flex .box .tbx{display: flex; flex-direction: column; }
.overview .arti3 .flex .box .tbx small{color: #1A55B5; font-size: 20px; font-weight: 700; line-height: 180%; margin-bottom: 10px;}
.overview .arti3 .flex .box .tbx b{color: #444; font-size: 26px; font-weight: 700; line-height: 180%; }
.overview .arti3 .flex .box .tbx p{color: #444;font-size: 20px; font-weight: 400; line-height: 180%;  letter-spacing: -0.6px;}
.overview .arti4-wrap{position: relative; z-index: 15; padding-bottom: 400px; padding-top: 200px;}
.overview .arti4-wrap:before{position: absolute; content: ''; width: 100%; height: 100%; background: url(../img/sub/overview-bg4.jpg) right top no-repeat; left: 7px; top: 12px; z-index: -1;} 
.overview .arti4 .flex{display: flex; flex-wrap:wrap; margin-left: -44px; gap:40px 0; margin-top: 68px;}
.overview .arti4 .flex .box{position: relative; width: calc(50% - 44px); height: 246px; margin-left: 44px; display: flex; flex-wrap:wrap; align-items:center;  gap:28px;  border-radius: 20px; border: 1px solid #CCC; background: #FFF; box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.10); padding: 0 61.19px; padding-bottom: 16px;}
.overview .arti4 .flex .box big{position: absolute; width: 121px; right: 13px; top: 12px; color: #000; text-align: center; font-family: "Poppins";  font-size: 96px; font-weight: 700; line-height: 160%; opacity: 0.06; line-height: 1;}
.overview .arti4 .flex .box .tbx{display: flex; flex-direction: column; gap:12px;}
.overview .arti4 .flex .box .tbx b{color: #203A72; font-size: 26px; font-weight: 700; line-height: 160%; }
.overview .arti4 .flex .box .tbx p{color: #444; font-size: 20px; font-weight: 400; line-height: 160%; }

/* certificate 인증서 */
.certificate .flex{display: flex; flex-wrap:wrap; gap:126px; justify-content: center;}

/* directions 오시는길 */
.directions .map-wrap .root_daum_roughmap{width: 100%;}
.directions .map-wrap .root_daum_roughmap .wrap_map{height: 620px !important;}
.directions .map-wrap .root_daum_roughmap .wrap_controllers{display: none;}
.directions .map-wrap .cont{display: none;}
.directions .tbx{display: flex; flex-wrap:wrap;align-items:center; justify-content: center; gap:170px; margin-top: 143px;}
.directions .tbx ul{max-width:862px; width: 100%; border-top: 3px solid #000; padding-top: 8px;}
.directions .tbx ul > li{display: flex; align-items:center; color: #555; font-size: 20px; font-weight: 400; line-height: 30.9px;  letter-spacing: -0.4px; padding: 12px 0 16px; border-bottom: 1px solid #E4E4E4;}
.directions .tbx ul > li b{position: relative; color: #333; font-size: 20px; font-weight: 600; line-height: 30.9px;  letter-spacing: -0.4px; position: relative; padding-left: 31px; width: 158px;}
.directions .tbx ul > li b:before{position: absolute; content: ''; width: 5px; height: 5px; background: #333; border-radius: 50%; left: 14px; top: 14px;}
.directions .tbx ul > li b:after{position: absolute; content: ''; right: -2px; top: 50%;  width: 1px; height: 9px; translate:0 -50%; background: linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%), linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%), linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%), #767676;}
.directions .tbx ul > li p{flex:1; padding-left: 30px;}

.sub-top{position: relative; display: flex; flex-direction: column; justify-content: center; text-align: center; gap:38px; padding-bottom: 185px; margin-bottom: 60px;}
.sub-top:before{position: absolute; content: ''; width: 1px; height:125px; background: #1A55B5; left:50%; bottom: 0%;}
.sub-top:after{position: absolute; content: ''; width: 6px; height: 6px; background: #1A55B5; border-radius: 50%; left: 50%; bottom: -3px; margin-left: -3px;}
.sub-top b{display: flex; justify-content: center;flex-wrap:wrap; gap:10px; color: #070707; font-size: 48px; font-weight: 200;line-height: 120%; }
.sub-top b span{color: #1A55B5; font-weight: 700; }
.sub-top p{color: #444; font-size: 24px; font-weight: 400; line-height: 160%; }

#sub .artwork{margin-bottom: 0; padding-bottom: 400px; background: url(../img/sub/artwork-bg3.jpg) center bottom no-repeat;}
.artwork .arti1{position: relative; z-index: 10;}
.artwork .arti1:before{position: absolute; content: ''; width: 100%; height: 300%;background: url(../img/sub/artwork-bg1.jpg) right top no-repeat; z-index: -1;    right: -7px; top: -49%; } 
.artwork .arti2-wrap{position: relative; z-index: 10;}
.artwork .arti2-wrap:before{position: absolute; content: ''; width: 100%; height: 100%; background: url(../img/sub/artwork-bg2.jpg) -0.8% 81% no-repeat; left: 0; top: 0; z-index: -1;}
.artwork .arti2 .flex-wrap{position: relative; display: flex; flex-direction: column;  gap:20px; margin-top: 50px; }
.artwork .arti2 .flex-wrap:after{position: absolute; content: ''; width: 2px; height: calc(100% - 6px); background: url(../img/sub/artwork-line.png) center; left: 50%; top: 6px; margin-left: -1px;}
.artwork .arti2 .flex{position: relative; display: flex; flex-wrap:wrap; justify-content: space-between;}
.artwork .arti2 .flex:after{position: absolute; left: 50%; top: 50%; translate:-50% -50%; content: ''; width: 34px; height: 34px; background: url(../img/sub/artwork-arr.png) center no-repeat;}
.artwork .arti2 .flex > *{width: 45.07%;}
.artwork .arti2 .flex figure{border-radius: 20px;} 
.artwork .arti2 .flex .tbx{display: flex; flex-wrap:wrap; align-items:center; gap:50px;}
.artwork .arti2 .flex .tbx .tit{display: flex; flex-wrap:wrap; align-items:center; gap:16px;}
.artwork .arti2 .flex .tbx .tit span{display: flex;width: 94px;height: 30px;  justify-content: center; align-items: center; text-align: center; color: #FFF; font-size: 16px; font-weight: 600; line-height: 33.9px;  letter-spacing: -0.32px; border-radius: 110px; background: #1A55B5;}
.artwork .arti2 .flex .tbx .tit b{color: #333; font-size: 26px; font-weight: 600; line-height: 33.9px;  letter-spacing: -0.52px;}
.artwork .arti2 .flex .tbx .txt ul{display: flex; flex-direction: column;}
.artwork .arti2 .flex .tbx .txt ul > li{color: #767676; font-size: 20px; font-weight: 400; line-height: 33.9px;  letter-spacing: -0.4px;}
.artwork .arti2 .flex:nth-child(even){flex-direction: row-reverse;
	&:after{rotate:180deg;}
	.tbx{flex-direction: row-reverse;}
}
.artwork .arti3, .artwork .arti4{margin-top: 200px;}
.artwork .arti4 .flex{display: flex; flex-wrap:wrap; gap:51px 42px; margin-top: 50px;}
.artwork .arti4 .flex .box{flex:1 1 28%; height: 120px; display: flex; align-items:center; justify-content: center; text-align: center; border-radius: 20px; border: 1px solid #C7C7CC;}
.arti-block2 .flex{display: flex; flex-wrap:wrap; gap:74px; margin-top: 50px;}
.arti-block2 .flex .box{position: relative; flex:1; height: 382px; border-radius: 20px; border: 1px solid rgba(26, 85, 181, 0.30); background: #FFF; box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.15); display: flex; justify-content: center; align-items: center; flex-direction: column; text-align: center; gap:20px; padding: 37px 10px; }
.arti-block2 .flex .box:after{position: absolute; right: -9px; top: 50%; margin-top: -9px; content: ''; width: 18px; height: 18px; border-radius: 50%; border: 4px solid #359FF4; background: #FFF;}
.arti-block2 .flex .box .tbx {display: flex; flex-direction: column; justify-content: center; text-align: center; gap:12px;}
.arti-block2 .flex .box .tbx p{color: #222; font-size: 24px; font-weight: 600; line-height: 160%; }
.arti-block2 .flex .box .tbx b{color: #222; font-size: 24px; font-weight: 700; line-height: 160%; }
.arti-block2 .flex .box .tbx small{color: #444; text-align: center; font-size: 20px; font-weight: 400; line-height: 160%; }


.arti-block3 .flex{display: flex; flex-wrap:wrap; gap:40px 50px; margin-top: 50px;}
.arti-block3 .flex .box{display: flex; width: calc(50% - 25px); height: 188px; padding: 0 58.5px;  align-items: center; gap: 38px;  border-radius: 20px; border: 1px solid rgba(26, 85, 181, 0.30); background: #FFF; box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.15);}
.arti-block3 .flex .box .tbx{display: flex; flex-direction: column; gap:12px;}
.arti-block3 .flex .box .tbx b{color: #222; font-size: 24px; font-weight: 700; line-height: 160%; }
.arti-block3 .flex .box .tbx p{color: #444; font-size: 20px; font-weight: 400; line-height: 160%; }
.table-block {margin-top: 200px;}
.table-block .table-wrap{margin-top: 50px;}
.table-block .table-wrap table{width: 100%; }
.table-block .table-wrap table thead tr th{border-top: 4px solid #1A55B5; border-bottom: 1px solid #1A55B5; background: #ECF3FF; height: 58px; color: #1A55B5; text-align: center; font-size: 20px; font-weight: 600; line-height: 33.9px;  letter-spacing: -0.4px;}
.table-block .table-wrap table tbody tr > *{border-bottom: 1px solid rgba(26, 85, 181, 0.20); height: 53px; color: #222; font-size: 18px; font-weight: 400; line-height: 33.9px;  letter-spacing: -0.36px; text-align: center;}
.table-block .table-wrap table tbody tr > th{border-right: 1px solid rgba(26, 85, 181, 0.20); }
.table-block-left .table-wrap table {border-top: 4px solid #1A55B5; }
.table-block-left .table-wrap table tbody tr > th{border-bottom: 1px solid rgba(26, 85, 181, 0.20); background: #ECF3FF; color: #1A55B5; font-size: 20px; font-weight: 600; line-height: 33.9px;  letter-spacing: -0.4px;}
.table-block-left .table-wrap table tbody tr > td{border-bottom: 1px solid rgba(0, 0, 0, 0.20); padding: 20px 40px;}
.table-block-left .table-wrap table tbody tr > td .dot-ul{display: flex; flex-direction: column; text-align: left; }
.table-block-left .table-wrap table tbody tr > td .dot-ul li{display: flex; flex-wrap:wrap; position: relative;  color: #222; font-size: 18px; font-weight: 400; line-height: 33.9px;  letter-spacing: -0.36px; padding-left: 27px;}
.table-block-left .table-wrap table tbody tr > td .dot-ul li b{/* font-weight: 700; */ margin-right: 4px; font-weight: 400;}
.table-block-left .table-wrap table tbody tr > td .dot-ul li:before{position: absolute; content: ''; width: 3px; height: 3px; background: #222; border-radius: 50%; left: 12px; top: 16px; }
.table-block-left .table-wrap table tbody tr > td .dot-ul li ol {display: flex; flex-wrap:wrap; gap:0px 5px; margin-left: 31px;}
.table-block-left .table-wrap table tbody tr > td .dot-ul li ol > li{flex:1 1 30%}
.table-block-left .table-wrap table tbody tr > td .dot-ul ul{display: flex; flex-direction: column; margin-left: -2px;}
.table-block-left .table-wrap table tbody tr > td .dot-ul li  ul > li{padding-left: 0;}
.table-block-left .table-wrap table tbody tr > td .dot-ul li  ul > li:before{display: none;}
.table-block-top table thead tr > th{border-right: 1px solid rgba(26, 85, 181, 0.20); height: 53px !important;}
.table-block-top table thead tr > th:last-child{border-right: 0;}
.table-block-top table thead tr:first-child > th{border-bottom: 1px solid rgba(26, 85, 181, 0.20); }
.table-block-top table thead tr:last-child > th{border-top: 0;background: #F7FAFF; color: #222; font-size: 18px; font-weight: 400; line-height: 33.9px;  letter-spacing: -0.36px;}
.table-block-top table tbody tr th{border-right: 1px solid rgba(26, 85, 181, 0.20); border-bottom: 1px solid rgba(26, 85, 181, 0.20); background: #F7FAFF; color: #222; font-weight: 400;}
.arti-block6 .tit-b{margin-bottom: 86px;}
.arti-block6 .tit{position: relative; display: inline-block; color: #1A55B5; font-size: 36px; font-weight: 700; line-height: 160%; padding-bottom: 4px; margin-bottom: 50px;}
.arti-block6 .tit:after{position: absolute; content: ''; width: 100%; height: 4px; background: #1A55B5; left: 0; bottom: 0;}
.arti-block6 .flex{display: flex; flex-wrap:wrap; gap:50px 47px;}
.arti-block6 .flex .cnt{display: flex; justify-content: center; align-items: center; flex-direction: column; gap:30px; height: 430px; padding: 37px 29px; border-radius: 20px; border: 1px solid rgba(26, 85, 181, 0.30); background: #FFF; box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.15);}
.arti-block6 .flex .cnt .tbx{display: flex; flex-direction: column; gap:12px; justify-content: center; text-align: center;}
.arti-block6 .flex .cnt .tbx b{color: #222; font-size: 20px; font-weight: 700; line-height: 160%; }
.arti-block6 .flex .cnt .tbx p{color: #444; font-size: 20px; font-weight: 400; line-height: 160%; }
.arti-block6 .box-wrap{display: flex; flex-direction: column; gap:200px;}
.arti-block6 .box1{position: relative; z-index: 10;}
.arti-block6 .box1:after{position: absolute; content: ''; width: 100%; height: 100%; background: url(../img/sub/smt-bg2.jpg) right bottom no-repeat; right: -210px; bottom: -240px; z-index: -1;}
.arti-block6 .box3{position: relative; z-index: 10;}
.arti-block6 .box3:after{position: absolute; content: ''; width: 100%; height: 100%; background: url(../img/sub/smt-bg3.jpg) left bottom no-repeat; left: -210px; bottom: -194px; z-index: -1;}
.arti-block6 .box .right-p{text-align: right; color: #222; font-size: 16px; font-weight: 400; line-height: 33.9px;  letter-spacing: -0.32px; margin-top: -40px; margin-bottom: 10px;}
.arti-block6 .box figure{padding-top: 10px;}
.arti-block6 .box .table-wrap{}
.arti-block6 .box .table-wrap table {width: 100%;}
.arti-block6 .box .table-wrap table tr th{border-top: 1px solid #1A55B5; border-bottom: 1px solid #1A55B5; background: #ECF3FF; height: 60px; color: #1A55B5; text-align: center; font-size: 20px; font-weight: 600; line-height: 33.9px;  letter-spacing: -0.4px;}
.arti-block6 .box .table-wrap table tr td{border-bottom: 1px solid rgba(26, 85, 181, 0.20); height: 53px; color: #222; text-align: center; font-size: 18px; font-weight: 400; line-height: 33.9px;  letter-spacing: -0.36px;}

#sub .pcb{margin-bottom: 0; padding-bottom: 400px; background: url(../img/sub/pcb-bg3.jpg) center bottom no-repeat;}
.pcb .arti1{position: relative; z-index: 10;}
.pcb .arti1:before{position: absolute; content: ''; width: 100%; height: 400%;background: url(../img/sub/pcb-bg1.jpg) right top no-repeat; z-index: -1;    right: -7px; top: -52%;} 
.pcb .arti-block3{position: relative; z-index: 10;}
.pcb .arti4-wrap {position: relative; z-index: 10;}
.pcb .arti4-wrap:before{position: absolute; content: ''; width: 100%; height: 100%; background: url(../img/sub/pcb-bg2.jpg) left top no-repeat; left: 0; top: -200px; z-index:	-1;}  

.smt .arti1{position: relative; z-index: 10;}
.smt .arti1:before{position: absolute; content: ''; width: 100%; height: 400%;background: url(../img/sub/smt-bg1.jpg) 73% top no-repeat; z-index: -1;    right: -7px; top: -192%;} 
.smt .arti2-wrap{position: relative; z-index: 15;}

#sub .electronic{margin-bottom: 0; padding-bottom: 400px; background: url(../img/sub/electronic-bg3.jpg) center 107.2% no-repeat;}
.electronic .arti1{position: relative; z-index: 10;}
.electronic .arti1:before{position: absolute; content: ''; width: 100%; height: 400%;background: url(../img/sub/smt-bg1.jpg) 73% top no-repeat; z-index: -1;   right: -7px; top: -192%;} 
.electronic .arti2-wrap{position: relative; z-index: 15;}
.electronic .arti3, .electronic .arti4-wrap{margin-top: 200px;}
.electronic .arti-block6 .box figure{padding-top: 0;}
.electronic .arti3{position: relative; z-index: 10;}
.electronic .arti3:before{position: absolute; content: ''; width: 100%; height: 100%; background: url(../img/sub/electronic-bg1.jpg) right top no-repeat; z-index: -1; right: -12.5%; top: -17%;	}
.electronic .arti-block6 .box1:after{display: none;}
.electronic .arti-block6 .box1 figure{padding-top: 10px;}
.electronic .arti-block6 .box2{position: relative; z-index: 10;}
.electronic .arti-block6 .box2:after{position: absolute; content: ''; width: 100%; height: 200%; background: url(../img/sub/electronic-bg2.jpg) top left no-repeat; left: -14%; top: 8%; z-index: -1;}
.electronic .arti-block6 .box3:after{display: none;}