@charset "utf-8";
#container.history {position: relative; z-index: 1; overflow: hidden;}
#container.history:before {content: ''; z-index: -1; position: absolute; top: -28%; left: -10%; width: 45.625%; height: 100%; background: url('/images/sub/bg-history.jpg') no-repeat left top; background-size: contain; opacity: .1;}
.history-timeline {display: flex; justify-content: flex-start; align-items: flex-start; gap: clamp(40px, calc(128 / var(--inner) * 100vw), 128px);}
.history-timeline .history-tit {display: flex; flex-direction: column; gap: var(--space-8); width: 227px;}
.history-timeline .brand {width: fit-content; font-size: clamp(40px, calc(80 / var(--inner) * 100vw), 80px); font-weight: 700; line-height: 1.1em; background: linear-gradient(to right, var(--primary-color), var(--secondary-color)); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.history-timeline .tit {font-size: var(--font-size-32); font-weight: 700; line-height: 1.375em; color: var(--dark-color);}
.history-item {display: flex; justify-content: flex-start; align-items: flex-start; gap: 15px clamp(24px, calc(56 / var(--inner) * 100vw), 56px); padding: var(--space-40) 0; border-top: 1px solid #DDDDDD;}
.history-item .year {width: 102px; font-size: var(--font-size-32); font-weight: 700; line-height: 1em; color: var(--secondary-color); flex-shrink: 0;}
.history-item .events {display: flex; flex-direction: column; gap: var(--space-25); flex: 1; min-width: 0;}
.history-item .event {display: flex; align-items: center; gap: var(--space-15);}
.history-item .month {font-size: var(--font-size-24); font-weight: 700; line-height: 1.33em; color: var(--secondary-color); width: 46px; flex-shrink: 0;}
.history-item .txt {font-size: var(--font-size-16); font-weight: 400; line-height: 1.5em; color: #454545;}

/* business */
.biz-wrap {display: grid; grid-template-columns: repeat(2, 1fr); gap:clamp(30px, calc(40 / var(--inner) * 100vw), 40px) var(--space-40);}
.biz-card {border-radius: var(--radius-16); display: flex; flex-direction: column; gap: var(--space-25);}
.biz-card .top {flex:1; min-width: 0; display: flex; gap: var(--space-25);}
.biz-card .icon { display: flex; justify-content: center; align-items: center; flex-shrink: 0; width: fit-content; height: fit-content;; padding:var(--space-15); border-radius: 100%;}
.biz-card .icon1 {background: var(--primary-color);}
.biz-card .icon2 {background: #35BACC;}
.biz-card .icon3 {background: var(--third-color);}
.biz-card .icon4 {background: var(--secondary-color);}
.biz-card .list li, .dot-list li {text-indent: -.8em; padding-left: .8em;}
.biz-card .list li:before, .dot-list li:before {content: '•'; margin-right: 8px; color: var(--secondary-color); font-weight: 800;}

.direction-map {height: clamp(270px, calc(600 / var(--inner) * 100vw), 600px);}
.root_daum_roughmap .wrap_map, .root_daum_roughmap {width: 100% !important; height: 100% !important;}
.direction-txt {display: flex; flex-direction: column; gap: var(--space-25);}
.direction-txt .dir-info {display: flex; flex-direction: column; gap: var(--space-15);}
.direction-txt .brand {font-size: var(--font-size-20); font-weight: 700; line-height: 1.4em; color: var(--primary-color);}
.direction-txt .addr {display: flex; flex-direction: column; gap: var(--space-8);}
.direction-txt .addr-main {font-size: var(--font-size-24); font-weight: 600; line-height: 1.17em; color: #2C2C2C;}
.direction-txt .addr-detail {font-size: var(--font-size-18); font-weight: 400; line-height: 1.44em; color: #505050;}
.direction-txt .dir-contact {display: flex; flex-direction: column; gap: var(--space-15);}
.direction-txt .contact-item {display: flex; align-items: center; gap: var(--space-25);}
.direction-txt .contact-item .label-val {display: flex; align-items: center; gap: var(--space-25);}
.direction-txt .contact-item .label {font-size: var(--font-size-18); font-weight: 600; line-height: 1.33em; color: #2C2C2C; flex-shrink: 0;}
.direction-txt .contact-item .val {font-size: var(--font-size-18); font-weight: 400; line-height: 1.44em; color: #505050;}