@charset "utf-8";
/* *******************************************************
 * filename : content.css
 * description : 서브페이지 컨텐츠 CSS
 * date : 2020-11-25
******************************************************** */

/* ******************  서브공통 ********************** */
/* -------- 공통 스크롤바  -------- */
.custom-scrollbar-cover{display:none;}

/* -------- 공통 :: 탭 -------- */
/* Tab 공통 스타일 */
.sub-tab-wrapper-style{position:relative; height:60px; margin-bottom:15px; }
.sub-tab-list-style ul{display: flex; align-items: center; justify-content: center; width:100%; height:100%;}
.sub-tab-list-style ul:after{display:none}
.sub-tab-list-style ul li{position:relative; max-width: 180px; width:25%; background-color:#fff; border:1px solid #ddd; border-left:0 }
.sub-tab-list-style ul li:first-child{border-left:1px solid #ddd;}
.sub-tab-list-style ul li a{display:table; height:58px; width:100%; }
.sub-tab-list-style ul li a em{display:table-cell; vertical-align:middle; color:#000; font-size:15px; line-height: 1.3; letter-spacing:-0.30px; text-align:center;}
.sub-tab-list-style ul li.selected{z-index:1; }
.sub-tab-list-style ul li.selected a{background-color:#0a2143; border-color:#0a2143}
.sub-tab-list-style ul li.selected a em{color:#fff; }
/* Tab Fixed Move*/
/* .sub-tab-list-style.top-fixed{position:fixed; top:70px; left:0; width:100%; height:60px;} */
/* Mobile Tab Drop Menu */
.sub-drop-open-btn-style{display:none}

@media all and (min-width:1025px){
	/* Tab Fixed Background */
	/* .sub-tab-list-style:before{position:absolute; top:0px; bottom:0px; left:50%; width:0; content:""; background-color:#fff; border-bottom:1px solid #e5e5e5; transition:all 0.5s}
	.sub-tab-list-style.top-fixed:before{width:100%; margin-left:-50%} */
}

.br-800{display: none;}
.cm-gray-box{background-color:#ececec;}
.inner-area{position: relative; max-width:1280px; margin:0 auto; padding:0 15px;}
.co-blue{color:#0f3c7e;}
.co-blue-02{color:#183969;}
.co-green{color:#0ca3b1;}
.co-green-02{color:#327b8a;}

.cm-sub-tit{font-size:32px; line-height:1.5em; letter-spacing:-0.9px; color:#000;}
.cm-sub-tit-02{font-size:24px; line-height:1.5em; letter-spacing:-0.75px; color:#333; font-weight:600; margin-bottom:40px;}
.cm-txt{font-size:18px; line-height:1.5em; letter-spacing:-0.75px; color:#333;}
.cm-dashed{position: relative; padding-left:13px;}
.cm-dashed:before{position: absolute; content:''; width:6px; height:1px; background:#000; top:18px; left:0;}
@media all and (max-width:800px){
	.br-800{display: block;}
	.cm-sub-tit{font-size:21px;}
	.cm-sub-tit-02{font-size:17px; margin-bottom:20px;}
	.cm-txt{font-size:14px;}
	.cm-dashed:before{top:14px;}
}
/* ******************  회사소개 ********************** */
/*********** 인사말 **********/
/* 인사말 :: top-box */
.greeting-top-box{position: relative; background:no-repeat center; background-image:url('/images/content/greeting_top_bg.jpg'); background-size:cover; padding:74px 0 60px; margin-bottom:68px;}
.greeting-top-box .tit-box{margin-bottom:50px;}
.greeting-top-box .tit-box .sub-tit{font-size:26px; line-height:1.5em; color:#000; font-weight:600;}
.greeting-top-box .tit-box .tit{font-size:45px; line-height:1.5em; color:#000; letter-spacing:-1.5px;} 
.greeting-top-box .txt-box{margin-bottom:57px;}
.greeting-top-box .txt-box p{font-size:20px; font-weight:500;}
.greeting-top-box .txt-box p.txt-01{line-height:1.65; letter-spacing:-0.5px; color:#000; margin-bottom:7px;}
.greeting-top-box .txt-box p.txt-02{line-height:2; letter-spacing:-0.5px; color:#55585b; }
.greeting-top-box .ceo-txt .ceo-txt{position: relative; font-size:20px; line-height:2; letter-spacing:-0.75px; color:#000; font-weight:500; padding-left:15px;}
.greeting-top-box .ceo-txt .ceo-txt:before{position: absolute; content:''; width:4px; height:18px; top:11px; left:0; background:#000;}
.greeting-img img{max-width:100%;}

/* 인사말 :: 내용 */
.greeting-con-wrap .tit{font-size:26px; line-height:1.53em; letter-spacing:-0.75px; color:#000; font-weight:600; margin-bottom:32px;}
.greeting-con-wrap .greeting-txt{font-size:16.8px; line-height:1.96em; letter-spacing:-0.65px; color:#55585b; margin-bottom:33px;}
.greeting-con-wrap .greeting-txt:last-child{margin-bottom:0;}

/*********** 인사말(220302) **********/
.greeting-con-wrap-re{display: flex; justify-content: center; position: relative; background:no-repeat center bottom; background-image:url('/images/content/greeting_bg.png'); padding: 3rem 10rem 8rem 10rem;}
.greeting-con-wrap-re .inner-area {padding-left: 0; padding-right: 6rem; margin: 0;}
.greeeting-top-box{margin-bottom:47px;}
.greeeting-top-box .top-tit{font-size:21px; line-height:1.7em; color:#000; font-weight: 500; margin-bottom:47px;}
.greeeting-top-box .top-tit span{font-size:26px; line-height:2.5em; letter-spacing:-0.75px; color:#000;}
.greeeting-top-box .top-txt-01{font-size:37px; line-height:0.9em; color:#000; font-weight:600; margin-bottom:7px;}
.greeeting-top-box .top-txt-01_02{font-size:37px; line-height:0.9em; color:#06377a; font-weight:600; margin-bottom:7px;}
.greeeting-top-box .top-txt-02{font-size:18px; line-height:1.7em; color:#414141; font-weight:400; margin:47px 0;}
.greeeting-top-box .sub-tit{font-size:15px; line-height:1.7em; color: #55585b; font-weight:400;}
.greeting-bottom-box .bottom-txt{font-size:15px; line-height:1.7em; color:#55585b; font-weight:400; margin-bottom:33px;}
.greeting-bottom-box .ceo-txt{position: relative; font-size:20px; line-height:2em; letter-spacing:-0.75px; color:#000; font-weight:500; padding-left:15px; margin-top:53px;}
.greeting-bottom-box .ceo-txt:before{position: absolute; content:''; width:4px; height:18px; left:0px; top:11px; background:#000;}
.greeting-bottom-box span {font-size: 15px; line-height: 1.7em; font-weight: 400; color: #55585b;}
.greeting-img-box {display: flex; justify-content: flex-start;}
.greeting-img {height: auto; position: relative;}
.greeting-img img {width: 100%;}

/*********** CI **********/
.ci-sub-tit{font-size:30px; line-height:1.5em; letter-spacing:-0.25px; color:#000; font-weight:600; margin-bottom:37px;}
.co-sky{color:#83bfde;}
.co-white{color:#b4b4b4;}
.co-black{color:#000;}
/* CI :: 타이틀 */
.ci-top-tit-box{margin-bottom:72px;}
.ci-top-tit-box .tit{font-size:70px; line-height:0.92em; letter-spacing:-2.25px; color:#183969; font-weight:600; text-align:center; margin-bottom:32px;}
.ci-top-tit-box .txt{font-size:19px; line-height:1.6em; color:#010101; font-weight:500; text-align:center;}
/* CI :: 로고 */
.ci-logo-wrap{display: flex; width:100%; padding:7.03% 0; margin-bottom:110px;}
.ci-logo-list{width:47.65%; margin-right:4.7%;}
.ci-logo-list:last-child{margin-right:0;}
.ci-logo-list .logo-img{}
.ci-logo-list .logo-img span{position: relative; display: block; width:100%; height:0; padding-top:52.45%; background:#fff;}
.ci-logo-list:nth-child(2) .logo-img span{background:#000;}
.ci-logo-list .logo-img span img{position: absolute; top:0; bottom:0; left:0; right:0; margin:auto; max-width:100%; max-height:100%;}
.ci-logo-list .logo-txt{font-size:20px; line-height:2em; letter-spacing:-0.25px; color:#000; font-weight:600; text-align:center; margin-top:15px;}
/* CI :: 색상 */
.ci-color-wrap{display: flex; flex-wrap:wrap; width:100%; margin-bottom:150px; border-top:1px solid rgba(214,214,214,0.4); padding-top:50px;}
.ci-color-wrap .concept-list{display: flex; align-itmes: center; width:50%; margin-bottom:50px;}
.ci-color-wrap .concept-list:nth-child(n+3){margin-bottom:0;}
.ci-color-wrap .concept-list .concept-color{display: table-cell; width:34.37%; vertical-align:top;}
.ci-color-wrap .concept-list .concept-color span{display: block; width:100%; height:0; padding-top:70px;}
.ci-color-wrap .concept-list.list-01 .concept-color span{background:#06377a;}
.ci-color-wrap .concept-list.list-02 .concept-color span{background:#16b9ed; border:1px solid #d6d6d6; box-sizing:border-box;}
.ci-color-wrap .concept-list.list-03 .concept-color span{Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#85c2e0+0,2b609d+100
background: rgb(133,194,224); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(133,194,224,1) 0%, rgba(43,96,157,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(133,194,224,1) 0%,rgba(43,96,157,1) 100%); /* Chrome10-25,Safari5.1-6 */
 background: linear-gradient(to right,  rgba(133,194,224,1) 0%,rgba(43,96,157,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#85c2e0', endColorstr='#2b609d',GradientType=1 ); /* IE6-9 */
}
.ci-color-wrap .concept-list.list-04 .concept-color span{background:#000}
.ci-color-wrap .concept-list .concept-info{display: flex; flex-direction: column; justify-content: center; width:65.63%; padding-left:8.9%; box-sizing:border-box;}
.ci-color-wrap .concept-list .concept-info .info-cmyk{font-size:18px; line-height:1.5em; letter-spacing:-0.25px; color:#000; font-weight:600;}
.ci-color-wrap .concept-list .concept-info .txt{font-size:16px; font-weight: 500; line-height:1.4em; color:#000; padding-right:20px;}
.ci-color-wrap .concept-list .concept-info .txt span{font-weight:600;}
/* CI :: 모양 */
/* .ci-shape-warp{display: flex; width:100%; padding:8.51% 0 10%; margin-bottom:92px;}
.ci-shape-warp dl{position: relative; width:33.33%; text-align:center;}
.ci-shape-warp dl:before{position: absolute; content:''; width:1px; height:107px; background:#000; opacity:0.1; right:0; top:50%; transform:translateY(-50%);}
.ci-shape-warp dl:last-child:before{display: none;}
.ci-shape-warp dl .icon{width:130px; height:130px; background:#fff; margin:auto; -webkit-border-radius:50%;border-radius:50%; margin-bottom:56px;}
.ci-shape-warp dl .icon span{display: block; background:no-repeat center; width:100%; height:100%;}
.ci-shape-warp dl .icon.icon01 span{background-image:url('/images/content/ci_shape_01.png');}
.ci-shape-warp dl .icon.icon02 span{background-image:url('/images/content/ci_shape_02.png');}
.ci-shape-warp dl .icon.icon03 span{background-image:url('/images/content/ci_shape_03.png');}
.ci-shape-warp dl dd strong{display: block; font-size:30px; line-height:1.5em; letter-spacing:-0.75px; color:#000; margin-bottom:10px;}
.ci-shape-warp dl dd p{font-size:20px; line-height:1.5em; letter-spacing:-0.75px; color:#000; padding:0 10px;} */
/*  CI :: 4logo */
.ci-4logo-wrap {display: flex; align-items: center; justify-content: center; border: 1px solid #d6d6d6; padding: 3rem 1rem;}
.ci-4logo-wrap img {width: 100%; height: 100%;}
/* CI :: 적용 */
.company-page .area:last-child {margin-top: 110px;}
.ci-combination-wrap{display: flex; width:100%; border-top:1px solid rgba(214,214,214,0.4); padding-top:50px;}
.ci-combination-con{width:47.65%; margin-right:4.7%;}
.ci-combination-con:last-child{margin-right:0;}
.ci-combination-con > strong{display: block; font-size:22px; font-weight: 500; line-height:1.5em; letter-spacing:-0.25px; color:#000; margin-bottom:10px;}
.ci-combination-con .combination-logo{display: flex; align-items: center; justify-content: space-between; width:100%; border:1px solid #d6d6d6; box-sizing:border-box; padding:5%;}
.ci-combination-con .combination-logo span{position: relative; display: block; width:100%; height:0; padding-top:40.98%;}
.ci-combination-con .combination-logo span img{position: absolute; top:0; bottom:0; left:0; right:0; margin: auto 0; max-width:100%; max-height:100%; width: calc(100% - 10px);}
.ci-combination-con .combination-logo span:last-child img {padding-left: 10px;}

/*********** 회사개요 **********/
/* 회사개요 :: 회사 정보 */
.intro-tit-box{text-align:center; margin-bottom:84px;}
.intro-tit-box .intro-tit{font-size:48px; line-height:1.35em; letter-spacing:-0.25px; color:#333; margin-bottom:48px;}
.intro-tit-box .intro-tit span{color:#0c4167;}
.intro-tit-box .intro-txt{font-size:17px; line-height:1.64em; letter-spacing:-0.65px; color:#55585b;}
.intro-tit-box .intro-txt-02{font-size:18px; line-height:1.64em; letter-spacing:-0.65px; color:#55585b;}
.intro-info-wrap{display: table; width:100%; margin-bottom:224px;}
.intro-info-wrap .img-box{display: table-cell; vertical-align:top; width:40.67%;}
.intro-info-wrap .img-box img{max-width:100%;}
.intro-info-wrap .txt-box{display: table-cell; vertical-align:top; width:59.33%; padding:0 7.33%; box-sizing:border-box;}
.intro-table{width:100%; border-top:1px solid rgba(0,0,0,0.1)}
.intro-table tbody tr{height:54px;}
.intro-table tbody tr th, .intro-table tbody tr td{border-bottom:1px solid rgba(0,0,0,0.1); font-size:16px; line-height:1.75em; letter-spacing:-0.65px; text-align:left;}
.intro-table tbody tr th{color:#000}
.intro-table tbody tr td{color:#55585b; font-weight:500; word-break:keep-all;}
.intro-table tbody tr td a{font-size:16px; line-height:1.75em; letter-spacing:-0.65px; color:#55585b; font-weight:500;}
/* 회사개요 :: 기술 */
.intro-provide-wrap .intro-tit-box{margin-bottom:120px;}
.intro-provide-wrap .intro-tit-box .intro-tit{margin-bottom:25px;}
.provide-list-wrap{display: flex; justify-content: center;}
.provide-list-wrap li{position: relative; width:16.87%; height:0; padding-top:16.87%; margin:0 -13px;}
.provide-list-wrap li:before{position: absolute; content:''; width:100%; padding-top:100%;; -webkit-border-radius:50%;border-radius:50%; z-index:-1; opacity:0.8; top:0; left:0;}
.provide-list-wrap li:nth-child(1):before{background:#6588cd;}
.provide-list-wrap li:nth-child(2):before{background:#5e81c7;}
.provide-list-wrap li:nth-child(3):before{background:#436dc1;}
.provide-list-wrap li:nth-child(4):before{background:#43aec1;}
.provide-list-wrap li:nth-child(5):before{background:#5ebbaf;}
.provide-list-wrap li:nth-child(6):before{background:#43c1b1;}
.provide-list-wrap li dl{position: absolute; top:50%; left:50%; transform:translate(-50%, -50%); text-align:center; width:100%;}
.provide-list-wrap li dl dt{margin-bottom:25px;}
.provide-list-wrap li dl dd{font-size:17px; line-height:1.64em; letter-spacing:-0.75px; color:#fff; font-weight:500;}


/*********** 회사연혁 **********/
.history-page .inner-area{padding:0 5.2%;}
.history-top-con{background:no-repeat center; background-image:url('/images/content/history_top_bg.jpg'); padding:8.61% 0 10.78%; background-size:cover;}
.history-top-con .tit{font-size:60px; line-height:1.16em; letter-spacing:-0.25px; color:#fff; }
.history-page .sub-tab-con{padding-top:90px; margin-bottom:155px;}
.history-page .sub-tab-con:last-child{margin-bottom:0px;}
.history-page .sub-tab-con .history-list-box-style02 .history-year-box .history-year-item:last-child:before{bottom:-250px;}
.history-page .sub-tab-con:last-child .history-list-box-style02 .history-year-box .history-year-item:last-child:before{display: none;}
.history-page .sub-tab-list-style.top-fixed{position: relative; top:auto;}
.history-page .sub-tab-list-style:before{display: none;}
.history-page .sub-tab-list-style ul li{border:0; background:rgba(10,33,67,0.8); max-width:none;}
.history-page .sub-tab-list-style ul li a em{color:#fff; font-size:18px; font-weight:600;}
/* .history-page .sub-tab-list-style ul li.selected a{background:#fff;} */
/* .history-page .sub-tab-list-style ul li.selected a em{color:#1b355a;} */

/*********** 계열사 **********/
/* 계열사 :: 글로벌 지도 */
.partner-map-wrap{position: relative; background:no-repeat; background-size:cover; width:100%; padding-top:37.28%; height:0; overflow:hidden; margin-bottom:55px;}
.partner-map-wrap .partner-inner-area{position: relative; max-width:1280px; margin:auto;}
.partner-map-txt-box{display: table; position: absolute; width:100%; bottom:54px; z-index:1;}
.partner-map-txt-box .left-txt-box{/* float:left; */ display: table-cell; }
.partner-map-txt-box .left-txt-box .txt-en{display: block; font-size:18px; line-height:1.5em; letter-spacing:-0.25px; font-weight:600; color:#000; margin-bottom:15px;}
.partner-map-txt-box .left-txt-box .tit{font-size:36px; line-height:1.5em; letter-spacing:-1px; font-weight:600; color:#000;}
.partner-map-txt-box .right-txt-box{/* float:right; */ display: table-cell;  vertical-align:bottom; text-align:right;}
.partner-map-txt-box .right-txt-box .company-type{position: relative; font-size:16px; line-height:1.5em; letter-spacing:-1px; font-weight:600; padding-left:40px;}
.partner-map-txt-box .right-txt-box .company-type:before{position: absolute; content:''; width:10px; height:10px; -webkit-border-radius:50%;border-radius:50%; left:23px; top:7px; background:#000;}
.partner-map-txt-box .right-txt-box .company-type:nth-child(1){color:#0c4167;}
.partner-map-txt-box .right-txt-box .company-type:nth-child(1):before{background:#0c4167;}
.partner-map-txt-box .right-txt-box .company-type:nth-child(2){color:#5d7281}
.partner-map-txt-box .right-txt-box .company-type:nth-child(2):before{background:#5d7281;}
.partner-map-txt-box .right-txt-box .company-type:nth-child(3){color:#c7a13b}
.partner-map-txt-box .right-txt-box .company-type:nth-child(3):before{background:#c7a13b;}

.global-nation-box{position:absolute; top:0px; left:0px; width:100%; height:100%; }
@keyframes nation-circle {
  0% {
	-webkit-transform: scale(0);
	transform: scale(0);
	opacity: 0.5; 
   }
  50% {
	opacity: 1.0; 
   }
  100% {
	-webkit-transform: scale(1);
			transform: scale(1);
	opacity: 0; } 
}
.nation-circle{position:absolute; left:19.11%; top:12%; display:inline-block; width:26.04%; padding-top:26.04%;}
.nation-circle > span:nth-child(2) {
	-webkit-animation-delay: 1s;
	animation-delay: 1s; 
}
.nation-circle > span:nth-child(3) {
	-webkit-animation-delay: 2s;
		animation-delay: 2s;
}
.nation-circle > span:nth-child(4) {
	-webkit-animation-delay: 3s;
		animation-delay:3s;
}
.nation-circle > span:nth-child(5) {
	-webkit-animation-delay: 4s;
		animation-delay:4s;
}
.nation-circle > span {
	background:rgba(12,65,103,0.03);
	border-radius: 50%;
	-webkit-animation-fill-mode: both;
			animation-fill-mode: both;
	position: absolute;
	left: 0;
	top: 0px;
	opacity: 0;
	margin: 0;
	width: 100%;
	height: 100%;
	-webkit-animation: nation-circle 5s cubic-bezier(0.22, 0.61, 0.36, 0.5) infinite;
	animation: nation-circle 5s cubic-bezier(1, 2, 0.66, 3) infinite; 
	}

.global-circle{position: absolute; width:5%; height:0; padding-top:5%;  top:38%; right:16.7%; }
.global-circle > span{
	position: absolute; top:0; left:0; margin:0; width:100%; height:100%; border:3px solid #c7a13b; box-sizing:border-box; -webkit-border-radius:50%;border-radius:50%; opacity:0;
	-webkit-animation: global-circle 1.5s  infinite;
	animation: global-circle 1.5s  infinite; 
}
@keyframes global-circle {
  0% {
	opacity: 0; 
	}
  50% {
	opacity: 1;
	}
  100% {
	opacity: 0;
	}
}


/* 계열사 :: 리스트 */
.partner-list-wrap{display: flex; flex-wrap:wrap; width:100%;}
.partner-list-con{display: block; width:47.96%; margin-right:4.08%; margin-bottom:4.08%; border:1px solid #eee; border-radius:15px; box-sizing:border-box; overflow:hidden;}
.partner-list-con:nth-child(even){margin-right:0;}
.partner-list-con .logo-box{display: block; position: relative; width:100%; background:#f9f9f9; vertical-align:middle; padding:5%; box-sizing:border-box;}
.partner-list-con .logo-box span{position: relative; display: block; width:100%; height:0; padding-top:25.27%;}
.partner-list-con .logo-box span img{position: absolute; top:0; bottom:0; left:0; right:0; margin:auto; max-width:100%; max-height:100%;}
.partner-list-con .info-box{display: block; width:100%; vertical-align:middle; padding:8.16% 8%; box-sizing:border-box;}
.partner-list-con .info-box .tit{font-size:30px; line-height:1.3em; letter-spacing:-0.75px; color:#000; margin-bottom:28px;}
.partner-list-con .info-box .info-type{position: relative; font-size:16px; line-height:1.5em; letter-spacing:-0.75px;}
.partner-list-con .info-box .info-type dt{color:#000; font-weight:600;}
.partner-list-con .info-box .info-type dd{color:#666;}
.partner-list-con .info-box .info-type.type-01{margin-bottom:20px;}
.partner-list-con .info-box .info-type.type-01 dt{margin-bottom:10px;}
.partner-list-con .info-box .info-type.type-02{margin-bottom:10px;}
.partner-list-con .info-box .info-type.type-02:last-child{margin-bottom:0;}
.partner-list-con .info-box .info-type.type-02 dt{position: absolute; }
.partner-list-con .info-box .info-type.type-02 dd{padding-left:42.8%;}


/*********** 매출 포트폴리오 **********/
.portfolio-top-con{background:no-repeat center; background-image:url('/images/content/portfolio_top_bg.jpg'); background-size:cover; padding:9.64% 0; margin-bottom:70px;}
.portfolio-top-con .tit{font-size:60px; line-height:1.16em; letter-spacing:-0.25px; color:#fff;}

.portfolio-customer-wrap .customer-tit{font-size:30px; line-height:1.5em; letter-spacing:-0.75px; color:#333; text-align:center; margin-bottom:52px;}
.portfolio-customer-wrap .customer-list{display: flex; flex-wrap:wrap; border-top:1px solid #ddd; border-left:1px solid #ddd; box-sizing:border-box;}
.portfolio-customer-wrap .customer-list li{position: relative; width:16.66%; border-bottom:1px solid #ddd; border-right:1px solid #ddd; box-sizing:border-box; padding:15px;}
.portfolio-customer-wrap .customer-list li span{position: relative; display: block; width:100%; height:0; padding-top:39.87%;}
.portfolio-customer-wrap .customer-list li span img{position: absolute; top:0; bottom:0; left:0; right:0; margin:auto; max-width:100%; max-height:100%;}

/* 매출 포트폴리오 */
.portfolio-graph-con{margin: 0 -2.1% 150px; display: flex; flex-wrap:warp;}
.portfolio-graph-item{padding: 70px 4.4%; width: 45.8%; margin: 0 2.1%; background-color: #f2f2f2; text-align: center; -webkit-box-sizing: border-box; box-sizing: border-box;}
.portfolio-graph-tit{font-size: 30px; line-height: 1.3; font-weight: 700; letter-spacing: -0.75px; color: #000;}
/* 그래프 영역 */
.portfolio-graph-wrap{position: relative; width: 335px; height: 335px; margin: 55px auto 45px;}
.portfolio-graph-box{position: absolute; top: 0; left: 0; width: 335px; height: 335px;}
.portfolio-graph-box svg{width: 100%; height: 100%;/* -webkit-box-shadow: 0 0 24px -12px rgba(0,0,0,0.19); box-shadow: 0 0 24px -12px rgba(0,0,0,0.19); -webkit-border-radius: 100%; border-radius: 100%; */}
.portfolio-graph-box .cls-1 {fill: #ccc;}
.portfolio-graph-box .cls-2, .portfolio-graph-box .cls-3, .portfolio-graph-box .cls-4,
.portfolio-graph-box .cls-6, .portfolio-graph-box .cls-7, .portfolio-graph-box .cls-8, .portfolio-graph-box .cls-9{fill: none; stroke-linecap: round; stroke-width: 34px;}
.portfolio-graph-box .cls-2 {stroke: #951fb7;}
.portfolio-graph-box .cls-3 {stroke: #20bd96;}
.portfolio-graph-box .cls-4 {stroke: #164691;}
/* 중앙 하얀원 */
.portfolio-graph-box .cls-5 {fill: #fff;}
/* svgIcon */
.portfolio-graph-box svg{transform: rotate(90deg) scaleX(-1);}
.portfolio-graph-box svg .circle-result {stroke-dashoffset:948.271; transition: 1s stroke-dashoffset;}
/* 중앙 텍스트 */
.portfolio-graph-txt{position: absolute; top: 50%; left: 50%; margin-left: -135px; margin-top: -135px; width: 270px; height: 270px; -webkit-border-radius: 100%; border-radius: 100%; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.portfolio-graph-txt h5{font-size: 40px; font-weight: 700; color: #000;}
.portfolio-graph-txt h5 span{margin-bottom: 15px; font-size: 18px; letter-spacing: -0.75px; font-weight: 400; display: block;}
.portfolio-graph-txt p{margin-top: 15px; font-size: 16px; line-height: 1.3; letter-spacing: -0.75px; font-weight: 500; color: #333;}
/* 하단 인포 */
.portfolio-graph-info{}
.portfolio-graph-info h5{font-size: 30px; line-height: 1.3; font-weight: 700; letter-spacing: -0.75px; color: #333; text-align: left;}
.portfolio-graph-info-inner{margin-top: 35px;}
.portfolio-graph-info-inner li{display: flex; align-items: center;}
.portfolio-graph-info-inner li + li{margin-top: 15px;}
.portfolio-graph-info-inner li .tit{width: 110px; font-size: 15px; line-height:23px; font-weight: 500; letter-spacing: -0.25px; color: #333; text-align: left;}
.portfolio-graph-info-inner li .graph{width: calc(100% - 160px); height: 10px; position: relative; background-color: #fff; -webkit-border-radius: 10px; border-radius: 10px;}
.portfolio-graph-info-inner li .graph span{position: absolute; top: 0; left: 0; width: 0; height: 10px; background-color: #164690; -webkit-border-radius: 10px; border-radius: 10px; -webkit-transition: width 0.5s; transition: width 0.5s;}
.portfolio-graph-info-inner li:nth-child(2) .graph span{background-color: #9620b9;}
.portfolio-graph-item:first-child .portfolio-graph-info-inner li:nth-child(2) .graph span,
.portfolio-graph-info-inner li:nth-child(3) .graph span{background-color: #1fb892;}
.portfolio-graph-info-inner li .result{width: 50px; font-size: 18px; font-weight: 500; letter-spacing: -0.75px; color: #333; text-align: right; font-weight:600;}

/*********** 찾아오시는길 **********/
.location-con-wrap:nth-child(2) {margin-top: 10rem;}
.location-info-box{display: table; width:100%; margin-top:90px;}
.location-info-box .img-box{display: table-cell; width:43.52%; vertical-align:middle; text-align: center; background-color: #fff;}
.location-info-box .info-img-box{background-color: rgba(245, 245, 245, 0.6);}
.location-info-box .img-box img{max-width:100%;}
.location-info-box .txt-box{display: table-cell; width:56.48%; vertical-align:bottom; padding-left:4.29%;}
.location-info-box .txt-box .tit{font-size:40px; line-height:1.5em; letter-spacing:-0.65px; color:#000; margin-bottom:50px;}
.location-table{width:100%; border-top:1px solid rgba(0,0,0,0.1);}
.location-table tbody tr{height:53px;}
.location-table tbody tr th, .location-table tbody tr td{font-size:16px; line-height:1.75em; letter-spacing:-0.65px; border-bottom:1px solid rgba(0,0,0,0.1); padding:10px 0;}
.location-table tbody tr th{font-weight:600; color:#000; text-align:left;}
.location-table tbody tr td{font-weight:500; color:#55585b; word-break:keep-all;}
.location-table tbody tr td .txt span{display: inline-block; margin-right:25px;}
.location-table tbody tr td .txt span:last-child{margin-right:0px;}

.location-map-box{margin-top:50px;}
.location-map-con{position: relative;width:100%; height:0; padding-top:29.29%; border:1px solid #ddd;}
.location-map-con iframe{position: absolute; top:0; bottom:0; right:0; left:0; margin:auto; width:100%; height:100%; border:none;}


/* ******************  BUSINESS ********************** */
/*********** 라인업 **********/
.line-up-tit{font-size:30px; line-height:1.5em; letter-spacing:-0.25px; color:#000;}
.line-up-top-con{position: relative; background:#f2f2f2; padding:7.98% 13.2%;}
.line-up-top-con .line-con-txt{width:50%;}
.line-up-top-con .line-con-txt > p{position: relative; padding-left:210px; letter-spacing:-2.9px; margin-bottom:9px;}
.line-up-top-con .line-con-txt > p:before{position: absolute; content:''; width:4px; height:30px; background:#0c4167; top:8px; left:185px;}
.line-up-top-con .line-con-txt > p b{display: block; position: absolute; left:0; color:#0c4167}
.line-up-top-con .line-con-txt > p:last-child{margin-bottom:0;}
.line-up-top-con .line-con-img{position: absolute; top:50%; right:15%; -webkit-transform:translateY(-50%);transform:translateY(-50%); width:31.3%;}
.line-up-top-con .line-con-img span{}
.line-up-top-con .line-con-img span img{max-width:100%; box-shadow: 0px 0px 54px 0px rgba(0, 0, 0, 0.23); border-radius:50%;}

/* 라인업 페이지 수정 css */
.line-up-page .line-up-top-area{padding: 0 2.6%;}
.line-up-page .line-up-top-con{width: auto; margin: 0; padding: 0; text-align: left; padding: 110px 0;}
.line-up-page .line-up-top-con .line-con-txt{width: calc(100% - 585px);}
.line-up-page .line-up-top-con .area{position: relative;}
/* 왼쪽 :: 타이틀 영역 */
.line-up-page .line-up-top-con .line-con-txt > p{padding-left: 220px;}
.line-up-page .line-up-top-con .line-con-txt > p:before{width:4px; height:26px; top:10px; left:185px;}
/* 오른쪽 :: 그래프 영역 */
.line-up-page .line-up-graph{position: absolute; top: 50%; margin-top: -200px; right: 0; width: 555px; height: 400px;}
.line-up-page .portfolio-graph-wrap{width: 400px; height: 400px; margin: 0 auto;}
.line-up-page .portfolio-graph-box{width: 400px; height: 400px;}
.line-up-page .portfolio-graph-box .cls-6 {stroke: #164690;}
.line-up-page .portfolio-graph-box .cls-7 {stroke: #951fb7;}
.line-up-page .portfolio-graph-box .cls-8 {stroke: #20bd96;}
.line-up-page .portfolio-graph-box .cls-9 {stroke: #333;}
.line-up-page .portfolio-graph-info-inner li:nth-child(1) .graph span{background-color: #164690 !important;}
.line-up-page .portfolio-graph-info-inner li:nth-child(2) .graph span{background-color: #951fb7 !important;}
.line-up-page .portfolio-graph-info-inner li:nth-child(3) .graph span{background-color: #20bd96 !important;}
.line-up-page .portfolio-graph-info-inner li:nth-child(4) .graph span{background-color: #333 !important;}
/* 오른쪽 :: 텍스트 영역 */
.line-up-page .portfolio-graph-txt img{max-width: 90%; display: inline-block; margin-bottom: 20px;}
.line-up-page .portfolio-graph-txt h5 span{margin-bottom: 10px; font-size: 20px; letter-spacing: -1px; font-weight: 600;}
.line-up-page .portfolio-graph-txt p{margin-top: 0; font-size: 15px; letter-spacing: -1px; font-weight: 400; color: #adadad;}
/* 왼쪽 :: 막대그래프 영역 */
.line-up-page .portfolio-graph-info{max-width: 510px;}
.line-up-page .portfolio-graph-info-inner {margin-top: 65px;}
.line-up-page .portfolio-graph-info-inner li + li {margin-top: 20px;}
.line-up-page .portfolio-graph-info-inner li .tit{width: 120px;}
.line-up-page .portfolio-graph-info-inner li .graph {width: calc(100% - 170px);}
/* 다음 컨텐츠 */
.line-up-page .line-up-mid-con {margin-top: 140px;}
/* // */

.line-up-mid-con{margin-top:230px;}
.line-list-wrap{display: flex; flex-wrap:wrap; width:100%;}
.line-list-wrap li{width:47.57%; margin-bottom:63px;}
.line-list-wrap li:nth-child(odd){margin-right:4.86%;}
.line-list-wrap li:nth-child(n+3){margin-bottom:0;}
.line-list-wrap li .list-txt{position: relative; margin-bottom:13px;}
.line-list-wrap li .list-txt .line-up-tit{}
.line-list-wrap li .list-txt a{position: absolute; display: block; top:50%; right:0; -webkit-transform:translateY(-50%);transform:translateY(-50%); font-size:12px; line-height:1.5em; letter-spacing:-0.25px; color:#000; font-weight:600;}
.line-list-wrap li .list-txt a:before{position: absolute; content:''; width:20px; height:1px; background-color:#393939; opacity:0.2; top:50%; right:73px; transform:translateY(-50%); transition:width 0.2s;}
.line-list-wrap li .list-txt a:hover:before{width:30px}
.line-list-wrap li .list-img{background:#f2f2f2; padding:6.08%; text-align:center;}
.line-list-wrap li .list-img img{max-width:100%;}


/*********** 라인업 :: 리스트 **********/
.line-up-list-con{display: table; width:100%; padding:57px 4.29% 70px; box-sizing:border-box; border-bottom:1px solid rgba(0,0,0,0.1);}
.line-up-list-con:first-child{border-top:1px solid #000; padding-top:47px;}
.line-up-list-con .img-box{position: relative; display: table-cell; vertical-align:middle; width:37.87%; box-sizing:border-box;}
.line-up-list-con .img-box.co-black{background:#000;}
.line-up-list-con .img-box.co-gray{background-color:#636469;}
.line-up-list-con .img-box.co-lightgray{background-color:#c9c7cc;}
.line-up-list-con .img-box span:before{position: absolute; content:''; width:100%; height:100%; top:10px; left:10px; background:#3366cc; z-index:-1;}
.line-up-list-con .img-box span{position: relative; display: block; width:calc(100% - 10px); height:0; padding-top:63.21%;}
.line-up-list-con .img-box span img{position: absolute; top:0; bottom:0; left:0; right:0; margin:auto; /* max-width:100%; max-height:100%; */ width:100%;}
.line-up-list-con .txt-box{display: table-cell; vertical-align:middle; width:62.14%; padding-left:9.65%; box-sizing:border-box;}
.line-up-list-con .txt-box .tit{font-size:35px; line-height:1.5em; letter-spacing:-0.25px; color:#173e78;}
.line-up-list-con .txt-box .sub-info{display: table; margin:22px 0 18px;}
.line-up-list-con .txt-box .sub-info dt{position: relative; display: table-cell; vertical-align:middle; left:0; font-size:20px; line-height:1.83em; letter-spacing:-0.5px; color:#000; font-weight:bold;}
/* .line-up-list-con .txt-box .sub-info dt:before{position: absolute; content:''; width:2px; height:13px; background:#000; right:-18px; top:11px;} */
.line-up-list-con .txt-box .sub-info dd{display: table-cell; vertical-align:middle; padding-left:30px; font-size:18px; line-height:1.83em; letter-spacing:-0.5px; color:#000;}
.line-up-list-con .txt-box .txt{font-size:15px; line-height:1.5em; letter-spacing:-1px; color:#55585b;}

/*********** Competencies :: R&D현황 **********/
/* R&D Center 운영 */
.rnd-page .cm-hr-tit-box .hr-bg{width:100%; font-size:235px;}

.rnd-page .cm-sub-tit{margin-bottom:40px;}
.rnd-page .cm-sub-tit-02{margin-bottom:30px;}

.rnd-page #fixedContentM1{padding-top:40px;}
.rnd-con-01-wrap .portfolio-graph-item{position: relative; display: table; table-layout:fixed; width:100%; margin:0 0 50px;}
.rnd-con-01-wrap .portfolio-graph-item:before{position: absolute; content:''; width:11.56%; height:100%;top:0; left:13.12%; background:#fff}
.rnd-con-01-wrap .portfolio-graph-item:nth-child(even):before{left:70.31%;}
.rnd-con-01-wrap .portfolio-graph-item .img-box{position: relative; display: table-cell; vertical-align:middle; width:50%; height:auto;}
.rnd-con-01-wrap .portfolio-graph-item .img-box span{position: relative; display: block; width:85.5%; padding-top:47.98%;}
.rnd-con-01-wrap .portfolio-graph-item .img-box span img{position: absolute; top:0; bottom:0; left:0; right:0; margin:auto; max-width:100%; max-height:100%;}
.rnd-con-01-wrap .portfolio-graph-item .img-box span .inner-txt{position: absolute;font-size:16px; line-height:1.5em; letter-spacing:-0.25px; color:#fff; bottom:15px; left:15px;}
.rnd-con-01-wrap .portfolio-graph-item .portfolio-graph-info{display: table-cell; vertical-align:middle; width:50%;}

.rnd-con-01-item .portfolio-graph-info{padding:0 4.28% 0 2.5%;}
.portfolio-graph-info-inner li .tit.rnd-tit{width:60px;}
.portfolio-graph-info-inner li .result.rnd-result{width:70px;}


.rnd-con-01-wrap .portfolio-graph-item .portfolio-graph-info-inner li .graph.graph-dashed:before{width:100%; transition:width 0.3s; animation-direction: reverse;}
.rnd-con-01-wrap .portfolio-graph-item.effect-end .portfolio-graph-info-inner li .graph.graph-dashed:before{width:0%;}
.portfolio-graph-info-inner li .graph.graph-dashed{position: relative; background:#f2f2f2;}
.portfolio-graph-info-inner li .graph.graph-dashed:before{position: absolute; content:''; width:100%; height:10px; background:#f2f2f2; top:0; right:0; z-index:1;}
.portfolio-graph-info-inner li .graph.graph-dashed .plus-graph{position: absolute; width:100%; height:10px; top:-2px;}
.portfolio-graph-info-inner li .graph.graph-dashed span{background:#f2f2f2;}
.portfolio-graph-info-inner li .graph.graph-dashed span img{width:100%; height:9px;}
/* 지적재산권 현황 */
.rnd-page #fixedContentM2, .rnd-page #fixedContentM3{ padding-top:40px; margin-top:80px;}
.rnd-con-02-wrap{display: flex; flex-wrap:wrap; border-top:1px solid #000;}
.rnd-con-02-item{display: table; width:50%; border-bottom:1px solid rgba(0,0,0,0.1); padding:35px 3.9% 35px 0; box-sizing:border-box;}
.rnd-con-02-item .tit-box{display: table-cell; vertical-align:middle; width:120px;}
.rnd-con-02-item .tit-box h4{margin-bottom:0;}
.rnd-con-02-item .num-counter-box{display: table-cell; vertical-align:middle; width:calc(100% - 120px);}
.rnd-con-02-item .num-counter-box .inner-con{display: flex; justify-content: flex-end;}
.rnd-con-02-item .num-counter-box dl{float:left; position: relative; width:134px; height:134px; background:rgba(0,0,0,0.05); -webkit-border-radius:50%;border-radius:50%; text-align:center; padding:30px 0; box-sizing:border-box; margin-right:20px;}
.rnd-con-02-item .num-counter-box dl:before{position: absolute; content:''; top:6px; right:6px; width:134px; height:134px; background:rgba(0,0,0,0.05); -webkit-border-radius:50%;border-radius:50%; z-index:-1;}
.rnd-con-02-item .num-counter-box dl dt span{font-size:16px; line-height:1.5em; letter-spacing:-0.75px; color:#000; font-weight:500;}
.rnd-con-02-item .num-counter-box dl dd .num{display: block; font-size:60px; line-height:0.66em; letter-spacing:-0.75px; color:#164a96; font-weight:600; margin-top:3px;}

.rnd-con-02-item .num-counter-box dl:nth-child(2){background:#164a96;}
.rnd-con-02-item .num-counter-box dl:nth-child(2):before{background:#164a96; opacity:0.1;}
.rnd-con-02-item .num-counter-box dl:nth-child(2) dt span, .rnd-con-02-item .num-counter-box dl:nth-child(2) dd .num{color:#fff;}

.rnd-page .certifi-list-style05 .certificate-list > ul li{margin-bottom:0;}


/*********** Competencies :: 소재개발기술 **********/
.competencies-page .cm-sub-tit{margin-bottom:30px;}
.competencies-page .careers-hr-con{margin-bottom:15em;}
.competencies-page .sub-tab-con{margin-top:6em; padding-top:3em;}
/* 소재개발기술 :: 합성쿼츠의 우수성 */
.material-table{width:100%; }
.material-table thead tr th, .material-table tbody tr th, .material-table tbody tr td{font-size:15px; line-height:1.5em; letter-spacing:-0.5px; padding:19px 5px; text-align:center;}
.material-table thead tr th{color:#fff; font-weight:600;}
.material-table thead tr th:nth-child(1){background:#333;}
.material-table thead tr th:nth-child(2){background:#1f3f6d;}
.material-table thead tr th:nth-child(3){background:#1f6a67;}
.material-table tbody tr th, .material-table tbody tr td{color:#333; font-weight:400; border-bottom:1px solid rgba(0,0,0,0.1); border-right:1px solid rgba(0,0,0,0.1); box-sizing:bordr-box;}
.material-table tbody tr th{background:#f2f2f2;}
.material-table tbody tr:nth-child(odd) td{background:rgba(230,233,238,0.7);}
.material-table tbody tr:nth-child(odd) td:last-child{background:rgba(238,246,246,0.7);}
.material-table tbody tr td:last-child{border-right:none;}

.material-arrow-con{position: relative; width:100%; margin:9em 0 8.5em;}
.material-arrow-con:before{position: absolute; content:''; width:120px; height:85px; background:no-repeat center; background-image:url('/images/icon/material_arrow_img.png'); top:0%; left:50%; transform:translate(-50%, -50%); animation: arrowUpDown 1.8s ease-in-out infinite;}
@keyframes arrowUpDown {
	0% {
		top:0%; opacity:0;
	}
	50% {
		opacity:1;
	}
	100% {
		top:110%; opacity:0
	}
}


.material-arrow-con .arrow-txt{font-size:24px; line-height:1.33em; letter-spacing:-0.5px; color:#333; text-align:center; font-weight:bold;}

.material-benefit-con{display: flex; width:100%; border:1px solid #ddd; border-radius:5px; box-sizing:border-box; padding:7.03% 9.375%;}
.benefit-item{width:33.33%; text-align:center; padding:0 20px; box-sizing:border-box;}
.benefit-item img{max-width:100%;}
.benefit-item .txt{font-size:20px; line-height:1.5em; letter-spacing:-0.9px; color:#000; font-weight:600; margin-top:22px;}

/* 소재개발기술 :: 마이크로 버블 발생 여부 */
.material-micro-con{background:#000002; padding:25px 40px;}
.material-micro-con span{display: block; width:80%; margin:auto; padding:50px 0; text-align:center;}
.material-micro-con span img{max-width:100%;}
.material-plus-txt{font-size:16px; line-height:1.5em; letter-spacing:-0.75px; color:#4d4d4e; opacity:0.3; text-align:right; margin-top:27px;}
.material-micro-con .material-plus-txt{color:#fff; margin-top:0px;}

/* 소재개발기술 :: 버블 영향성 Test */
.material-bubble-con{display: flex; justify-content: space-between; width:100%;}
.bubble-item{width:47.65%; border:1px solid #ddd;}
.bubble-item .img-box{background:#787679}
.bubble-item:last-child .img-box{background:#79777a;}
.bubble-item .img-box span{position: relative; display: block; width:100%; height:0; padding-top:65.57%;}
.bubble-item .img-box span img{position: absolute; top:0; bottom:0; left:0; right:0; max-width:100%; max-height:100%; margin:auto;}
.bubble-item .txt-box{position: relative; padding:33px 6.55%;}
.bubble-item .txt-box strong{font-size:30px; line-height:1.33em; letter-spacing:-0.25px; color:#164a96;}
.bubble-item:last-child .txt-box strong{color:#000}
.bubble-item .txt-box span{position: absolute; display: block; padding-left:168px; padding-right:40px; font-size:16px; line-height:1.33em; letter-spacing:-0.75px; color:#999; top:50%; transform:translateY(-50%);}


/*********** Competencies :: 제조기술 **********/
/* 양산history :: 테이블 */
.cm-sub-tit.technology-tit{border-bottom:1px solid rgba(0,0,0,0.1); padding-bottom:28px; margin-bottom:53px;}
.reference-table{width:100%; margin-top:50px;}
.reference-table tbody tr td{padding:18px 0;}
.reference-table-con01 td{position: relative; border-right:2px solid #fff; /* border-left:1px solid #fff; */}
.reference-table-con01 td:first-child:before{position: absolute; content:''; width:calc(78% - 10px); height:1px; border-top:1px dashed #666; opacity:0.3; left:22%;}
.reference-table-con01 td:first-child:after{position: absolute; content:'\e93f'; font-family:'xeicon'; font-size:30px; color:#666; opacity:0.3; right:-5px; top:50%; -webkit-transform:translateY(-50%);transform:translateY(-50%);}
.reference-table-con01 .txt{position: absolute; font-size:14px; line-height:1.1em; letter-spacing:-0.75px; color:#fff; background:#666; padding:7px 15px; border-radius:15px; top:50%; -webkit-transform:translateY(-50%);transform:translateY(-50%);}
.reference-table-con01 .txt:first-child{left:14%;}
.reference-table-con01 .txt:last-child{left:58%;}
.reference-table-con01 .txt-02{font-size:16px; line-height:1.375em; letter-spacing:-0.25px; color:#1b355a; font-weight:800;}

.reference-table-con02 td{position: relative;  border-right:2px solid #fff;  /* border-left:1px solid #fff; */}
.reference-table-con02 td:before{position: absolute; content:''; width:10px; height:10px; -webkit-border-radius:50%;border-radius:50%; bottom:-7px; left:-5px;}
.reference-table-con02 td.circle-blue:before{background:#1b355a;}
.reference-table-con02 td.circle-green:before{background:#34b988;}
.reference-table-con02 .num{text-align:left; font-size:24px; line-height:1.5em; letter-spacing:-0.75px; color:#333; font-weight:600;}

.reference-table-con03 td{border-top:3px solid; text-align:center;}
.reference-table-con03 td span{font-size:16px; line-height:1.5em; letter-spacing:-0.75px;}
.reference-table-con03 td.bg-blue{border-color:#1b355a; background:rgba(27,53,90,0.1); color:#1b355a; border-left:2px dotted rgba(27,53,90,0.3); border-right:2px dotted rgba(27,53,90,0.3); box-sizing:border-box;}
.reference-table-con03 td.bg-green{border-color:#34b988; background:rgba(52,185,136,0.1); color:#34b988; border-right:2px dotted rgba(52,185,136,0.3); box-sizing:border-box;}
.reference-table-con03 td.bg-green:last-child{position: relative;}
.reference-table-con03 td.bg-green:last-child:before{position: absolute; content:''; width:2px; height:10px; background-color:#34b988; top:-3px; right:1.2px; transform:rotate(45deg);}
.reference-table-con03 td.bg-green:last-child:after{position: absolute; content:''; width:2px; height:10px; background-color:#34b988; top:-10px; right:1.2px; transform:rotate(-45deg);}
 
.reference-table-con04 td{ border-right:2px solid #fff;  /* border-left:1px solid #fff; */}
.reference-table-con04 td .txt{font-size:14px; line-height:1.57em; letter-spacing:-0.75px; color:#333; height:45px; margin-top:19px; padding-right:10px;}

/* 양산history :: arrow */
.reference-arrow{position: relative; margin:80px 0 60px;}
.reference-arrow p{position: absolute; display: table; width:84px; height:84px; top:50%; left:50%; transform:translate(-50%, -50%);}
/* .reference-arrow p:before{position: absolute; content:''; width:106px; height:106px; top:50%; left:50%; -webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%); background:rgba(22,74,150,0.1); -webkit-border-radius:50%;border-radius:50%;} */
.reference-arrow p i{display: table-cell; vertical-align:middle; font-size:30px; line-height:1.33em; letter-spacing:-0.75px; color:#333; margin:auto; text-align:center; }

.reference-arrow-circle{position: relative; width:84px; height:84px; margin:auto;}
.reference-arrow-circle > span{position: absolute; width:84px; height:0; padding-top:84px; top:0; left:0; background:#164a96}

@keyframes reference-arrow-circle {
  0% {
	-webkit-transform: scale(0);
	transform: scale(0);
	opacity: 0.5; 
   }
  50% {
	opacity: 1.0; 
   }
  100% {
	-webkit-transform: scale(1);
			transform: scale(1);
	opacity: 0; } 
}

.reference-arrow-circle > span:nth-child(2) {
	-webkit-animation-delay: 0.8s;
	animation-delay: 0.8s; 
}
.reference-arrow-circle > span:nth-child(3) {
	-webkit-animation-delay: 1.6s;
		animation-delay: 1.6s;
}
.reference-arrow-circle > span:nth-child(4) {
	-webkit-animation-delay: 2.4s;
		animation-delay: 2.4s;
}
.reference-arrow-circle > span {
	background:rgba(22,74,150,0.1);
	border-radius: 50%;
	-webkit-animation-fill-mode: both;
			animation-fill-mode: both;
	opacity: 0;
	margin: 0;
	-webkit-animation: reference-arrow-circle 3.2s cubic-bezier(0.22, 0.61, 0.36, 0.5) infinite;
	animation: reference-arrow-circle 3.2s cubic-bezier(1, 2, 0.66, 1.5) infinite; 
	}

/* 양산history :: Needs */
.needs-con-wrap{display: flex; width:100%; border:1px solid #cfcfcf; background:#f2f2f2; padding:33px 0; box-sizing:border-box;}
.needs-item{width:25%; text-align:center; border-right:1px solid rgba(0,0,0,0.1); padding:30px 0; box-sizing:border-box;}
.needs-item:last-child{border-right:none;}
.needs-item .icon{display: block; width:52px; height:51px; margin:0 auto 25px;}
/* 핵심제조기술 */
.technology-con .cm-sub-tit.technology-tit{margin-bottom:43px;}
.technology-con .cm-sub-tit-02{margin-bottom:30px;}
.technology-con .cm-sub-tit-02 span{font-size:20px; line-height:2em; color:#000; opacity:0.5; font-weight:600; margin-left:6px;}
.technology-con-wrap{display: flex; justify-content: space-between; width:100%;}
.technology-item{width:47.65%;}
.technology-item .img-box{background:#f2f2f2; padding:14.61% 7.38% 11.49%;}
.technology-item .img-box .inner-img{float:left; width:49.05%; text-align:center; margin-right:1.9%;}
.technology-item .img-box .inner-img:last-child{margin-right:0;}
.technology-item .img-box .inner-img span{display: block; margin-bottom:20px;}
.technology-item .img-box .inner-img img{max-width:100%;}
.technology-item .technology-txt{font-size:16px; line-height:2.06em; letter-spacing:-0.85px; color:#333; opacity:0.7; margin-top:30px;}


/*********** Careers :: 인사제도 :: 인재상 **********/

/* 아코디언 전체 레이아웃 */
/* .m-br{display: none;}
.accordion-list-box{max-width:1600px; margin:130px auto 100px; width: 100%;}
.accordion-list-new .accordion-item{position:relative; overflow:hidden; -webkit-filter:grayscale(100%); -webkit-transition: width 0.3s; transition: width 0.5s;}
.accordion-list-new .accordion-item:before{position: absolute; content:''; width:100%; height:100%; background:#000; opacity:0.5; top:0; left:0; z-index:9}
.accordion-list-new .accordion-item.active:before{display: none;}
.accordion-list-new .accordion-item.active{-webkit-filter:grayscale(0%);}
.accordion-list-new .accordion-item .accordion-inner{display:block; position:relative; height:100%; margin:0; }
@media all and ( min-width: 1367px ){
	.accordion-list-box .accordion-list-new{height:670px}
	.accordion-list-new .accordion-item{width:250px;}
}
@media all and (min-width:1221px){
	.accordion-list-new .accordion-item{width:120px !important;}
	.accordion-list-new .accordion-item.active{width: calc(100% - 360px) !important;}
}
@media all and ( min-width: 801px ){
	.accordion-list-box .accordion-list-new{ display: flex; flex-wrap:wrap; table-layout: fixed; width:100%; height: 530px; white-space:nowrap; overflow:hidden; font-size:0;}
	.accordion-list-new .accordion-item{width:90px; display:block; height:100%; white-space:nowrap;} */ /* 접힌 li의 width */
	/* .accordion-list-new .accordion-item.active{width: calc(100% - 270px);}
	.accordion-list-new .accordion-item .accordion-m-img{display:none;}
}
@media all and ( max-width: 800px ){
	.accordion-list-box{margin:50px auto;}
	.accordion-list-box .accordion-list-new{max-width:800px; margin:0px auto;}
	.accordion-list-new .accordion-item{display:block; width:100%; height:auto; margin-top:10px; padding-left:0; }
	.accordion-list-new .accordion-item:first-child{margin-top:0}
	.accordion-list-new .accordion-item .accordion-inner{background-image:none;}
	.accordion-list-new .accordion-item .accordion-m-img{
		height:0; padding-top:110px; 
		background-size:cover !important;
		-webkit-transition:padding 0.4s;
		-moz-transition:padding 0.4s;
		-o-transition:padding 0.4s;
		-ms-transition:padding 0.4s;
		transition:padding 0.4s;
	}
	.accordion-list-new .accordion-item.active .accordion-inner{cursor:default;}
	.accordion-list-new .accordion-item.active .accordion-m-img{padding-top:70%}
	
.accordion-list-new .accordion-item:before{display: none;}
.accordion-list-new .accordion-item{-webkit-filter:grayscale(0%);}
.accordion-list-new .accordion-item .accordion-inner{cursor:default;}
.accordion-list-new .accordion-item .accordion-m-img{padding-top:70%}
}
@media all and ( max-width: 480px ){
	.accordion-list-new .accordion-item .accordion-m-img{padding-top:80px;}
} */

/* 아코디언  :: 타이틀 및 내용 */
/* .accordion-item .accordion-inner .accordion-tit{
	position:absolute; top:24px; 
	color:#fff; font-size:70px; font-weight:600; 
	width:100%; height:calc(100% - 24px);
	text-align:center; 
	z-index:1;
	opacity:1.0;filter:Alpha(opacity=100);
	transition:all 0.5s; z-index:10;
}
.accordion-item .accordion-inner .accordion-tit span{display: block; position: absolute; bottom:100px; left:-20px; transform: rotate(90deg); font-size:18px; color:#fff; opacity:0.6; width:150px; text-align:right;}
.accordion-item .accordion-info-box{position:absolute; left:0; right:0; bottom:0px;}

.accordion-item .accordion-info-box dl{
	display: table; width:100%;
	position:relative; z-index:1; 
	padding:0 7.9% 38px; 
	opacity:0;filter:Alpha(opacity=0); 
	color:#fff; 
	-webkit-transition-delay:0s; 
	-moz-transition-delay:0s; 
	-o-transition-delay:0s; 
	-ms-transition-delay:0s; 
	transition-delay:0s; 
	z-index:1;
	box-sizing:border-box;
}
.accordion-item .accordion-info-box dl dt{display: table-cell; width:120px; vertical-align:bottom; font-size:140px; font-weight:600; letter-spacing:-0.65px; color:#fff; opacity:0.5; line-height:0.84em;}
.accordion-item .accordion-info-box dl dd{position: relative; display: table-cell; width:calc(100% - 120px); vertical-align:bottom; padding-left:34px;}
.accordion-item .accordion-info-box dl dd:before{position: absolute; content:''; width:1px; height:65px; background:#ddd; opacity:0.2; bottom:5px; left:0px;}
.accordion-item .accordion-info-box dl .accordion-info-tit{display:block; font-size:40px; font-weight:600; line-height:1.5em; letter-spacing:-0.25px; color:#fff;}
.accordion-item .accordion-info-box dl .accordion-info-txt{font-size:18px; font-weight:500; letter-spacing:-0.65px; opacity:0.8;filter:Alpha(opacity=80); line-height:1.55;}
.accordion-item .accordion-inner .more-btn{
	position:absolute; bottom:0px; right:0px;
	width:68px; height:68px; line-height:68px; 
	text-align:center; 
	background-color:#fff; 
	z-index:1; 
	-webkit-transition:all 0.2s 0s;
	-moz-transition:all 0.2s 0s;
	-o-transition:all 0.2s 0s;
	-ms-transition:all 0.2s 0s;
	transition:all 0.2s 0s;  
	opacity:0;filter:Alpha(opacity=0);
}
.accordion-item .accordion-inner .more-btn i{line-height:68px; color:#333;} */

/* 아코디언 :: 타이틀 및 내용 Active */
/* .accordion-item.active .accordion-inner:after{opacity:0;filter:Alpha(opacity=0); }
.accordion-item.active .accordion-inner .accordion-tit{
	opacity:0;filter:Alpha(opacity=0);
	transition:all 0s;
}
.accordion-item.active .accordion-info-box:before{width:100%; opacity:1.0;filter:Alpha(opacity=100);}
.accordion-item.active .accordion-inner dl{ 
	opacity:1.0;filter:Alpha(opacity=100);  
	-webkit-transition:all 0.3s 0.2s; 
	-moz-transition:all 0.3s 0.2s; 
	-o-transition:all 0.3s 0.2s; 
	-ms-transition:all 0.3s 0.2s; 
	transition:all 0.3s 0.2s; 
}
.accordion-item.active .accordion-inner .more-btn{ 
	opacity:1.0;filter:Alpha(opacity=100); 
	-webkit-transition-delay:0.3s;
	-moz-transition-delay:0.3s;
	-o-transition-delay:0.3s;
	-ms-transition-delay:0.3s;
	transition-delay:0.3s
}

@media all and (max-width:1220px){
	.accordion-item .accordion-inner .accordion-tit span{left:-30px;}
}
@media all and (max-width:1024px){
	.accordion-item.active .accordion-inner dl{display: block;}
	.accordion-item.active .accordion-inner dl dt{display: block; width:100%; margin-left:-8px;}
	.accordion-item.active .accordion-inner dl dd{display: block; width:100%; padding-left:0;}
	.accordion-item.active .accordion-inner dl dd:before{display: none;}
}
@media all and (max-width:800px){
	.accordion-item .accordion-info-box dl{padding:30px;}
	.accordion-item .accordion-inner .accordion-tit{top:15px; height:100%;}
	.accordion-item .accordion-inner .accordion-tit h4{margin-bottom:10px; font-size:50px;}
	.accordion-item .accordion-inner .accordion-tit span{position: relative; bottom:auto; left:auto; transform:none; text-align:center; width:100%; font-size:14px;}
	.accordion-item.active .accordion-inner dl dt{font-size:80px; margin-left:-4px;}
	.accordion-item .accordion-info-box dl .accordion-info-tit{font-size:25px;}
	.accordion-item .accordion-info-box dl .accordion-info-txt{font-size:14px;}


	.accordion-item .accordion-inner dl{display: block;}
	.accordion-item .accordion-inner dl dt{display: block; width:100%; margin-left:-8px;}
	.accordion-item .accordion-inner dl dd{display: block; width:100%; padding-left:0;}
	.accordion-item .accordion-inner dl dd:before{display: none;}
	.accordion-item .accordion-inner dl dt{font-size:80px; margin-left:-4px;} */
	/* 아코디언 :: 타이틀 및 내용 Active */
/* .accordion-item .accordion-inner:after{opacity:0;filter:Alpha(opacity=0); }
.accordion-item .accordion-inner .accordion-tit{
	opacity:0;filter:Alpha(opacity=0);
	transition:all 0s;
}
.accordion-item .accordion-info-box:before{width:100%; opacity:1.0;filter:Alpha(opacity=100);}
.accordion-item .accordion-inner dl{ 
	opacity:1.0;filter:Alpha(opacity=100);  
	-webkit-transition:all 0.3s 0.2s; 
	-moz-transition:all 0.3s 0.2s; 
	-o-transition:all 0.3s 0.2s; 
	-ms-transition:all 0.3s 0.2s; 
	transition:all 0.3s 0.2s; 
}
.accordion-item .accordion-inner .more-btn{ 
	opacity:1.0;filter:Alpha(opacity=100); 
	-webkit-transition-delay:0.3s;
	-moz-transition-delay:0.3s;
	-o-transition-delay:0.3s;
	-ms-transition-delay:0.3s;
	transition-delay:0.3s
	}
}
@media all and (max-width:480px){
	.m-br{display: block;}
	.accordion-item .accordion-info-box dl{padding:15px;}
	.accordion-item .accordion-inner .accordion-tit{top:3px;}
	.accordion-item .accordion-inner .accordion-tit h4{margin-bottom:5px;}
} */

/*********** Careers :: 인사제도 :: 인사제도 **********/
/* .ht-sub-txt{font-size:20px; line-height:1.5em; letter-spacing:-0.75px; color:#666; text-align:center; padding-top:64px;}
.word-break{display: inline-block;} */
/* 아이콘 원형 */
/* .personnel-top-icon{display: flex; justify-content: center; margin:12em 0;}
.personnel-icon-con{position: relative; width:31.25%; height:0; padding-top:31.25%;}
.personnel-icon-con dl{display: flex; flex-wrap:wrap; align-content: center; position: absolute; top:-20px; left:-20px; width:calc(100% + 40px); height:calc(100% + 40px); -webkit-border-radius:50%;border-radius:50%;}
.personnel-icon-con dl:after{position: absolute; content:''; width:100%; height:100%; -webkit-border-radius:50%;border-radius:50%; box-sizing:border-box; z-index:2}
.personnel-icon-con dl dt{width:100%; text-align:center;}
.personnel-icon-con dl dd{width:100%; text-align:center;}
.personnel-icon-con dl dd .txt{font-size:26px; line-height:1.5em; letter-spacing:-0.75px; font-weight:600; margin-top:30px;}
.personnel-icon-con dl dd .txt-en{font-size:16px; line-height:1.5em; letter-spacing:-0.25px; font-weight:600; opacity:0.5; margin-top:5px;}

.personnel-icon-con.con-01 dl{background:#0a2143;}
.personnel-icon-con.con-01 dl:after{border:1px solid rgba(10,33,67,0.1);}
.personnel-icon-con.con-01 dl dt, .personnel-icon-con.con-01 dl dd{color:#fff;}
.personnel-icon-con.con-01 dl dd{color:#fff;}

.personnel-icon-con.con-02 dl{z-index:1;}
.personnel-icon-con.con-02 dl{transition:all 1s;}
.personnel-icon-con.con-02 dl:after{border:1px solid #113162;}
.personnel-icon-con.con-02 dl dt, .personnel-icon-con.con-02 dl dd{color:#113162;}
.personnel-icon-con.con-02.active dl{background:#fff;}

.personnel-icon-con dl:before{position: absolute; content:''; top:-18px; left:-18px; width:100%; height:100%;  opacity:0.1; -webkit-border-radius:50%;border-radius:50%; border:18px solid rgba(238,238,238,0.5); z-index:2; opacity:0; transition:all 1s;}
.personnel-icon-con.active dl:before{opacity:0.5;}
.personnel-icon-con.con-01.active dl:before{border-color:rgba(10,33,67,0.4);}
.personnel-icon-con.con-02.active dl:before{border-color:rgba(170,170,170,0.4);} */

/* 인사제도 정보 */
/* .personnel-info-box{border-top:2px solid #333;}
.personnel-info-con{display: table; width:100%; padding:57px 0; border-bottom:1px solid rgba(51,51,51,0.1);}
.personnel-info-con .tit-box{display: table-cell; width:17.5%; vertical-align:top;}
.personnel-info-con .tit-box .tit{font-size:30px; line-height:0.93em; letter-spacing:-0.75px; color:#000; font-weight:600;}
.personnel-info-con .txt-box{display: table-cell; width:82.5%; vertical-align:top;}
.personnel-info-con .txt-box .txt{font-size:18px; line-height:1.55em; letter-spacing:-0.75px; color:#000;} */
/* 인사제도 정보 :: 직위체계 - 직군 */
/* .personnel-inner-con{position: relative; padding:43px 0;}
.personnel-inner-con.con-01{margin-top:33px;}
.personnel-inner-con .inner-item{position: relative;}
.personnel-inner-con .inner-item .tit{position: absolute; display: block; top:50%; left:0; transform:translateY(-50%); font-size:20px; line-height:1.4em; letter-spacing:-0.75px; color:#000;}
.personnel-list-wrap{display: flex; padding-left:115px;}
.personnel-list-wrap li{position: relative; width:10.62%; height:0px; padding-top:10.62%; margin-right:5.1%; }
.personnel-list-wrap li:last-child{margin-right:0;}
.personnel-list-wrap li span{position: absolute; display: flex; flex-wrap:wrap; justify-content: center; align-content: center; top:0; left:0; width:100%; height:100%; -webkit-border-radius:50%;border-radius:50%; background:#f2f2f2; font-size:18px; line-height:100px; letter-spacing:-0.75px; color:#333; font-weight:600; transition:all 0.3s;}
.personnel-list-wrap li.active span{color:#fff; transition:all 0.3s;}
.personnel-list-wrap li.active span:before{position: absolute; content:''; width:calc(100% + 16px); height:calc(100% + 16px); top:-8px; left:-8px; background:#000; z-index:-1; opacity:0.1;  transition:all 0.3s; -webkit-border-radius:50%;border-radius:50%;}

.personnel-inner-con.con-01 .personnel-list-wrap li.active span{background:#0a2143}
.personnel-inner-con.con-01 .personnel-list-wrap li.active span:before{background:#0a2143}
.personnel-inner-con.con-02 .personnel-list-wrap li.active span{background:#349ba1}
.personnel-inner-con.con-02 .personnel-list-wrap li.active span:before{background:#349ba1} */
/* 인사제도 정보 :: 직위체계 - 직군 - 가운데 선 */
/* .personnel-inner-con.con-02 .personnel-list-wrap li{position: relative;}
.personnel-inner-con.con-02 .personnel-list-wrap li:before{position: absolute; content:''; width:148%; height:1px; background:#333; opacity:0.1; left:50%; top:-43px;}
.personnel-inner-con.con-02 .personnel-list-wrap li:last-child:before{display: none;}
.personnel-inner-con.con-02 .personnel-list-wrap li:after{position: absolute; content:''; width:11px; height:11px; background:#349ba1; -webkit-border-radius:50%;border-radius:50%; top:-48px; left:calc(50% - 5px);  transition:all 0.3s; opacity:0;}
.personnel-inner-con.con-02 .personnel-list-wrap li.active:after{opacity:1; transition:all 0.3s;} */

/*********** Careers :: 인사제도 :: 교육 **********/
.edu-txt{font-size:18px; line-height:1.55em; letter-spacing:-0.75px; color:#000;}
.edu-icon-list{display: flex; margin:13em 0 12em;}
.edu-icon-list .edu-item{width:20%; border-top:1px solid #ddd; border-bottom:1px solid #ddd; border-right:1px solid #e3e3e3; box-sizing:border-box; text-align:center; padding:79px 15px 63px;}
.edu-icon-list .edu-item:first-child{border-left:1px solid #ddd;}
.edu-icon-list .edu-item:last-child{border-right:1px solid #ddd;}
.edu-icon-list .edu-item .icon{position: relative; display: block; width:57%; height:0; padding-top:57%; margin:auto; background-color:#f2f2f2; -webkit-border-radius:50%;border-radius:50%; margin-bottom:40px;}
.edu-icon-list .edu-item .icon:before{position: absolute; content:''; width:100%; height:100%; top:0; left:0; background:no-repeat center; background-size:cover;}
.edu-icon-list .edu-item.item-01 .icon:before{background-image:url('/images/content/hr_edu_icon01.png');}
.edu-icon-list .edu-item.item-02 .icon:before{background-image:url('/images/content/hr_edu_icon02.png');}
.edu-icon-list .edu-item.item-03 .icon:before{background-image:url('/images/content/hr_edu_icon03.png');}
.edu-icon-list .edu-item.item-04 .icon:before{background-image:url('/images/content/hr_edu_icon04.png');}
.edu-icon-list .edu-item.item-05 .icon:before{background-image:url('/images/content/hr_edu_icon05.png');}
.edu-icon-list .edu-item.item-06 .icon:before{background-image:url('/images/content/hr_edu_icon06.png');}

.edu-img-list{display: flex; width:100%; margin-top:37px;}
.edu-img-list .edu-item{width:25%; border-top:1px solid #ddd; border-bottom:1px solid #ddd; border-right:1px solid #e3e3e3; box-sizing:border-box; text-align:center; transition:all 0.3s; padding:29px;}
.edu-img-list .edu-item:first-child{border-left:1px solid #ddd;}
.edu-img-list .edu-item:last-child{border-right:1px solid #ddd;}
.edu-img-list .edu-item .edu-txt{font-weight:500; margin-bottom:26px;}
.edu-img-list .edu-item .edu-img{display: block; width:100%;}
.edu-img-list .edu-item .edu-img img{width:100%;}

.edu-img-list .edu-item.active{background:#0a2143; border-color:#0a2143;}
.edu-img-list .edu-item.active .edu-txt{color:#fff;}

/*********** Careers **********/

/***** 공통 *****/
.careers-page .careers-personal-con {margin: 150px 0 200px 0;}
.careers-personal-con .cm-personal-wrap {margin-bottom: 100px;}
.careers-personal-con .cm-personal-wrap:last-child {margin-bottom: 0;}
.cm-careers-tit-box{position: relative; margin-top:116px;}
.cm-careers-tit-box .careers-tit{font-size:30px; line-height:1.5em; color:#000; font-weight: 500; text-align:center;}
.cm-careers-tit-box .careers-tit span {color: #0c3274;}
.cm-careers-tit-box .careers-tit .co-blue{color:#1b355a;}
.careers-personal-con .cm-personal-tit {font-size: 30px; font-weight: 600; line-height: 0.9em; letter-spacing: -0.025em; color: #000; border-bottom: 2px solid #333333; padding-bottom: 25px;}
.cm-personal-wrap .cm-item-txt {margin: 90px 0 100px 0;}
.cm-personal-wrap .cm-item-txt p {font-size: 24px; font-weight: 400; line-height: 1.7em; color: #000; text-align: center;}
/* .hr-accordion-box{position: relative; } */
/* .hr-accordion-box:before{position: absolute; content:''; width:100%; height:0; padding-top:23.96%; background:#e6e6e6; bottom:-20%;} */

/***** talent *****/
.careers-page .talent-item-con {display: flex; justify-content: center; flex-wrap: wrap; margin-top: 75px;}
.careers-page .talent-item-con .talent-item {display: flex; flex-direction: column; align-items: center; justify-content: space-between; border: 1px solid rgba(0, 0, 0, 0.08); margin-right: 17px; width: calc(33.333% - 17px); box-sizing: border-box; padding: 40px 20px; box-shadow: 3px 4px 5px 0px rgba(0, 0, 0, 0); background-color: #fbfbfb;}
.careers-page .talent-item-con .talent-item:nth-child(3), .careers-page .talent-item-con .talent-item:last-child {margin-right: 0;}
.careers-page .talent-item-con .talent-item:nth-child(n + 4) {margin-top: 17px;}
.careers-page .talent-item-con .talent-item h5 {font-size: 25px; font-weight: 500; line-height: 1.4em; color: #000;}
.careers-page .talent-item-con .talent-item p {font-size: 15px; font-weight: 400; line-height: 1.9em; color: #55585b; text-align: center;}
.careers-page .talent-item-con .talent-item img {margin: 20px 0;}

/***** personal system *****/
.careers-personal-con .position-item-box .position-item {display: flex; align-items: center; border-bottom: 1px solid #eaeaea; padding: 35px 0;}
.position-item-box .position-item .position-tit {width: 25%;}
.position-item-box .position-item .position-tit h5 {font-size: 20px; font-weight: 500; line-height: 1.4em; color: #000;}
.position-item-box .position-item .position-circle-con {display: flex; justify-content: space-between; width: 75%;}
.position-item .position-circle-con .position-circle {position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 150px; height: 150px; background-color: #f7f7f7; border: 1px solid rgba(0, 0, 0, 0.11); border-radius: 50%; transition: 0.3s;}
.position-item:first-child .position-circle-con .position-circle::before {position: absolute; content: ""; bottom: -41.5px; left: 50%; transform: translateX(-50%); width: 11px; height: 11px; background-color: #000; border-radius: 50%; opacity: 0; pointer-events: none; transition: 0.3s;}
.position-item .position-circle-con .position-circle::after {position: absolute; content: ""; width: 100%; height: 100%; background-color: transparent; border-radius: 50%; border: 10px solid #e6e6e6; z-index: 2; opacity: 0; transition: 0.3s; pointer-events: none;}
.position-item .position-circle-con .position-circle h6 {font-size: 19px; font-weight: 500; line-height: 1.5em; letter-spacing: -0.025em; color: #0c3274; padding-bottom: 10px; transition: 0.3s;}
.position-item .position-circle-con .position-circle span {font-size: 15px; font-weight: 400; letter-spacing: -0.025em; color: #5e5e5e; text-align: center; transition: 0.3s;}
.position-item .position-circle-con .position-circle span:last-child {padding-top: 10px;}
.position-item:first-child .position-circle-con .position-circle.active.position-circle::before {opacity: 1;}
.position-item .position-circle-con .position-circle.active.position-circle::after {opacity: 1;}
.position-item .position-circle-con .position-circle.active.position-circle h6 {color: #fff;}
.position-item .position-circle-con .position-circle.active.position-circle span {color: #fff;}
.position-item:first-child .position-circle-con .position-circle.active {background-color: #0c3274;}
.position-item:last-child .position-circle-con .position-circle.active {background-color: #16b9ed;}
.personal-evaluation-wrap .evaluation-item-box .evaluation-img img {width: 100%;}
.compen-system-con .compen-system-inner {display: flex;}
.compen-system-con .compen-system-inner:first-child {border-bottom: 1px solid #eee; padding-bottom: 60px;}
.compen-system-con .compen-system-inner:last-child {padding-top: 60px;}
.compen-system-inner .system-item-box {display: flex; flex-wrap: wrap; width: 80%;}
.compen-system-inner .system-title-box {width: 20%; padding: 30px 10px 30px 0;}
.compen-system-inner .system-title-box h5 {font-size: 30px; font-weight: 600; line-height: 1.2em;}
.compen-system-inner .system-title-box .blue-tit {color: #0c3274;}
.compen-system-inner .system-title-box .sky-tit {color: #16b9ed;}
.compen-system-inner .system-item-box .system-item {width: 50%; box-sizing: border-box; padding: 20px 10px 20px 70px;}
.compen-system-inner .system-item-box .system-item h6 {font-size: 20px; font-weight: 500; line-height: 1.5em; color: #060606; padding: 15px 0;}
.compen-system-inner .system-item-box .system-item p {font-size: 15px; font-weight: 400; line-height: 1.8em; color: #55585b;}
.compen-system-inner:first-child .system-item-box .system-item:first-child, .compen-system-inner:last-child .system-item-box .system-item:nth-child(odd) {border-left: 1px solid #eee;}
.compen-system-inner:first-child .system-item-box .system-item:last-child, .compen-system-inner:last-child .system-item-box .system-item:nth-child(even) {border-left: 1px solid #eee; border-right: 1px solid #eee;}
.compen-system-inner:last-child .system-item-box .system-item:first-child, .compen-system-inner:last-child .system-item-box .system-item:nth-child(2) {margin-bottom: 60px;}

/***** welfare *****/
.welfare-list-con{border-top:2px solid #333; margin-top:115px}
.welfare-item-wrap{display: table; width:100%; table-layout:fixed; border-bottom:1px solid rgba(51,51,51,0.1); padding:60px 0 50px;}
.welfare-item-wrap .tit-box{position: relative; display: table-cell; width:387px; vertical-align:top;}
.welfare-item-wrap .tit-box .icon{position: absolute; top:-10px; left:0; display: block; width:140px; height:57px; background:no-repeat center; background-image:url('/images/content/hr_welfare_icon01.png');}
.welfare-item-wrap .tit-box .icon.icon01{background-image:url('/images/content/hr_welfare_icon01.png');}
.welfare-item-wrap .tit-box .icon.icon02{background-image:url('/images/content/hr_welfare_icon02.png');}
.welfare-item-wrap .tit-box .icon.icon03{background-image:url('/images/content/hr_welfare_icon03.png');}
.welfare-item-wrap .tit-box .icon.icon04{background-image:url('/images/content/hr_welfare_icon04.png');}
.welfare-item-wrap .tit-box .icon.icon05{background-image:url('/images/content/hr_welfare_icon05.png');}
.welfare-item-wrap .tit-box .icon.icon06{background-image:url('/images/content/hr_welfare_icon06.png');}
.welfare-item-wrap .tit-box .icon.icon07{background-image:url('/images/content/hr_welfare_icon07.png');}
.welfare-item-wrap .tit-box .tit{padding-left:140px; font-size:30px; line-height:1.2em; letter-spacing:-0.75px; color:#000;}
.welfare-item-wrap .txt-list{display: table-cell; width:calc(100% - 387px); vertical-align:top;}
.welfare-item-wrap .txt-list li{display: inline-block; background:#f2f2f2; border-radius:20px; padding:6px 20px; margin-right:10px; margin-bottom:10px;}
.welfare-item-wrap .txt-list li .txt{font-size:16px; line-height:1.75em; letter-spacing:-0.75px; color:#000;}
.welfare-img-list{margin-top:62px;}
.welfare-img-list li{float:left; width:30.24%; margin-right:4.6%;}
.welfare-img-list li:last-child{margin-right:0;}
.welfare-img-list li span img{width:100%;}

/***** welfare 23-05-25 추가 *****/
.welfare-page .welfare-tit {font-size: 30px; font-weight: 700; line-height: 1.5em; letter-spacing: -0.075em; color: #000;}
.welfare-page .careers-hr-con {padding-top: 95px;}
.welfare-page .welfare-list-con {margin-top: 17px;}
.welfare-page .welfare-item-wrap .tit-box .tit {font-size: 29px; font-weight: 700;}
.welfare-page .welfare-item-wrap .txt-list li .txt {letter-spacing: -0.075em;}

/*********** 채용정보 :: 채용안내 **********/
.recruit-tit{font-size:30px; line-height:2.1em; letter-spacing:-0.75px; color:#000;}
.recruit-porcess-list{position: relative; display: flex; flex-wrap:wrap; justify-content: space-between; width:100%; margin-top:19px;}
.recruit-process-item{position: relative; width:30.46%; background:#f9f9f9; border-radius:5px; margin-bottom:125px; padding:35px 2.73%; box-sizing:border-box; transition:all 0.3s; border: 1px solid transparent;}
.recruit-process-item:nth-child(n+4){margin-bottom:0;}
.recruit-process-item.active{background:#fff; border:1px solid #0a2143; box-sizing:border-box; box-shadow: 27px 29px 54px 0px rgba(0, 0, 0, 0.15);}
.recruit-process-item .tit-box{position: relative; margin-bottom:24.06%;}
.recruit-process-item .tit-box .num{position: absolute; top: -15px; font-size:60px; line-height:1.05em; letter-spacing:-0.75px; color:#000; opacity:0.1; font-weight:600;}
.recruit-process-item .tit-box .tit{font-size:26px; line-height:1.5em; letter-spacing:-0.75px; color:#102e5b; font-weight:600; padding-left:25px; min-height: 78px;}
.recruit-process-item .tit-box .icon{position: absolute; display: block; width:48px; height:53px; background:no-repeat center; right:0px; top:0px;}
.recruit-process-item .tit-box .icon.icon01{background-image:url("/images/content/info_icon01.png");}
.recruit-process-item .tit-box .icon.icon02{background-image:url("/images/content/info_icon02.png");}
.recruit-process-item .tit-box .icon.icon03{background-image:url("/images/content/info_icon03.png");}
.recruit-process-item .tit-box .icon.icon04{background-image:url("/images/content/info_icon04.png");}
.recruit-process-item .tit-box .icon.icon05{background-image:url("/images/content/info_icon05.png");}
.recruit-process-item .tit-box .icon.icon06{background-image:url("/images/content/info_icon06.png");}
.recruit-process-item .txt-box .txt{font-size:16px; line-height:1.75em; letter-spacing:-0.75px; color:#55585b;}

/* 채용프로세스 :: 화살표 & 선 */
.recruit-porcess-list:before{position: absolute; content:''; width:69.5%; height:1px; background:#0a2143; opacity:0.1; top:50%; left:50%; transform:translate(-50%, -50%); z-index:-1;}
.recruit-porcess-list:after{position: absolute; content:''; display: block; width:3.2%;height:0; padding-top:3.2%; background:no-repeat center; background-image:url('/images/icon/info_arrow_left.png'); background-size:cover;  top:50%; left:50%; -webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);}
.recruit-process-item:before{position: absolute; content:''; width:56px; height:1px; background:#0a2143; opacity:0.1; top:50%; right:0px; transform:translate(100%, -50%); z-index:-1;}
.recruit-process-item:after{position: absolute; content:''; display: block; width:10.51%; height:0; padding-top:10.51%; background:no-repeat center; background-image:url('/images/icon/info_arrow_right.png');  background-size:cover; top:50%; right:-2.05%; -webkit-transform:translate(100%, -50%);transform:translate(100%, -50%);}
.recruit-process-item .item-inner{position: relative;}


.recruit-process-item:nth-child(3):before, 
.recruit-process-item:nth-child(3):after{display: none;}
.recruit-process-item:nth-child(3) .item-inner:before{position: absolute; content:''; width:1px; height:64px; top:auto; bottom:-35px; right:50%; transform:translate(-50%, 100%); background:#0a2143; opacity:0.1; z-index:-1;}
.recruit-process-item:nth-child(4) .item-inner:after{position: absolute; content:""; width:1px; height:64px; top:-35px; right:50%; transform:translate(50%, -100%); background:#0a2143; opacity:0.1; z-index:-1;}
.recruit-process-item:nth-child(6):before, 
.recruit-process-item:nth-child(6):after, 
.recruit-process-item:nth-child(6) .item-inner:before{display: none;}


/*********** 채용정보 :: 채용공고 **********/
.recruit_txt{text-align:center;font-size:24px; line-height:1.2em; letter-spacing:-1px; margin-top:50px; color:#000; font-weight:700} 
.recruit_txt span{color:#0c4167}

.careers-page .faq-list-con {border-top: none;}
.careers-page .faq-list-con .faq-item dt {padding: 15px 30px 15px 120px;}
.careers-page .faq-list-con .faq-item dt .question-icon{left: 20px; width: 80px; -webkit-border-radius: 10px; border-radius: 3px;}
.careers-page .faq-list-con .faq-item dt .question-icon.ongoing{background-color: #3366cc;}
.careers-page .faq-list-con.faq-category-list-con dl dt .faq-date{display:inline-block; width:265px; min-height: 24px; color: #343434; font-size: 16px; line-height:24px; font-weight: 400; vertical-align:top;}
.careers-page .faq-list-con.faq-category-list-con dl dt .faq-title{display:inline-block; width:calc(100% - 270px);}
.careers-page .faq-list-con .faq-item dd {padding: 18px 30px 15px;}

/*********** IR :: investment inquiry **********/
.ir-page .inquiry-style04-box {position: relative; border: 1px solid #cccccc; padding: 2rem; margin-bottom: 2rem;}
.ir-page .inquiry-style04-box::before {position: absolute; top: -1px; left: 50%; width: 100px; height: 1px; margin-left: -50px; background-color: #c4201f; content: "";}
.ir-page .inquiry-style04-box .inquiry-tit {letter-spacing: -0.3px; color: #222; font-size: 20px; font-weight: 400; text-align: center; margin-bottom: 25px;}
.ir-page .inquiry-style04-box .bbs-write-tbl-box .bbs-write-tbl {border-top: 0;}
.ir-page .inquiry-style04-box .bbs-write-tbl-box .bbs-write-tbl th {background-color: #fff; border: none;}
.ir-page .inquiry-style04-box .bbs-write-tbl-box .bbs-write-tbl td {border: none;}
.ir-page .inquiry-style04-box .bbs-write-tbl-box .bbs-write-tbl tr:first-child td input {width: calc(40% - 12.79px) !important;}
.ir-page .inquiry-style04-box .bbs-write-tbl-box .bbs-write-tbl .write-input, .ir-page .inquiry-style04-box .bbs-write-tbl-box .bbs-write-tbl .write-select, .ir-page .inquiry-style04-box .bbs-write-tbl-box .bbs-write-tbl .write-textarea {height: 46px; background-color: #f2f2f2; border: none;}
.ir-page .inquiry-style04-box .bbs-write-tbl-box .bbs-write-tbl .write-input:focus, .ir-page .inquiry-style04-box .bbs-write-tbl-box .bbs-write-tbl .write-select:focus, .ir-page .inquiry-style04-box .bbs-write-tbl-box .bbs-write-tbl .write-textarea:focus {background-color: #fff; border:1px solid #333;}
.ir-page .inquiry-style04-box .bbs-write-tbl-box .bbs-write-tbl .write-input, .ir-page .inquiry-style04-box .bbs-write-tbl-box .bbs-write-tbl .write-select {max-width: none;}
.ir-page .bbs-write-tbl td .write-sub-txt2 {color: #cf0505;}
.ir-page .inquiry-style04-box .bbs-write-tbl-box .bbs-write-tbl .email-fieldset {display: flex;}
.ir-page .inquiry-style04-box .bbs-write-tbl-box .bbs-write-tbl .write-input {width: 40% !important;}
.ir-page .inquiry-style04-box .bbs-write-tbl-box .bbs-write-tbl .width100 {width: 100% !important;}
.ir-page .inquiry-style04-box .bbs-inquiry-agree-con .agree-txt {margin-top: 25px;}
.ir-page .inquiry-style04-box .bbs-write-tbl-box .bbs-write-tbl .email-fieldset .hypen {display: flex; align-items: center;  justify-content: center;}
.ir-page .inquiry-style04-box .bbs-write-tbl-box .bbs-write-tbl .email-fieldset .write-select {margin-left: 10px;}
.ir-page .inquiry-style04-box .bbs-inquiry-agree-con .radio-item:first-child {margin-right: 1rem;}
.ir-page .inquiry-style04-box .bbs-inquiry-agree-con .radio-item label::before {content: ""; position: absolute; top: 0; left: 0; width: 16px; height: 16px; border: 2px solid #e6e6e6; background-color: #fff; -webkit-border-radius: 16px; -moz-border-radius: 16px; -o-border-radius: 16px; border-radius: 16px;}
.ir-page .inquiry-style04-box .bbs-inquiry-agree-con .radio-item label i {position: absolute; top: 0; left: 0; line-height: 20px; text-align: center; display: none; color: #fff; font-size: 20px;}
.ir-page .inquiry-style04-box .bbs-inquiry-agree-con .radio-item input:checked + label i {color: #000;}
.ir-page .inquiry-style04-box .bbs-inquiry-agree-con .radio-item input[type="radio"]:checked + label i {display: block;}
.ir-page .inquiry-style04-box .bbs-inquiry-agree-con .radio-item input[type="radio"]:checked + label::before {border-color: #222; background-color: #222;}

/*********** ESG :: Ethical management **********/
.ethical-page .ethical-wrap .txt-wrap p, .ethical-page .ethical-wrap .txt-wrap span {font-size: 18px; line-height: 1.5em; letter-spacing: -0.05em; color: #000; font-weight: 400; margin-bottom: 2rem;}
.ethical-page .ethical-wrap .txt-wrap span {margin-top: 2rem; color: #0c3274; font-weight: bold;}

/*********** ESG :: Anti-Corruption Guidelines **********/
.guidelines-page .guidelines-wrap .txt-box-wrap .txt-box {margin-bottom: 2rem;}
.guidelines-wrap .txt-box-wrap .txt-box h4 {margin-bottom: 1rem; font-size: 24px; font-weight: bold; line-height: 1.5em; letter-spacing: -0.05em; color: #000; border-bottom: 1px solid rgba(214,214,214,0.4); padding-bottom: 0.5rem;}
.guidelines-wrap .txt-box-wrap .txt-box p {font-size: 18px; font-weight: 400; line-height: 1.5em; letter-spacing: -0.05em; color: #000;}

/*********** ESG :: Code of Ethics **********/
.code-page .code-item-wrap h4 {font-size: 24px; font-weight: bold; line-height: 1.5em; letter-spacing: -0.05em; color: #000; border-bottom: 1px solid rgba(214,214,214,0.4); margin-bottom: 1rem; padding-bottom: 0.5rem;}
.code-page .code-item-wrap .code-txt-box .code-txt {display: flex; align-items: flex-start; margin-bottom: 1rem;}
.code-page .code-item-wrap .code-txt-box .code-txt p {font-size: 18px; font-weight: 400; line-height: 1.5em; letter-spacing: -0.05em; color: #000;}
.code-page .code-item-wrap .code-txt-box .code-txt span {font-size: 18px; display: inline-block; font-weight: bold; line-height: 1.5em; min-width: 30px; height: 100%; color: #000;}
.code-page .code-item-wrap .code-down-box .down-txt-box p {font-size: 18px; font-weight: 400; line-height: 1.5em; letter-spacing: -0.05em; color: #000;}
.code-page .code-item-wrap .code-down-box {border: 10px solid #f2f2f2; padding: 3rem; margin-top: 5rem;}
.code-page .code-item-wrap .code-down-box .down-btn-box {display: flex; align-items: center;}
.code-page .code-item-wrap .code-down-box .down-btn-box a {margin-top: 30px; padding: 0 55px; width: 100%; max-width: 325px; height: 65px; border: 1px solid #d4d4d4; -webkit-border-radius: 10px; border-radius: 10px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; -webkit-box-sizing: border-box; box-sizing: border-box; position: relative; -webkit-box-shadow: 7px 7px 9px 0 rgb(0 0 0 / 6%); box-shadow: 7px 7px 9px 0 rgb(0 0 0 / 6%); -webkit-transition: all 0.3s; transition: all 0.3s; font-size: 18px; line-height: 1.2em; font-weight: 400; color: #000;}
.code-page .code-item-wrap .code-down-box .down-btn-box a:first-child {margin-right: 2rem;}
.code-page .code-item-wrap .code-down-box .down-btn-box a i {font-size: 20px;}
.code-page .code-item-wrap .code-down-box .down-btn-box a:hover{background-color: #226cbe; color: #fff;}
.code-page .code-item-wrap .code-down-box .down-btn-box a:hover .code-page .code-item-wrap .code-down-box .down-btn-box a i {color: #fff;}

/*********** ESG :: Conflict-Mineral Free Policy **********/
.policy-page .policy-wrap .policy-txt-box .policy-txt h4 {font-size: 24px; font-weight: bold; line-height: 1.5em; letter-spacing: -0.05em; color: #000; border-bottom: 1px solid rgba(214,214,214,0.4); margin-bottom: 1rem; padding-bottom: 0.5rem;}
.policy-page .policy-wrap .policy-txt-box .policy-txt p {margin-bottom: 1rem; font-size: 18px; font-weight: 400; line-height: 1.5em; letter-spacing: -0.05em; color: #000;}

/*********** ESG :: Report Unethical Actions **********/
.report-page .online-report-wrap .online-report-tit {font-size: 24px; font-weight: bold; line-height: 1.5em; letter-spacing: -0.05em; color: #000; padding-bottom: 0.5rem;}
.report-page .online-report-wrap .accusation-con01-privacy-box {margin-top: 20px;}
.report-page .report-wrap .report-txt-wrap .cm-report-tit {font-size: 24px; font-weight: bold; line-height: 1.5em; letter-spacing: -0.05em; color: #000; border-bottom: 1px solid rgba(214,214,214,0.4); margin-bottom: 1rem; padding-bottom: 0.5rem;}
.report-page .report-wrap .report-txt-wrap .manage-contact {padding: 30px; border: 1px solid #d6d6d6;}
.report-page .report-wrap .report-txt-wrap .cm-txt-box {margin-bottom: 3rem;}
.report-page .report-wrap .report-txt-wrap .target-txt-box {margin-bottom: 6rem;}
.report-page .report-wrap .report-txt-wrap .target-txt-box .target-txt {display: flex; align-items: flex-start;}
.report-page .report-wrap .rp-cm-txt {font-size: 18px; font-weight: 400; line-height: 1.5em; letter-spacing: -0.05em; color: #000;}
.report-page .report-wrap .cm-txt-bold {font-size: 18px; font-weight: bold; line-height: 1.5em; letter-spacing: -0.05em; color: #000;}
.report-page .report-wrap .manage-contact .contact-txt {margin-bottom: 1rem;}
.report-page .report-wrap .target-txt-box .target-txt {margin-bottom: 1rem;}
.report-page .report-wrap .target-txt-box .target-txt .cm-txt-bold {min-width: 30px;}
.report-page .report-wrap .target-txt-box .target-txt .txt-red {color: #cf0505;}

/*********** R&D :: R&D strategy **********/
/* .strategy-page .strategy-wrap .strategy-img img {width: 100%;} */
.strategy-page .strategy-item-con .strategy-item {display: flex; align-items: center;}
.strategy-page .strategy-item-con .strategy-item:nth-child(odd) .item-img {margin-right: 40px;}
.strategy-page .strategy-item-con .strategy-item:nth-child(even) .item-img {margin-left: 40px;}
.strategy-page .strategy-item-con .strategy-item:nth-child(even) {flex-direction: row-reverse;}
.strategy-page .strategy-item-con .strategy-item .item-txt h5 {font-size: 30px; font-weight: 600; line-height: 1.2em; letter-spacing: -0.025em; color: #000; margin-bottom: 35px;}
.strategy-page .strategy-item-con .strategy-item .item-txt p {position: relative; font-size: 15px; font-weight: 400; line-height: 1.9em; color: #55585b;}
.strategy-page .strategy-item-con .strategy-item:nth-child(odd) .item-txt p {padding-left: 24px;}
.strategy-page .strategy-item-con .strategy-item:nth-child(even) .item-txt p {padding-right: 24px;}
.strategy-page .strategy-item-con .strategy-item:nth-child(odd) .item-txt p::before {position: absolute; top:11.25px; left: 6px; content: ""; width: 6px; height: 6px; background-color: #0c3274; border-radius: 50%;}
.strategy-page .strategy-item-con .strategy-item:nth-child(even) .item-txt p::before {position: absolute; top: 11.25px; right: 6px; content: ""; width: 6px; height: 6px; background-color: #0c3274; border-radius: 50%;}
.strategy-page .strategy-item-con .strategy-item:nth-child(odd) .item-txt {text-align: start;}
.strategy-page .strategy-item-con .strategy-item:nth-child(even) .item-txt {text-align: end;}

/* ****************** BUSINESS ********************** */

/***** 공통 *****/
/* .business-page .business-wrap {margin-top: 10rem;} */
.business-page .business-wrap .business-img img {width: 100%;}
.business-page .cm-tit {display: flex; align-items: center; justify-content: space-between; padding-bottom: 23px; border-bottom: 2px solid #333333;}
.business-page .cm-tit h4 {font-size: 30px; font-weight: 600; line-height: 1.2em; letter-spacing: -0.025em; color: #000;}
.business-page .cm-tit .cm-tit-dfcolor {font-weight: 300;}
.business-page .cm-tit .cm-tit-dfcolor span {font-weight: 600;}
.business-system-con .system-item-box {border-top: 1px solid #ebebeb; padding: 100px 0;}
.business-system-con .system-item-box:first-child {border-top: 0;}
.business-system-con .system-item-box:last-child {padding-bottom: 0;}
.business-system-con .system-item-box .system-item {display: flex; align-items: center;}
.business-system-con .system-item-box .system-item:first-child {margin-bottom: 40px;}
.business-system-con .system-item-box:first-child .system-item:first-child {margin-bottom: 0;}
.system-item-box .system-item .system-img {margin-right: 80px;}
.system-item-box .system-item .system-img {width: 50%;}
.system-item-box .system-item .system-txt-con {width: 50%;}
.system-item-box .system-item .system-img img {width: 100%;}
.system-txt-con .txt-inner {padding-top: 35px;}
.system-txt-con .txt-inner:first-child {padding-top: 0;}
.system-txt-con .txt-inner h5 {font-size: 23px; font-weight: 500; line-height: 1.5em; color: #000; border-bottom: 1px solid #bbc6d8; margin-bottom: 10px; padding-bottom: 5px;}
.system-txt-con .txt-inner .spacing10 {letter-spacing: -0.01em;}
.system-txt-con .txt-inner .system-txt {display: flex;}
.system-txt-con .txt-inner .system-txt span {min-width: 25px; width: 25px; height: 25px; display: flex; align-items: center; justify-content: center; border-radius: 50%; font-size: 12px; font-weight: 600; font-style: italic; line-height: 1.9em; color: #fff; background-color: #0c3274; margin-right: 10px;}
.system-txt-con .txt-inner .system-txt p {font-size: 15px; font-weight: 400; line-height: 1.9em; color: #55585b;}

.business-page .business-num-txt {display: flex; margin-bottom: 15px;}
.business-page .business-num-txt:last-child {margin-bottom: 0;}
.business-page .business-num-txt > span {display: flex; align-items: center; justify-content: center; border-radius: 50%; min-width: 28px; height: 28px; background-color: #0c3274; font-size: 13px; font-weight: 600; font-style: italic; line-height: 1.5em; color: #fff;}
.business-page .business-num-txt > p {font-size: 17px; font-weight: 400; line-height: 1.6em; letter-spacing: -0.025em; color: #444; padding-left: 15px;}
.business-page .business-blue-tit {font-size: 19px; font-weight: 500; line-height: 1.8em; letter-spacing: -0.025em; color: #0c3274; margin-bottom: 25px;}

.business-page .business-txt {font-size: 14px; font-weight: 400; line-height: 1.6em; letter-spacing: -0.025em; color: #444; padding-top:20px;}

/***** 반도체 물류 자동화 시스템 *****/
.business-item-con .auto-img-con {margin-top: 90px;}
.business-item-con .auto-img-con .img-box {border-top: 1px solid #bbc6d8; padding-top: 50px;}
.business-item-con .business-cm-txt {font-size: 18px; font-weight: 400; line-height: 1.8em; letter-spacing: -0.025em; color: #444; word-break: break-all;}
.business-item-con .auto-img-con .auto-img-tit {font-size: 23px; font-weight: 700; line-height: 1.5em; color: #000; padding-bottom: 1.1rem;}
.business-item-con .auto-img-con img {max-width: 100%;}

/***** Smart OHT (Overhead Hoist Transport) *****/
.oht-page .oht-img-con {display: flex; margin: 50px 0;}
.oht-page .oht-img-con .img-box:first-child {margin-right: 15px;}
.oht-page .oht-img-con img {max-width: 100%;}

/***** 슬라이드 *****/
.oht-page .oht-slide-con {margin-top: 86px;}
.oht-page .oht-slide-con .oht-slide-inner {background-color: #f6f6f6; padding: 48px 42px 63px 42px; border: 1px solid rgba(0, 0, 0, 0.1);}
.oht-page .oht-slide-con .oht-slide-inner {display: flex; align-items: center;}
.oht-page .oht-slide-con .oht-slide-inner .slide-box {width: 46.824%; position: relative;}
.oht-page .oht-slide-con .oht-slide-inner .slide-box img {max-width: 100%;}
.oht-page .oht-slide-con .oht-slide-inner .slide-box .inner {margin-bottom: 14px;}
.oht-page .oht-slide-con .oht-slide-inner .slide-box .inner .slick-dots {position: relative; top: 30px; display: flex; justify-content: center; width: 100%;}
.oht-page .oht-slide-con .oht-slide-inner .slide-box .inner .slick-dots li {cursor: pointer; width: 6px; height: 6px; background-color: #d9d9d9; border-radius: 50%; margin: 0 6px;}
.oht-page .oht-slide-con .oht-slide-inner .slide-box .inner .slick-dots li.slick-active {background-color: #0c3274;}
.oht-page .oht-slide-con .oht-slide-inner .slide-box .inner .slick-dots li button {display: none;}
.oht-page .oht-slide-con .oht-slide-inner .slide-box > button {position: absolute;}
.oht-page .oht-slide-con .oht-slide-inner .slide-box > button i {font-size: 25px; color: #333;}
.oht-page .oht-slide-con .oht-slide-inner .next-btn {right: 0;}
.oht-page .oht-slide-con .oht-slide-inner .slide-txt {width: 53.176%; margin-left: 46px; margin-bottom: 20px;}

/***** Smart Conveyor System & Smart Purge System *****/
.business-page .cm-content-con {margin-bottom: 40px;}
.business-page .content-inner {background-color: #f6f6f6; padding: 55px 37px; display: flex; align-items: center; border: 1px solid rgba(0, 0, 0, 0.1);}
.business-page .content-inner.paddingMin {padding: 60px 37px;}
.business-page .content-inner .content-txt-box {width: 50%;}
.business-page .content-inner .content-img {display: flex; align-items: center; justify-content: center; width: 50%; margin-left: -10px;}
.business-page .content-inner .content-img img {max-width: 100%;}
@media all and (max-width: 800px) {
	.conveyor-page .custom-scrollbar-wrapper .scroll-object {width: 628px;}
}

.conveyor-page .cm-content-con:first-child {margin-bottom: 50px;}

.purge-page .cm-content-con {margin-bottom: 0; margin-top: 55px;}
.purge-page .content-inner .content-txt-box {width: 52.55%;}
.purge-page .content-inner .content-img {width: 47.45%;}
.purge-page .content-inner .content-img .img:last-child {margin-left: 30px;}

/***** Semiconductor Automated Material Handling System *****/
.business-page .sys-tit .sys-tit-dfcolor {color: #0c3274;}
.business-page .business-item-wrap {border-bottom: 1px solid #ebebeb; padding: 80px 0 100px 0;}
.business-item-wrap .business-table-con {display: flex; align-items: flex-start; justify-content: space-between;}
.business-item-wrap .business-table-con .business-table-box {width: 50%;}
.business-item-wrap .business-table-con .business-table-box:first-child {margin-right: 82px;}
.business-table-box .business-table-imgs img {width: 100%;}
.business-table-box .business-table-info {margin-top: 40px;}
.business-table-box .business-table-info table {width: 100%;}
.business-table-box .business-table-info table thead {background-color: #0c3274;}
.business-table-box .business-table-info table thead th {color: #fefefe; padding: 12px; font-size: 22px; font-weight: 600; line-height: 1.6em;}
.business-table-box .business-table-info tbody tr {display: flex;}
.business-table-box .business-table-info tbody tr th {display: flex; align-items: center; justify-content: center; box-sizing: border-box; width: 40%; background-color: #f1f4f8; padding: 10px; border-bottom: 1px solid #ebebeb; border-right: 1px solid #ebebeb; font-size: 15px; font-weight: 400; line-height: 1.9em; color: #55585b;}
.business-table-box .business-table-info tbody tr td {display: flex; align-items: center; justify-content: center; box-sizing: border-box; width: 60%; padding: 10px; border-bottom: 1px solid #ebebeb; font-size: 15px; font-weight: 400; line-height: 1.9em; color: #55585b; text-align: center;}
.business-table-box .business-table-info .df-width {width: 20%;}
.business-page .business-linear-con {margin-top: 95px;}
.business-linear-con .linear-img img {width: 100%;}
.business-linear-con .linear-item-box {display: flex; margin-top: 40px;}
.business-linear-con .linear-item-box .linear-item-img {margin-right: 80px; width: 599px;}
.business-linear-con .linear-item-box .linear-item-img img {width: 100%;}
.business-wrap .cm-item-tit {font-size: 23px; font-weight: 600; line-height: 1.5em; color: #000; margin-bottom: 25px;}
.business-wrap .cm-txt-con {display: flex; flex-direction: column; justify-content: center; width: 45%;}
.business-wrap .cm-txt-con .cm-txt {display: flex;}
.business-wrap .cm-txt-con .cm-txt p {font-size: 15px; font-weight: 400; line-height: 1.9em; color: #55585b;}
.business-wrap .cm-txt-con .cm-txt span {min-width: 35px; font-size: 15px; font-weight: 600; font-style: italic; line-height: 1.9em; color: #0c3274;}
.business-guide-con {margin-top: 100px; border-bottom: 1px solid #ebebeb; padding-bottom: 70px;}
.business-guide-con .business-guide-box {display: flex; justify-content: space-between;}
.business-guide-con .guide-item-box .guide-item-img img {width: 100%;}
.business-guide-con .item3-box {margin-top: 80px;}
.business-guide-con .item2-box .business-guide {width: 50%;}
.business-guide-con .item2-box .business-guide:first-child {margin-right: 82px;}
.business-guide-con .item3-box .business-guide {width: 33.333%; margin-right: 31px;}
.business-guide-con .item3-box .business-guide:last-child {margin-right: 0;}
.business-guide-con .item2-box .guide-txt-con {min-height: 194.5px;}
.business-guide-con .item3-box .guide-txt-con {min-height: 137.5px;}
.business-guide-con .guide-item-box .guide-txt-con {justify-content: flex-start; box-sizing: border-box; width: 100%; border: 1px solid #e8e8e8; border-top: none;}
.business-guide-con .guide-item-box .guide-txt-con .guide-txt-inner {padding: 26px 45px;}
.business-guide-con .business-part-box {display: flex; justify-content: space-between; margin-top: 80px;}
.business-guide-con .business-part-box .business-part {width: 50%;}
.business-guide-con .business-part-box .business-part:first-child {margin-right: 80px;}
.business-guide-con .business-part-box .business-part .part-img img {width: 100%;}
.business-guide-con .business-part-box .business-part .part-txt {padding: 20px 10px;}
.business-guide-con .business-part-box .business-part .part-txt p {font-size: 15px; font-weight: 400; line-height: 1.9em; color: #55585b;}

/*****Semiconductor Manufacturing Automation Solutions *****/
.solution-page .business-system-con .system-item-box {padding: 80px 0;}
.solution-page .business-item-con:nth-child(3) .business-system-con .system-item-box {padding-bottom: 35px;}
.solution-page .business-system-con .system-item-box:last-child {padding-bottom: 100px;}
.solution-page .business-item-con {margin-top: 100px;}
.solution-page .business-item-con:nth-child(3) {margin-top: 60px;}
.solution-page .business-item-con:nth-child(4) {margin-top: 150px;}
.solution-page .business-item-con:first-child {margin-top: 0;}
.solution-page .business-item-con:last-child .business-system-con .system-item-box {padding-bottom: 0;}
.solution-page .solution-tit .solution-tit-dfcolor {color: #006b8d;}
.system-txt-con .txt-inner .system-txt .system-txt-dfcolor {background-color: #17b9ed;}
.business-system-con .solution-spec-box {display: flex; align-items: center; margin-top: 80px;}
.business-system-con .system-rowitem-box {display: flex; justify-content: space-between;}
.system-rowitem-box .system-rowitem:first-child {margin-right: 15px;}
.system-rowitem-box .system-rowitem img {width: 100%;}
.system-rowitem-box .system-rowitem > h5 {font-size: 23px; font-weight: 500; line-height: 1.5em; color: #000; margin-bottom: 25px;}
.system-rowitem .system-txt-con .txt-inner p {position: relative; font-size: 15px; font-weight: 400; line-height: 1.9em; color: #55585b;}
.system-rowitem .system-txt-con .txt-inner p::before {position: absolute; top: 50%; left: -17px; transform: translateY(-50%); content: ""; width: 7px; height: 8px; background: center / cover no-repeat url("/images/content/business_rhombus.png");}
.system-rowitem .system-txt-con {display: flex; align-items: center; justify-content: center;}
.system-rowitem .system-txt-con .txt-inner {padding: 30px; 10px;}
.system-item-box .system-2item {padding: 108px 0 20px 0;}
.system-item-box .system-item .system-2img {position: relative; top: -80px; width: 50%; display: flex; justify-content: space-between; margin-right: 80px;}
.system-item-box .system-item .system-2img img {width: 100%;}
.system-item-box .system-item .system-2img .img-box > h5 {font-size: 23px; font-weight: 500; line-height: 1.5em; color: #000; padding-bottom: 23px;}
.solution-spec-box .spec-item-box {display: flex; justify-content: space-between; width: 50%; margin-right: 80px;}
.solution-spec-box .spec-item-box .spec-item {width: 50%;}
.solution-spec-box .spec-item-box .spec-item:first-child {margin-right: 18px;}
.solution-spec-box .spec-item-box .spec-item > h5 {font-size: 23px; font-weight: 500; line-height: 1.5em; color: #000; padding-bottom: 23px;}
.solution-spec-box .spec-item-box .spec-item:last-child {margin-right: 0;}
.solution-spec-box .spec-item-box .spec-item img {width: 100%;}
.solution-spec-box .system-txt-con {width: 50%;}
.solution-spec-box .spec-item-box .spec-item .spec-txt {display: flex; align-items: center; justify-content: center; border: 1px solid #e8e8e8; padding: 20px;}
.solution-spec-box .spec-item-box .spec-item .spec-txt p {position: relative; font-size: 15px; font-weight: 400; line-height: 1.9em; color: #55585b;}
.solution-spec-box .spec-item-box .spec-item .spec-txt p::before {position: absolute; top: 50%; left: -17px; transform: translateY(-50%); content: ""; width: 7px; height: 8px; background: center / cover no-repeat url("/images/content/business_rhombus.png");}
.solution-page .business-item-con:first-child .business-system-con .system-item-box .system-item:first-child {margin-bottom: 0;}
.solution-page .business-system-con .system-item-box .system-item:first-child, .solution-page .business-system-con .system-item-box .system-item:nth-child(2) {margin-bottom: 40px;}
.system-txt-con .txt-inner .system-txt .system-txt-des h6 {font-size: 15px; font-weight: 400; line-height: 1.9em; color: #55585b;}
.system-txt-con .txt-inner .system-txt .system-txt-des p {position: relative; margin-left: 18px;}
.system-txt-con .txt-inner .system-txt .system-txt-des p::before {position: absolute; top: 10px; left: -17px; content: ""; width: 7px; height: 8px; background: center / cover no-repeat url("/images/content/business_rhombus.png");}

/* ****************** digital-center 페이지 추가 2023-02-20 YJ ****************** */
/* 공통 */

/* ****************** shaping the future ****************** */
.digital-page.future {text-align:center; width:84%; margin:0 auto;}
.digital-page.future .highlight {color:#06377a;}
.future-bg {display:inline-block; width: 100%; height: 545px;}
.future-bg span {display:inline-block; background: url(/en/images/content/digital_future_img.jpg)no-repeat; width:100%; height: 100%; background-size:cover; background-position:50% 50%;}
.digital-page.future .txt-box {background: #fff; text-align:left; margin:-130px 0 0 17.56%; padding:55px 90px; position: relative; z-index:10; /* width:84%; */ box-sizing:border-box;}
.digital-page.future .txt-01 {display:inline-block; font-size:15px; color:#06377a; font-weight: 600; margin-bottom: 22px;}
.digital-page.future .txt-02 {font-size:24px; color:#000; margin-bottom: 20px; line-height:1.2;}
.digital-page.future .txt-03 {font-size:36px; color:#000; line-height:1.3; letter-spacing:-0.01em; font-weight: 600;}

/* ****************** State-of-Art Material Handling System ****************** */
.digital-page.art .top-box{background:url(/en/images/content/art_img.jpg)no-repeat; width: 100%; padding:16.03% 0; background-size:cover;}
.digital-page.art .top-box .top-txt {font-size:30px; color:#fff; font-weight: 300; line-height:1.6; padding:0 2rem; text-align:center;} 
.digital-page.art .bottom-box {margin-top:120px;}
.digital-page.art .arrow-box {text-align:center; margin-top: 1.5rem;}
.digital-page.art .arrow-box span {display:flex; justify-content:center; flex-direction:column;}
.digital-page.art .arrow-box span i {font-size:18px;}
.digital-page.art .arrow-box span i:first-child {margin-bottom:-12px; color:rgba(255,255,255,0.2);}
.digital-page.art .arrow-box span i:last-child {margin-bottom:-12px; color:rgba(255,255,255,0.8);}
.art-list .item {display:flex; align-items:center; margin-bottom: 140px;}
.art-list .item:last-of-type {margin-bottom: 0;}
.art-list .item > div {width: 50%;}
.art-list .item .img-box {position: relative; padding-right:6.25%; box-sizing:border-box;}
.art-list .item .img-box:before {position:absolute; bottom:-10px; left:-10px; display:block; content:""; width:52.96%; height:60.89%; background:#16b9ed; z-index:-1;}
.art-list .item .img-box img {max-width:100%;}
.art-list .item:nth-of-type(even) {flex-direction:row-reverse; text-align:right;}
.art-list .item:nth-of-type(even) .img-box {text-align:right; padding-right:0; padding-left:6.25%;}
.art-list .item:nth-of-type(even) .img-box:before {left:initial; right:-10px;} 
.art-list .item .num {position: relative; display:inline-block; font-size:16px; font-weight: 700; color:#16b9ed; font-style:italic; margin-bottom:12px;}
.art-list .item .num:before {display:block; content:""; width:60px; height:1px; background: #16b9ed; position:absolute; bottom:-12px;}
.art-list .item:nth-of-type(even) .num:before {left:initial; right:0;}
.art-list .item:nth-of-type(2) .num {color:#3e79e6;}
.art-list .item:nth-of-type(3) .num {color:#0c3274;}
.art-list .item:nth-of-type(4) .num {color:#07152c;}
.art-list .item:nth-of-type(2) .num:before , .art-list .item:nth-of-type(2) .img-box:before {background: #3e79e6;}
.art-list .item:nth-of-type(3) .num:before , .art-list .item:nth-of-type(3) .img-box:before {background: #0c3274;}
.art-list .item:nth-of-type(4) .num:before , .art-list .item:nth-of-type(4) .img-box:before {background: #07152c;}
.art-list .item .txt {font-size:24px; color:#000; line-height:1.65; padding-top: 10px;}

/* ****************** Software Centric Material Handling System ****************** */

.digital-page.material .top-box {position: relative;}
.digital-page.material .bottom-box {margin-top: 8.99%;}
/** material 슬릭 슬라이드 **/
.material-list .item {overflow:hidden;}
.material-list .item img {max-width:100%;}
.material-list .item span {background-size:cover !important; transform:scale(1.08,1.08); background-position:50% 50% !important; width: 100%; height: 760px;}
.material-list .item.active-item span {animation: image-zoom-out 8s 0s forwards;}
.material-list .item:nth-of-type(1) span {display:inline-block; background:url(/en/images/content/intelligence.jpg)no-repeat;}
.material-list .item:nth-of-type(2) span {display:inline-block; background:url(/en/images/content/vision.jpg)no-repeat;}
.material-list .item:nth-of-type(3) span {display:inline-block; background:url(/en/images/content/algorithm.jpg)no-repeat;}
.material-list .item:nth-of-type(4) span {display:inline-block; background:url(/en/images/content/control.jpg)no-repeat;}
.material-list .item:nth-of-type(5) span {display:inline-block; background:url(/en/images/content/electrical.jpg)no-repeat;}
.material-list .item:nth-of-type(6) span {display:inline-block; background:url(/en/images/content/mechanical.jpg)no-repeat;}
/** material 슬릭 슬라이드 paging **/
.material-list .slick-dots {position:absolute; bottom:60px; width: 100%; display:flex !important; justify-content:center; z-index:10;}
.material-list .slick-dots li {margin:0 31.5px; width:160px; text-align:center; cursor:pointer;}
.material-list .slick-dots li a .loading-bar-paging-tit em{font-size:18px;}
.material-list .slick-dots li em {transition:all 0.4s;}
.material-list .slick-dots li.active-item .loading-bar-line:after{width: 100%; transition:all 4s; visibility:visible;}
.material-list .slick-dots li.active-item em {color:#fff;}
.material-list .loading-bar-line {display:inline-block; width: 100%; position: relative;}
.material-list .loading-bar-line:before {display:block; content:""; position:absolute; left:0; top:0; width: 100%; height: 2px; background: rgba(255,255,255,0.2);}
.material-list .loading-bar-line:after {display:block; content:""; position:absolute; left:0; top:0; width: 0; height: 2px; background: #fff; visibility:hidden;}
/** material 도식화 **/
.digital-page.material .diagram-box {position: relative; height: 0; padding-top:45%;}
.digital-page.material .diagram-box .item {text-align:center; position:absolute; height:100%; left:50%; top:0; transform:translateX(-50%); opacity:0; transition:all 0.4s;}
.digital-page.material .diagram-box .item img {max-width:100%; max-height:100%;}
.digital-page.material .diagram-box .item.active {opacity: 1;}

@keyframes image-zoom-out {
	from {
		transform: scale(1.08,1.08);
	}
	to {
		transform: scale(1.0,1.0);
	}
}

@media all and (max-width:1000px){
	.material-list .slick-dots li {position: absolute; width: 80%; text-align:left; opacity:0;}
	.material-list .slick-dots li.active-item {opacity:1;}
}

@media all and (max-width:800px){
	.future-bg {height:272px;}
	.digital-page.future .txt-box {padding:27.5px 45px; margin:-65px 0 0 17.56%;}
	.digital-page.future .txt-01 {font-size:13px;}
	.digital-page.future .txt-02 {font-size:17px;}
	.digital-page.future .txt-03 {font-size:20px;}
	.digital-page.art .top-box .top-txt {font-size:20px;}
	.digital-page.art .bottom-box {margin-top:60px;}
	.art-list .item {flex-wrap:wrap; margin-bottom: 70px;}
	.art-list .item > div {width: 100%;}
	.art-list .item .img-box {padding-right: 0;}
	.art-list .item:nth-of-type(even) .img-box {padding-left:0;}
	.art-list .item .num {font-size:13px;}
	.art-list .item .txt-box {margin-top: 2rem;}
	.art-list .item .txt {font-size:17px;}
	.material-list .item span {height: 380px;}
}