@charset "utf-8";
/* 공통 */
.subtit { line-height: 1.3em; font-size: 28px; font-weight: 700; letter-spacing: -.03em; color: #242424; margin-bottom: 30px; position: relative; display: inline-block;}
.subtit::after { content: ""; position: absolute; right: -25px; top: -22px; z-index: -1; width: 50px; height: 50px; background: url(../images/sub/tit-bf.png) center no-repeat; background-size: contain;}

/* 기업소개 및 연혁 */
.hst-txtbox { padding-bottom: 80px; margin-bottom: 100px; border-bottom: 1px solid #ddd;}
.hst-txtbox h3 { line-height: 1.5em; font-size: 22px; font-weight: 700; letter-spacing: -.03em; color: #242424; margin-bottom: 12px; }
.hst .group { display: flex; position: relative; margin-top: 40px; }
.hst .group::after { content: ""; position: absolute; top: 0; bottom: 0; margin: auto; left: 0; width: 100%; height: 2px; background: #ddd; z-index: -1;} 
.hst .group .since { border: 3px solid #37d0e4; background: #fff; position: relative; display: flex; align-items: center; justify-content: center; text-align: center; width: 120px; height: 120px; border-radius: 100%; font-size: 20px; line-height: 1.4em; letter-spacing: -.03em; color: #242424; font-weight: 700; box-shadow: 0 0 16px rgba(0,0,0,0.16);}
.hst .group ul { flex: 1 1 auto; min-width: 0; width: 1%; display: flex; padding-top: 56px;}
.hst .group ul li { flex: 1; position: relative;}
.hst .group ul li::after { content: ""; position: absolute;  right: 0; top: 0; width: 8px; height: 8px; border-radius: 8px; background: #37d0e4;}
.hst .group ul li>div { display: flex; align-items: center; position: absolute; left: -85px; transform: rotate(-30deg); top: 70px; }
.hst .group ul li .month { font-size: 16px; font-weight: 700; letter-spacing: -.03em; line-height: 1.2em; color: #454545; white-space: nowrap;}
.hst .group ul li .txt { flex: 1 1 auto; min-width: 0; width: 1%; font-size: 16px; letter-spacing: -.03em; color: #454545; font-weight: 300; padding-left: 4px; white-space: nowrap;}
.hst .group ul li>div.wh1 { left: -40px; top: 60px;}
.hst .group ul li>div.wh2 { left: -50px; top: 66px;}
.hst .group ul li>div.wh3 { left: -120px; top: 86px;}
.hst .group ul li>div.wh4 { left: -120px; top: 86px;}
.hst .group ul li>div.wh5 { left: -15px; top: 60px;}
.hst .group ul li>div.wh6 { left: -15px; top: 60px;}

/* 공장소개 */
.pd-tab { margin-bottom: 70px; display: flex; gap: 20px; flex-wrap: wrap; justify-content: center; }
.pd-tab li { flex: 1; background: #eee; border-radius: 8px; }
.pd-tab li a { display: flex; align-items: center; justify-content: center; font-size: 18px; font-weight: 500; letter-spacing: -.03em; line-height: 1.2em; color: #999; text-align: center; padding: 14px 5px;}
.pd-tab li.active { background: #37d0e4;}
.pd-tab li.active a { color: #fff; }
.pd-tab.tab2 { margin-bottom: 40px; }
.pd-tab.tab2 li { flex: none; width: 120px; }
.mapbox { border: 1px solid #ddd; margin-bottom: 40px; }
.lct { display: flex; justify-content: space-between; align-items: center; margin-bottom: 80px; flex-wrap: wrap; gap: 20px 0;}
.lct h2 { font-size: 28px; font-weight: 700; line-height: 1em; letter-spacing: -.03em; color: #242424;}
.lct .spanbox span { display: inline-flex; align-items: center; gap: 14px; padding: 0 20px; position: relative; line-height: 1.3em; letter-spacing: -.03em; font-weight: 400; color: #242424; }
.lct .spanbox span::after { content: ""; position: absolute; right: 0; top: 0; bottom: 0; margin: auto; width: 1px; height: 16px; background: #ddd; }
.lct .spanbox span:last-child { padding-right: 0;}
.lct .spanbox span:last-child::after { display: none; }
.lct .spanbox span strong { display: inline-block; padding-right: 0; font-weight: 400; padding-right: 10px;}
.lct-ctt h3 { font-size: 20px; font-weight: 700; line-height: 1em; letter-spacing: -.03em; color: #242424; margin-bottom: 20px; }
[data-tab-content] { display: none; }
[data-tab-content].active { display: block; }
.organ { text-align: center; }

/* 인증서 */
.certi-list { display: flex; flex-wrap: wrap; gap: 40px;}
.certi-list li { width: calc(100%/4 - 30px); text-align: center; }
.certi-list .thumb {display:block; position:relative; padding-bottom:126%; overflow:hidden; margin-bottom: 18px; }
.certi-list .thumb img {position:absolute; top:50%; left:0; transition:.4s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:contain;}
.certi-list .thumb::after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border: 1px solid #ddd; }

/* 연구개발실 */
.of-list { display: flex; flex-wrap: wrap; gap: 40px; }
.of-list li { width: calc(100%/2 - 20px); }
.of-wrap .group { margin-bottom: 40px; display: flex; align-items: flex-start; gap: 40px;}
.of-wrap .group:last-child { margin-bottom: 0; }
.of-wrap .group>div { width: calc(100%/2 - 20px); }
.of-wrap .group .thumb>div {display:block; position:relative; padding-bottom:68%; overflow:hidden;}
.of-wrap .group .thumb img {position:absolute; top:50%; left:0; transition:.4s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:contain;}
.of-wrap .group .thumb>div::after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border: 1px solid #ddd; }
.of-wrap .group .info { padding-top: 40px; }
.of-wrap .group .info h3 { line-height: 1.3em; margin-bottom: 0; font-size: 32px; font-weight: 700; letter-spacing: -.03em; color: #242424; margin-bottom: 12px;}
.of-wrap .group .info h3 span { display: inline-block; font-size: 14px; font-weight: 400; color: #999; position: relative; padding-left: 22px; line-height: 1em;}
.of-wrap .group .info h3 span::before { content: ""; position: absolute; left: 7px; width: 1px; height: 12px; top: 0px; background: #ddd;}