
/*/////////////////////////////////// 소개 /////////////////////////////////////////*/
.about_wrap { width:100%; box-sizing:border-box; margin: 100px 0;  }
.about_wrap > h2{color: #000; font-size: 44px; font-weight: 700; letter-spacing: -0.44px; text-align: center; margin: 70px 0 30px 0; }
.about_wrap > p{text-align: center;  font-size: 20px; font-weight: 500;}
.about_wrap .about_icon{width: 350px ; border-radius: 50%; height: 350px; position: relative; overflow: hidden;  margin: 50px auto;}
.about_inner{padding:50px 20px; display: grid;grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px;}
.about-item{padding:20px 40px; align-items: center; background: #fff; width: 100%; border-radius: 20px; box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);}

.about-item h3{position:relative; margin-bottom:24px; font-size:2rem; font-weight:700; letter-spacing:-0.03em;color:#222; padding-left: 28px;}
.about-item h3::before{content:"";display:block; width:10px; height:10px; position: absolute; left: 0;top: 17px; margin-bottom:14px; background:#1e40af; border-radius:10px;}
.about-item p,
.about-item li{font-size:1.063rem; color:#666; word-break:keep-all;}

@media screen and (max-width:1200px) {
	.about_inner{ padding:50px 20px; display: grid;  grid-template-columns: 1fr;    gap: 40px;}
	.about-item { padding: 20px 40px;}
}

/*/////////////////////////////////// 연혁 /////////////////////////////////////////*/
/* ==============================
	History Layout
============================== */
.history_wrap { width:100%; box-sizing:border-box; margin: 100px 0;     border-top: 1px solid;}
.history_wrap h2{color: #000;     font-size: 44px;    font-weight: 700;    letter-spacing: -0.44px;    text-align: center;      margin: 70px 0;}
.history_wrap * { box-sizing:border-box; }
.history_wrap .history_area { position:relative; padding-top:1px; }
.history_wrap .history_area:before { content:""; position:absolute; left:50%; top:0; width:1px; height:100%; background:#dfe7df; transform:translateX(-50%); }
.history_wrap .history_progress { position:absolute; left:50%; top:0; z-index:1; width:2px; height:0; background:#253c97; border-radius:999px; transform:translateX(-50%); transition:height .08s linear; }

/* ==============================
	Top Image
============================== */
.history_wrap .history-img-box { width:100%; margin-bottom:80px; background:#f8fafc; border:1px solid #ddd; border-radius:20px; border-top-left-radius:50px; overflow:hidden; }
.history_wrap .history-img-box img { display:block; width:100%; height:auto; object-fit:cover; }

/* ==============================
	Period Title
============================== */
.history_wrap .history_group { position:relative; margin-bottom:0; }
.history_wrap .history_group:last-child { margin-bottom:260px; }
.history_wrap .period_tit { position:relative; z-index:3; display:flex; align-items:center; justify-content:center; width:190px; height:56px; margin:0 auto 120px; background:#253c97; border-radius:999px; color:#fff; font-size:20px; font-weight:800; letter-spacing:-0.03em; }

/* ==============================
	History Item
============================== */
.history_wrap .history_item { position:relative; z-index:2; display:grid; grid-template-columns:1fr 86px 1fr; align-items:flex-start; margin-bottom:100px; }
.history_wrap .history_item:last-child { margin-bottom:0; }
.history_wrap .year { grid-column:1; grid-row:1; align-self:start; padding:0 42px 0 0; color:#b9bfc5; font-size:36px; font-weight:800; line-height:1; letter-spacing:-0.04em; text-align:right; transition:.3s; }
.history_wrap .dot { grid-column:2; grid-row:1; align-self:start; position:relative; z-index:4; width:17px; height:17px; margin:9px auto 0; background:#fff; border:5px solid #cfdacf; border-radius:50%; transition:.3s; }
.history_wrap .cont { grid-column:3; grid-row:1; align-self:start; padding:0 0 0 42px; }
.history_wrap .cont ul { margin:0; padding:0; list-style:none; }
.history_wrap .cont li { position:relative; margin-bottom:8px; padding-left:14px; color:#444; font-size:18px; font-weight:400; line-height:1.55; letter-spacing:-0.035em; word-break:keep-all; }
.history_wrap .cont li:last-child { margin-bottom:0; }
.history_wrap .cont li:before { content:""; position:absolute; left:0; top:12px; width:5px; height:5px; background:#253c97; border-radius:50%; }
.history_wrap .cont li b { display:inline-block; margin-right:15px; color:#253c97; font-weight:700; }
.history_wrap .cont li span { color:#999; }

/* ==============================
	Active
============================== */
.history_wrap .history_item.active .year { color:#253c97; }
.history_wrap .history_item.active .dot { background:#253c97; border-color:#253c97; box-shadow:0 0 0 8px rgba(37,60,151,.12); }

/* ==============================
	Responsive
============================== */
@media screen and (max-width:1200px) {
	.history_wrap .history-img-box { margin-bottom:70px; border-radius:18px; border-top-left-radius:42px; }
	.history_wrap .period_tit { margin-bottom:100px; }
	.history_wrap .history_item { grid-template-columns:1fr 70px 1fr; margin-bottom:90px; }
	.history_wrap .year { padding-right:34px; font-size:34px; }
	.history_wrap .cont { padding-left:34px; }
	.history_wrap .cont li { font-size:17px; }
}

@media screen and (max-width:1024px) {
	.history_wrap .history-img-box { margin-bottom:60px; }
	.history_wrap .period_tit { width:180px; height:52px; margin-bottom:80px; font-size:19px; }
	.history_wrap .history_item { grid-template-columns:1fr 58px 1fr; margin-bottom:78px; }
	.history_wrap .year { padding-right:28px; font-size:31px; }
	.history_wrap .cont { padding-left:28px; }
	.history_wrap .cont li { font-size:16px; line-height:1.6; }
	.history_wrap .cont li b { margin-right:12px; }
}

@media screen and (max-width:768px) {
	.history_wrap .history-img-box { margin-bottom:45px; border-radius:16px; border-top-left-radius:32px; }
	.history_wrap .history_area { padding-left:8px; }
	.history_wrap .history_area:before { left:10px; transform:none; }
	.history_wrap .history_progress { left:10px; transform:none; }
	.history_wrap .history_group:last-child { margin-bottom:120px; }
	
	.history_wrap .history-img-box img {width:180%;}

	.history_wrap .period_tit { justify-content:flex-start; width:auto; height:auto; min-height:48px; margin-left:30px; margin-bottom:50px; padding:0 24px; display:inline-flex; font-size:18px; }
	.history_wrap .history_item { display:grid; grid-template-columns:34px 1fr; align-items:flex-start; margin-bottom:55px; }
	.history_wrap .dot { grid-column:1; grid-row:1 / span 2; width:16px; height:16px; margin:7px 0 0 -5px; border-width:4px; }
	.history_wrap .year { grid-column:2; grid-row:1; padding:0 0 12px 20px; font-size:28px; text-align:left; }
	.history_wrap .cont { grid-column:2; grid-row:2; padding:0 0 0 20px; }
	.history_wrap .cont li { margin-bottom:10px; font-size:16px; line-height:1.65; }
	.history_wrap .cont li b { display:block; margin:0 0 3px; }
	.history_wrap .cont li:before { top:12px; }
	.history_wrap .history_item.active .dot { box-shadow:0 0 0 7px rgba(37,60,151,.12); }
}

@media screen and (max-width:480px) {
	.history_wrap .history-img-box { margin-bottom:36px; border-radius:14px; border-top-left-radius:24px; }
	.history_wrap .history_area { padding-left:6px; }
	.history_wrap .history_area:before { left:8px; }
	.history_wrap .history_progress { left:8px; }
	.history_wrap .history_group:last-child { margin-bottom:80px; }
	.history_wrap .period_tit { min-height:44px; margin-bottom:42px; padding:0 20px; font-size:16px; }
	.history_wrap .history_item { grid-template-columns:30px 1fr; margin-bottom:45px; }
	.history_wrap .dot { width:14px; height:14px; margin:6px 0 0 -5px; border-width:4px; }
	.history_wrap .year { padding:0 0 10px 16px; font-size:24px; }
	.history_wrap .cont { padding-left:16px; }
	.history_wrap .cont li { padding-left:12px; font-size:15px; line-height:1.65; }
	.history_wrap .cont li:before { top:11px; width:4px; height:4px; }
	.history_wrap .cont li span { display:inline; }
	.history_wrap .history_item.active .dot { box-shadow:0 0 0 6px rgba(37,60,151,.12); }
}