/* common */
.grey-box {background: #fafafa; padding: 150px 0; box-sizing: border-box; }
.slick-dots.disabled { display:none !important; }

/* 서브 상단 */
#sv {width: 100%; height: 565px; position: relative; overflow: hidden;}
#sv .bg {width: 100%; height: 100%; animation: bgScale 2.8s; position: relative; }
.sv01 {background: url("/img/sub/sv01.jpg") no-repeat center/cover;}
.sv01-1 {background: url("/img/sub/sv01-1.jpg") no-repeat center/cover;}
.sv02 {background: url("/img/sub/sv02.jpg") no-repeat center/cover;}
.sv03 {background: url("/img/sub/sv03_n.jpg") no-repeat center/cover;}
.sv04 {background: url("/img/sub/sv04_n.jpg") no-repeat center/cover;}
.sv05 {background: url("/img/sub/sv05.jpg") no-repeat center/cover;}
.sv0504 {background: url("/img/sub/sv0504.jpg") no-repeat center/cover;}
.sv06 {background: url("/img/sub/sv06.jpg") no-repeat center/cover;}
.sv00 {background: url("/img/sub/sv10.jpg") no-repeat center/cover;}
#sv .inner1560 {position: absolute; top: 60%; left: 50%; transform: translate(-50%,-50%);}
#sv .sv-navi {display: flex;}
#sv .sv-navi li {font-size: 15px; color: #fff; position: relative; text-transform: uppercase;}
#sv .sv-navi li:not(:last-child) {margin-right: 20px; padding-right: 24px; box-sizing: border-box;}
#sv .sv-navi li:not(:last-child):after {content: '\e93f'; font-family: 'xeicon'; opacity: 0.5; position: absolute; right: 0; top: 50%; transform: translateY(-50%); font-size: 11px;}
#sv .sv-tit {margin: 52px 0 0 0;  letter-spacing: -0.1px;}
#sv .sv-tit h2 {font-size: 75px; color: #fff; font-weight: bold; text-transform: uppercase; overflow: hidden;}
#sv .sv-tit h2 > span {display: block;}
#sv .sv-tit p {font-size: 18px; color: #fff; font-weight: 300; margin: 20px 0 0 0; text-transform: uppercase; line-height: 1.5; overflow: hidden;}
#sv .sv-tit p > span {display: block;}

#lnb {height: 92px; border-bottom: 1px solid #ddd;}
#lnb span.tit { display:none }
#lnb div {width: 100%;  height: 100%;}
#lnb ul {display: flex; width: 100%; height: 100%; justify-content: center; align-items: center;}
#lnb ul li {height: 100%; padding: 0 72px; box-sizing: border-box; text-align: center;}
#lnb ul li a {height: 100%; display: flex; align-items: center;  position: relative; font-size: 18px; color: #111; font-weight: 600; font-family: 'Pretendard';}
#lnb ul li a:after {content: ''; position: absolute; left: 50%; bottom: -1px; transform: translateX(-50%); width: 0; height: 2px;  background: var(--color-darkblue);}
#lnb ul li:hover a,
#lnb ul li.on a {color: var(--color-darkblue);}
#lnb ul li:hover a:after,
#lnb ul li.on a:after {width: 100%; transition: 0.4s;}

#lnb ul.sub-gnb03 li {padding: 0 32px;}

#subContents {padding: 110px 0 180px; box-sizing: border-box;}
.sub-tit {text-align: center; }
.sub-tit > span {display: block; font-size: 24px; color: var(--color-blue); font-weight: bold; overflow: hidden;}
.sub-tit > span > span {display: block;}
.sub-tit > p,
.h3-tit {font-size: 85px; color: #111; letter-spacing: -0.1px; font-weight: 600; text-transform: uppercase; }
.sub-tit > p.t1 { font-size: 70px;}
.sub-tit p > span {display: block;}
.sub-tit p > span > span { font-size:40px; }

#subContents > .sub-tit {margin-bottom: 85px;}

.product-content .tab {width: 100%; }
.product-content .tab ul {width: 100%; height: 95px; display: flex;}
.product-content .tab ul li {width: 50%; height: 100%; border: 1px solid #ececec;}
.product-content .tab ul li:not(:last-child) {border-right: none;}
.product-content .tab ul li a {font-size: 20px; color: #999; display: block; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;}
.product-content .tab ul li.on {border: 1px solid var(--color-blue);}
.product-content .tab ul li.on a {color: #fff; background: var(--color-blue); }

.product-content .tab ul.n2 li {width: 50%;}

@keyframes bgScale {
	0%{transform:scale(1.15); }
	100%{ transform:scale(1); }
}

@keyframes bgScale2 {
	0%{transform:scale(1.2); }
	100%{ transform:scale(1); }
}

/*=====================
			기업정보
=====================*/
/* 회사소개 및 연혁 */
#introduce .subVisual {width: 100%; height: 100vh; height: calc(var(--vh, 1vh) * 100); position: relative; overflow: hidden;}
#introduce .subVisual :root {
  --vh: 100%;
}
#introduce .subVisual .bg {width: 100%; height: 100%; background: url(/img/sub/sv01-1.jpg) no-repeat center/cover;  animation: bgScale2 3.5s; }
#introduce .subVisual .sub-tit {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; text-align: center; }
#introduce .subVisual .sub-tit > h3 {font-size: 75px; font-weight: bold; overflow: hidden;}
#introduce .subVisual .sub-tit > h3 > span {display: block;  font-size: inherit; color: inherit; font-weight: inherit;}
#introduce .subVisual .sub-tit > span {font-size: 23px; display: block; margin-top: 30px; color: #fff; font-weight: 400; overflow: hidden;}
#introduce .subVisual .sub-tit > span > span {display: block;  font-size: inherit; color: inherit; font-weight: inherit;}
#introduce .subVisual .scroll {width: 90px; height: 90px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, 0.2); position: absolute; bottom: 125px; left: 50%; transform: translateX(-50%);}
#introduce .subVisual .scroll i {color: #fff; font-size: 15px;}

#introduce .cnt {padding: 173px 0 250px; box-sizing: border-box; overflow: hidden;}
#introduce .cnt > div:not(:first-child) {padding-top: 220px; box-sizing: border-box;}
#introduce .greeting h4 {font-size: 90px; color: #111; font-weight: 600; font-family: 'Poppins'; line-height: 1.1; text-transform: uppercase; overflow: hidden;}
#introduce .greeting h4 > span {display: block;}
#introduce .greeting .txt {max-width: 1053px; width: 100%; font-size: 26px; color: #555; font-family: 'Urbanist', 'Noto Sans KR'; margin:  100px 0 0 auto; font-weight: 300; line-height: 1.8; letter-spacing: -0.2px;}
/*
#introduce .greeting .txt > span {font-size: 30px; font-weight: 500;  }
#introduce .greeting .txt > span b {font-weight: 700;}
*/
#introduce .greeting .txt b {color: #111; font-weight: 500;}
#introduce .greeting .txt p {font-size: 18px; color: #555;}
#introduce .greeting .txt p span {font-size: 26px; color: #111; font-weight: 500;}

#introduce .intro {display:  flex; align-items: center;}
#introduce .intro > div {width: 50%;}
#introduce .intro .txt {padding-left: 100px; box-sizing: border-box;}
#introduce .intro .txt .sub-tit {text-align: left;}
#introduce .intro .txt ul {margin-top: 55px;}
#introduce .intro .txt ul li {display: flex; align-items: center; gap: 0 18px;}
#introduce .intro .txt ul li:not(:last-child) {margin-bottom: 27px;}
#introduce .intro .txt ul li .circle {width: 82px; height: 82px; border-radius: 50%; background: #e9e9e9; display: flex; align-items: center; justify-content: center;}
#introduce .intro .txt ul li p {font-size: 18px; color: #555; font-weight: 300; line-height: 1.6; width:  calc(100% - 100px);}

#introduce .intro .txt ul li.item01 .circle {background: var(--color-blue);}
#introduce .intro .txt ul li.item03 {align-items: flex-start;}

#introduce .history {display: flex; overflow: hidden;}
#introduce .history .titBox {overflow: hidden;}
#introduce .history .titBox .sub-tit {text-align: left;}
#introduce .history .titBox .yearTab {display: flex; flex-direction: column; gap: 40px 0; margin: 90px 0 0; position: relative;}
#introduce .history .titBox .yearTab li {position: relative; padding-left: 18px; box-sizing: border-box;}
#introduce .history .titBox .yearTab li:before {content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 5px; height: 5px; background: #fff; border: 2px solid #b5b5b5; border-radius: 50%;}
#introduce .history .titBox .yearTab li button{font-size: 24px; color: #999; font-weight: 500; font-family: 'Urbanist';}
#introduce .history .titBox .yearTab li.on button {color: var(--color-blue); font-weight: bold;}
#introduce .history .titBox .yearTab li.on:before {background: var(--color-blue); border: 3px solid #bed2ed;}

#introduce .history .content {width: 50%; margin: 30px 0 0 auto;}
#introduce .history .content .listBox {}
#introduce .history .content .listBox:not(:last-child) {margin-bottom: 100px;}
#introduce .history .content .listBox h4 {font-size: 60px; color: #111; font-weight: bold; font-family: 'Urbanist';}
#introduce .history .content .listBox .list {margin-top: 60px;}
#introduce .history .content .listBox .list dl:not(:last-child) {margin-bottom: 53px;}
#introduce .history .content .listBox .list dt {font-size: 23px; color: #333; font-weight: bold; font-family: 'Urbanist';}
#introduce .history .content .listBox .list dd {margin-top: 12px;}
#introduce .history .content .listBox .list dd > div {display: flex;  flex-direction: column;}
#introduce .history .content .listBox .list dd span {font-size: 18px; color: var(--color-blue); font-weight: 500; width: 34px;}
#introduce .history .content .listBox .list dd p {position: relative; font-size: 18px; color: #555; font-weight: 300; font-family: 'Noto Sans KR'; line-height: 1.4; padding-left:12px; }
#introduce .history .content .listBox .list dd p:before {content: ''; position: absolute; top: 10px; left: 0; width: 4px; height: 4px; background: #555;border-radius: 50%;}
#introduce .history .content .listBox .list dd p:not(:last-child) { margin-bottom:5px; }



/* 경영이념 */
#management .cnt {padding-top: 94px; }
#management .cnt .img {}
#management .cnt .img img {margin: 0 auto; display: block;}
#management .list {width: 100%; height: 100%; position: absolute; top: 0; left: 50%; transform: translateX(-50%);}
#management .list .item {display: flex; align-items: center; gap: 0 30px;}
#management .list .item.fd {flex-direction: row-reverse;}
#management .list .item .txt {width: calc(100% - 166px);}
#management .list .item .txt div {font-size: 23px; color: #111; font-weight: bold; }
#management .list .item .txt span {font-size: 15px;  color: #86a7cf; font-weight: bold; font-family: 'Urbanist', sans-serif; display: block; margin: 12px 0 15px;}
#management .list .item .txt p {font-size: 17px; color: #555; font-weight: 300; line-height: 1.5;}
#management .list .item .icon {width: 136px; height: 136px; background: #fff; border-radius: 50%; text-align: center; box-shadow: 0 0 20px rgba(172, 197, 228, 0.2); z-index: 1;}
#management .list .item .icon img {position: relative; top: 50%; transform: translateY(-50%);}
#management .list .item01 .txt,
#management .list .item02 .txt {text-align: right;}

#management .list .item {position: absolute;}
/* #management .list .item01 {top: 108px; left: 80px;}
#management .list .item02 {top: 340px; left: 80px;}
#management .list .item03 {top: 222px; left: 1118px;}
#management .list .item04 {top: 464px; left: 1087px;} */

#management .list .item:after {content: ''; position: absolute; top: 50%;}
#management .list .item01:after {width: 169px; height: 42px; background: url(/img/sub/management_line01.png) no-repeat center; right: -33%;}
#management .list .item02:after {width: 169px; height: 42px; background: url(/img/sub/management_line02.png) no-repeat center; right: -23.8%; margin-top: 2px;}
#management .list .item03:after {width: 169px; height: 42px; background: url(/img/sub/management_line03.png) no-repeat center; left: -32%; margin-top: 3px;}
#management .list .item04:after {width: 169px; height: 42px; background: url(/img/sub/management_line04.png) no-repeat center; left: -20.8%; margin-top: -3px;}

#management .list .item02 .txt span {color: #024297;}
#management .list .item03 .txt span {color: #5e8ab9;}
#management .list .item04 .txt span {color: #022d5a;}

#management .list .item01 {top: 14.8%;left: 5%;}
#management .list .item02 {top: 47.8%;left: 5.12%;}
#management .list .item03 {top: 31.22%;left: 71.8%;}
#management .list .item04 {top: 65.34%;left: 69.58%;}

/* 조직도 */
#organization .circle {margin: 0 auto; width: 233px; height: 233px; border-radius: 50%; background: #022d5a; text-align: center; position: relative;}
#organization .circle:before,
#organization .circle:after {content: ''; position: absolute; top: 50%; left: 50%;  transform: translate(-50%,-50%); background: #022d5a; opacity: 0.2; border-radius: 50%;}
#organization .circle:before {width: 151%; height: 151%; animation: scale-up-center 2.5s both;}
#organization .circle:after {width: 127%; height: 127%; animation: scale-up-center 2.5s both;}
#organization .circle .txt {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); color: #fff; z-index: 1;}
#organization .circle .txt p {font-size: 23px; margin: 18px 0 6px; font-weight: bold;}
#organization .circle .txt span {font-size: 15px; display: block; font-family: 'Urbanist';}
#organization .img {text-align: center;}


@keyframes scale-up-center {
	0% {
		-webkit-transform: scale(0.5);
		transform: translate(-50%,-50%) scale(0.5);
	}
	100% {
		-webkit-transform: scale(1);
		transform: translate(-50%,-50%) scale(1);
	}
}


/* 오시는 길 */
#contact {}
#contact .map-cnt {width: 100%; height: 660px; margin-bottom: 85px;}
#contact .map-cnt iframe {width: 100%; height: 100%;} 
#contact h3 {font-size: 32px; color: #111; font-weight: bold;}
#contact .list {display: flex; flex-wrap: wrap; gap: 40px 20px; margin-top: 33px;}
#contact .list .item {width: calc(50% - 10px); display: flex; align-items: center;}
#contact .list .item:first-of-type{width: 100%;}
#contact .list .item .icon {display: flex; align-items: center; }
#contact .list .item .icon span {display: block; width: 48px; height: 48px; background: #f4f4f4; border-radius: 50%; text-align: center;}
#contact .list .item .icon span img {position: relative; top: 50%; transform: translateY(-50%);}
#contact .list .item .icon p {font-size: 20px; color: var(--color-blue); font-weight: 500; margin-left: 10px;}
#contact .list .item .txt {font-size: 18px; color: #555; /* font-weight: 300; */ line-height: 1.5; margin-left: 20px;}
#contact .list .item .txt span {display: inline-block;}
#contact .list .item .txt ul {flex-wrap: wrap; display: flex; gap: 15px 0; }
#contact .list .item .txt ul li {display: flex; width: 100%; gap: 0 15px;}
#contact .list .item .txt ul li .num {width: 23px; height: 23px; border-radius: 50%; color: #fff; background: #0253a5; text-align: center; font-size: 13px; line-height: 23px; display: block;}
#contact .list .item .txt ul li p {width: calc(100% - 33px);}

#contact .list .item .txt ul li:nth-child(2) .num {background: #c6b182;}
#contact .list .item .txt ul li:nth-child(3) .num {background: #883297;}

/* 특허 및 인증서 */
#patent {}
#patent .list ul {display: flex; flex-wrap: wrap; gap: 30px 34px;}
#patent .list ul li {width: calc(20% - 27.5px); cursor: pointer;  border: 1px solid #e9e9e9; box-sizing: border-box;}
#patent .list ul li .img {position: relative; padding-bottom: 139.5%; overflow: hidden; }
#patent .list ul li .img img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 100%; max-height: 100%; transition: 0.4s;}
#patent .list ul li:hover .img img {transform: translate(-50%, -50%) scale(1.1); }


/*=====================
			사업분야
=====================*/
#production {}
#production > div:not(:last-child) {margin-bottom: 145px;}
#production .cnt1 > .inner1560 > div {width: 50%;}
#production .cnt1 .txt {padding-right: 80px; box-sizing: border-box;}
#production .cnt1 .txt .icon {display: block; width: 66px; height: 66px; background: #f3f3f3; border-radius: 50%; text-align: center; display: flex; align-items: center; justify-content: center; }
#production .cnt1 .txt p {font-size: 45px; color: #000; font-weight: bold; text-transform: uppercase; margin: 17px 0 36px;}
#production .cnt1 .txt p .en {font-size: 48px;}
#production .cnt1 .txt > span {font-size: 18px; color: #555; font-weight: 300; line-height: 1.6; font-family: 'Noto Sans KR';}

#production .grey-box {width: 100%; }
#production .imgBox {margin: 50px 0 104px; position: relative; }
#production .cnt2 {position: absolute; left: 0; top: 50%; padding: 0 45px; transform: translateY(-50%); margin-top: 6%; }
#production .cnt2 .img {}
#production .cnt2 .img picture {display: none;}
#production .cnt2 .list {width: 100%; position: absolute; top: 0; height: 100%; box-sizing: border-box;}
#production .cnt2 .list .txt {text-align: center; position: absolute;}
#production .cnt2 .list .txt img { filter: brightness(0) invert(1);}
#production .cnt2 .list .txt span {display: block; font-size: 18px; color: #fff; margin-top: 12px; opacity: 0.5; }

#production .cnt2 .list .txt.on span {opacity: 1;/* font-size: 20px; */}

#production .cnt2 .list .txt01 {top: 37%; left: 6%;}
#production .cnt2 .list .txt02 {top: 49%; left: 28.5%;}
#production .cnt2 .list .txt03 {top: 56%; left: 47%;}
#production .cnt2 .list .txt04 {top: 66%; left: 64.8%;}
#production .cnt2 .list .txt05 {top: 20%; left: 82.6%;}

#production .cnt3 .list {display: flex; gap: 0 63px;  margin-top: 70px;}
#production .cnt3 .item {width: calc(50% - 32px); position: relative;}
#production .cnt3 .item .bg {width: 100%; height: 100%; background: #c3c3c3; }
#production .cnt3 .item .bg img {mix-blend-mode: multiply; width: 100%; height: 100%;}
#production .cnt3 .item .txt {color: #fff; text-align: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; flex-direction: column; padding: 0 15px; box-sizing: border-box;}
#production .cnt3 .item .txt p {font-size: 35px; font-weight: bold; font-family: 'Urbanist', 'Noto Sans KR', sans-serif;}
#production .cnt3 .item .txt span {display: block; font-size: 18px; font-weight: 300; opacity: 0.8; line-height: 1.6; margin-top: 28px; display: none;}

#production .cnt3 .item.on .bg {background: #6a6a6a; transition:  0.4s; }

#production .cnt4 .sub-tit div {font-size: 18px; color: #111; font-family:  'Noto Sans KR', sans-serif; margin-top: 35px;}
#production .cnt4 .sub-tit .s-txt {font-size: 16px; color: #555; font-weight: 300; margin-top: 11px;}
#production .cnt4 .line {margin-top: 70px;}
#production .cnt4 .line:not(:last-child) {margin-bottom: 48px;}
#production .cnt4 .line .item {display: flex; justify-content: space-between; align-items: center; padding-left: 30px; box-sizing: border-box;}
#production .cnt4 .line .item .circle {width: 154px; height: 154px; color: #fff; text-align: center; position: relative; display: flex; align-items: center; justify-content: center;}
#production .cnt4 .line .item .circle:after {content: ''; position: absolute; top: 50%; right: -140px; width: 140px; height: 1px; border-bottom: 1px dashed #bebebe;}
#production .cnt4 .line .item .circle:before {content: ''; position: absolute; top: 50%; right: -140px; width: 5px; height: 5px; background: #bebebe; border-radius: 50%; margin-top: -1px; z-index: 2;}    
#production .cnt4 .line .item .circle span {font-size: 16px; font-weight: 300; z-index: 4; position: relative;}
#production .cnt4 .line .item .circle span b {font-size: 30px; font-weight: bold; font-family: 'Urbanist', sans-serif;  display: block; }
#production .cnt4 .line .item .circle > p {border-radius: 50%; background: #a7a7a7; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
#production .cnt4 .line .item .circle .circle1 { width: 100%; height: 100%; z-index: 3;}
#production .cnt4 .line .item .circle .circle2 {width: calc(100% + 32px); height: calc(100% + 32px); z-index: 2; opacity: 0.2;}
#production .cnt4 .line .item .circle .circle3 {width: calc(100% + 56px); height: calc(100% + 56px); z-index: 1; opacity: 0.2;}
#production .cnt4 .line .item ul {display: flex; align-items: center; max-width: 1165px; width: 100%; height: 210px; background: #fafafa; border-radius: 125px;}
#production .cnt4 .line .item ul li {width: 33.3333%; text-align: center; position: relative;  font-family: 'Noto Sans KR';}
#production .cnt4 .line .item ul li:not(:last-child):after {content: '\e93e'; font-family: 'xeicon'; font-size: 14px; color: #aeaeae; position: absolute; top: 50%; right: 0; transform: translateY(-50%); margin-right: 5px;}
#production .cnt4 .line .item ul li:not(:last-child):before {content: ''; width: 28px; height: 28px; background: #e7e7e7; border-radius: 50%; position: absolute; top: 50%; right: 0; transform: translateY(-50%);}
#production .cnt4 .line .item ul li p {font-size: 19px;  color: #111; text-transform: uppercase;}
#production .cnt4 .line .item ul li img {display: inline-block; margin: 23px 0;}
#production .cnt4 .line .item ul li span {font-size: 16px; color: #555; font-weight: 300; display: block; }

#production .cnt4 .line02 .item .circle > p,
#production .cnt4 .line02 .item .circle:before {background: var(--color-blue);}
#production .cnt4 .line03 .item .circle > p,
#production .cnt4 .line03 .item .circle:before {background: #022d5a;}

#production .cnt5 ul {display: flex; width: 100%;/*  gap: 0 37px; */ padding: 0 30px; box-sizing: border-box; margin: 80px 0 0 0;}
#production .cnt5 ul li {width: 16.6666%;}
#production .cnt5 ul li .circle-cnt {position: relative; width: 100%; height: auto; padding-bottom: 100%; }
#production .cnt5 ul li .circle-cnt:after {content: ''; width: 100%; height: 50%; border: 1px dashed var(--color-blue); position: absolute; left: 50%; transform: translateX(-50%); }

#production .cnt5 ul li:nth-child(1) .circle-cnt:after,
#production .cnt5 ul li:nth-child(3) .circle-cnt:after,
#production .cnt5 ul li:nth-child(5) .circle-cnt:after {top: 0; border-top-left-radius: 124.5px;border-top-right-radius: 124.5px;border-bottom: none;}

#production .cnt5 ul li:nth-child(2) .circle-cnt:after,
#production .cnt5 ul li:nth-child(4) .circle-cnt:after {bottom: 0; border-bottom-left-radius: 124.5px;border-bottom-right-radius: 124.5px;border-top: none;} 

#production .cnt5 ul li.item05 .circle-cnt:after {height: 100%; border-radius: 50%;}
#production .cnt5 ul li .circle {width: calc(100% - 35px); height: auto; padding-bottom: calc(100% - 35px); border-radius: 50%; box-shadow: 0 0 16px rgba(39, 106, 194, 0.1);     position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1; background: #fff;} 

#production .cnt5 ul li .circle:before,
#production .cnt5 ul li .circle:after {content: ''; position: absolute; top: 50%; transform: translateY(-50%); border-radius: 50%;}
#production .cnt5 ul li .circle:before {width: 6px; height: 6px; background: var(--color-blue);  left: -21px;}
#production .cnt5 ul li .circle:after {width: 11px; height: 11px; border: 1px solid var(--color-blue); left: -24px;}
#production .cnt5 ul li .circle img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
#production .cnt5 ul li .txt {text-align: center; margin-top: 45px;}
#production .cnt5 ul li .txt p {font-size: 20px; color: #111; font-weight: 500; }
#production .cnt5 ul li .txt span {font-size: 18px; color: #555; font-weight: 300; line-height: 1.6; display: block; margin-top: 10px; font-family: 'Noto Sans KR';}
#production .cnt5 ul li.item05 .circle {box-shadow: none; background: var(--color-blue);}


/* 개발프로세스 circle gradient  */
#production .cnt5 ul li:nth-child(1) .circle-cnt:after, 
#production .cnt5 ul li:nth-child(3) .circle-cnt:after,
#production .cnt5 ul li:nth-child(5) .circle-cnt:after {background-origin: border-box; background-clip: content-box, border-box; border: 1px dashed #fff; border-bottom: none;}
#production .cnt5 ul li:nth-child(2) .circle-cnt:after, 
#production .cnt5 ul li:nth-child(4) .circle-cnt:after {background-origin: border-box; background-clip: content-box, border-box; border: 1px dashed #fff; border-top: none;}
#production .cnt5 ul li:nth-child(6) .circle-cnt:after {background-origin: border-box; background-clip: content-box, border-box; border: 1px dashed #fff;}

#production .cnt5 ul li:nth-child(1) .circle-cnt:after {background-image: linear-gradient(#fff, #fff), linear-gradient(90deg, rgba(153,217,243,1) 0%, rgba(123,187,221,1) 100%); }
#production .cnt5 ul li:nth-child(2) .circle-cnt:after {background-image: linear-gradient(#fff, #fff), linear-gradient(90deg, rgba(123,187,221,1) 0%, rgba(116,162,200,1) 100%);}
#production .cnt5 ul li:nth-child(3) .circle-cnt:after {background-image: linear-gradient(#fff, #fff), linear-gradient(90deg, rgba(116,162,200,1) 0%, rgba(96,131,175,1) 100%);}
#production .cnt5 ul li:nth-child(4) .circle-cnt:after {background-image: linear-gradient(#fff, #fff), linear-gradient(90deg, rgba(96,131,175,1) 0%, rgba(67,91,144,1) 100%);}
#production .cnt5 ul li:nth-child(5) .circle-cnt:after {background-image: linear-gradient(#fff, #fff), linear-gradient(90deg, rgba(67,91,144,1) 0%, rgba(34,49,112,1) 100%);}
#production .cnt5 ul li:nth-child(6) .circle-cnt:after {background-image: linear-gradient(#fff, #fff), linear-gradient(90deg, rgba(34,49,112,1) 0%, rgba(2,0,75,1) 100%);}

#production .cnt5 ul li:nth-child(1) .circle:before {background: #99d9f3;}
#production .cnt5 ul li:nth-child(1) .circle:after {border: 1px solid #99d9f3;}
#production .cnt5 ul li:nth-child(2) .circle:before {background: #7bbbdd;}
#production .cnt5 ul li:nth-child(2) .circle:after {border: 1px solid #7bbbdd;}
#production .cnt5 ul li:nth-child(3) .circle:before {background: #74a2c8;}
#production .cnt5 ul li:nth-child(3) .circle:after {border: 1px solid #74a2c8;}
#production .cnt5 ul li:nth-child(4) .circle:before {background: #6083af;}
#production .cnt5 ul li:nth-child(4) .circle:after {border: 1px solid #6083af;}
#production .cnt5 ul li:nth-child(5) .circle:before {background: #435b90;}
#production .cnt5 ul li:nth-child(5) .circle:after {border: 1px solid #435b90;}
#production .cnt5 ul li:nth-child(6) .circle:before {background: #223170;}
#production .cnt5 ul li:nth-child(6) .circle:after {border: 1px solid #223170;}






/*=====================
			제품정보
=====================*/
.product-content {overflow: hidden;}
.product-content .tab {margin-bottom: 130px;}
.product-content .sub-tit {margin-bottom: 80px;}

.product-content .tabCnt > div > div {margin-bottom: 154px;}
/* .product-content .tabCnt > div > div:not(:last-child) {margin-bottom: 154px;} */
.product-content .tabCnt > div > div.grey-box:last-child {margin-bottom: 0;}
.df-box {display: flex; align-items: center;}
.df-box.reverse {flex-direction: row-reverse;}
.df-box.fs {align-items: flex-start;}
.df-box > div {width: 50%;}
.product-content .df-box .img {}
.product-content .df-box .txt {padding: 0 0 0 100px; box-sizing: border-box;}
.product-content .df-box .txt .icon {width: 66px; height: 66px; border-radius: 50%; background: #f3f3f3; display: flex; align-items: center; justify-content: center;}
.product-content .df-box .txt div {font-size: 44px; color: #111; font-weight: 600; text-transform: uppercase; margin: 17px 0 32px;}
.product-content .df-box .txt div .en {font-size: 48px;}
.product-content .df-box .txt p {font-size: 18px; color: #555; font-weight: 300; line-height: 1.7;}
.product-content .df-box .txt .dot-list {}
.product-content .df-box .txt .dot-list span {display: block; position: relative; padding-left: 10px; box-sizing: border-box;}
.product-content .df-box .txt .dot-list span:before {content: '·'; font-size: 22px; color: var(--color-blue); display: inline-block; position: absolute; left: 0; top: -5px;}
.product-content .df-box .txt .dot-list span:not(:last-child) {margin-bottom: 22px;}

.product-content .reverse .txt {padding: 0 100px 0 0;}
.product-content .grey-box {}

.product-content .point-box {/* justify-content: space-between; */}
.product-content .point-box .df-box {gap: 0 131px; }
.product-content .point-box .point {position: relative; width: 488px; height: 488px;/* height: auto; padding-bottom: 31.283%; */ border-radius: 50%; transition: 1s; cursor: pointer;}
.product-content .point-box .point .img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; overflow: hidden; border-radius: 50%; background: #f5f5f5; display: flex; align-items: center; justify-content: center;}
.product-content .point-box .point .img:after {content: ''; width: 100%; height: 100%; background: #505050; position: absolute; top: 0; left: 0; z-index: -1;}
.product-content .point-box .point .img img {width: 100%; height: 100%; object-fit: cover; mix-blend-mode: multiply;}
.product-content .point-box .point .num {font-size: 76px; font-weight: bold; text-transform: uppercase; -webkit-text-stroke: 1px rgba(0, 0, 0, 0.25); color: transparent; position: absolute;  line-height: 1; z-index: 2; opacity: 0;}
.product-content .point-box .point .icon {width: 78px; height: 78px; background: rgba(36, 36, 36, 0.5) url(/img/sub/search-icon.png) no-repeat center; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 50%;}
.product-content .point-box .point:nth-child(1) .num {top: -36px; left: -68px;}
.product-content .point-box .point:nth-child(2) .num {top: -36px; right: -68px;}

.product-content .point-box .point.on {max-width: calc(100% - 619px); width: 100%; cursor: initial;}
.product-content .point-box .point.on .num {opacity: 1;}
.product-content .point-box .point.on .img {border-radius: 0;}
.product-content .point-box .point.on .img:after {width: 0;}
.product-content .point-box .point.on .img img {max-width: 100%; max-height: 100%; width: initial; height: initial; /* width: 100%; height: 100%;  */object-fit: contain;} 
.product-content .point-box .point.on .icon {opacity: 0;}

.product-content .tab_s1 {width: 100%; /* overflow-x: scroll; overflow-y: hidden;  */padding: 10px 0; box-sizing: border-box;}
.product-content .tab_s1 ul {display: flex; gap: 0 77px; justify-content: center; /* min-width: 1024px; */}
.product-content .tab_s1 ul li button {font-size: 16px; color: #999; font-weight: 500; font-family: 'Poppins', 'Noto Sans KR', sans-serif; position: relative;}
.product-content .tab_s1 ul li button:after {content: ''; width: 0; height: 2px; background: var(--color-blue); position: absolute; bottom: -5px; left: 50%; transform: translateX(-50%); transition: 0.4s;}
.product-content .tab_s1 ul li.on button,
.product-content .tab_s1 ul li:hover button {color: var(--color-blue);}
.product-content .tab_s1 ul li.on button:after,
.product-content .tab_s1 ul li:hover button:after {width: 100%;}

.product-content .s_tabCnt {margin-top: 80px;}
.product-content .s_tabCnt .list  {display: flex; }
.product-content .s_tabCnt .list  > div {width: 50%;}
.product-content .s_tabCnt .slide {}
.product-content .s_tabCnt .slide .img {background: #fff; height: 444px;}
.product-content .s_tabCnt .slide .img img {margin: 0 auto; position: relative; top: 50%; transform: translateY(-50%);}
.product-content .s_tabCnt .slide .slick-dots {display: flex; position: absolute; right: 35px; bottom: 30px; gap: 0 8px;}
.product-content .s_tabCnt .slide .slick-dots li {width: 8px; height: 8px; background: #d1d1d1; border-radius: 50%; }
.product-content .s_tabCnt .slide .slick-dots li.slick-active {background: var(--color-blue);}
.product-content .s_tabCnt .slide .slick-dots li button {text-indent: -99999px;}
.product-content .s_tabCnt .txt div {margin: 0 0 15px;}
.product-content .s_tabCnt .txt div .en {font-weight: bold;}
.product-content .s_tabCnt .txt ul {display: flex; gap: 0 10px; margin-top: 55px;}
.product-content .s_tabCnt .txt ul li {width: 89px; height: 89px; background: #efefef; display: flex; align-items: center; justify-content: center;}

.product-content .s_tabCnt .list .used {width: 100%; margin-top: 110px;}
.product-content .s_tabCnt .list .used .tit {width: 100%; text-align: center; font-size: 45px; color: #111; font-weight: bold; line-height: 1.2; margin-bottom: 43px;}
.product-content .s_tabCnt .list .used .box-list {display: flex;  gap: 0 16px;}
.product-content .s_tabCnt .list .used .box-list .box {width: calc(50% - 16px); text-align: center; }
.product-content .s_tabCnt .list .used .box-list .box .item {border: 1px solid #f2f2f2;  background: #fff; display: flex; align-items: center; flex-wrap: wrap; justify-content: center; width: 100%; padding: 20px 0; box-sizing: border-box;}
.product-content .s_tabCnt .list .used .box-list .left {display: flex; flex-wrap: wrap; gap: 13px 0;}
.product-content .s_tabCnt .list .used .box-list .left .item {/* height: 316px; */}
.product-content .s_tabCnt .list .used .box-list .right .item {/* height: 647px; */}
.product-content .s_tabCnt .list .used .box-list .box span {display: block; width: 100%;} 

.product-content .used02 .box {}
.product-content .used02 ul {display: flex; align-items: center; flex-wrap: wrap; gap: 14px 13px;}
.product-content .used02 ul li {width: calc(33.3333% - 14px); text-align: center; background: #fff; height: 316px; border: 1px solid #f2f2f2;}
.product-content .used02 ul li > div {position: relative; top: 50%; transform: translateY(-50%); }
.product-content .used02 ul li img {}
.product-content .used02 ul li span {display: block; margin-top: 18px; font-size: 17px; color: #333; font-weight: 300;}
.product-content .used02 ul li span.mt0 {margin-top: 0;}

.product-content .imgSlide .slick-dots {display: flex; position: absolute; right: 35px; bottom: 30px; gap: 0 8px;}
.product-content .imgSlide .slick-dots li {width: 8px; height: 8px; background: #d1d1d1; border-radius: 50%; }
.product-content .imgSlide .slick-dots li.slick-active {background: var(--color-blue);}
.product-content .imgSlide .slick-dots li button {text-indent: -99999px;}

.product-content .kind-list dl:not(:last-child) { margin-bottom: 150px; }
.product-content .kind-list dt { text-align: center; font-size: 21px; font-weight: 400; color: #111; }
.product-content .kind-list dt strong { font-weight: 700;}
.product-content .kind-list dt span { display:inline-block; border-radius: 50%; background-color: #276ac2; width: 34px; height: 34px; padding-top: 7px; font-size: 16px; color: #fff; font-weight: 500; vertical-align: middle; box-sizing: border-box;}
.product-content .kind-list dd { padding-top: 65px;}
.product-content .kind-list dd > ul { display: flex; gap: 20px 32px; justify-content: center; flex-wrap: wrap;}
.product-content .kind-list dd > ul > li { width:calc(33.33% - 32px); padding: 0 40px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; height: 307px; background-color: #fafafa;}
.product-content .kind-list dd > ul > li img { max-width:100%; margin: 0 auto; }

.product-content .feature-list ul { display: flex; align-items: center; flex-wrap: wrap; gap: 35px 40px;}
.product-content .feature-list li {width: calc(50% - 40px); background-color: #fff; padding:65px 75px; height:465px; box-sizing: border-box;}
.product-content .feature-list li p { min-height:50px; margin-bottom:40px; }
.product-content .feature-list li dt { font-size: 30px; font-weight: 700; color: #111; }
.product-content .feature-list li dd { padding-top: 22px; font-size: 18px; font-weight: 300; color: #333; line-height:1.6; }

.product-content .product-list .list { display: block !important;}
.product-content .product-list .list ul {display: flex; flex-wrap: wrap; gap: 35px 37px;}
.product-content .product-list .list li {width: calc((100% - 111px) / 4); text-align: center; background-color: #fafafa; }
.product-content .product-list.p-list2 .list ul {gap: 30px 30px;}
.product-content .product-list.p-list2 .list li {width: calc((100% - 30px) / 2); height: 466px; display: flex; align-items: center; justify-content: center;}
.product-content .product-list.p-list3 .list ul {gap: 30px 30px;}
.product-content .product-list.p-list3 .list li {width: calc((100% - 60px) / 3); }
.product-content .product-list.p-list4 .list ul {gap: 30px 30px;}
.product-content .product-list.p-list4 .list li {width: calc((100% - 90px) / 4); height: 307px; display: flex; align-items: center; justify-content: center; }
.product-content .product-list.p-list4 .list li:nth-child(5),
.product-content .product-list.p-list4 .list li:nth-child(6),
.product-content .product-list.p-list4 .list li:nth-child(7) {width: calc((100% - 60px) / 3); }
.product-content .product-list.panel-list .list ul {display: grid; grid-gap:40px 45px; grid-template-columns:  1.7fr 1fr;}
.product-content .product-list.panel-list .list li { width: auto;}
.product-content .product-list.panel-list .list li:nth-child(1) { grid-row: span 2; }
.product-content .product-list.panel-list.panel-list-p .list ul {display: grid; grid-gap:40px 45px; grid-template-columns:  1fr 0.97fr 0.97fr;}

#board .s_tabCnt .list {flex-wrap: wrap; }

#monitor .list-box {}
#monitor .list-box .list {}
#monitor .list-box .list:not(:last-child) {margin-bottom: 100px;}
#monitor .list-box .list .tit {font-size: 45px; color: #111; font-weight: bold; text-align: center;}
#monitor .list-box .list ul {margin-top: 34px;}
#monitor .list-box .list ul li {background: #fff; text-align: center; width: 100%; padding: 30px 5px; box-sizing: border-box;}
#monitor .list-box .list ul li > div {}
#monitor .list-box .list ul li img {}
#monitor .list-box .list ul li p {margin-top: 34px;}

#monitor .list-box .list ul.n5 {gap: 0 18px;}
#monitor .list-box .list ul.n5 li {width: calc(20% - 15px); max-height: 307px;}
#monitor .list-box .list ul.n3 {gap: 0 30px;}
#monitor .list-box .list ul.n3 li {width: calc(33.33333% - 20px); max-height: 307px;}
#monitor .list-box .list ul.n2 {gap: 0 45px;}
#monitor .list-box .list ul.n2 li {width: calc(50% - 23px);}

#led2 .cnt2 .df-box {gap: 30px;}
#led2 .cnt2 .df-box .img {width: clac(50% - 15px);}

#board .cnt3 .img-list {display: flex; flex-wrap: wrap; gap: 30px; margin-top: 180px;}
#board .cnt3 .img-list .item {width: calc(33.3333% - 20px); border: 1px solid #dedede; box-sizing: border-box; padding: 25px 10px;}
#board .cnt3 .img-list .item.w2 {width: calc(50% - 15px); padding: 42px 10px;}
#board .cnt3 .img-list .item > div {display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 30px 0;}
#board .cnt3 .img-list .item span {display: block; font-size: 18px; color: #555; font-weight: 300; }


/*=====================
			제품정보
=====================*/
.qualiy-content .tab {margin-bottom: 130px;}
.qualiy-content  .grey-box {}
/* mono LCD */
#lab .grey-box {margin-top: 150px;}
#lab .tech-cnt .df-box:not(:last-child) { margin-bottom:40px; }
#lab .tech-cnt .img {text-align: center; padding-right: 50px; box-sizing: border-box; }
#lab .tech-cnt .list {}
#lab .tech-cnt .list dl {padding: 45px 10px 68px 68px; box-sizing: border-box; border-top: 1px solid rgba(51, 51, 51, 0.1); font-family: 'Noto Sans KR';}
#lab .tech-cnt .list dt {font-size: 32px; color: #111; font-weight: bold;}
#lab .tech-cnt .list dd {margin-top: 23px;  }
#lab .tech-cnt .list dd p {padding-left: 11px; box-sizing: border-box; position: relative; line-height: 1.4; } 
#lab .tech-cnt .list dd p:not(:last-child) {margin-bottom: 12px;} 
#lab .tech-cnt .list dd p:before {content: '·';  color: var(--color-blue);position: absolute; left: 0; display: inline-block;}


/* 품질보증 */
#assurance .sub-tit {margin-bottom: 120px;}
#assurance .sub-tit .s-txt {font-size: 18px; color: #333; font-weight: 300; line-height: 1.5; margin-top: 40px;}
#assurance .circle-con {position: relative; padding-bottom: 595px; box-sizing: border-box;}
#assurance .circle-con .b-circle {width: 398px; height: 398px; margin: 0 auto; border: 25px solid transparent; background-image: linear-gradient(#fff, #fff), linear-gradient(90deg, rgba(26,81,163,1) 10%, rgba(8,8,96,1) 100%); border-radius: 50%; background-origin: border-box; background-clip: content-box, border-box; text-align: center; display: flex; flex-direction: column; justify-content: center; align-items: center; position: relative; box-sizing: border-box;}
#assurance .circle-con .b-circle:after {content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% + 132px); height: calc(100% + 132px); border: 1px dashed #d9d9d9;  border-radius: 50%;}
#assurance .circle-con .b-circle p {font-size: 42.43px; font-weight: 600; color: #111; text-transform: uppercase;}
#assurance .circle-con .b-circle span {font-size: 19px; color: #024397; margin-top: 10px; display: block;}

#assurance .circle-line {width: 59.62%; height: 464px; border: 1px dashed #d9d9d9; position: absolute; left: 50%; transform: translateX(-50%); top: 206px; border-bottom-left-radius: 464px; border-bottom-right-radius: 464px; border-top: none;}
#assurance .circle-list {width: 100%; height: 100%; position: absolute; top: 0; }
#assurance .circle-list .circle {display: flex; align-items: center; position: absolute;}
#assurance .circle-list .circle .icon {width: 230px; height: 230px; border-radius: 50%; background: #a5bddc; display: flex; align-items: center; justify-content: center; flex-direction: column;}
#assurance .circle-list .circle .icon > div {display: flex; align-items: center; justify-content: center; flex-direction: column; position: relative; width: 100%; height: 100%;}
#assurance .circle-list .circle .icon img {}
#assurance .circle-list .circle .icon span {font-size: 20px; color: #fff; font-weight: 500; margin-top: 18px;}
#assurance .circle-list .circle ul {padding-right: 30px;}
#assurance .circle-list .circle ul > li {font-size: 17px; color: #333; font-weight: 300; line-height: 1.5;}
#assurance .circle-list .circle ul > li:not(:last-child) {margin-bottom: 7px;}
#assurance .circle-list .circle.reverse {flex-direction: row-reverse;}
#assurance .circle-list .circle1 {top: 83px; left: 3.14%;}
#assurance .circle-list .circle2 {top: 53.25%; left: 50%; transform: translateX(-50%); flex-direction: column; text-align: center; }
#assurance .circle-list .circle2 .icon {background: #024397;}
#assurance .circle-list .circle2 ul { padding: 23px 0 0 0;}
#assurance .circle-list .circle3 {top: 83px; left: 71.73%;}
#assurance .circle-list .circle3 .icon {background: #022d5a;}
#assurance .circle-list .circle3 ul {padding: 0 0 0 30px;}


#assurance .circle-list .circle .icon > div:after {content: ''; width: 5px; height: 5px; background: #acc5e4; border: 3px solid #fff; border-radius: 50%; position: absolute; bottom: -6px; left: 50%; transform: translateX(-50%);}
#assurance .circle-list .circle3 .icon > div:after {background: #022d5a; left: calc(50% - 2px);}

#assurance .circle-list .circle2 .icon > div:after {right: -5px; top: calc(50% + 12px); bottom: initial; transform: translateY(-50%); background: #024397; left: initial;}
#assurance .circle-list .circle2 .icon > div:before {left: -5px; top: calc(50% + 12px); bottom: initial; transform: translateY(-50%); background: #024397; content: ''; width: 5px; height: 5px; border: 3px solid #fff;  position: absolute; border-radius: 50%; }

#assurance .circle-box * {box-sizing: border-box;}
#assurance .circle-box { margin-bottom: 155px; }
#assurance .circle-box .listbox {position: relative; margin: 0 auto; max-width: 1335px;}
#assurance .circle-box .listbox .line { position: absolute; bottom:375px; left: 13%; width:calc(100% - 26%); height:53px; border: 1px dashed #d9d9d9; border-top: none; border-radius: 0 0 15px 15px;}
#assurance .circle-box .listbox dl {position: relative; padding-bottom:428px; }
#assurance .circle-box .listbox dt {position: absolute; left:0; bottom:0; width: 100%; }
#assurance .circle-box .listbox dt:before {content: ''; display: block; position: absolute; left:50%; top:-42px; width: 1px; height: 42px;  border-left: 1px dashed #d9d9d9;}
#assurance .circle-box .listbox dt span {font-size:30px; color: #fff; height: 332px; max-width:760px; width: 100%; margin:0 auto; text-align: center; display: flex; align-items: center; justify-content: center; flex-direction: column; background: linear-gradient(to right,  rgba(26,81,163,1) 0%,rgba(8,8,96,1) 100%); border-radius: 300px;}
#assurance .circle-box .listbox dt span strong { display: block; font-size:40px; font-weight: 600; margin-bottom:8px;}
#assurance .circle-box .listbox dd ul {display: flex; flex-wrap: wrap; padding: 0 22px; }
#assurance .circle-box .listbox dd li {position: relative; width:calc(25% + 44px); margin:0 -22px;}
#assurance .circle-box .listbox dd li:after {content: ''; display: block; padding-bottom:100%;}
#assurance .circle-box .listbox dd li:before {content: ''; display: block; position: absolute; left:50%; bottom:-53px; width: 1px; height: 53px;  border-left: 1px dashed #d9d9d9;}
#assurance .circle-box .listbox dd li .circle {position: absolute; left:0; top:0; font-size:20px; color: #111; font-weight: 500; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; flex-direction: column; mix-blend-mode: multiply; background-color: #fff; border-radius:50%; }
#assurance .circle-box .listbox dd li .circle strong { display: block; font-size:30px; font-weight: 600; margin-bottom:8px;}
#assurance .circle-box .listbox dd li:nth-child(1) .circle {border: 20px solid #a5bddc;}
#assurance .circle-box .listbox dd li:nth-child(2) .circle {border: 20px solid #6c92c4;}
#assurance .circle-box .listbox dd li:nth-child(3) .circle {border: 20px solid #276ac2;}
#assurance .circle-box .listbox dd li:nth-child(4) .circle {border: 20px solid #214e89;}
#assurance .circle-box .listbox dd li:nth-child(1):before,
#assurance .circle-box .listbox dd li:nth-child(4):before {display: none;}
#assurance .circle-box .list { margin: 0 auto; max-width: 1335px; margin-top:100px; }
#assurance .circle-box .list ul {display: flex; flex-wrap: wrap; padding-left: 64px;}
#assurance .circle-box .list ul li { width: 25%; }
#assurance .circle-box .list ul li dt {position: relative; padding-left: 25px; font-size:30px; color: #111; font-weight: 600; }
#assurance .circle-box .list ul li dt:after {content: ''; display: block; position: absolute; left:0; top:14px; width: 13px; height: 13px; border-radius: 50%; }
#assurance .circle-box .list ul li dd {padding-top: 15px; font-size:17px; color: #333; font-weight: 300; line-height:1.4;}
#assurance .circle-box .list ul li:nth-child(1) dt:after {background-color: #a5bddc;}
#assurance .circle-box .list ul li:nth-child(2) dt:after {background-color: #6c92c4;}
#assurance .circle-box .list ul li:nth-child(3) dt:after {background-color: #276ac2;}
#assurance .circle-box .list ul li:nth-child(4) dt:after {background-color: #214e89;}

#assurance .manage-con {}
#assurance .manage-con .sub-tit {margin-bottom: 50px;}
#assurance .manage-con .slide-con {position: relative;}
#assurance .manage-con .slide-con .dot-cnt { position: absolute; left: 0;  top: 40px; z-index: 2; overflow: hidden;}
#assurance .manage-con .slide-con .dot {display: flex; flex-direction: column; gap: 8px 0;}
#assurance .manage-con .slide-con .dot li {font-size: 54px; color: #4a4a4a; opacity: 0.3; font-family: 'Pretendard'; font-weight: bold; cursor: pointer; }
#assurance .manage-con .slide-con .dot li.on {color: #024397; opacity: 1;}
#assurance .manage-con .slide-con .slide {width: calc(100% - 155px); margin: 0 0 0 auto;}
#assurance .manage-con .slide-con .slide .item {position: relative;}
#assurance .manage-con .slide-con .slide .item span {position: absolute; right: 35px; bottom: 45px; display: block; font-size: 18px; color: #fff; font-weight: 300; line-height: 1.8; text-align: right;}
#assurance .manage-con .slide-con .slide .item .imgbox {position: relative; overflow: hidden; height:480px; }
#assurance .manage-con .slide-con .slide .item .imgbox img { position: absolute; left: 0; top:0; width: 100% ; height: 100%; object-fit: cover; -o-object-fit: cover; }
#assurance .manage-con .slide-con .slide .item .txtbox { margin-top: 30px; display: flex; align-items: center; }
#assurance .manage-con .slide-con .slide .item .txtbox > p { display: flex; align-items: center; justify-content: center; width: 140px; height: 140px; background-color: #f1f1f1; border-radius:190px; box-sizing: border-box;}
#assurance .manage-con .slide-con .slide .item .txtbox > p img { width: auto; }
#assurance .manage-con .slide-con .slide .item .txtbox dl {width: calc(100% - 140px); padding-left: 40px; box-sizing: border-box;}
#assurance .manage-con .slide-con .slide .item .txtbox dt {font-size: 30px; font-weight: 700; color: #111;} 
#assurance .manage-con .slide-con .slide .item .txtbox dd {font-size: 17px; font-weight: 300; color: #333; margin-top: 10px; line-height: 1.4; } 

#assurance .assurance-process .list { display: block !important; margin-top:100px; }
#assurance .assurance-process .list ul {display: flex; flex-wrap: wrap; justify-content: center; gap: 30px;}
#assurance .assurance-process .list li {width: calc((100% - 60px) / 3); text-align: center; }
#assurance .assurance-process .list.list-p2 ul {center; gap: 30px 36px;}
#assurance .assurance-process .list.list-p2  li {width: calc((100% - 36px) / 2); }
#assurance .assurance-process .list p { text-align:center; padding-bottom: 30px; font-size:25px; color: #111; font-weight: 700;}

#assurance .response-con {margin-top: 145px; margin-bottom: 145px;}
#assurance .response-con .sub-tit {margin-bottom: 155px;}
#assurance .response-con .arrow {text-align: center; position: relative;}
#assurance .response-con .arrow p {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); font-size: 20px; color: #333; font-weight: 300; line-height: 1.6;}
#assurance .response-con .arrow p span {color: #0e3e95; font-weight: 500;}

#assurance .response-con .con {position: relative;}
#assurance .response-con .list {width: 100%; height: 100%; position: absolute; top: 0; }
#assurance .response-con .list .item {position: absolute; top: 0; /* display: flex; flex-flow: column; align-items: center; */}
#assurance .response-con .list .item span {font-size: 20px; color: #000; display: block; margin-top: 16px;}
#assurance .response-con .list .item01 {top: 308px; left: 5%; text-align: right;}
#assurance .response-con .list .item02 {top: 32px; left: 13%; text-align: right;}
#assurance .response-con .list .item03 {top: -92px; left: 50%; transform: translateX(-50%);  text-align: center;} 
#assurance .response-con .list .item04 {top: 45px; left: 80%; } 
#assurance .response-con .list .item05 {top: 311px; left: 86%; } 

#assurance .management-con { padding-bottom:150px; }
#assurance .management-con .sub-tit {margin-bottom: 70px;}
#assurance .management-con .slide {z-index: 1;}
#assurance .management-con .slick-dots {display: flex; gap: 0 9px; position: absolute; left: 50%; bottom: -30px; transform: translateX(-50%); }
#assurance .management-con .slick-dots li {color: #dfdfdf; width: 8px; height: 8px; background: #dfdfdf; border-radius: 50%; cursor: pointer; }
#assurance .management-con .slick-dots li.slick-active {background: #000;}
#assurance .management-con .slick-dots li button {text-indent: -99999px; }

#assurance .management-con .slide-cnt {position: relative;}
#assurance .management-con .slide-cnt > .inner1720 {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#assurance .management-con .slide-cnt .control {display: flex; justify-content: space-between;}
#assurance .management-con .slide-cnt .control button {color: #d8d8d8; padding: 0; margin: 0;}


/* 보유장비 */
#equipment {}
#equipment .list {display: flex; align-items: center; flex-wrap: wrap; gap: 60px 41px;}
#equipment .list .item {width:  calc(33.33333% - 28px); text-align: center;}
#equipment .list .item .img {border: 1px solid #ddd; box-sizing: border-box; position: relative; width: 100%; padding-bottom: 92%; }
#equipment .list .item .img img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(0.9); max-width: 100%; max-height: 100%; transition: 0.4s;}
#equipment .list .item .txt {font-size: 20px; color: #111; font-weight: 500; line-height: 1.3; margin-top: 30px;}
#equipment .list .item:hover .img img {transform: translate(-50%, -50%) scale(0.98);}

.hoverItem .hover {width: 100%; height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.hoverItem .hover > span {display: block; background: transparent;  position: absolute; transition: all 0.28s; }
.hoverItem .hover > span:after { content: ""; display: block; background: var(--color-blue); position: absolute; }
.hoverItem .hover > span:nth-child(odd) {width: 100%; height: 1px; }
.hoverItem .hover > span:nth-child(odd)::after { width: 0; height: 1px; }
.hoverItem .hover > span:nth-child(even) { width: 1px; height: 100%; }
.hoverItem .hover > span:nth-child(even)::after { width: 1px; height: 0; }

.hoverItem .hover > span:nth-child(1) { top: 0; left: 0; }
.hoverItem .hover > span:nth-child(1)::after { top: 0; left: 0; }
.hoverItem .hover > span:nth-child(2) { top: 0; right: 0; }
.hoverItem .hover > span:nth-child(2)::after { top: 0; right: 0; }
.hoverItem .hover > span:nth-child(3) { right: 0; bottom: 0; }
.hoverItem .hover > span:nth-child(3)::after { right: 0; bottom: 0; }
.hoverItem .hover > span:nth-child(4) { left: 0px; bottom: 0; }
.hoverItem .hover > span:nth-child(4)::after { left: 0px; bottom: 0; }

.hoverItem:hover .hover > span:nth-child(odd)::after { width: 100%; transition: width 0.44s linear; transition-duration: 0.28s; }
.hoverItem:hover .hover > span:nth-child(even)::after { height: 100%; transition: height 0.44s linear; transition-delay: 0.28s; } 



/*=====================
			채용정보
=====================*/
/* 인재상 */
#talent .sub-titie {font-size: 40px; color: #111; font-weight: bold; text-align: center;}
#talent .sub-titie span {color: var(--color-blue);}

#talent .circleCnt {margin: 107px 0 0; box-sizing: border-box; position: relative;}
#talent .circleCnt .b-txt {position: absolute; top: 50%; transform: translateY(-50%); z-index: -1;}
#talent .circleCnt .circle {text-align: center; position: relative; z-index: 2;}
#talent .circleCnt .list {position: absolute; top: 0; width: 100%; height: 100%;}
#talent .circleCnt .list .item {position: absolute;}
#talent .circleCnt .list .item:after {content: ''; background: url(/img/sub/talent_list01.png); width: 116px; height: 39px; position: absolute; }
#talent .circleCnt .list .item p {font-size: 38px; color: #111; font-weight: bold;}
#talent .circleCnt .list .item span {display: block; font-size: 16px; color: var(--color-blue); margin-top: 10px; font-weight: 300; text-transform: uppercase;}

#talent .circleCnt .list .item01 {top: 7%; left: 14%; text-align: right;}
#talent .circleCnt .list .item01:after {right: -140px; top: 25px; }
#talent .circleCnt .list .item02 {top: 83.8%; left: 15%; text-align: right;}
#talent .circleCnt .list .item02:after {right: -140px; top: -16px; transform: scaleY(-1); }
#talent .circleCnt .list .item03 {top: 7%; left: 76%;}
#talent .circleCnt .list .item03:after {left: -140px; top: 37px; transform: scaleX(-1); }
#talent .circleCnt .list .item04 {top: 83.8%; left: 76%;}
#talent .circleCnt .list .item04:after {left: -140px; top: -16px; transform: scaleX(-1) scaleY(-1);}


/* 복리후생제도 */
#benefits {}
#benefits .list-cnt {display: flex; flex-wrap: wrap; /* gap: 45px 53px; */ gap: 40px 45px}
#benefits .item {width: calc(25% - 45px); height: 252px;}
#benefits .item:not(.item-tit){display: flex; justify-content: center; background: #fafafa; align-items: center; flex-direction: column; text-align: center;}
#benefits .item .icon {margin-right: 0;}
#benefits .item .icon img {}
#benefits .item .list {}
#benefits .item .list p {font-size: 20px; color: #111; font-weight: bold; margin-top:30px; min-height:54px; line-height:1.6; width: 85%;margin: 30px auto 0;}
#benefits .item .list ul {display: flex; flex-wrap: wrap; margin-top: 18px; max-width: 220px;} 
#benefits .item .list ul li {width: 100%; font-size: 17px; color: #555; font-weight: 300; padding-left: 10px; box-sizing: border-box; position: relative; line-height: 1.6;}
#benefits .item .list ul li:after {content: '·'; position: absolute; left: 0; top: -3px; font-size: 18px;}
#benefits .item .list ul.n2 {}
#benefits .item .list ul.n2 li {width: 50%;}

#benefits .item-tit p {font-size: 50px; color: #000; font-weight: 600; text-transform: uppercase;}
#benefits .item-tit p span.en {font-size: 55px; display: inline-block; }
#benefits .item-tit > span {font-size: 17px; color: #555; font-weight: 300; display: block; margin-top: 27px;}


/* 채용절차 및 모집부문 */
.talent-con .cnt2 {margin-top: 0;}
.talent-con .circle-list {display: flex; padding: 37px 38px; box-sizing: border-box; border: 1px dashed #e7e7e7; border-radius: 180px; gap: 0 76px; margin-top: 50px;}
.talent-con .circle-list .item {width: calc(20% - 63px); height: auto; padding-bottom: calc(20% - 63px); border: 1px solid var(--color-blue); border-radius: 50%; position: relative; background: #fff;}
.talent-con .circle-list .item:not(:last-child):after {content: '\e93f'; font-family: 'xeicon'; color: #aeaeae; position: absolute; right: -47px; top: 50%; transform: translateY(-50%); }
.talent-con .circle-list .item > div {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; text-align: center;}
.talent-con .circle-list .item .num {font-size: 15px; color: var(--color-blue); font-weight: bold; }
.talent-con .circle-list .item p {font-size: 23px; color: #111; font-weight: bold; margin: 8px 0 18px;}
.talent-con .circle-list .item .txt {font-size: 15px; color: #555; font-weight: 300; }
.talent-con .circle-list .item:last-child {background: var(--color-blue); color: #fff;}
.talent-con .circle-list .item:last-child .num,
.talent-con .circle-list .item:last-child p,
.talent-con .circle-list .item:last-child .txt {color: #fff;}

.talent-con .s-txt {text-align: center; font-size: 15px; color: #666; font-weight: 300; margin-top: 45px;}
.talent-con .s-txt span {color: var(--color-blue); font-weight: 500; }

.talent-con .cnt2 .list {display: flex; flex-wrap: wrap; border-top: 1px solid var(--color-blue); border-bottom: 1px solid #eee; margin-top: 64px;}
.talent-con .cnt2 .list .item {width: 50%; box-sizing: border-box; display: flex; padding: 60px 0 58px; box-sizing: border-box; }
.talent-con .cnt2 .list .item:not(:last-child) {border-bottom: 1px solid #eee;}
.talent-con .cnt2 .list .item:nth-child(2n) {padding-left: 60px; box-sizing: border-box;}
.talent-con .cnt2 .list .item p {font-size: 25px; color: #111; font-weight: bold; max-width: 253px; width: 100%;}
.talent-con .cnt2 .list .item:nth-child(2n) p {max-width: 218px;}
.talent-con .cnt2 .list .item span {font-size: 18px; color: #333; font-weight: 300;}

.talent-con .cnt3 {/* padding: 140px 0 149px; box-sizing: border-box; background: #fafafa;  */ margin-top: 150px;}
.talent-con .cnt3 .box-list {display: flex; flex-wrap: wrap; gap: 34px 41px; margin-top: 74px;}
.talent-con .cnt3 .box-list .item {width: calc(50% - 21px); height: 470px; background: #fff; padding: 0 40px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; font-family: 'Noto Sans KR';}
.talent-con .cnt3 .box-list .item .icon {}
.talent-con .cnt3 .box-list .item h4 {font-size: 30px; color: #111; font-weight: bold; margin: 28px 0;}
.talent-con .cnt3 .box-list .item p {font-size: 18px; color: #333; font-weight: 300; line-height: 1.5; }
.talent-con .cnt3 .box-list .item dl {font-size: 16px; display: flex; margin-top: 30px;justify-content: space-between;}
.talent-con .cnt3 .box-list .item dl dt {color: var(--color-blue); font-weight: bold; max-width: 50px; width: 100%;}
.talent-con .cnt3 .box-list .item dl dd {color: #555; font-weight: 300;width: 80%;}
.talent-con .cnt3 .box-list .item dl dd span {display: block; position: relative; padding-left: 10px; box-sizing: border-box;}
.talent-con .cnt3 .box-list .item dl dd span:before {content: '·';  color: var(--color-blue);position: absolute; left: 0; display: inline-block;}
.talent-con .cnt3 .box-list .item dl dd span:not(:last-child) {margin-bottom: 7px;}

.talent-con .cnt4 { height:276px; display:flex; width:100%; align-items: center; justify-content: center; background: #276ac2 url(/img/sub/procedure_bg.jpg) no-repeat center/cover;  }
.talent-con .cnt4 dl { text-align: center; }
.talent-con .cnt4 dt { color: #fff; font-size: 45px; font-weight: 700; }
.talent-con .cnt4 dd { margin-top: 25px; color: #fff; font-size: 19px; font-weight: 500; }
.talent-con .cnt4 dd span { font-weight: 300; font-family: 'Poppins'; }
.talent-con .cnt4 dd img { vertical-align: middle; }


/*=====================
		sub bottom lnb
=====================
.btmLnb {width: 100%; height: 172px; border-top: 1px solid #eeeeee;}
.btmLnb .depth2 {width: 100%; height: 100%;display: flex;}
.btmLnb .depth2 li {width: 100%; height: 100%; width: 25%; text-align: center; }
.btmLnb .depth2 li:not(:last-child) {border-right: 1px solid #eeeeee; box-sizing: border-box;}
.btmLnb .depth2 li > a {width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 20px; color: #111; font-weight: bold; position: relative;  transform: translateY(-10px);}
.btmLnb .depth2 li > a:after {content: 'view more'; font-size: 13px; color: #ccc; font-weight: 300; position: absolute; bottom: 33px; text-transform: uppercase;}
.btmLnb .depth2 li.on > a:after {content: 'this page'; background: var(--color-blue); padding: 4px 8px; box-sizing: border-box; border-radius: 24px; color: #fff;}

.btmLnb .sub-gnb01 li {width: 25%;}
.btmLnb .sub-gnb03 li {width: 14.28%;}
.btmLnb .sub-gnb03 li > a {font-size: 18px;}
.btmLnb .sub-gnb04 li {width: 33.3333333%;}
.btmLnb .sub-gnb05 li {width: 100%;}
*/
/*=====================
		sub bottom allmenu
=====================*/
.btmAll { width: 100%; height: auto; border-top: 1px solid #eeeeee; display:block !important; }
.btmAll * { box-sizing: border-box; }
.btmAll > ul { max-width:1600px; margin:0 auto; display:flex; }
.btmAll > ul > li { width:288px; padding:60px 0 55px 60px; border-left:1px solid #e5e5e5; }
.btmAll > ul > li:first-child { border-left:none; }
.btmAll > ul > li:first-child,
.btmAll > ul > li:last-child { width:225px; }
.btmAll > ul > li > a span { color:#000; font-size:18px; font-weight:500; }
.btmAll > ul > li > ul { padding-top:30px; }
.btmAll > ul > li > ul > li:not(:last-child) { margin-bottom:10px; }
.btmAll > ul > li > ul > li a { color:#000; font-size:16px; font-weight:300; }


/* online */
.online-inquiry .ipbox * { box-sizing: border-box; }
.online-inquiry .ipbox > ul { display:grid; gap:0 40px; border-top:1px solid #ededed;  } 
.online-inquiry .ipbox > ul > li.full { grid-column:1/3; }
.online-inquiry .ipbox > ul > li { position:relative; border-bottom:1px solid #ededed; padding:25px 0 25px 160px; }
.online-inquiry .ipbox > ul > li.p-txt { padding:15px 0 15px 0; }
.online-inquiry .ipbox > ul > li > strong { position:absolute; left:0; top:32px; color:#111; font-size:18px; font-weight:700; display:block; width:160px; padding-left:55px; }
.online-inquiry .ipbox > ul > li > strong span { color:#276ac2; font-weight:300; }
.online-inquiry .ipbox > ul > li.p-txt > strong { position:relative; top:0; width:auto; padding:30px 0 25px 55px; }
.online-inquiry .ipbox > ul > li input[type="text"],
.online-inquiry .ipbox > ul > li input[type="password"] { height:42px; padding:0 20px; width:100%; font-size:17px; color:#111; font-weight:400; border:none; outline:none; background:#fff; border-radius:0; }
.online-inquiry .ipbox > ul > li input.ip2 { width:150px; }
.online-inquiry .ipbox > ul > li select { width:100%; height:55px; padding:0 20px; font-size:16px; color:#222; font-weight:400; border:none; outline:none; -webkit-appearance:none; -moz-appearance:none; appearance:none; background:#f5f5f5 url(/img/sub/icon_select_down1.png) right center no-repeat; border-radius:8px; }
.online-inquiry .ipbox > ul > li select::-ms-expand { display: none; }
.online-inquiry .ipbox > ul > li select.sel2 { width:calc(30% - 14px); margin-left:10px; }
.online-inquiry .ipbox > ul > li textarea { width:100%; height:200px; line-height:1.6; padding:5px 20px; font-size:17px; color:#111; font-weight:400; border:none; outline:none; background:#fff; border-radius:0; }
.online-inquiry .ipbox > ul > li ::placeholder { color:#999; opacity:1; font-weight:300; }
.online-inquiry .ipbox > ul > li .txtbox .box { padding:20px; font-size:14px; color:#555; font-weight:400; border-bottom:none; height:210px; overflow:auto; border:1px solid #ededed }
.online-inquiry .ipbox > ul > li .txtbox .box p { font-size:14px; font-weight:300; color:#555; line-height:1.3; margin-top:15px; }
.online-inquiry .ipbox > ul > li .txtbox .box .privacy { padding:0; }
.online-inquiry .ipbox > ul > li .txtbox .box .privacy .sTxt h3,
.online-inquiry .ipbox > ul > li .txtbox .box .privacy > dl > dt,
.online-inquiry .ipbox > ul > li .txtbox .box .privacy > dl > dd { font-size:14px; color: #555; font-weight:300; }
.online-inquiry .ipbox > ul > li .txtbox .box p:nth-child(1) { margin-top:0; }
.online-inquiry .ipbox > ul > li .kcaptcha_ip { padding-left:30px; }
.online-inquiry .ipbox > ul > li .file_ip { display:flex; gap:0 10px; }
.online-inquiry .ipbox > ul > li .file_ip input { height:42px; padding:0 20px; width:100%; font-size:16px; color:#222; font-weight:400; border:none; outline:none; background:#fff; border-radius:0; }
.online-inquiry .ipbox > ul > li .file_ip .upload-name{ width:calc(100% - 90px); }
.online-inquiry .ipbox > ul > li .file_ip label{ display:flex; align-items:center; justify-content:center; height:42px; border-radius:0; width:105px; font-size:15px; color:#fff; font-weight:400; text-align:center; outline:none; background:#505050; border:none; cursor:pointer; }
.online-inquiry .ipbox > ul > li .file_ip input[type="file"]{ display:none; }
.online-inquiry .ipbox > ul > li .stxt { display:block; margin-top:10px; color:#999; font-size:14px; font-weight:300; line-height:1.3; }
.online-inquiry .ipbox .btn { margin-top:50px; text-align:center; }
.online-inquiry .ipbox .btn button { border:none; outline:none; background:none; }
.online-inquiry .ipbox .btn button span { display:flex; justify-content:center; align-items:center; font-size:18px; font-weight:500; color:#fff; width:214px; height:77px; background-color:#276ac2; border-radius:0; }

.online-inquiry .ipbox .ch { margin:85px auto 0 auto; text-align:center; color:#333; font-size:17px; font-weight:300; }
.online-inquiry .ipbox .ch input { margin:-2px 5px 0 8px; }


#recruit * { box-sizing: border-box; }
#recruit .search-box { position:relative; margin:0 auto; max-width:800px; display:flex; justify-content:space-between; }
#recruit .search-box select { width:135px; height:80px; padding:0 30px; color:#111; font-size:17px; font-weight:300; border:1px solid #ededed; border-radius:0; outline:none; -webkit-appearance:none; -moz-appearance:none; appearance:none; background:url(/img/sub/icon_select_down1.png) right center no-repeat; }
#recruit .search-box select::-ms-expand { display: none; }
#recruit .search-box input { width:calc(100% - 145px); height:80px; color:#111; font-size:17px; font-weight:300; border:1px solid #ededed; outline:none; padding:0 100px 0 30px; }
#recruit .search-box button { position:absolute; right:0; top:0; width:80px; height:80px; overflow:hidden; text-indent:-999em; background:url(/img/sub/icon_search.png) center center no-repeat; }
#recruit .search-box ::placeholder { color:#999; opacity:1; font-weight:300; }
#recruit .recruit-list table { width:100%; margin-top:75px;}
#recruit .recruit-list table,
#recruit .recruit-list th,
#recruit .recruit-list td { border:none; }
#recruit .recruit-list thead th { height:94px; background-color:#f9f9f9; color:#111; font-size:18px; font-weight:700; }
#recruit .recruit-list tbody td { text-align:center; height:80px; border-bottom:1px solid #ededed; color:#666; font-size:15px; }
#recruit .recruit-list tbody td.td-left { text-align:left; padding-left:20px; }
#recruit .recruit-list tbody td.td-left a { max-height:35px; color:#555; font-weight:300; font-size:18px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical;}
#recruit .recruit-list tbody td.td-left a strong { color:#276ac2; font-weight:700; }
#recruit .recruit-list tbody td.td-left a strong.finish { color:#666; }
#recruit .recruit-list tbody td .sbox { width:120px; height:32px; display:flex; justify-content:center; align-items:center; color:#fff; font-weight:500; font-size:15px; border-radius:30px; background-color:#276ac2; margin: auto;}
#recruit .recruit-list tbody td .sbox.finish { background-color:#333; }

#recruit .recruit-view .title { padding:50px; background-color:#f9f9f9; text-align:center; line-height:1.6; font-weight:700; font-size:22px; color:#111; }
#recruit .recruit-view .title .box { display:inline-block; vertical-align:middle; margin-right:10px; }
#recruit .recruit-view .title .sbox { width:70px; height:32px; display:flex; justify-content:center; align-items:center; color:#fff; font-weight:500; font-size:15px; border-radius:30px; background-color:#276ac2; margin: auto;}
#recruit .recruit-view .title .sbox.finish { background-color:#333; }
#recruit .recruit-view .date { border-bottom:1px solid #ededed; padding:30px 55px; color:#666; font-size:15px; }
#recruit .recruit-view .date strong { font-weight:700; font-size:18px; color:#111; display:inline-block; margin-right:52px; }
#recruit .recruit-view .cont { padding:35px 55px; min-height:185px; line-height:1.4; color:#555; font-size:18px; font-weight:300; border-bottom:1px solid #ededed; }
#recruit .recruit-view .prevnext > div { padding:30px 0; display:flex; align-items:center; border-bottom:1px solid #ededed; }
#recruit .recruit-view .prevnext > div strong { width:206px; padding-left:55px; font-weight:700; font-size:16px; color:#111; vertical-align:middle; display:inline-block; }
#recruit .recruit-view .prevnext > div span { width:calc(100% - 206px); overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; }
#recruit .recruit-view .prevnext > div span > a { color:#555; font-size:18px; font-weight:300; }
#recruit .recruit-view  .btn { margin-top:50px; text-align:center; }
#recruit .recruit-view  .btn a { margin:0 auto; display:flex; justify-content:center; align-items:center; font-size:18px; font-weight:500; color:#333; width:194px; height:77px; background-color:#f0f0f0; border-radius:0; }

.paging { display: flex; margin-top: 70px; }
.paging .arr { display: flex; }
.paging .arr a:not(:last-child) { margin-right: 5px; }
.paging .arr a.last,
.paging .arr a.first { letter-spacing: -10px; margin:0; }
.paging .arr a.last i,
.paging .arr a.first i {  transform: translateX(-5px); }
.paging a { font-size:17px; width: 35px; height: 35px; border: none; display: flex; justify-content: center; color: #999; }
.paging ul { margin: 0 5px;  display: flex; }
.paging ul li:not(:last-child) { margin-right: 5px; }
.paging ul li.on a { color: #fff; background: #1560ae; border:none}


.product-list *{ box-sizing: border-box; }
.product-list .search-box { position:relative; margin:0 auto; max-width:1220px; display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px 10px}
.product-list .search-box select { width:200px; height:80px; padding:0 30px; color:#111; font-size:17px; font-weight:300; border:1px solid #ededed; border-radius:0; outline:none; -webkit-appearance:none; -moz-appearance:none; appearance:none; background:url(/img/sub/icon_select_down1.png) right center no-repeat; }
.product-list .search-box select::-ms-expand { display: none; }
.product-list .search-box select.sel1 { width:200px; }
.product-list .search-box input { width:calc(100% - 640px); height:80px; color:#111; font-size:17px; font-weight:300; border:1px solid #ededed; outline:none; padding:0 100px 0 30px; }
.product-list .search-box button { position:absolute; right:0; top:0; width:80px; height:80px; overflow:hidden; text-indent:-999em; background:url(/img/sub/icon_search.png) center center no-repeat; }
.product-list .search-box ::placeholder { color:#999; opacity:1; font-weight:300; }
.product-list .dataTable { margin-top:70px; overflow:hidden; }
.product-list .dataTable table { width:calc(100% + 1px); margin-left:-1px; }
.product-list .dataTable table,
.product-list .dataTable th,
.product-list .dataTable td { border:none; }
.product-list .dataTable thead th { height:94px; background-color:#f9f9f9; color:#111; font-size:18px; font-weight:700; border-bottom:1px solid #ededed; border-left:1px solid #ededed; }
.product-list .dataTable tbody td { text-align:center; padding:22px 10px; border-bottom:1px solid #ededed; color:#111; border-left:1px solid #ededed; color:#111; font-size:16px; line-height:1.8; }
.product-list .dataTable tbody td.td-left { text-align:left; padding-left:40px; padding-right:40px; }
.product-list .dataTable tbody td.td-left a { color:#111; }
.product-list .dataTable tbody td a.btn_down { color:#fff; font-size:15px; font-weight:500; margin:0 auto; text-align:center; padding:5px 13px; background-color:#276ac2; border-radius:20px; }



.sub-contact-n .map-box { margin-top:100px; }
.sub-contact-n .map-box:nth-child(1) { margin-top:0; }
.sub-contact-n .map-box .map {width: 100%; height: 500px; }
.sub-contact-n .map-box .map iframe {width: 100%; height: 100%;} 
.sub-contact-n .map-box .info-box { margin-top:15px; display:flex; flex-wrap:wrap; align-items:center; padding:50px; background: #F9F9F9; }
.sub-contact-n .map-box .info-box h4 { width:273px; color:#111; font-size:40px; font-weight:600; line-height:1.3; }
.sub-contact-n .map-box .info-box ul { width:calc(100% - 273px); display:flex; flex-wrap:wrap; gap:20px 100px; }
.sub-contact-n .map-box .info-box ul li { display:flex; align-items:center; color:#999; font-size:18px; font-weight:400; line-height:1.3;}
.sub-contact-n .map-box .info-box ul li .icon { width:48px; height:48px; border-radius:48px; background:#fff; display:flex; align-items:center; justify-content:center; }
.sub-contact-n .map-box .info-box ul li .txt { display:flex; align-items:center; }
.sub-contact-n .map-box .info-box ul li strong { display:inline-block; margin:0 16px 0 10px; color:var(--color-blue); font-size:20px; font-weight:500; line-height:1.5; }
.sub-contact-n .map-box .info-box ul li span.stxt { display:inline-block; margin-right:6px; color:#555; font-size:18px; font-weight:400; line-height:1.5; }
.sub-contact-n .map-box .info-box ul li span.bar { display:inline-block; margin:0 16px; width:1px; height:14px; background:#ddd; vertical-align:middle; text-indent:-9999em; overflow:hidden }