@charset "utf-8";
.dot-list li {text-indent: -.8em; padding-left: .8em;}
.dot-list li:before {content: '•'; margin-right: 8px;}
.dot-list li:not(:last-child) {margin-bottom: 5px;}

.page-greetings {gap: clamp(25px, calc(95 / var(--inner) * 100vw), 95px);}
.greeting-img {width: 32.35%; max-width: 427px;}
.greeting-sign {gap: var(--space-16); position: relative;}
.greeting-sign-img {margin-left: -65px;}

/* history timeline */
.history-timeline {position: relative; display: flex; flex-direction: column; gap: var(--space-60);}
.history-timeline:before {content: ''; position: absolute; left: 50%; top: 0; bottom: 0; width: 1px; background: #000;}
.history-cnt {padding-bottom: var(--space-60);}
.history-group {display: flex; align-items: flex-start; gap: calc(var(--space-40) * 2);}
.history-group.left {flex-direction: row;}
.history-group.right {flex-direction: row-reverse;}
.history-year {flex: 1; font-size: var(--font-size-40); font-weight: 600; line-height: 1.4; color: var(--dark-color); width: 120px; text-align: center;}
.history-group.left .history-year {text-align: right;}
.history-group.right .history-year {text-align: left;}
.history-events {flex: 1; display: flex; flex-direction: column; gap: var(--space-10);}
.history-item {display: flex; width: fit-content; padding: 6px var(--space-25); background: #fff; box-shadow: 10px 10px 30px rgba(0, 0, 0, 0.06); border-radius: 47px; font-size: var(--font-size-18); line-height: 1.8; color: var(--dark-color);}
.history-item .month {font-weight: 600; width: 45px;}
.history-group.right .history-item {margin-left: auto;}

/* team */
.team-cnt {max-width: 1082px; margin: 0 auto;}
.team-list {display: flex; flex-wrap: wrap; justify-content: center; gap: clamp(30px, calc(90 / var(--inner) * 100vw), 90px) clamp(15px, calc(139 / var(--inner) * 100vw), 139px);}
.team-item {display: flex; flex-direction: column; align-items: center; flex: 0 0 24.77%; max-width: 268px;}
.team-item:first-child {margin-left: 5%;}
.team-img {position: relative; width: 100%; max-width: 268px;; border-radius: 50%; background: var(--primary-color); overflow: hidden; flex-shrink: 0;}
.team-img:before {content: ''; display: block; width: 100%; padding-bottom: 100%;}
.team-img .img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0;}
.team-img .img img {width: 100%; height: 100%; object-fit: cover; object-position: center top;}
.team-info {margin-top: var(--space-20); font-size: var(--font-size-20); line-height: 1.4; color: var(--dark-color);}
.team-info .name {font-weight: 400;}

/* workflow */
.workflow-box {display: flex; gap: 12px clamp(25px, calc(130 / var(--inner) * 100vw), 130px); padding:clamp(30px, calc(70 / var(--inner) * 100vw), 70px) clamp(15px, calc(110 / var(--inner) * 100vw), 110px); background: #fff; border-radius: var(--radius-30);}
.workflow-box:not(:last-child) {margin-bottom: var(--space-20);}
.icon-workflow {max-width: 258px; width:24.5%; text-align: center;}

/* philosophy */
.philosophy-boxes {display: grid; gap: var(--space-20); grid-template-columns: repeat(2, 1fr);}
.philosophy-box {position: relative; background: #fff; padding: clamp(20px, calc(60 / var(--inner) * 100vw), 60px) clamp(15px, calc(70 / var(--inner) * 100vw), 70px); border-radius: var(--radius-20);}
.philosophy-box .bg {position: absolute; top: 0; right: 0;}

/* 배치 프로그램 */
.sec-batch {padding: var(--space-120) 0; background: #fff; margin-top: calc(var(--space-120) * -1);}
.batch-program-item:not(:last-child) {margin-bottom: var(--space-70);}
.batch-program-item {gap: 25px clamp(35px, calc(64 / var(--inner) * 100vw), 64px);}
.batch-program-gallery {gap: var(--space-12);}
.batch-program-for {width: 49.3%; max-width: 650px;}
.sec-why {padding: var(--space-120) 0; background: #E5E5EC; color: #000;}
.page-program .full-img {height: 195px; overflow: hidden;}
.page-program .full-img img {width: 100%; height: 100%; object-fit: cover; object-position: center center;}
.cards {gap: var(--space-20);}
.card {position: relative; box-shadow: 10px 10px 30px 0 rgba(0, 0, 0, 0.06); overflow: hidden;}
.card .txt {position: absolute; left: 0; bottom: 0; width: 100%; padding: 20px;}
.card .inline {display: inline-block;}
.requirement-boxes {gap: clamp(20px, calc(75 / var(--inner) * 100vw), 75px);}
.requirement-box .icon {margin-left: auto; margin-right: auto; width: clamp(120px, calc(253 / var(--inner) * 100vw), 253px); height: clamp(120px, calc(253 / var(--inner) * 100vw), 253px); border-radius: var(--radius-20); box-shadow:.5em .5em 1.5em 0 rgba(0, 0, 0, 0.06); background: #fff; padding: 30px 10px;}
.requirement-box .icon img {max-height: 100%;}
.target-boxes {gap:var(--space-30);}
.target-box h4 {background: var(--gradient-color); color: #fff; padding: var(--space-16); border-radius: 10px; text-shadow: 0 0 13.686px rgba(0, 0, 0, 0.25);}
.target-box h5 {color: #000; margin-bottom: var(--space-25);}
.target-box .txt {padding: clamp(20px, calc(70 / var(--inner) * 100vw), 70px) 12px; background: #fff; box-shadow: 10px 10px 30px 0 rgba(0, 0, 0, 0.06); border-radius: var(--radius-20); color: rgba(17, 17, 17, 0.60);}
.problem-items {padding: var(--space-50) 0; border-radius: var(--radius-20); box-shadow: 10px 10px 30px 0 rgba(0, 0, 0, 0.06); background: #fff; color: rgba(17, 17, 17, 0.60);}
.problem-item {padding: var(--space-25); line-height: 1.53em;}
.problem-item:not(:last-child) {border-right: 1px solid #b7b7b7;}
.problem-item .img {height: 202px; display: flex; align-items: center; justify-content: center; overflow: hidden;}
.zigzag-item {display: flex; gap: 20px var(--space-50);}
.zigzag-item:nth-child(even) {flex-direction: row-reverse; text-align: right;}
.zigzag-item:not(:last-child) {margin-bottom: 40px;}
.zigzag-item .img {width: 38.5%; max-width: 505px;}
.sec-food {padding: var(--space-120) 0; background: #E5E5EC; color: #000; line-height: 1.7em;}
.support-overlay {display: flex; flex-direction:column; justify-content: center; gap: 1.4em; position: absolute; width: 100%; height: 100%;top: 0; left: 0; padding: var(--space-30); background: rgba(17, 17, 17, 0.67); text-align: center; opacity: 0; transition: .5s;}
.card:hover .support-overlay {opacity: 1;}

.news-head {margin-top: var(--space-120);}
.sec-news {padding: var(--space-40) var(--space-50); border-radius: var(--radius-24); margin-bottom: var(--space-40); background: #fff; box-shadow: 10px 10px 30px 0 rgba(0, 0, 0, 0.06);}
.news-items {display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-40) var(--space-50);}
.news-thumb {position: relative; width: 100%; padding-bottom: 67.4732%; overflow: hidden; border-radius: 12px; box-shadow: 10px 10px 30px 0 rgba(0, 0, 0, 0.06);}
.news-thumb:after {content:''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border: 1px solid #ddd; border-radius: 12px;}
.news-thumb img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center center;}
.news-item {display: flex; flex-direction: column; max-width: 372px;}
.news-tit {overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all;}
.news-item:hover .news-tit {color: var(--secondary-color);}

.inquiry-head {gap: 20px clamp(20px, calc(80 / var(--inner) * 100vw), 80px); margin-top: var(--space-120); margin-bottom:clamp(30px, calc(110 / var(--inner) * 100vw), 110px);}
.company-info:before {content: ''; display: block; width: 27px; height: 7px; background: var(--primary-color); margin-bottom: 20px;}
.company-info li {display: flex;}
.company-info li:first-child {flex-direction: column;}
.company-info li:not(:last-child) {margin-bottom: var(--space-20);}
.company-info strong {min-width: 70px;}