.history-con { position: relative; } 
/* 가운데 바 */
.history-percent-bar { position: absolute; left: 39rem; border-radius: 2px; margin-left: -0.2rem; width:4px; height: 100%; background: #eee; } 
.history-percent-bar .percent-bar-child { position: absolute; content: ""; width: 100%; height: 0; background-color: var(--color-point); z-index: 1; border-radius:2px 2px 0 0; } 
.percent-bar-child .point { display: flex; align-items: center; justify-content: center; position: absolute; bottom: -3rem; left: 50%; content: ""; z-index: 10; width: 4.4rem; height: 4.4rem; border-radius: 50%; background-color: var(--color-point); box-shadow: 0.5rem 0.5rem 2.5rem #09738554; transform: translate(-50%, 0); } 
.percent-bar-child .point i { font-size: 2.2rem; color: #fff; } 
/* 연혁 영역 */
.history-year-group-box { position: relative; display: flex; padding-bottom: 15rem; --month-wi:4rem; } 
.history-year-group-box:last-of-type { padding-bottom: 0; } 
/* 왼쪽 연대 */
.history-year-group-box .history-year-group-tit-box { width: 43rem; padding-right: 11rem; box-sizing: border-box; } 
.history-year-group-box .history-year-group-tit { position: relative; top: -3rem; font-size: 8rem; font-weight: 700; letter-spacing: -0.025em; color: var(--color-txt);; line-height: 1.1; transition: all 0.3s; } 
.history-year-group-box.active .history-year-group-tit { color: var(--color-point); } 
/* 오른쪽 연도+내용 */
.history-summary { display: inline-flex; padding: 1rem 3rem; align-items: center; margin-bottom: 2rem; border-radius: 10rem; background: var(--color-point, #222E80); color: #fff; font-size: var(--font-22); font-weight: 700; } 
.history-year-group-box .history-year-list-box { width: calc(100% - 43rem); padding: 0 0 0 11rem; box-sizing: border-box; } 
.history-year-group-box .history-year-item { display: flex; margin-bottom: 5rem; } 
.history-year-group-box .history-year-item:last-of-type { margin-bottom: 0; } 
.history-year-group-box .history-year-item .history-year { display: block; width: 11.5rem; } 
.history-year-group-box .history-year-item .history-year strong { font-size: 2.4rem; font-weight: 700; letter-spacing: -0.02em; color: #222222; line-height: 1.2; } 
.history-year-group-box .history-year-item .history-month-item { margin-bottom: 5rem; } 
.history-year-group-box .history-year-item .history-month-item:last-child { margin-bottom: 0; } 
.history-year-group-box .history-year-item .history-month-item .history-month { width: 11rem; font-size: 2.4rem; font-weight: 700; letter-spacing: -0.025em; color: #000; padding-right: 0.5rem; box-sizing: border-box; } 
.history-year-group-box .history-year-item .history-month-item .history-detail-txt-con { width: 100%; } 
.history-year-group-box .history-year-item .history-month-item .history-detail-txt { display: flex; } 
.history-year-group-box .history-year-item .history-month-item .history-detail-txt .txt { width: calc(100% - var(--month-wi)); margin-top: -0.2rem; font-size: 2rem; font-weight: 500; line-height: 1.5; } 
.history-year-group-box .history-year-item .history-month-item .history-detail-txt .txt p + p { margin-top: .5rem; } 
.history-year-group-box .history-year-item .history-month-item .history-detail-txt .month { display: inline-block; width: var(--month-wi); color: #000; font-size: 2rem; font-weight: 600; line-height: 1.3; } 
.history-year-group-box .history-year-item .history-month-item .history-detail-txt + .history-detail-txt { margin-top: 2rem; } 
/* active */
.history-year-group-box.active .history-year-group-tit { top: -5rem; font-size: 10rem; color: var(--color-point); } 

@media all and (min-width:801px) { 
 .history-year-group-box.reverse { flex-direction: row-reverse; } 
.history-year-group-box.reverse .history-year-group-tit-box { padding-right: 0; padding-left: 11rem; text-align: left; } 
.history-year-group-box.reverse .history-year-list-box { padding: 0 11rem 0 0; } 
.history-year-group-box.reverse .history-year-item { justify-content: flex-end; } 
.history-year-group-box.reverse .history-year-item .history-year,
.history-year-group-box.reverse .history-year-item .history-month-box,
.history-year-group-box.reverse .history-year-item .history-month-item .history-detail-txt { text-align: right; } 
.history-year-group-box.reverse .history-year-item .history-month-item { flex-direction: row-reverse; } 
.history-year-group-box.reverse .history-year-item .history-month-item .history-month { text-align: right; padding-right: 0; padding-left: 0.5rem; } 
 } 
@media all and (max-width:800px) { 
 .history-page { padding-bottom: 9rem; } 
 .history-con { margin-top: 8rem; } 
 .history-percent-bar { left: 3.5rem; } 
 .history-year-group-box { position: relative; flex-wrap: wrap; padding: 4rem 0 10rem 8rem; } 
 .history-year-group-box .history-year-group-tit-box { text-align: left; width: 100%; padding-right: 0; } 
 .history-year-group-box .history-year-group-tit { position: absolute; font-size: 5rem; } 
 .history-year-group-box .history-year-list-box { width: 100%; padding: 2rem 0 0 0; } 
 .history-year-group-box .history-year-item .history-year { width: 11rem; } 
 .history-year-group-box .history-year-item .history-month-box { width: calc(100% - 11rem); } 
 /* active */
 .history-year-group-box.active .history-year-group-tit { top: -5rem; font-size: 7rem; } 
 } 
@media all and (max-width:640px) { 
 .history-year-group-box .history-year-item { flex-wrap: wrap; margin-bottom: 4rem; } 
 .history-year-group-box .history-year-item .history-year { width: 100%; margin-bottom: 1rem; } 
 .history-year-group-box .history-year-item .history-month-box { width: 100%; } 
 } 
@media all and (max-width:576px) { 
 .history-con { margin-top: 3rem; } 
 .history-summary { padding: .5rem 1rem; margin-bottom: 1rem; border-radius: 1rem; font-size: 1.8rem; } 
 .history-year-group-box .history-year-group-tit { font-size: 4rem; } 
 .history-year-group-box.active .history-year-group-tit { top: -2rem; font-size: 4rem; } 
 .history-year-group-box .history-year-list-box { padding: 0; } 
 .history-year-group-box .history-year-item .history-month-item .history-detail-txt .month,
 .history-year-group-box .history-year-item .history-month-item .history-detail-txt .txt { font-size: 1.8rem; } 

 .percent-bar-child .point { width: 3.4rem; height: 3.4rem; } 
 .history-percent-bar { left: 1.5rem; } 
 .history-year-group-box { padding: 3rem 0 9rem 5rem; } 
 } 




 /* 주요 구성원 소개 */
.info-card-list1 { gap: 2.4rem; align-items: stretch; } 
.info-card-list1 .info-card { display: flex; flex-direction: column; height: 100%; border: 1px solid #d9dce5; background: #fff; } 
.info-card-list1 .info-card__head { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; min-height: 27rem; padding: 3rem; text-align: center; background: linear-gradient(180deg, #ffffff 0%, #fafbfd 100%); } 
.info-card-list1 .info-card__icon { display: flex; align-items: center; justify-content: center; width: 9.2rem; height: 9.2rem; margin-bottom: 2rem; border-radius: 50%; background: #f3f5fa; color: #223b98; } 
.info-card-list1 .info-card__icon span { font-size: 2rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1; } 
.info-card-list1 .info-card__title { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; width: 100%; padding-bottom: 1.8rem; border-bottom: 2px solid #223b98; } 
.info-card-list1 .info-card__name { font-size: var(--font-22); font-weight: 700; line-height: 1; } 
.info-card-list1 .info-card__role { position: relative; font-size: var(--font-22); font-weight: 700; color: #223b98; line-height: 1; } 
.info-card-list1 .info-card__role::before { content: ""; width: 1px; height: 100%; background: #cfd5e3; display: inline-block; margin: 0 1.3rem; vertical-align: middle; } 
.info-card-list1 .info-card__summary { margin-top: 1rem; font-size: 1.5rem; font-weight: 400; line-height: 1.45; letter-spacing: -0.02em; color: #5a5f6f; } 
.info-card-list1 .info-card__body { flex: 1; padding: 2.4rem 2.2rem 2.6rem; border-top: 1px solid #eceef3; } 
.info-card-list1 .info-card__body .list-cy { margin-left: 0; } 
.info-card-list1 .info-card__body .list-cy > li { position: relative; padding-left: 3.1rem; font-size: 1.8rem; font-weight: 600; line-height: 1.75; letter-spacing: -0.03em; color: #111; } 
.info-card-list1 .info-card__body .list-cy > li + li { margin-top: 0.8rem; } 
.info-card-list1 .info-card__body .list-cy > li::before { content: ""; position: absolute; top: 0.3rem; left: 0; width: 2.2rem; height: 2.2rem; border-radius: 50%; background: #223b98; } 
.info-card-list1 .info-card__body .list-cy > li::after { content: ""; position: absolute; top: 0.9rem; left: 0.6rem; width: 0.8rem; height: 0.45rem; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg); } 
.info-card-list1 .info-card__body .list-bar li { font-size: 1.8rem; font-weight: 400; line-height: 1.5; color: #505463; } 

@media all and (max-width:1140px) { 
 .info-card-list1 .info-card__head { min-height: 29rem; } 
 } 
@media all and (max-width:960px) { 
 .info-card-list1 .info-card__head { align-items: flex-start; min-height: auto; padding: 2.8rem 2.2rem 3rem; } 
 .info-card-list1 .info-card__body { padding: 2.2rem 1.8rem 2.4rem; } 
 .info-card-list1 .info-card__title {justify-content: flex-start; }
 .info-card-list1 .info-card__summary {text-align: left;}
} 
@media all and (max-width:576px) { 
 .info-card-list1 { gap: 1.6rem; } 
 .info-card-list1 .info-card__icon { width: 7.6rem; height: 7.6rem; margin-bottom: 1.5rem; } 
 .info-card-list1 .info-card__body .list-cy > li { padding-left: 2.8rem; } 
 
 }