 @charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */

.root_daum_roughmap {width:100% !important;} 
.root_daum_roughmap .wrap_map {height:450px !important;} 

.doc-tit {position:relative; padding-left:16px; margin-bottom:var(--space-25); font-size:var(--font-size-24); line-height:1.3em; letter-spacing:-.03em; color:var(--color-dark);} 
.doc-tit:before {content:''; position:absolute; top:.15em; left:0; width:3px; height:1em; background:linear-gradient(180deg, rgba(23,122,198,1) 50%, rgba(2,82,190,1) 50%);} 

.doc-cnt { margin-bottom:var(--space-80); } 
.doc-cnt:last-child {margin-bottom:0;} 
.doc-cnt.bg-grey { background-color: #f4f4f4; } 

.doc-sub-cnt { padding:var(--padding-100-60); } 
.doc-sub-cnt:last-child { padding-bottom:0; } 
.doc-sub-cnt.bg-grey { background-color: #f9f9f9; } 

.mb150 { margin-bottom:var(--margin-150-70); } 
.mb20 {margin-bottom:var(--margin-20-10);}

.pt0 { padding-top:0 !important; } 
.pb0 {padding-bottom:0 !important;}
.pb100 {padding-bottom:var(--padding-100-60) !important;}

.pt80 {padding-top:var(--space-80);}

.txt-blue { color: var(--color-primary) !important; } 
.txt-grey { color: rgba(255,255,255,.6) !important; }
.txt-dark { color: var(--color-dark) !important; } 
.txt-wht {color: #fff !important;}

.bg-grey { background-color: #f9f9f9; } 

.flex-wrap { display:flex; } 

.table-style table {width:100%; border-collapse:collapse; border-spacing:0px; border-top:2px solid #242424;}
.table-style th {padding:15px; border:1px solid #ddd; background:#f4f4f4; font-weight:600; color:var(--color-dark);}
.table-style td {padding:15px; border:1px solid #ddd; text-align:center;}
.table-style tr th:first-child,
.table-style tr td:first-child {border-left:0;}
.table-style tr th:last-child,
.table-style tr td:last-child {border-right:0;}
.table-style.st2 table {line-height:1.69em;}
.table-style.st2 th {padding:9px; font-weight:700;}
.table-style.st2 td {padding:9px;}
.table-style.st2 td.bg {background:#e7f5ff;}
.table-style.st3 table {font-size:var(--font-size-15); line-height:1.69em;}
.table-style.st3 th {padding:16px 5px;}
.table-style.st3 td {padding:2px 4px;}

/* 회사소개 */
.greetings {text-align:center;}
.greetings .img {border-radius:16px; overflow:hidden;}
.greetings p {margin-top:var(--body-line-height);}
.greetings .lg-txt {font-size:var(--font-size-22); line-height:1.55em;}
.greetings .sign {font-size:var(--font-size-20); font-weight:600;}
.greetings .sign img {height:26px; margin-left:12px;}
.greetings .bottom-img {margin-top:clamp(40px, calc( 80 / var(--inner) * 100vw ), 80px);}

.mission-1 {margin-bottom:var(--space-60); text-align:center;}
.mission-1 .items {display:flex; flex-wrap:wrap; justify-content:center;}
.mission-1 .item {width:33.33333333%; max-width:342px; padding:0 13px;}
.mission-1 .circle {position:relative; background-position:50% 50%; background-repeat:no-repeat; background-size:contain;}
.mission-1 .circle:before {content:''; display:block; padding-bottom:100%;}
.mission-1 .circle dl {display:flex; flex-direction:column; justify-content:center; align-items:center; position:absolute; top:0; left:0; width:100%; height:100%; padding:1em;}
.mission-1 .circle dt {margin-bottom:.5em; font-size:var(--font-size-26); font-weight:700; line-height:1.3em;}
.mission-1 .circle.st1 {background-image:url('../images/sub/mission-1.png');}
.mission-1 .circle.st2 {background-image:url('../images/sub/mission-2.png');}
.mission-1 .circle.st3 {background-image:url('../images/sub/mission-3.png');}
.mission-1 .circle.st1 dt {color:#1679c5;}
.mission-1 .circle.st2 dt {color:#0252be;}
.mission-1 .circle.st3 dt {color:#003a7b;}

.mission-2 dl {display:flex; align-items:flex-start;}
.mission-2 dl:not(:last-child) {margin-bottom:30px;}
.mission-2 dt {width:150px; margin-right:20px; padding:9px; border-radius:50vh; font-size:var(--font-size-18); font-weight:600; color:#fff; text-align:center;}
.mission-2 dd {flex:1 1 auto; min-width:0; width:1%; padding-top:10px;}
.mission-2 .st1 dt {background:var(--color-secondary);}
.mission-2 .st2 dt {background:var(--color-primary);}

.directions-map {margin-bottom:30px; border:1px solid #ddd; border-radius:16px; overflow:hidden;}
.directions-map .root_daum_roughmap .map_border {display:none;}
.directions-map .root_daum_roughmap .wrap_controllers {display:none;}

.directions-info .img {margin-bottom:25px;}
.directions-info .img img {height:40px;}
.directions-info .info {display:flex; flex-wrap:wrap; gap:8px 40px;}
.root_daum_roughmap .cont {display: none;}

/* 제품소개 */
.products {display:grid; grid-template-columns:repeat(2, 1fr); gap:var(--space-60) var(--space-80); padding-top:15px; text-align:center;}
.products .img {position:relative;}
.products .img:before {content:''; position:absolute; top:-15px; left:-15px; width:100px; height:100px; background:var(--color-primary);}
.products .img img {position:relative;}
.products .txt {margin-top:1.11em; font-size:var(--font-size-18); font-weight:500; line-height:1.5em;}

.production-process .flow {margin-bottom:var(--space-150) !important;}
.production-process .items {display:grid; grid-template-columns:repeat(4, 1fr); gap:var(--space-40) var(--space-32); text-align:center;}
.production-process .img {margin-bottom:1em;}
.production-process dt {margin-bottom:.3em; font-size:var(--font-size-18); font-weight:600; line-height:1.3em; color:var(--color-dark);}
.production-process dd {font-size:var(--font-size-15); line-height:1.47em;}
.production-process dd br {display:none;}

@media (min-width: 1400px) {
	.production-process dd br {display:block;}
}

.equipment {display:grid; grid-template-columns:repeat(3, 1fr); gap:var(--space-30); text-align:center;}

/* 품질관리 */
.certificate {display:grid; grid-template-columns:repeat(3, 1fr); gap:var(--space-30); text-align:center;}
.certificate .img {margin-bottom:var(--space-20);}