@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */ 

/* 공통 */


/* 인사말 */
.greetings .point {color: #515a94;}
.greetings .lead {font-size:var(--font-size-36); font-weight:600; line-height:1.4em; letter-spacing:-0.02em; color:#2c2c2c; margin-bottom: var(--space-40);}
.greetings .lead strong {font-weight:600;}
.greetings .img {border-radius:var(--radius-16); overflow:hidden; width: 100%; aspect-ratio: 1440 / 430; margin-bottom: var(--space-70);}
.greetings .img img {width:100%; height:100%; object-fit:cover;}
.greetings .txt {display:flex; flex-direction:column; gap:var(--space-24); font-size:var(--font-size-20); line-height:1.7em; color:#676767; margin-bottom: var(--space-40);}
.greetings .sign {font-size:var(--font-size-20); font-weight:600; line-height:1.7em; color:#505050;}

/* 회사연혁 */
.history .point {color: #515a94;}
.history .img {border-radius:var(--radius-16); overflow:hidden; width: 100%; aspect-ratio: 1440 / 430; margin-bottom: var(--space-70);}
.history .img img {width:100%; height:100%; object-fit:cover;}
.history .cont {display:flex; justify-content: space-between; gap:var(--space-40);}
.history .lead {font-size:var(--font-size-36); font-weight:600; line-height:1.4em; letter-spacing:-0.02em; color:#2c2c2c; margin-bottom: var(--space-40); flex: 1 0 auto;}
.history .lead strong {font-weight:600;}
.history .timeline {width: 50%;}
.history .year {width: 100%; padding-bottom: var(--space-25); border-bottom: 1px solid #ddd; margin-bottom: var(--space-40);}
.history .year span {color: var(--color-primary); font-size:var(--font-size-40); font-weight:600; line-height:1.1em; position: relative;}
.history .year span::after {content: ''; width: 100%; height: 4px; background: var(--color-primary); position: absolute; bottom: calc((var(--space-25) + 2px) * -1); left: 0; border-radius: 4px;}
.history .list {margin-bottom: var(--space-70);}
.history .list li {color: #676767; font-size:var(--font-size-20); line-height:1.7em; margin-bottom: var(--space-16); position: relative; padding-left: 14px;}
.history .list li strong {font-weight:600; margin-right: 10px;}
.history .list li:last-child {margin-bottom: 0;}
.history .list li::before {content: ''; width: 4px; height: 4px; background: #676767; position: absolute; top: 15px; left: 0; border-radius: 50%;}
.history .year-wrap:last-child .list {margin-bottom: var(--space-40);}

/* 찾아오시는 길 */
.directions .root_daum_roughmap {width:100% !important; border-radius:var(--radius-16) !important;}
.directions .root_daum_roughmap .wrap_map {height:clamp(300px, calc(530 / var(--inner) * 100vw), 530px) !important;}
.directions .root_daum_roughmap .cont {display:none !important;}
.directions .root_daum_roughmap .wrap_controllers {display:none !important;}
.directions .root_daum_roughmap .map_border {display: none !important;}
.directions .info {margin-top: var(--space-60);}
.directions .address {margin-bottom: var(--space-40);}
.directions .address .sub {display: block; color: var(--color-primary); font-size:var(--font-size-18); font-weight: 600; line-height:1.7; margin-bottom: var(--space-14);}
.directions .address p {color: #2c2c2c; font-size:var(--font-size-28); font-weight: 600; line-height:1.5;}
.directions .contact {display: flex; align-items: stretch; justify-content: center;}
.directions .contact .tit {display: flex; align-items: center; justify-content: center; color: var(--color-primary); font-size:var(--font-size-18); font-weight: 600; line-height:1.66; padding: 0 var(--space-40); background: #e0e1ec;}
.directions .contact .list {display: flex; align-items: center; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; padding: var(--space-15) 0; width: 100%; line-height: 1.55;}
.directions .contact .list dt {display: flex; align-items: center; padding-left: var(--space-70);}
.directions .contact .list dt .icon {width: 20px; height: 20px; margin-right: var(--space-16); user-select: none;}
.directions .contact .list dt .icon img {width: 100%; height: 100%; object-fit: contain;}
.directions .contact .list dt .lbl {color: #2c2c2c; font-size:var(--font-size-20); font-weight: 600; margin-right: var(--space-30);}
.directions .contact .list .val {color: #676767; font-size:var(--font-size-20);}

/* 제품소개 */
.prd section {margin-bottom: var(--space-70);}
.prd section:last-child {margin-bottom: 0;}
.prd header.tit {margin-bottom: var(--space-24);}
.prd header.tit h3 {color: #2c2c2c; font-size:var(--font-size-24); font-weight: 600; line-height:1.5;}
.prd-img {border-radius:var(--radius-16); overflow:hidden; width: 100%; height: 0; padding-bottom: 37.362%; position: relative; border: 1px solid #ddd;}
.prd-img img {max-width:100%; max-height:100%; object-fit:cover; position: absolute; top: 50%; left: 50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%);}
.prd-info header.tit {border-bottom: 1px solid #eee; padding-bottom: var(--space-24);}
.prd-info .cont p {font-size:var(--font-size-20); line-height:1.7em;}
.prd .table-scroll {overflow-x:auto;}
.prd table {width: 100%; min-width: 980px; border-collapse:collapse; border-spacing:0px; font-size:var(--font-size-18); line-height:1.66em; letter-spacing:-.03em;}
.prd table thead th {padding: var(--space-15) var(--space-10); border:1px solid #ddd; background: #f4f5f8; font-weight:600; color: var(--color-primary);}
.prd table thead th:first-child {border-left:0;}
.prd table thead th:last-child {border-right:0;}
.prd table tbody td {padding: var(--space-15) var(--space-10); border:1px solid #ddd; text-align:center;}
.prd table tbody td:first-child {border-left:0;}
.prd table tbody td:last-child {border-right:0;}