@charset "utf-8";

/* CEO 인사말 */
.gt {text-align: center; }
.gt h2 { font-size: 28px; font-weight: 600; color: #08c399; line-height: 1.2em; padding: 35px 0 55px; }
.gt .fx { display: flex; text-align: left; align-items: center;}
.gt .fx .left { width: 42%;}
.gt .fx .left img { border-radius: 24px; }
.gt .fx .right { width: 58%; padding-left: 60px; }
.gt .fx .right p { margin-bottom: 28px; }
.gt .fx .right p:last-child { margin-bottom: 0; }
.gt .fx .right p strong { font-weight: 600; }
.gt .fx .right h4 { font-size: 18px; line-height: 1.4em; font-weight: 700; margin-top: 45px; }
.gt .fx .right h4 span { padding-left: 14px; } 

/* 회사연혁 */
.hst-img img { width: 100%; }
.hst { display: flex; align-items: flex-start; margin-top: 80px; }
.hst .title { width: 41%; font-size: 25px; font-weight: 700; line-height: 1.556em; padding-right: 20px; }
.hst .title span { color: #08c399;}
.hst .ctt { width: 59%; border-top: 1px solid #222; border-bottom: 1px solid #222;}
.hst .ctt .group { display: flex; border-bottom: 1px solid #ddd; padding: 35px 40px; }
.hst .ctt .group:last-child { border: none; }
.hst .ctt .group .year { width: 135px; font-size: 32px; font-weight: 700; line-height: 1em; }
.hst .ctt .group .txt { flex: 1 1 auto; min-width: 0; width: 1%;}
.hst .ctt .group .txt .fx { display: flex; margin-bottom: 30px; }
.hst .ctt .group .txt .fx:last-child { margin-bottom: 0; }
.hst .ctt .group .txt .month {width: 80px; font-weight: 600; font-size: 16px; }
.hst .ctt .group .txt p { flex: 1 1 auto; min-width: 0; width: 1%; position: relative; padding-left: 14px; }
.hst .ctt .group .txt p::before { content: ""; position: absolute; left: 0; width: 5px; height: 5px; border-radius: 5px; background: #08c399; top: 11px; }

/* 인증서 */
.certi-list { display: flex; flex-wrap: wrap; gap: 40px; }
.certi-list li { width: calc(100%/4 - 30px); text-align: center; } 
.certi-list li .img { border-radius: 8px; overflow: hidden; position: relative;}
.certi-list li .img::after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border-radius: 8px; border: 1px solid #ddd;}
.certi-list li .tit { max-width: 200px; width: 100%; margin: 30px auto 0; height: 50px; border-radius: 8px; border: 1px solid #08c399; color: #08c399; line-height: 1.2em; font-size: 18px; font-weight: 600; display: flex; align-items: center; justify-content: center; text-align: center; }

/* 찾아오시는 길 */
.lct { display: flex; align-items: center; }
.lct .left { width: 38%; padding-right: 20px; }
.lct .left h2 { font-size: 24px; font-weight: 700; line-height: 1.2em; }
.lct .left .group { margin-top: 40px; }
.lct .left .group h4 { display: flex; gap: 8px; align-items: center; line-height: 1em; font-size: 15px; font-weight: 600; color: #08c399; margin-bottom: 14px; }
.lct .left .group p { line-height: 1.5em; font-weight: 400; }
.lct .right { width: 62%; border-radius: 24px; overflow: hidden; }

/* sub2 공통 */
.sub2-box { margin-bottom: 80px; }
.sub2-box.tc { text-align: center; }
.sub2-box:last-child { margin-bottom: 0; }
.sub2-tit { position: relative; line-height: 1.2em; font-size: 24px; font-weight: 700; margin-bottom: 35px; padding-left: 21px; }
.sub2-title { width: 180px; height: 48px; margin: 30px auto 0; border-radius: 24px; display: flex; align-items: center; justify-content: center; border: 1px solid #08c399; color: #08c399; line-height: 1.2em; font-size: 18px; font-weight: 600; background: #e9f9f5; }
.sub2-title-fx { display: flex; align-items: center; margin-bottom: 40px; flex-wrap: wrap;}
.sub2-title-fx .sub2-title { margin: 0 !important; }
.sub2-title-fx span { font-size: 18px; line-height: 1.6em; padding-left: 20px; }
.sub2-title-fx span.pl { padding-left: 100px; }
.sub2-tit::before { content: ""; position: absolute; left: 0; width: 10px; height: 10px; border-radius: 10px; background: #08c399; top: 8px; }
/* .sub2-buy { width: 306px; height: 64px; border: 1px solid #ddd; display: flex; align-items: center; justify-content: center; border-radius: 8px; transition: .2s; margin: 70px auto 0; line-height: 1em; font-size: 18px; font-weight: 600; color: #666; } */
.sub2-buy { width: 150px; height: 40px; border: 1px solid #ddd; display: flex; align-items: center; justify-content: center; border-radius: 5px; transition: .2s; margin: auto; line-height: 1em; font-size: 16px; font-weight: 600; color: #666; }
.sub2-buy:hover { background: #08c399; border-color: #08c399; color: #fff; }
.sub2-list1 { display: flex; gap: 39px; flex-wrap: wrap;}
.sub2-list1 li { width: calc(100%/3 - 26px); text-align: center; }
.sub2-list1 li .img { border-radius: 24px; overflow: hidden; position: relative;}
.sub2-list1 li .img::after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border-radius: 24px; border: 1px solid #ddd;}
.sub2-list1 li .txt { line-height: 1.2em; margin-top: 18px; font-weight: 400; }
.sub2-list2 { display: flex; gap: 40px; flex-wrap: wrap;}
.sub2-list2 li { border: 1px solid #ddd; border-radius: 24px; width: calc(100%/2 - 20px); padding: 55px 60px; }
.sub2-list2 li .tit { line-height: 1.3em; font-size: 20px; font-weight: 600; color: #08c399; margin-bottom: 20px; }
.sub2-list2 li .txt p { position: relative; padding-left: 6px; }
.sub2-list2 li .txt p::before { content: ""; position: absolute; left: 0; width: 2px; height: 2px; border-radius: 3px; background: #222; top: 12px; }
.sub2-list2 li .txt.bf p { padding-left: 0; }
.sub2-list2 li .txt.bf p::before { display: none; }
.sub2-certi { display: flex; flex-wrap: wrap; gap: 40px; justify-content: center;}
.sub2-certi.mg { margin-bottom: 40px; }
.sub2-certi li { text-align: center; } 
.sub2-certi li .img { border-radius: 8px; overflow: hidden; position: relative;}
.sub2-certi li .img::after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border-radius: 8px; border: 1px solid #ddd;}
.sub2-big { border: 1px solid #ddd; border-radius: 24px; text-align: center; padding: 100px 10px; margin-bottom: 40px; }
.sub2-big.pd { padding: 30px 10px;}
.sub2-tbl-wrap { overflow: auto;}
.sub2-tbl { border-collapse: collapse; width: 100%; border-top: 1px solid #08c399;}
.sub2-tbl tr { border-bottom: 1px solid #08c399;}
.sub2-tbl tr th { background: #e9f9f5; line-height: 1.2em; border-right: 1px solid #08c399; padding: 18px 5px; font-size: 18px; font-weight: 600; color: #08c399; }
.sub2-tbl tr th:last-child { border-right: none; }
.sub2-tbl tr td { line-height: 1.6em; border-right: 1px solid #08c399; padding: 18px 5px; font-size: 16px; font-weight: 400; color: #222; text-align: center; }
.sub2-tbl tr td:last-child { border-right: none; }
.sub2-tbl tr td.bd { border-right: 1px solid #08c399;}
.sub2-tbl tr td.tl { text-align: left; padding-left: 40px; }
.sub2-pc { display: flex; gap: 39px; flex-wrap: wrap; }
.sub2-pc li { width: calc(100%/3 - 26px); }
.sub2-pc li .img { border-radius: 24px; overflow: hidden; position: relative; margin-bottom: 20px; }
.sub2-pc li .img::after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border-radius: 24px; border: 1px solid #ddd;}
.sub2-pc li .tit { padding: 0 20px; display: flex; padding-right: 0;}
.sub2-pc li .tit .num { width: 30px; height: 30px; border-radius: 30px; background: #08c399; display: flex; align-items: center; justify-content: center; line-height: 1em; color: #fff; font-size: 14px; font-weight: 500; margin-right: 10px; }
.sub2-pc li .tit .txt { flex: 1 1 auto; min-width: 0; width: 1%; line-height: 1.666em; font-size: 18px; font-weight: 600; padding-top: 1px;}
.sub2-pc.top li .img {margin-bottom: 0; margin-top: 20px; }
.sub2-pc.wt { gap: 40px; }
.sub2-pc.wt li { flex: 1;}
.sub2-col { padding: 40px 0; border-bottom: 1px solid #ddd;}
.sub2-col.pt { padding-top: 0; }
.sub2-box .sub2-col.pb { border-bottom: none; padding-bottom: 0; }
.sub2-col .sub2-title { margin: 0 0 30px;}
.sub2-col-list { display: flex; gap: 40px; flex-wrap: wrap;}
.sub2-col-list li { position: relative; border-radius: 24px; overflow: hidden; width: calc(100%/2 - 20px);}
.sub2-col-list li img { width: 100%; }
.sub2-col-list li .abbox { font-weight: 600; line-height: 1em; color: #08c399; width: 80px; height: 40px; border-radius: 8px; background: #fff; display: flex; align-items: center; justify-content: center; position: absolute; left: 30px; top: 30px; }

/* sub4 공통 */
.sub4-bd-txt { border: 1px solid #ddd; border-radius: 24px; padding: 55px 60px; }
.sub4-bd-txt h3 { font-size: 18px; margin-bottom: 30px; font-weight: 600; line-height: 1.6em; }
.sub4-tab {display:flex; margin-bottom: 80px; border-radius: 20px 20px 0 0; overflow: hidden; background:#fafafa;  border: 1px solid #ddd; border-bottom: 1px solid #fff;}
.sub4-tab li {flex:1; height:60px; border-bottom:1px solid #08c399; }
.sub4-tab li a {display:flex; align-items:center; justify-content:center; height:100%; color:#666666; font-size:18px; font-weight:600; line-height:1.3em;}
.sub4-tab li.active {border:1px solid #08c399; border-bottom:1px solid #fff; background:#fff; border-radius: 20px 20px 0 0; color: #08c399;}
.sub4-tab li.active a { color: #08c399; }
[data-tab-content] { display: none; }
[data-tab-content].active { display: block; }
.sub4-tit { text-align: center; line-height: 1em; font-size: 32px; font-weight: 700; color: #222; margin-bottom: 80px; }
.sub4-dia { text-align: center; }
.sub4-big-img { border-radius: 24px; overflow: hidden;}
.sub4-big-img.mb { margin-bottom: 40px; }
.sub4-txt2 { font-weight: 600; line-height: 1.2em; color: #08c399; border: 1px solid #08c399; border-radius: 8px; padding: 9px 12px; display: inline-block; margin-bottom: 20px; }
.pin-tit { font-size: 30px; font-weight: 600; line-height: 1.5em; margin-bottom: 50px; }
.pin-tit span { color: #08c399; }
.pin-list { display: flex; justify-content: center; gap: 20px; flex-wrap: wrap; margin-bottom: 60px; }
.pin-list li { width: 160px; border-radius: 16px; background: #fff; box-shadow: 0 0 16px rgba(0,0,0,0.08); padding: 40px 10px;}
.pin-list li .tit { font-weight: 400; line-height: 1.2em; margin-top: 20px; }
.pin-fx { display: flex; gap: 20px; }
.pin-fx .left { width: calc(33% - 10px); }
.pin-fx .right { width: calc(67% - 10px); }
.pin-fx .right .img-fx { display: flex; gap: 20px; }
.pin-fx img { width: 100%; }
.pin-fx .img { border-radius: 24px; overflow: hidden; position: relative; margin-bottom: 20px; }
.pin-fx .img::after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border-radius: 24px; border: 1px solid #ddd;}
.pin-fx .right .img { width: calc(100%/2 - 10px); margin-bottom: 0; }
.pin-fx .right .sub2-title { width: auto; padding: 0 25px; display: inline-flex;}
.pin-list2 { display: flex; justify-content: center; gap: 20px; flex-wrap: wrap; }
.pin-list2 li { border-radius: 24px; overflow: hidden; width: calc(100%/2 - 10px); }
.pin-list2 li img { width: 100%; }