@charset "utf-8";

.company {}
.company>div .titType1 {padding:0 0 50px;}

.company .fixedText {
	padding:40px;width:100%; background:#f7f7f7; border-radius:20px;
	/* margin:0 0 70px; */
	/* width:calc(100% - 600px - 14vw);  right:7vw; top:6vw; position:absolute;z-index:9; */
	/* width:calc(100% - 600px - 14vw);  */
}
/* .company .fixedText.fixOn {position:fixed; top:0; box-shadow:0 0 15px rgba(0,0,0,.1);} */


/* .company .history {padding-top:370px} */
.history-wrap {display:flex; gap:100px;}
.history-tab {align-self:start; position:sticky; top:20px;}
.history-tab .tabBtn {}
.history-con {}
.history-con dl {padding-left:100px; position:relative;}
.history-con dl+dl {padding-top:30px; margin-top:30px; border-top:1px solid #e5e5e5;}
.history-con dl>* {}
.history-con dt {color: var(--base3); font-size:var(--fs18); font-weight: 300; line-height: 140%; position:absolute; left:0; }
.history-con dd {position:relative; color:#333; font-weight:300; padding-left:10px;}
.history-con dd:before {content:""; position:absolute; left:0; top:12px; width:3px; height:3px; background:#ccc;}

.network-list {}
.network-list li {}
.network-list li+li {margin:30px 0 0; padding:30px 0 0; border-top:1px solid #ddd;}
.network-list li.light {margin:15px 0 0; padding:15px 0 0; border-top:1px dashed #e5e5e5;}
.network-list li h3 {padding:0 0 10px; font-size:var(--fs18); color:var(--base3); font-size: var(--fs18); line-height: 160%;}
.network-list li p {padding-left:70px; font-weight: 300;line-height: 120%; position:relative;}
.network-list li p+p {padding-top:5px;}
.network-list li p span {color:#000; left:0; position:absolute;}

.network-list li.strong {}
.network-list li.strong {}
.network-list li.strong h3 {font-weight:700;}
.network-list li.strong p {font-weight:500;}

.domestic {}
.domestic-wrap {display:flex; gap:50px;}
.domestic-list {}
.domestic-map {align-self:start; position:sticky; top:20px;}
.domestic-map img {}

.overseas-wrap {}
.overseas-map {padding:0 0 50px;}
.overseas-map img {}
.overseas-list {}

.vision {}
.vision-wrap {}
.vision-item {display:flex; gap:10px; width:100%;}
.vision-item+.vision-item {margin-top:20px; padding-top:20px; border-top:1px solid #e5e5e5;}
.vision-item h3 {width:150px; align-self:start; color: var(--base3);font-size:var(--fs18);font-weight: 300; line-height: 100%;}
.vision-item .inner {width:calc(100% - 150px); display:flex; gap:50px; flex-wrap:wrap;}
/* .vision-item .inner .con {width:calc((100% - 50px)/2);} */
.vision-item .inner .con {width:100%;}
.vision-item .inner .con h4 {padding:0 0 10px; color: var(--base2);font-size: var(--fs18);font-weight: 300; line-height: 100%;}
.vision-item .inner .con p {color:#333; font-weight:300; line-height:100%;}

.skill {}
.skill .skill-wrap {display:flex; gap:80px; flex-wrap:wrap;}
.skill .skill-box {width:calc((100% - 80px)/2);overflow:hidden;}
.skill .skill-tit {padding:0 0 20px; font-size:var(--fs18); color:var(--base3); font-weight:700;}
.skill .skill-list {height:calc(100% - 50px);gap:30px; display:flex; width:100%; border-radius:0 0 10px 10px; }
.skill .skill-item {width:calc((100% - 30px)/2);}
.skill .skill-item .img {width:140px; max-width:100%; aspect-ratio:1/1.2; overflow:hidden;border-radius:10px; overflow:hidden; border:1px solid #e5e5e5;}
.skill .skill-item .img img {width:100%; height:100%; object-fit:cover;}
.skill .skill-item .tit {padding:20px 0 10px; font-size:var(--fs14); line-height:1.4;}
.skill .skill-item .tit b {color:#000; font-size:var(--fs18); font-weight:700; display:block;}
.skill .skill-item dl {padding:10px 0 0; border-top:1px solid #e5e5e5; }
.skill .skill-item dl>* { font-size:var(--fs15);}
.skill .skill-item dt {color:#000;}
.skill .skill-item dd {padding:0 0 0 10px;position:relative;}
.skill .skill-item dd:before {width:3px; height:3px; background:#666; border-radius:50%; left:0; top:10px; position:absolute; display:block; content:'';}

.skill .skill-box.ceo {width:100%;}
.skill .skill-box.ceo .skill-item {display:flex; gap:30px;}
.skill .skill-box.ceo .skill-item .img {width:140px;}
.skill .skill-box.ceo .skill-item .txt {width:200px;}
.skill .skill-box.ceo .skill-item .tit {padding:0 0 10px;}

.certificate {}
.certificate-wrap {display:flex; gap:100px;}
.certificate-item {width:calc((100% - 100px)/2);}
.certificate-item .img {width:; height:;border:1px solid #e5e5e5; border-radius:10px; overflow:hidden;}
.certificate-item .img img {width:100%; height:100%; object-fit:cover;}
.certificate-item p {padding:20px 20px 0; font-size:var(--fs18); font-weight:500; text-align:center;}

/* ************************ 태블릿 이하(~991) ************************ */
@media (max-width: 1199px) {
	
	
	.company>div .titType1 {padding:0 0 40px;}
	
	/* .company .history {padding-top:300px; position:relative;} */
	/* .company .fixedText {width:calc(100% - 60px); right:30px; } */
	/* .company .fixedText.fixOn {position:absolute;} */
	
	.history-con dl {padding-left:80px;}
	.history-con dl+dl {padding-top: 25px; margin-top: 25px;}
	.history-con .tabItem {display:block;}

	.domestic-wrap {gap:30px;}
	
	.overseas-map {padding:0 0 40px;}
	
	.vision-item .inner {gap:30px;}
	.vision-item .inner .con {width:calc((100% - 30px)/2);}
	
	.skill .skill-box.ceo .skill-item {width:100%;}
	.skill .skill-box.ceo .skill-item .txt {width:calc(100% - 170px)}
	
	.certificate {}
	.certificate-wrap {gap:40px;}
	.certificate-item {width:calc((100% - 40px)/2);}
}


/* ************************ 모바일 ************************ */
@media (max-width: 767px) {
	
	.company>div .titType1 {padding:0 0 30px;}
	
	.history-con dt {padding-bottom:10px; position:static;}
	.history-con dl {padding-left:0;}
	.history-con dl+dl {padding-top: 20px; margin-top: 20px;}
	
	.network-list li h3 {padding:0 0 5px;}
	.network-list li+li {margin:14px 0 0; padding:14px 0 0;}
	.network-list li p {padding-left:0;}
	.network-list li p span {position:static;}
	
	.domestic-wrap {flex-direction:column;}
	
	.overseas-map {padding:0 0 30px;}
	
	.vision-item {flex-direction:column; gap:20px;}
	.vision-item .inner {width:100%; gap:10px;}
	.vision-item .inner .con {width:100%;}
	
	
	
	.skill {}
	.skill .skill-wrap {flex-direction:column; gap:40px;}
	.skill .skill-box {width:100%;}
	
	.certificate {}
	.certificate-wrap {gap:20px;}
	.certificate-item {width:calc((100% - 20px)/2);}
	.certificate-item p {padding:10px 10px 0;}
	
	
	
	
}


