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

/* 인사말 */
.greetings .img {display:block; margin-bottom:var(--space-80); border-radius:var(--radius-24); overflow:hidden;}
.greetings .img img {width:100%; height:100%; object-fit:cover;}
.greetings .cont {display:flex; gap:clamp(40px, calc(64 / var(--inner) * 100vw), 64px);}
.greetings .head {flex:0 0 clamp(280px, calc(495 / var(--inner) * 100vw), 495px);}
.greetings .head .lead {margin-bottom:var(--space-16); color:var(--color-secondary); font-size:var(--font-size-18); line-height:1.44em;}
.greetings .head .tit {font-size:var(--font-size-32); font-weight:600; line-height:1.31em; color:#242424;}
.greetings .head .tit strong {font-weight:700; color:var(--color-primary);}
.greetings .body {flex:1; min-width:0;}
.greetings .body .thanks {margin-bottom:var(--space-32); font-size:var(--font-size-24); font-weight:600; line-height:1.33em; color:rgba(36,36,36,0.9);}
.greetings .body .txt {display:flex; flex-direction:column; gap:var(--space-24);}
.greetings .body .txt p {color:#454545; font-size:var(--font-size-18); line-height:1.67em;}
.greetings .body .sign {display:flex; align-items:center; gap:var(--space-16); margin-top:var(--space-40); color:#242424; font-size:var(--font-size-18); font-weight:600; line-height:1.44em;}
.greetings .body .sign .name {font-size:var(--font-size-44); font-weight:400; line-height:1; letter-spacing:-0.05em; font-family: 'NanumSonPyeonJiCe', sans-serif;}

/* 비전 및 경영이념 */
.vision .intro {margin-bottom:var(--space-60); text-align:center;}
.vision .intro .tit {display:flex; align-items:center; justify-content:center; gap:var(--space-20); margin-bottom:var(--space-24);}
.vision .intro .tit h3 {font-size:var(--font-size-28); font-weight:500; line-height:1.29em; color:#242424;}
.vision .intro .tit h3 strong {font-weight:700; color:var(--color-primary);}
.vision .intro .tit .deco {display:block; flex-shrink:0; width:32px; height:32px;}
.vision .intro .tit .deco img {width:100%; height:100%; object-fit:contain;}
.vision .intro .desc {color:#686868; font-size:var(--font-size-18); line-height:1.67em;}
.vision .cards {display:flex; flex-wrap:wrap; margin:calc(var(--space-15) * -1); list-style:none; padding:0;}
.vision .cards .item {width:25%; padding:var(--space-15);}
.vision .cards .box {display:flex; flex-direction:column; gap:var(--space-16); height:100%; padding:var(--space-40); border:1px solid #ddd; border-radius:var(--radius-24); background:#fff;}
.vision .cards .head {display:flex; flex-direction:column; gap:var(--space-24);}
.vision .cards .icon {display:flex; align-items:center; justify-content:center; width:56px; height:56px; border-radius:var(--radius-8);}
.vision .cards .icon.blue {background:rgba(26,26,129,0.05);}
.vision .cards .icon.red {background:rgba(254,0,0,0.05);}
.vision .cards .icon img {width:32px; height:32px; object-fit:contain;}
.vision .cards .tit {font-size:var(--font-size-20); font-weight:600; line-height:1.4em; color:#242424;}
.vision .cards .txt {color:#686868; font-size:var(--font-size-16); line-height:1.75em;}
.vision .sec2 {background:#fafafa; padding:var(--space-100) 0 var(--space-150);}
.vision .sec2 .contain {display:flex; align-items:center; gap:var(--space-60);}
.vision .sec2 .contain .txt {flex:1; min-width:0;}
.vision .sec2 .contain .txt .head {margin-bottom:var(--space-24);}
.vision .sec2 .contain .txt .en {margin-bottom:var(--space-16); color:var(--color-secondary); font-size:var(--font-size-16); line-height:1.5em;}
.vision .sec2 .contain .txt .tit {font-size:var(--font-size-28); font-weight:600; line-height:1.29em; color:#242424;}
.vision .sec2 .contain .txt p {color:#454545; font-size:var(--font-size-18); line-height:1.67em;}
.vision .sec2 .contain .img {display:block; flex-shrink:0; width:clamp(280px, calc(600 / var(--inner) * 100vw), 600px); border-radius:var(--radius-24); overflow:hidden;}
.vision .sec2 .contain .img img {width:100%; height:100%; object-fit:cover;}

/* 연혁 */
.history .list {position:relative; list-style:none; margin:0; padding:var(--space-20) 0 0; display:flex; flex-direction:column;}
.history .item {position:relative; display:flex; align-items:flex-start; gap:var(--space-60); width:50%; padding-bottom: var(--space-100);}
.history .item:last-child {padding-bottom: 0;}
.history .item::before {content:''; position:absolute; top: .7em; width:1px; height: 100%; background:#ddd;}
.history .item.side-right {margin-left:50%; padding-left: var(--space-60);}
.history .item.side-right::before {left: 0;}
.history .item.side-left {margin-right:50%; padding-right: var(--space-60); flex-direction:row-reverse; text-align:right;}
.history .item.side-left::before {right: 0;}
.history .item:last-child::before {height: 0;}
.history .item.side-right .point {left: 0; transform: translateX(-50%);}
.history .item.side-left .point {right: 0; transform: translateX(50%);}
.history .item .point {flex-shrink:0; width:20px; height:20px; position: absolute; top: 0.7em; border-radius: 50%; background: #fff; border: 6px solid var(--color-primary);}
.history .item .year {flex-shrink:0; font-size:var(--font-size-32); font-weight:700; line-height:1.25em; color:var(--color-primary);}
.history .item .txt p {font-size:var(--font-size-16); line-height:2.5em; color:#454545;}

/* 조직도 */
.organization .img {display:block; width:100%;}
.organization .img img {width:100%; height:100%; object-fit:contain;}

/* 찾아오시는 길 */
.directions .map-area {margin-bottom:var(--space-60); border-radius: 0; overflow:hidden;}
.directions .root_daum_roughmap_landing {width:100%; height:clamp(300px, calc(440 / var(--inner) * 100vw), 440px); margin-bottom:0;}
.directions .root_daum_roughmap .wrap_map {height:100% !important;}
.directions .root_daum_roughmap .wrap_controllers {display:none !important;}
.directions .root_daum_roughmap .cont {display:none !important;}
.directions .root_daum_roughmap .map_border {display:none !important;}
.directions .info {display:flex; flex-wrap:wrap; margin:0; padding:0; list-style:none;}
.directions .info .item {display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--space-32); width:25%; padding:0 var(--space-30); text-align:center; border-right:1px dashed #ddd;}
.directions .info .item:last-child {border-right:0;}
.directions .info .icon {display:flex; align-items:center; justify-content:center; width:56px; height:56px; margin:0;}
.directions .info .icon.red {border-radius:50%; background:var(--color-secondary);}
.directions .info .icon.blue {border-radius:50%; background:var(--color-primary);}
.directions .info .icon img {width:28px; height:28px; object-fit:contain;}
.directions .info .lbl {margin-bottom:var(--space-8); color:#454545; font-size:var(--font-size-16); line-height:1.5em;}
.directions .info .val {color:#242424; font-size:var(--font-size-18); font-weight:600; line-height:1.56em;}
.directions .info .val a {color:inherit; text-decoration:none;}

/* 해외배송 */
.overseas .process {display:flex; flex-wrap:wrap; margin:0; padding:0; list-style:none;}
.overseas .process .item {display:flex; flex-direction:column; align-items:center; gap:var(--space-16); width:33.33333333%; padding:0 var(--space-30); text-align:center; border-right:1px dashed #ddd;}
.overseas .process .item:last-child {border-right:0;}
.overseas .process .img {display:flex; align-items:center; justify-content:center; width:150px; height:150px;}
.overseas .process .img img {width:100%; height:100%; object-fit:contain;}
.overseas .process .tit {color:#242424; font-size:var(--font-size-20); font-weight:600; line-height:1.4;}
.overseas .process .txt {color:#686868; font-size:var(--font-size-16); line-height:1.75;}