/* timeline */
.timeline { width: 100%; margin: 160px auto 0; position: relative; display: flex; flex-direction: column; align-items: center; position: relative; } 
   
.timeline-progress { position: absolute; left: 50%; top: 0; width: 2px; height: 0%; /* 초기 높이 0 */
background: #e4e2e2; transform: translateX(-50%); } 
.timeline-progress-before { position: absolute; left: 50%; top: 0; width: 2px; height: 100%; /* 초기 높이 0 */
background: #e4e2e2; transform: translateX(-50%); z-index: -1; } 

.timeline-item { position: relative; margin-bottom: 80px; display: flex; flex-direction: column; align-items: center; min-width: 45%; } 
.timeline-item:nth-child(odd) { align-self: flex-start; text-align: right; } 
.timeline-item:nth-child(even) { align-self: flex-end; text-align: left; } 
.timeline-date { font-weight: 600; color: #215CA6; font-size: 38px; width: 100%; margin-bottom: 20px; } 
/* .timeline-date::before { content: ""; position: absolute; left: -12%; top: 4%; width: 13px; height: 13px; background-color: #215CA6; border-radius: 50%; } 
.timeline-item:nth-child(odd) .timeline-date::before { left: 110%; top: 4%; } */
.timeline-content { /* display: flex; */
gap: 25px; width: 100%; align-items: flex-start; } 
.timeline-content .cont-year { font-size: 30px; font-weight: 500; margin-bottom: 20px; padding-top:10px; } 
.timeline-content .cont-text { flex: 1; font-size: 20px; }
.timeline-content .cont-text ul { margin-top: 3px; } 
.timeline-content .cont-text ul li { margin-bottom: 20px; position: relative; color:#6a6a6a; } 

@media (max-width: 1200px){
.timeline-content .cont-text ul { padding-left: 10px; } 
.timeline-content .cont-text ul li { padding-left: 15px; } 
.timeline-content .cont-text ul li::after { content: ''; width: 4px; height: 4px; background-color: #6a6a6a; border-radius: 100%; position: absolute; top:50%; transform: translateY(-50%); left: 0; } 
.timeline-item { margin-bottom: 15px; } 
.timeline-content .cont-text ul li { margin-bottom: 20px; } 
}
@media (max-width: 543px){
.timeline-content .cont-text ul li::after { top: 10.5px; } 
}

.timeline-item:nth-child(odd) .timeline-content .cont-year { order: 1; } 
.timeline-item:nth-child(even) .timeline-content .cont-year { order: -1; } 

.timeline-bg-wrap { position: absolute;  background-size: contain; background-repeat: no-repeat;} 
.timeline-bg-wrap.first-img { top: 17%; left: 11.5%; width: 385px; height: 200px; background-image: url('/sites/www/images/sub/sub01/timeline_bg01.jpg');} 
.timeline-bg-wrap.second-img { top: 38%; left: 24%; width: 250px; height: 200px; background-image: url('/sites/www/images/sub/sub01/timeline_bg02.jpg');} 
.timeline-bg-wrap.third-img { bottom: 5%; right: 15%; width: 395px; height: 200px; background-image: url('/sites/www/images/sub/sub01/timeline_bg03.jpg');} 

@media (max-width: 1200px){
.timeline-bg-wrap { display: none; } 
}

@media (max-width: 1200px){
.timeline-progress, .timeline-progress-before { left: 10%; } 
.timeline-item { align-self: flex-start; text-align: left; } 
.timeline-item:nth-child(odd),
.timeline-item:nth-child(even) { align-self: flex-start; text-align: left; margin-left: 15%; } 
.timeline-item:nth-child(odd) .timeline-content .cont-year { order: -1; } 
}
@media (max-width: 768px){
.timeline-progress, .timeline-progress-before { left: 4%; } 
.timeline { margin: 100px auto; } 
.timeline-item { margin-bottom: 40px; } 
.timeline-date { font-size: 30px; margin-bottom: 10px; } 
.timeline-content { gap: 20px; } 
.timeline-content .cont-year { font-size: 23px; margin-bottom: 10px; } 
.timeline-content .cont-text { font-size: 16px; } 
.timeline-content .cont-text ul li { margin-bottom: 20px; } 
.timeline-item:nth-child(odd),
.timeline-item:nth-child(even) { margin-left: 11%; } 
}


/* 정책 */
.data-box { border: 1px solid #d2d2d2; padding: 20px; margin: 20px 0; font-size: 18px; line-height: 1.6; border-radius: 15px; } 
.image-container { display: flex; width: 100%; justify-content: space-between; } 
.image-box { width: 50%; margin: 10px 0; padding: 20px; box-sizing: border-box; border: 1px solid #d2d2d2; } 
.image-box img { width: 100%; height: 450px; padding: 30px 40px; } 
figcaption { margin-top: 10px; text-align: center; font-size: 18px; color: #333; } 

@media (max-width: 1024px){
 .image-container { flex-direction: column; }
 .image-box { width: 100%; margin: 10px 0;}
 .image-box img { padding: 15px 20px;} 
 }

/* 정책 탭메뉴 */
.content-container { display: flex; align-items: flex-start; position: relative; } 
.wrap_terms.wrap_policy { width: calc(100% - 200px); margin-left: auto; } 
.tab-menu { display: flex; flex-direction: column; margin-right: 40px; margin-top: 40px; padding-right: 20px; position: sticky; top: 100px; height: fit-content; align-self: flex-start; } 
.tab-menu > a { display: none; } 
.tab-menu > ul a { color: #888; font-weight: 600; margin: 5px 0; transition: background-color 0.3s, color 0.3s; text-align: left; padding: 5px 0; font-size: 22px; text-decoration: none; display: inline-block; position: relative; } 
.tab-menu ul li a::after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 2px; background: #0056b3; transform: scaleX(0); transition: transform 0.3s; transform-origin: left center; } 
.tab-menu a:hover::after { transform: scaleX(1); } 
.tab-menu a.active { color: #0056b3; } 
.tab-menu a.active::after { transform: scaleX(1); } 
.tab-menu a:hover, .active-tab { color: #0056b3; } 

.tit_policy { font-size: 22px; margin-bottom: 10px; font-weight: 600; color: #0056b3; } 
.tit_policy_desc .desc { font-size: 18px; color: #555; line-height: 1.5; /*margin-left: 12px; */ } 
.content-section { margin-top: 50px; } 
.content-section > p { color: #4d4d4d; font-size: 18px; line-height: 33px; } 
.content-section a { line-height: 1.4; } 
.content-section.active a::after { content: ""; transform: scaleX(1); height: 1px; display: block; background: #0072ff; transition: transform 0.3s; transform-origin: left center; } 
.content-section a::after { content: ""; transform: scaleX(0); height: 1px; display: block; background: #0072ff; transition: transform 0.3s; transform-origin: left center; } 
.active { display: block; } 
.tit_policy_desc { margin-top: 10px; line-height: 1.6; } 
.desc_g { font-size: 19px; color: #2a2a2a; margin-bottom: 10px; } 
.tit_subject { font-weight: 600; margin: 10px 0; font-size: 20px; } 

@media (max-width: 700px){
 .content-container { flex-direction: column; } 
 .tab-menu { margin: 0; margin-top: 20px; margin-bottom: 20px; padding-right: 0; width: 100%; top: 60px; z-index: 99; } 
 .tab-menu > a { display: flex; align-items: center; justify-content: space-between;width: 100%; font-size: 18px; height: 55px; padding: 0 15px; border: 2px solid #2969b3; background: #f7f7f7; font-weight: bold; cursor: pointer; } 
 
 /* 드롭다운 화살표 */
 /* .tab-menu > a::after { content: "▼"; font-size: 14px; transition: transform 0.3s ease; } */ 
 /* .tab-menu > a.open::after { transform: rotate(180deg); } */
 .tab-menu > a::before{        
	position: absolute;
	content: '';
	background: url(../images/layout/chevron-right.svg) center no-repeat;
	width: 30px;
	height: 30px;
	top: 12px;
	right: 10px;
	transform: rotate(90deg);
	transition: 0.3s;
  }
 .tab-menu > a.open::before{transform: rotate(270deg);}
 .tab-menu > ul { opacity: 0; max-height: 0; overflow: hidden; position: absolute; left: 0; top: 55px; z-index: 110; width: 100%; background: #fff; transition: max-height 0.3s ease, opacity 0.3s ease; border: 1px solid #dbdbdb; } 
 .tab-menu > ul.open { opacity: 1; max-height: 270px; overflow-y: auto; } 
 .tab-menu ul li { text-align: left; padding: 6px 10px; font-size: 16px; cursor: pointer; } 
 .tab-menu ul li a { text-decoration: none; color: #000; display: block; font-size: 17px; } 
 .tab-menu ul li a.active { font-weight: bold; } 
 .tab-menu ul li a::after { display: none; } 
 .wrap_terms.wrap_policy { width: 100%; } 
 .content-section:first-child { margin-top: 0; } 
 .tit_policy { font-size: 20px; } 
 }


/* 조직도 */
.org-chart { display: flex; flex-direction: column; align-items: center; gap: 100px; text-align: center; padding: 100px 0; background-color: #f6f9fe; margin-bottom: 40px; position: relative; z-index: -2; } 
.org-chart::before { content: ''; position: absolute; left: 50%; top: 15%; height: 35%; background: #CECECE; width: 1px; z-index: -1; } 
.box { padding: 10px 20px; text-align: center; background-color: #fff; border-radius: 10px; border: 1px solid #333077; } 
.box-step01 { background-color: #1e1652; color: white; padding: 40px 20px; } 
.box-step02 { width: 100%; } 
.box-step02 > ul { display: flex; justify-content: space-evenly; position: relative; } 
.box-step02::before { content: ''; position: absolute; top: 36%; left: 20%; right: 20%; height: 1px; background: #CECECE; } 
.box-step02 li { background-color: #333077; color: white; padding: 10px; list-style: none; display: inline-block; width: 15%; text-align: center; } 
.box-step03 { display: flex; gap: 20px; border-radius: 10px; position: relative; } 
.box-step03::before { content: ''; position: absolute; top: 6%; left: 0; right: 0; height: 1px; background: #CECECE; } 

.section { font-size: 20px; align-items: center; background-color: #41438d; padding: 15px 10px; border-radius: 10px; box-sizing: border-box; text-align: center; color: #fff; position: relative; } 
.section.cio { height: fit-content; width: 200px; } 
.section.krem { width: 200px; } 

.sub-section { display: flex; justify-content: center;  width: 100%; gap: 10px; font-size: 18px; } 

.team { border-radius: 5px; width: 200px; text-align: center; } 
.team p { font-size: 20px; margin-bottom: 5px; background-color: #d9d8ea; border-radius: 10px; padding: 15px 10px; margin: 20px 0; } 
.team >ul >li { text-align: center; border: 1px solid #333077; color: #343a40; padding: 10px; border-radius: 10px; margin-bottom: 10px; } 
.committee { width: 200px; text-align: center; border: 1px solid #333077; color: #343a40; padding: 15px; border-radius: 10px; height: 165px; background: #fff; } 
.committee::before { position: absolute; content: ""; width: 124px; height: 2px; top: 13.8%; left: 19.8%; background-color: #41438d; z-index: -1; } 
.committee ul { list-style-type: none; padding: 0; margin-top: 10px; } 
.committee li { margin-top: 5px; font-size: 17px; } 
.krem-group { position: relative; display: flex; flex-direction: column; align-items: center; } 
.krem-group::before { content: ''; position: absolute; top: 0; bottom: 168px; left: 50%; width: 2px; height: 100px; bottom: 200px;  background-color: #41438d; z-index: -1; } 

@media (max-width: 1400px){
 .org-chart { gap: 50px; } 
 .box-step02 > ul { justify-content: center; gap: 50px; } 
 .box-step03 { flex-direction: column; align-items: center; } 

 .org-chart::before,
 .box-step02::before,
 .box-step03::before,
 .krem-group::before { display: none; } 
 .region-group,
 .region-group > .team,
 .krem-group > .team,
 .section.cio,
 .section.krem,
 .section.krem.team,
 .krem-group > .committee,
 .krem-group { width: 100% !important; }
 }

@media (max-width: 700px){
 .sub-section { flex-direction: column; align-items: center; } 
 .sub-section > .team { width: 100%; } 
 .box-step03 { width: 80%; } 
 .section.cio, .office-group { width: 100%; } 
 }

@media (max-width: 500px){
 .box-step02 > ul { flex-direction: column; align-items: center; gap: 20px; } 
 .box-step02 > ul > li { width: 80%; } 
 }

  /* 20250326 조직도 수정 */
.org-chart::before { width: 2px; background: #41438d; left: 58%; height: 39%; } 
.box-step01 { margin-left: 230px; background-color: #FFF; border: 2px solid #41438d; color: #41438d; border-radius: 10px; padding: 14px 25px; font-weight: bold; } 
.box-step01 > p{margin-bottom: 12px;}
.box-step02::before { top: 33.4%; left: 40%; right: 30%; background: #41438d; height: 2px; } 
.box-step02 ul:first-child li:first-child { background-color: #FFF; border: 2px solid #41438d; color: #41438d; font-weight: 500; } 
.box-step02 ul li { padding: 15px 10px; font-size: 20px;display: flex; justify-content: center; align-items: center; border-radius: 10px; width: 150px; margin: 25px 0; } 
.box-step02 ul:first-child > li { margin-top: 0; } 
.box-step02 ul { justify-content: flex-end; margin-right: 290px; gap: 70px; } 
.box-step02 ul:nth-child(2) > li { margin-bottom: 0; } 
.box-step02 ul:nth-child(2)::before { position: absolute; content: ""; width: 36px; height: 2px; top: 64.5%; right: 13.3%; background-color: #41438d; } 
.box-step02 ul:nth-child(2)::after { position: absolute; content: ""; width: 2px; height: 108px; top: -66.5%;right: 16.4%; background-color: #41438d; } 
.box-step03 { margin-top: -30px; width: 100%; justify-content: center; } 
.box-step03::before { background-color: #41438d; height: 2px; left: 28%; right: 10%; z-index: -1; top: 6%; } 
.box-step03 .team { width: 150px; } 
.team >ul >li { height: 90px; display: flex; flex-direction: column; justify-content: center; align-items: center; word-break: keep-all;} 
.box-step03 .krem { width: 150px; } 

@media (max-width: 1400px){
 .org-chart .box-step02 li { margin: 0; width: 100%; } 
 .box-step01 { width: 620px; margin-left: 0; display: flex; justify-content:space-around; align-items: center;  } 
 .box-step01 > p{margin-bottom: 0;}
 .box-step02 { width: 100%; display: flex; flex-direction: column; align-items: center; } 
 .box-step02 ul { display: flex; flex-direction: column; align-items: center; margin-right: 0; gap: 10px; width: 620px; } 
 .box-step02 ul:nth-child(2) { margin-top: 10px; } 
 .box-step02 ul:nth-child(2)::after { display: none; } 
 .box-step02 ul:nth-child(2)::before { display: none; } 
 .box-step03 { margin-top: 0; width: 620px; } 
 .committee { width: 100%; margin-bottom: 30px; } 
 .committee::before { display: none; } 
 .box-step03 .krem-group .team:nth-child(1) { width: 100%; } 
 .team >ul >li { height: 80px; } 
 .office-group .sub-section .team li { height: 70px; } 
 }

@media (max-width: 700px){
 .box-step01 > p{ font-size: 16px;}
 .box-step01 > img{ width: 100px; margin-left: 10px;}
 .box-step01, .box-step02 { max-width: 80%; } 
 .box-step02 ul { width: 100%; } 
 .box-step03 { width: 80%; } 
 .box-step03 .team { width: 100%; } 
 .office-group .sub-section .team li { height: 60px; } 
 }
@media (max-width: 380px){
 .box-step01 > img{ width: 80px; margin-left: 0;}
 }


 /*250313*/

/* 서비스 목표 */
.item-box-wrap { position: relative; width: 100%; box-shadow: 0 0 10px rgba(0, 75, 176,.25); border-radius: 100px; } 
.item-box-wrap .item-text { width: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 3.4375rem 0; } 
.item-box-wrap .item-text h3 { width: 100%; display: flex; justify-content: center; color: #004BB0; font-size: 1.875rem; font-weight: bold; margin-bottom: 1.875rem; } 
.item-box-wrap .item-text p { font-size: 1.625rem; font-weight: bold; color: #4d4d4d; } 

.item-box { position: relative; display: flex; justify-content: center; align-items: center; max-width: 100%; list-style-type: none; padding: 0; height: 32rem; } 
.item-img { position: relative; display: flex; justify-content: center; width: 100%; height: 15.375rem; } 
.item-img::before { position: absolute; content: ""; width: 60.6875rem; height: 21.25rem; background-image: url('../images/sub/sub0101-word.svg'); background-repeat: no-repeat; background-size: contain; top: 3.75rem; left: 50%; transform: translateX(-50%); z-index: -1; } 
.item-img img { position: absolute; top: -2rem; width: 45.9375rem; height: 30.3125rem;}

.item-box li { display: flex; flex-direction: column; justify-content: center; border-radius: 20px; padding: 0; box-sizing: border-box; } 
.item-box .card-title { position: absolute; display: flex; justify-content: center; align-items: center; width: 23.5625rem; height: 23.5625rem; border-radius: 100%; font-size: 1.625rem; font-weight: 600; color: white; line-height: 2.5rem; text-align: center; } 
.item-box .box1 .card-title { background-color: rgba(50, 97, 176, .85); } 
.item-box .box2 .card-title { background-image: url('../images/sub/sub0101-box2-card-title-bg.svg'); background-repeat: no-repeat; background-size: contain; } 
.item-box .box3 .card-title { background-color: rgba(41, 105, 179, .85); } 
.item-box .box4 .card-title { background-color: rgba(68, 111, 185, .85); } 

.card-content { display: flex; flex-direction: column; list-style-type: none; background-color: white; font-size: 18px; color: #4d4d4d; font-weight: 400; line-height: 25px; margin-top: 18.5625rem; } 
/* .card-content li { margin-bottom: 10px; padding: 0; width: 100%; height: auto; min-height: auto; font-size: 18px; line-height: 1.5; text-align: left; border: none; background: transparent; overflow: visible; box-sizing: border-box; display: list-item; } */
.card-content li { width: 350px; font-size: 16px; line-height: 1.5; text-align: left; border: none; background: transparent; overflow: visible; box-sizing: border-box; position: relative; word-wrap: break-word; overflow-wrap: break-word; word-break: keep-all; } 
.card-content li::before { content: ""; position: absolute; left: 0; top: 10px; transform: translateY(-50%); width: 7px; height: 7px; background: url('../images/sub/list-bul03.svg') no-repeat center center; background-size: contain; } 
.card-content li:last-child { margin-bottom: 0; } 

@media (max-width: 1200px){
 .item-box { flex-direction: column; align-items: center;}
 .item-box li { width: 100%; }
 .card-content { display: flex; flex-wrap: wrap; } 
 .card-content li { width: 50%; } 
 }

@media (max-width: 500px){
 .item-box-wrap { padding: 20px; } 
 .item-wrap p { font-size: 18px;
 min-width: 200px; text-align: center; } 
 .item-text { font-size: 16px; }
 .card-title { font-size: 16px; }
 .card-content li { font-size: 14px;}
 .card-content { display: block; }
 .card-content li { width: 100%; } 
}


/* 서비스 비전/미션 */
.ser-container { display: flex; justify-content: space-between; gap: 30px; position: relative; } 
.ser-container:before { /* content: ''; position: absolute; top: 50px; left: 0; right: 0; height: 4px; background: linear-gradient(to right, #d7e3fd, #3261b0); z-index: 0; */}
.ser-inner-box { border-radius: 25px; background: #f8f9fe; padding: 55px 75px 55px 75px; margin-bottom: 50px; } 
.ser-item { flex: 1; background-color: #fff; border-radius: 20px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); padding: 25px; position: relative; z-index: 1; transition: transform 0.3s ease; } 
.ser-item:hover { transform: translateY(-5px); } 
.ser-number { font-size: 60px; font-weight: bold; color: #e8ecf9; position: absolute; top: 10px; right: 20px; z-index: 0; opacity: 0.7; } 
.ser-content { position: relative; z-index: 2; padding: 10px; } 
.ser-content > .ser-title { font-size: 22px; color: #000; font-weight: 600; } 
.ser-content > .ser-desc { font-size: 18px; font-weight: 400; line-height: 1.6; color: #4d4d4d; margin-top: 30px; } 

@media (max-width: 1400px){
 .ser-container { flex-direction: column; } 
 .ser-container:before { display: none; } 
 .ser-item { margin-bottom: 20px; } 
 }

@media (max-width: 500px){
 .ser-inner-box { padding: 20px; } 
 .ser-item { margin-bottom: 20px; padding: 20px; flex-direction: column; } 
 .ser-number { display: none; } 
 .ser-content { padding: 10px; } 
 .ser-content > .ser-title { font-size: 18px; } 
 .ser-content > .ser-desc { font-size: 14px; } 
 }


/* 참여자 구성 및 혜택 */
.feature-item { display: flex; margin-bottom: 30px; align-items: center; } 
.feature-image { flex: 0 0 auto; margin-right: 60px; width: 250px; } 
.feature-image img { border-radius: 10px; width: 100%; height: auto; display: block; margin-top: 60px; } 
.feature-text { flex: 1; } 

@media (max-width: 768px){
 .feature-item { flex-direction: column; } 
 .feature-image { margin-right: 0; margin-bottom: 15px; width: 100%; } 
 }


/* Idp 사용방법 */
.idp-use-wrap { max-width: 1400px; width: 90%; margin: 0 auto; } 
.idp-use { width: 100%; display: flex; align-items: center; justify-content: center; gap: 80px; } 
.idp-use li { width: calc(25% - 60px); padding: 15px; border-radius: 35px; display: flex; align-items: center; justify-content: center; flex-direction: column; box-shadow: 0px 5px 10px 0 rgba(121, 121, 121, 0.06); background-color: #fff; border: 1px solid #e5e5e5; position: relative; } 
.idp-use li:not(:last-child)::after { content: ''; width: 50px; height: 50px; position: absolute; top: 50%; transform: translateY(-50%); right: -65px; background: url('../images/main/arrow.png') no-repeat center center; background-size: 50%; } 
.idp-use li .img-box { width: 100%; height: 200px; background-color: #f5f5f6; box-shadow: inset 0px 5px 10px 0 rgba(121, 121, 121, 0.06); border-radius: 30px; display: flex; align-items: center; justify-content: center; } 
.idp-use li .img-box img { object-fit: contain; width: 120px; height: 120px; } 
.idp-use li .txt-box { width: 100%; height: 80px; display: flex; flex-direction: column; align-items: center; justify-content: center; } 
.idp-use li .tit { font-weight: 600; font-size: 18px; color: #004BB0; } 
.idp-use li p { font-family: Pretendard; font-size: 20px; font-weight: 500; text-align: center; word-wrap: break-word; overflow-wrap: break-word; word-break: keep-all; } 

@media (max-width: 1200px){
.idp-use li .img-box { height: 150px; } 
.idp-use li .img-box img { width: 90px; height: 90px; } 

}

@media (max-width: 1024px){
.idp-use { flex-wrap: wrap; gap: 30px; } 
.idp-use li { width: calc(50% - 15px); } 
.idp-use li:not(:last-child)::after { display: none; } 
}

@media (max-width: 700px){
.idp-use { flex-wrap: wrap; gap: 0; } 
.idp-use li { width: 100%; } 
.idp-use li:not(:last-child) { margin-bottom: 60px; } 
.idp-use li:not(:last-child)::after { display: block; } 
.idp-use li:not(:last-child)::after { top: auto; bottom: -55px; left: 50%; transform: translateX(-50%) rotate(90deg); } 
.idp-use li .img-box { height: 120px; } 
.idp-use li .img-box img { width: 80px; height: 80px; } 
.idp-use li .txt-box { height: 60px; } 
}



 /* 20250327 서비스 개요 수정 */

.sub-container { display: flex; flex-direction: column; align-items: center; width: 100%; text-align: center; } 

/* 첫번째 컨텐츠 스타일 */
.sichimi { position: relative; width: 100%; height: 480px; margin-top: 80px; } 
.sichimi::before { position: absolute; content: ""; width: 1px; height: 170px; background: #ccc; bottom: 0; left: 50%; transform: translateX(-50%); } 
.sichimi::after { position: absolute; content: ""; width: 1px; height: 85px; background: #1f5aa9; bottom: 85px; left: 50%; transform: translateX(-50%); } 
.sub-contents01 { position: relative; display: flex; flex-direction: column; align-items: center; width: 100%; } 
.sub-contents01 .sub01-con-title, .sub-contents01 .sub01-con-title span { font-size: 80px; font-weight: 800; color: #B5B5B5; margin-bottom: 30px; } 
.sub-contents01 .sub01-con-title span { color: #888; } 
.sub-contents01 .sub01-con-txt { font-size: 1.3rem; color: #434343; line-height: 1.6; font-weight: 400; word-break: keep-all; } 
.sub-contents01 .sub01-con-title { position: relative; display: inline-block; font-size: 48px; line-height: 1.2; font-weight: 700; letter-spacing: -0.5px; white-space: nowrap; } 
.sub-contents01 .sub01-con-title .overlay-text { position: relative; display: inline-block; font-size: 48px; line-height: 1.2; font-weight: 700; letter-spacing: -0.5px; white-space: nowrap; } 
.sub-contents01 .sub01-con-title .text-part { opacity: 1; position: relative; display: inline-block; } 

@media (max-width: 1200px) {
    .sichimi::after  { bottom: 55px; } 
    .sichimi::before { bottom: -30px; } 
}

/* 서비스 목표 섹션 */
.service { justify-content: center; width: 100%; margin: 85px 0;} 
.sub-contents02 p.sub02-con-title { font-size: 42px; color: #333; font-weight: bold; margin-bottom: 30px; } 
.sub-contents02 span.sub02-con-txt { font-size: 1.5rem; font-weight: 500; color: #434343; } 

/* 기능 블록 스타일 */
.sub-contents03 { display: flex; justify-content: center; gap: 20px; width: 100%; } 
.sub-contents03 img{width: 100%; max-width: 100%;}
.sub-box01, .sub-box02, .sub-box03, .sub-box04 { display: flex; flex-grow: 1; flex-direction: column; justify-content: flex-start; align-items: flex-start; gap:20px; padding: 38px; border-radius: 20px; text-align: left; } 
.sub-box01 { background: #f9f9f9; gap: 75px; width: 40%;} 
.sub-box02 { background: #ebf6fc; width: 100%; } 
.sub-box03-right{width: 60%;}
.sub-box03-bottom { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 20px; } 
.sub-box03, .sub-box04 { background: #ebf6fc; width: calc(50% - 10px); box-sizing: border-box; max-width: 100%;}

.scroll-box { transform: scaleX(0); transform-origin: center; transition: transform 0.5s ease-in-out, opacity 0.5s ease-in-out; opacity: 0;}
.scroll-box.show { transform: scaleX(1); opacity: 1;}

.box01-svg{width: 260px; height: 260px; align-self: center;}
.box02-svg, .box03-svg, .box04-svg { width: 60px; height: 60px; } 

.sub-con03-tit span { font-size: 24px; font-weight: bold; color: #434343; word-break: keep-all; display: block; margin-bottom: 15px; line-height: 1.5; } 
.sub-con03-list p { position: relative; font-size: 18px; color: #434343; line-height: 1.6; } 

@media (max-width: 1365px){
    .sub-box01 { justify-content: space-evenly;}
}
@media (max-width: 1150px){
    .sub-contents03 {flex-wrap: wrap; }
    .sub-box01 { width: 100%; justify-content: space-evenly;}
    .sub-box03-right{width: 100%;}
    .sub-box01 { gap: 20px; } 
    .box01-svg{width: 170px; height: 170px; margin-top: 0;}
    
}
@media (max-width: 980px){
    .sub-contents01 .sub01-con-title, .sub-contents01 .sub01-con-title span { font-size: 62px; }
    .service { margin: 40px 0;}
	.box01-svg{width: 140px; height: 140px; margin-top: 0;}
    .sub-box03-bottom {flex-direction: column;}
    .sub-box03, .sub-box04 {width: 100%;}
}

@media (max-width: 700px){
    .sichimi { height: 425px;}
    .sub-contents01 .sub01-con-title, .sub-contents01 .sub01-con-title span { font-size: 30px; margin-bottom: 10px; }
    .sub-contents01 .sub01-con-txt {font-size: 18px;}
    .sub-contents02 p.sub02-con-title {font-size: 30px; margin-bottom: 18px;}
    .sub-contents02 span.sub02-con-txt {font-size: 18px;}
    .sub-box01, .sub-box02, .sub-box03, .sub-box04 {padding: 26px;}
    .box02-svg, .box03-svg, .box04-svg {width: 50px; height: 50px;}
    .sub-con03-tit span {font-size: 20px; margin-bottom: 8px;}
    .sichimi::before { height: 100px; } 
    .sichimi::after { height: 55px; bottom: 45px;} 
    .sub-con03-list p {font-size: 17px;}
}


/* 서브 sp-list-box */
.sp-list-box { padding: 70px 0 0px; position: relative; } 
.sp-list-box .list-dot { position: absolute; background-size: cover; background-position: center; transition: all ease 0.5s; border-radius: 50%; } 
.sp-list-box .list { display: flex; flex-wrap: wrap; position: relative; z-index: 10; margin-top: 40px; /* margin: 0 -12px -35px;*/ height: 400px;} 
.sp-list-box .list .list-item { height: 180px; position: relative; width: calc(25% - 24px); margin: 0 12px 25px; padding: 22px 24px; border-radius: 25px; background: rgba(247, 246, 246, 0.6); border: 2px solid transparent; transition: all 0.3s ease; overflow: hidden;} 
.sp-list-box .list .list-item[style*="display: none"] { opacity: 0; transform: scale(0.9); }
.sp-list-box .list .list-item .list-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; margin: 0 0 20px; } 
.sp-list-box .list .list-item .list-head strong { transition: all ease 0.5s; border-radius: 50px; height: 45px; padding: 0 18px; font-size: 18px; font-weight: 600; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; border: 1px solid; } 
.sp-list-box .list .list-item .list-body .inner { display: block; pointer-events: none; } 
.sp-list-box .list .list-item .list-body .inner strong { display: -webkit-box; font-size: 21px; font-weight: bold; line-height: 1.5; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } 
.sp-list-box .list .list-item .list-body .inner p { display: -webkit-box; padding: 20px 0 0; margin: 20px 0 0; border-top: 1px solid #bebebe; font-size: 17px; line-height: 1.5; color: #454545; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 3; } 
.sp-list-box .list .list-item .list-body .more { pointer-events: none; opacity: 0; position: absolute; right: -15px; bottom: -15px; width: 60px; height: 60px; font-size: 0; background: url('/sites/www/images/main/ico_list_more.svg') no-repeat center / cover; transition: all ease 0.5s; box-shadow: 3px 3px 4px rgba(124, 124, 124, 0.25); border-radius: 50%; } 
.sp-list-box .list .list-item .list-foot { margin-top: 34px; display: none;} 

/* sp hover */
/* .sp-list-box .list .list-item02:hover {margin-top: -215px;} */
.sp-list-box .list .list-item:hover { height: 385px; background: #fff url('/sites/www/images/main/bg_list.svg') no-repeat center / 150%; box-shadow: 4px 5px 4px rgba(46, 46, 46, 0.25); z-index: 1; margin-top: -205px;} 
.sp-list-box .list .list-item-down:hover {margin-top:0; margin-bottom: -207px;}
.sp-list-box .list .list-item:hover .list-foot { display: block;}
.sp-list-box .list .list-item:hover .list-body .more { pointer-events: inherit; opacity: 1; } 
.sp-list-box .list .list-item.yellow .list-head strong { color: #e2c12f; border-color: #e2c12f; } 
.sp-list-box .list .list-item.yellow:hover { border-color: #e2c12f; } 
.sp-list-box .list .list-item.yellow:hover .list-head strong { background: #eecc36; color: #fff; }
.sp-list-box .list .list-item.red .list-head strong { color: #F05F82; border-color: #F05F82; } 
.sp-list-box .list .list-item.red:hover { border-color: #F05F82; } 
.sp-list-box .list .list-item.red:hover .list-head strong { background: #F05F82; color: #fff; } 
.sp-list-box .list .list-item.orange .list-head strong { color: #F1A046; border-color: #F1A046; } 
.sp-list-box .list .list-item.orange:hover { border-color: #F1A046; } 
.sp-list-box .list .list-item.orange:hover .list-head strong { background: #F1A046; color: #fff; } 
.sp-list-box .list .list-item.green .list-head strong { color: #65C7B0; border-color: #65C7B0; } 
.sp-list-box .list .list-item.green:hover { border-color: #65C7B0; } 
.sp-list-box .list .list-item.green:hover .list-head strong { background: #65C7B0; color: #fff; } 
.sp-list-box .list .list-item.blue .list-head strong { color: #0087CC; border-color: #0087CC; } 
.sp-list-box .list .list-item.blue:hover { border-color: #0087CC; } 
.sp-list-box .list .list-item.blue:hover .list-head strong { background: #0087CC; color: #fff; }
.sp-list-box .list .list-item.lightgreen .list-head strong { color: #83b973; border-color: #83b973; } 
.sp-list-box .list .list-item.lightgreen:hover { border-color: #83b973; } 
.sp-list-box .list .list-item.lightgreen:hover .list-head strong { background: #83b973; color: #fff; } 
.sp-list-box .list .list-item.purple .list-head strong { color: #8C73B8; border-color: #8C73B8; } 
.sp-list-box .list .list-item.purple:hover { border-color: #8C73B8; } 
.sp-list-box .list .list-item.purple:hover .list-head strong { background: #8C73B8; color: #fff; } 

.sp-list-box .list .list-item.title { width: calc(100% - 24px); background: none !important; padding: 0; border-radius: 0; border: 0 !important; box-shadow: none !important; display: flex; flex-wrap: wrap; align-items: center;} 
.sp-list-box .list-item.title .list-left { flex: 1; min-width: 0; } 
.sp-list-box .list-item.title .list-left small { font-size: 20px; font-weight: 600; color: #605b5b; line-height: 1.5; display: block; } 
.sp-list-box .list-item.title .list-left h2 { margin: 5px 0 0; font-size: 43px; font-weight: 500; line-height: 1; color: #292929; } 
.sp-list-box .list-item.title .list-left h2 strong { font-size: 43px; font-weight: 700; line-height: 1; color: #202020; } 
.sp-list-box .list-item.title .list-left h2 b { font-size: 43px; font-weight: 700; color: #0E70DD; } 
.sp-list-box .list-item.title .list-left ul { max-width: 1300px; margin: 30px -5px -20px; display: flex; flex-wrap: wrap; } 
.sp-list-box .list-item.title .list-left ul li { margin: 0 5px 20px; } 
.sp-list-box .list-item.title .list-left ul li a { height: 45px; border-radius: 400px; padding: 0 17px; font-size: 16px; font-weight: 600; transition: all ease 0.5s; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; } 
.sp-list-box .list-item.title .list-left ul li.all a { background: #eeeeee; color: #2D2D2D; } 
.sp-list-box .list-item.title .list-left ul li.yellow a { background: #FEFFD8; color: #D3A423; } 
.sp-list-box .list-item.title .list-left ul li.red a { background: #FFD2DD; color: #F05F82; } 
.sp-list-box .list-item.title .list-left ul li.green a { background: #D9F1EC; color: #1FAD8D; } 
.sp-list-box .list-item.title .list-left ul li.blue a { background: #E8F2FF; color: #0087CC; } 
.sp-list-box .list-item.title .list-left ul li.orange a { background: #FFEDD9; color: #EC8615; } 
.sp-list-box .list-item.title .list-left ul li.lightgreen a { background: #E0F5DA; color: #729867; } 
.sp-list-box .list-item.title .list-left ul li.purple a { background: #E1D8F1; color: #7052A6; }  
.sp-list-box .list-item.title .list-left ul li a:hover { box-shadow: 4px 4px 4px rgba(69, 69, 69, 0.17); } 
.sp-list-box .list .list-item.title .list-right div { animation: colorCycle 1s infinite; margin: 0 0 8px; font-size: 0; display: block; width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 15px solid #858585; transition: all ease 0.3s; } 
.sp-list-box .list .list-item.title .list-right div:last-of-type { margin: 0; } 
.sp-list-box .list .list-item.add { background: none !important; padding: 0; border-radius: 0; border: 0 !important; box-shadow: none !important; } 
.sp-list-box .list .list-item.add a { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; width: 100%; height: 100%; } 
.sp-list-box .list .list-item.add a p { width: 82px; height: 82px; font-size: 0; border-radius: 50%; background: #4F6175 url('/sites/www/images/main/ico_list_add.svg') no-repeat center / 27px auto; box-shadow: 4px 4px 4px rgba(168, 168, 168, 0.25); position: relative; } 
.sp-list-box .list .list-item.add a p:before { position: absolute; content: ""; left: 50%; top: -40px; transform: translateX(-50%); width: 1px; height: 34px; background: rgba(0,0,0,0.29); }
.sp-list-box .list .list-item.add a p:hover { background-color: #2f445c; transition: all ease 0.5s; } 
.sp-list-box .list .list-item.image { padding: 0 20px; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; background: none !important; padding: 0; border-radius: 0; border: 0 !important; box-shadow: none !important; } 
.sp-list-box .list .list-item.image img { width: 100%; max-width: 158px; }

/* sp 리스트 */
.sp-list-box .list .list-item .list-body strong { line-height: 30px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; word-break: break-word; }
.sp-list-box .list .list-item .list-foot .list-details{ font-size: 17px; line-height: 26px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; word-break: break-word;}
.sp-list-box .list .list-item .list-foot .list-btn-wrapper{ display: flex; gap: 10px; justify-content: end; position: absolute; bottom: 25px; right: 25px;}
.sp-list-box .list .list-item .list-foot .list-btn-wrapper .list-btn{position: relative; background: #fff; width: 50px; height: 50px; border-radius: 50%; transition: all 0.4s ease;}

.sp-list-box .list .list-item .list-foot .list-btn-wrapper .list-btn.gray{ background:url('/sites/www/images/sub/sub02/ico_sp_window.svg') no-repeat center; background-color:  #909cb2;}
.sp-list-box .list .list-item .list-foot .list-btn-wrapper .list-btn.blue{ background:url('/sites/www/images/sub/sub02/ico_sp_info.svg') no-repeat center; background-color: #364c73; }
.sp-list-box .list .list-item .list-foot .list-btn-wrapper .list-btn .foot-icon-wrapper { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;} 
.sp-list-box .list .list-item .list-foot .list-btn-wrapper .list-btn .foot-icon-wrapper button { transition: all 0.4s ease; display: none; transform: translateX(20px); padding: 0 5px;} 
.sp-list-box .list .list-item .list-foot .list-btn-wrapper .list-btn .foot-icon-wrapper .quick-menu {transition: all 0.4s ease; display: none; pointer-events: none; transform: translateX(20px); padding: 0 5px;} 

.sp-list-box .list .list-item .list-foot .list-btn-wrapper .list-btn.gray .foot-icon { background: url('/sites/www/images/sub/sub02/ico_sp_window.svg') no-repeat center;} 
.sp-list-box .list .list-item .list-foot .list-btn-wrapper .list-btn.gray .foot-icon { opacity: 1; transform: translateX(0px); width: 24px; height: 24px;} 
.sp-list-box .list .list-item .list-foot .list-btn-wrapper .list-btn.blue .foot-icon { background: url('/sites/www/images/sub/sub02/ico_sp_info.svg') no-repeat center; } 
.sp-list-box .list .list-item .list-foot .list-btn-wrapper .list-btn.blue .foot-icon { opacity: 1; transform: translateX(0px); width: 24px; height: 24px; } 
.sp-list-box .title .list-left ul li.active a { box-shadow: 4px 4px 4px rgba(69, 69, 69, 0.25); }


.sp-list-box .list .list-item .list-foot .list-btn-wrapper .list-btn.gray:hover{ background-image: none; }
.sp-list-box .list .list-item .list-foot .list-btn-wrapper .list-btn.blue:hover{ background-image: none; }
.sp-list-box .list .list-item .list-foot .list-btn-wrapper .list-btn:hover { width: 120px; border-radius: 60px; } 
.sp-list-box .list .list-item .list-foot .list-btn-wrapper .list-btn:hover .foot-icon-wrapper .quick-menu { display: flex; gap: 5px; pointer-events: auto; transform: translateX(0); color: #fff; } 
.sp-list-box .list .list-item .list-foot .list-btn-wrapper .list-btn:hover .foot-icon-wrapper button { display: flex; gap: 5px; pointer-events: auto; transform: translateX(0); color: #fff; }

/* @media (hover: none){
.sp-list-box .list .list-item .list-foot .list-btn-wrapper .list-btn:active { width: 120px; border-radius: 60px; transition: all 0.4s ease; } 
.sp-list-box .list .list-item .list-foot .list-btn-wrapper .list-btn:active .foot-icon-wrapper .quick-menu { display: initial; pointer-events: auto; transform: translateX(0); color: #fff; }
.sp-list-box .list .list-item .list-foot .list-btn-wrapper .list-btn:active .foot-icon-wrapper button { display: initial; pointer-events: auto; transform: translateX(0); color: #fff; } 
} */


@media (max-width: 1300px){
/* .sp-list-box .list { margin:0 -12px -24px; }  */
.sp-list-box .list .list-item { width: calc(33.33% - 24px); padding: 20px; margin: 0 12px 24px;} 
.sp-list-box .list .list-item.title { width: 100%; margin-bottom: 34px; }
}

@media (max-width: 1100px){
/* .sp-list-box .list { margin: 0 -7.5px -15px; }  */
.sp-list-box .list .list-item { border-radius: 10px; width: calc(33.33% - 15px); margin: 0 7.5px 15px; padding: 20px; height: 148px;} 
.sp-list-box .list .list-item:hover {height: 310px; margin-top: -162px;}
.sp-list-box .list .list-item-down:hover {margin-top:0; margin-bottom: -164px;}
/* .sp-list-box .list .list-item .list-item-down {height: 225px;} */
.sp-list-box .list .list-item .list-head { margin: 0 0 10px; } 
.sp-list-box .list .list-item .list-head strong { height: 40px; font-size: 17px; padding: 0 10px; } 
.sp-list-box .list .list-item .list-body .inner strong { font-size: 18px;} 
.sp-list-box .list .list-item .list-body .inner p { font-size: 14px; margin: 10px 0 0; padding: 10px 0 0; } 
.sp-list-box .list .list-item .list-foot .list-details{ -webkit-line-clamp: 2; margin-top: -17px;}
}

@media (max-width: 800px){
.sp-list-box .list-dot { display:none; } 
.sp-list-box .list .list-item { width: calc(50% - 15px); /*background:url('../images/bg_list.png') no-repeat center / cover; */  padding: 20px;  }
.sp-list-box .list .list-item .list-body .inner { pointer-events: inherit; } 
.sp-list-box .list .list-item .list-body .more { display: none; } 
.sp-list-box .list .list-item.title { margin-bottom: 20px; }
.sp-list-box .list .list-item.title { position: relative; } 
.sp-list-box .list-item.title .list-left { padding: 0; } 
.sp-list-box .list-item.title .list-left small { font-size: 18px; } 
.sp-list-box .list-item.title .list-left h2 { font-size: 28px; line-height: 1.3; } 
.sp-list-box .list-item.title .list-left h2 strong { font-size: 28px; line-height: 1.3; }
.sp-list-box .list-item.title .list-left h2 b { font-size: 28px; } 
.sp-list-box .list-item.title .list-left ul { max-width: 100%; margin: 20px -2.5px -5px; } 
.sp-list-box .list-item.title .list-left ul li { margin: 0 4px 7px; } 
.sp-list-box .list-item.title .list-left ul li a { height: 40px; } 
.sp-list-box .list .list-item.title .list-right { position: absolute; right: 0; top: 30px; }
}

@media (max-width: 560px){
/* .sp-list-box .list { margin:0 -5px -10px; }  */
/* .sp-list-box .list { height: 2400px; background-color: #f00;}  */
.sp-list-box .list .list-item { width: calc(100% - 10px); margin: 0 0 12px 0; padding: 26px 20px; } 
.sp-list-box .list .list-item .list-head strong { font-size: 17px; padding: 0 10px; height: 35px; }
.sp-list-box .list .list-item:hover {height: 305px; margin-bottom: 20px;}
.sp-list-box .list .list-item .list-head .icon-box { display: none; } 
.sp-list-box .list .list-item .list-body strong { font-size: 19px; } 
.sp-list-box .list .list-item .list-body p { font-size: 12px; min-height: 65px; margin: 7px 0 0; padding: 7px 0 0; } 
.sp-list-box .list .list-item .list-foot { /* display: block; */ height: unset; margin: 18px 0 0; } 
.sp-list-box .list .list-item .list-foot .icon-box { justify-content: flex-end; } 
.sp-list-box .list .list-item.image img { max-width: 110px; } 
.sp-list-box .list .list-item.add a p { width: 65px; height: 65px; background-size: 21px auto; }
.sp-list-box .list .list-item .list-foot .list-details{ margin-top: 0;}
.sp-list-box .list .list-item .list-foot .list-btn-wrapper .list-btn {width: 46px; height: 46px;}
}

/* 각 요소에 순차적 애니메이션 딜레이 설정 */
.sp-list-box .list .list-item.title .list-right div:nth-child(1) { animation-delay: 0s; } 
.sp-list-box .list .list-item.title .list-right div:nth-child(2) { animation-delay: 0.2s; } 
.sp-list-box .list .list-item.title .list-right div:nth-child(3) { animation-delay: 0.4s; } 
.sp-list-box .list .list-item.title .list-right div:nth-child(4) { animation-delay: 0.6s; } 

/* 색상 순환 애니메이션 (4단계) */
@keyframes colorCycle { 
 0% { border-top-color: #858585; } 
 20% { border-top-color: #858585; } 
 25% { border-top-color: #B4B4B4; } 
 45% { border-top-color: #B4B4B4; } 
 50% { border-top-color: #D9D9D9; } 
 70% { border-top-color: #D9D9D9; } 
 75% { border-top-color: #EFEFEF; } 
 95% { border-top-color: #EFEFEF; } 
 100% { border-top-color: #858585; } 
 }


/* 서브 idp */
.map-wrap { padding:50px 40px; border-radius:50px; background: #eff6ff; margin-left: auto; margin-right: auto; overflow: hidden; } 
.map-title { color: #2d2d2d; word-break: keep-all; font-family: Pretendard; font-size: 32px; font-style: normal; font-weight: var(--font-weight-700, 700); line-height: var(--line-height-39_2, 39.2px); /* 122.5% */
letter-spacing: var(--letter-spacing--0_5, -0.5px); margin-bottom: 56px; } 
.map-list-title { height: 53px; flex-shrink: 0; border-radius: 25px; background: #fff;} 
.map-list-title { display: flex; align-items: center; justify-content: space-between;} 
.map-list-title li { height: 100%; } 
.map-list-title button {color: rgba(122, 122, 122, 0.96); font-family: Pretendard; font-size: 22px; font-style: normal; font-weight: 500; line-height: var(--line-height-22_4, 22.4px); letter-spacing: var(--letter-spacing--0_5, -0.5px); height: 100%; padding: 10px 20px; min-width: 130px; } 
/* .map-list-title li > a { width: 100%; color: rgba(122, 122, 122, 0.96); font-family: Pretendard; font-size: 22px; font-style: normal; font-weight: 500; line-height: var(--line-height-22_4, 22.4px); letter-spacing: var(--letter-spacing--0_5, -0.5px); height: 100%; padding: 15px 25px; min-width: 130px; }  */
.map-list-title li button.is-active {border-radius: 25px; background: #0056b3; box-shadow: 3px 4px 10px 0px rgb(175 211 255 / 75%); color: #fff; text-align: center; font-family: Pretendard; font-size: 22px; font-style: normal; font-weight: 700; line-height: var(--line-height-22_4, 22.4px); /* 93.333% */
letter-spacing: var(--letter-spacing--0_5, -0.5px); } 
.map-list { display: grid; grid-template-columns: 1fr 1fr 1fr; margin-top: 52px; gap: 17px 30px; max-height: 425px; overflow: auto; padding-right: 30px; padding-bottom: 20px; } 
.map-list::-webkit-scrollbar { width: 3px; height: 3px; } 
.map-list::-webkit-scrollbar-thumb { background-color: #8d8d8d; border-radius: 10px; background-clip: padding-box; border: 0px solid transparent; } 
.map-list::-webkit-scrollbar-track { border-radius: 10px; background-color: #cfcfcf; } 
.map-left { width: 820px; } 
.map-list li { border-radius: 10.559px; background: var(--biz-gooroomee-com-white, #fff); box-shadow: 2px 5px 12.671px 0px rgba(107, 173, 255, 0.26); } 
.map-list li a { display: flex; align-items: center; justify-content: center; height: 90px; }
.map-list li a img { max-width: 160px; min-width: 80px; max-height: 65px; object-fit: contain; }
.map-wrap { display: flex; gap: 32px; } 
.map-right { flex: 1; display: flex; align-items: center; justify-content: center; } 
.map-right .st0 { fill: #dbe2eb; transition: all 0.3s ease-in-out; }
.map-right .st1 { fill: #6d6d6d; font-family: Pretendard-Bold-KSCpc-EUC-H, Pretendard; font-size: 16px; font-weight: 700; transition: all 0.3s ease-in-out;}

@media (max-width: 1350px){
    .map-wrap { flex-direction: column-reverse; } 
    .map-left { width: 100%; margin-top: 20px;} 
    .map-title { text-align: center;} 
    .map-list-title { flex-wrap: wrap; height: 50px;} 
    .map-list-title li { width: calc(100% / 6);} 
    .map-list-title li button { width: 100%;} 
}
@media (max-width: 1024px){
    .map-list-title { display: flex; align-items: center; justify-content: space-between;} 
    .map-list-title li { min-width:14%;} 
    .map-list img { width: calc(100% - 42px);} 
}
@media (max-width: 960px){
    .map-list-title { height: auto;} 
    .map-list-title li { min-width:33.333%; height: 50px;} 
    .map-list-title li button { font-size: 20px;}
    .map-list-title li button.is-active { font-size: 20px;}
    .map-left { margin-top: 0;} 
    .map-right { display: none;}
}
@media (max-width: 768px){
    .map-wrap { padding: 30px 20px; }
    /* .map-list-title { margin-right: 0; justify-content: space-around; } */
    .map-list { /* max-height: fit-content; */
    padding-right: 0; overflow: auto; margin-top:35px;} 
    .map-list { grid-template-columns: 1fr 1fr; gap: 15px; padding-right: 14px;} 
    .map-list li {height: 90px; display: flex; align-items: center; justify-content: center;}
    .map-list li a {width: 100%;}
    .map-list img {height: 70px; object-fit: contain;}
    .map-title { font-size: 18px; margin-bottom: 30px; } 
    .map-list-title li button.is-active { padding: 14px; border-radius: 30px; } 
}
@media (max-width: 480px){
    .map-list li {height: 65px;}
    .map-list img { width: calc(100% - 24px);}
  	.map-list li a img { max-width: 120px; max-height: 50px;}
    .map-list-title li { min-width:50%; height: 45px;}
    .map-list-title button {min-width: 98px; height: 45px; display: flex; align-items: center; justify-content: center; overflow-y: hidden;}
    .map-list-title li button {font-size: 16px;}
    .map-list-title li button.is-active {font-size: 16px;}
    .map-list-title li button.is-active {font-size: 16px; }
}


.bottom-logos { padding-top: 38px; position: relative; height: 130px; margin-top: 26px; } 
.bottom-logos img { position: absolute; left: 0; height: 130px; min-width: 1920px; top: 0; } 
.bottom-logos img:nth-child(1) { animation: bottomImg01 20s infinite linear; } 
.bottom-logos img:nth-child(2) { animation: bottomImg02 20s infinite linear; } 
@keyframes bottomImg01 {0% { transform: translateX(0%); } 
100% { transform: translateX(100%); } 
 }
@keyframes bottomImg02 {0% { transform: translateX(-100%); } 
100% { transform: translateX(0%); } 
 }
.map-right svg g:not(#_레이어_1) { cursor: pointer; } 
.map-right .is-active path,
.map-right svg g:not(#_레이어_1):hover path { fill: #97c0e8; stroke: #97c0e8; stroke-width: 3.5; transform: translateY(-5px);}
.map-right svg g:not(#_레이어_1):hover text, .map-right .is-active text {fill: rgb(255, 255, 255) ;}

/* 검색창 */
.sp-search-box-wrapper { display: flex; align-items: baseline; justify-content: space-between; width: 100%; /* padding: 0 15px; */ box-sizing: border-box; }
.sp-search-box-wrapper > div{ display: flex; width: 100%; max-width: 300px;}
.sp-search-box { display: flex; align-items: center; justify-content: space-between; border-bottom: 2px solid #2a2829; padding: 4px 7px; width: 100%; max-width: 300px; } 
.sp-search-box form {display: flex; align-items: center; justify-content: space-between; flex:1; width: 100%;}
.sp-search-box .search { width: 24px; height: 24px; font-size: 0; background: url('../images/sub/sub02/ico_sp_search.svg') no-repeat center / cover; border: none; background-color: transparent; cursor: pointer;} 
.sp-search-box input { flex-grow: 1; border: none; outline: none; width: calc(100% - 34px); background-color : transparent;}

@media (max-width: 1410px){
    .sp-search-box-wrapper { flex-direction: column; gap: 20px;}  
    /* .sp-search-box-wrapper:last-child { align-items: flex-end;} */
    .sp-search-box-wrapper > div { width: 98%; justify-content: flex-end; }
}
@media (max-width: 800px) {
    .sp-search-box { max-width: 250px;}
    .sp-search-box input{font-size: 16px;}    
    .sp-search-box .search { width: 20px; height: 20px;}
}

@media (max-width: 1410px){
.sp-search-box-wrapper { flex-direction: column;  gap: 20px; } 
.sp-search-box-wrapper > div { width: 100%; max-width: none; justify-content: flex-end; } 
}

@media (max-width: 800px){
.sp-search-box { padding: 4px 5px; } 
.sp-search-box input { font-size: 16px;}
.sp-search-box .search { width: 20px; height: 20px; } 
.sp-search-input {&::placeholder { content: attr(data-placeholder-mobile); }}
}

@media (max-width: 480px){
.sp-search-box-wrapper > div { max-width: 100%; width: 98%;} 
}

/* SP 레이어팝업 */
.sp-layer-popup {display: none;position: fixed;left: 0;top: 0;z-index: 100;width: 100%;height: 100%;background-color: rgba(0, 0, 0, .4);}
.sp-layer-popup .group {overflow: hidden; overflow-y: auto; position: relative; top: 50%; width: 1280px; max-width: 90%; max-height: 70%; margin: 0 auto; padding: 30px; background-color: #fff; transform:translate(0, -50%); -webkit-transform:translate(0, -50%);}
.sp-layer-popup .close {position: absolute; right: 50px; top: 40px; width: 36px; height: 46px; background: url('../images/layout/ico_menu_close.svg') no-repeat 50%;background-size: contain;}
/* .sp-layer-popup .close {position: absolute; right: 50px; top: 40px;} */
/* .sp-layer-popup .close::before {content: 'X'; font-size: 2rem; color: #175e95; } */
.sp-layer-popup .sp-layer-text{margin: 18px 0;}

@media (max-width: 800px){
    .sp-layer-popup h3.middle-title{font-size: 19px; margin-top: 30px; margin-bottom: 5px;}
    .sp-layer-popup h3.middle-title span.hexagon::after {top: -20px; right: -10px; width: 8px; height: 10px;}
    .sp-layer-popup .sp-layer-text{font-size: 17px; margin: 12px 0;}
    .sp-layer-popup .close {right: 30px; top: 30px; width: 26px; height: 36px; }
}


/* 서비스 목표 */
.item-box-wrap { position: relative; width: 100%; border: 1px solid #ccc; border-radius: 100px; } 
.item-box-wrap .item-text { width: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 1.8rem 0; } 
.item-box-wrap .item-text h3 { width: 100%; display: flex; justify-content: center; color: #004BB0; font-size: 1.875rem; font-weight: bold; margin-bottom: 1.875rem; } 
.item-box-wrap .item-text p { font-size: 1.625rem; font-weight: bold; color: #4d4d4d; } 
.item-box { position: relative; display: flex; justify-content: space-between; align-items: flex-start; max-width: 100%; list-style-type: none; padding: 0; } 
.item-img { position: relative; display: flex; justify-content: center; width: 100%; } 
.item-img img { position: absolute; top: -1.5rem; width: 30rem; } 
.item-box li { display: flex; flex-direction: column; justify-content: center; border-radius: 20px; padding: 0; box-sizing: border-box; } 
.item-box .card-title { display: flex; justify-content: center; align-items: center; width: 300px; height: 100px; border-radius: 30px; font-size: 1.25rem; font-weight: 600; color: white; line-height: 1.5; text-align: center; } 
.item-box .box1, .item-box .box2, .item-box .box3, .item-box .box4 { position: relative; display: flex; /* justify-content: flex-start; */
 background: #fff; padding: 10px; border-radius: 30px; height: 300px; box-shadow: 0 0 5px rgba(0, 0, 0, .25); } 
.item-box .card-title { background-color: rgba(50, 97, 176, .85); } 

.card-content { display: flex; flex-direction: column; list-style-type: none; font-size: 18px; color: #4d4d4d; font-weight: 400; line-height: 25px; } 
/* .card-content li { margin-bottom: 10px; padding: 0; width: 100%; height: auto; min-height: auto; font-size: 18px; line-height: 1.5; text-align: left; border: none; background: transparent; overflow: visible; box-sizing: border-box; display: list-item; } */
.card-content li { width: 300px; font-size: 16px; line-height: 2; text-align: left; border: none; background: transparent; overflow: visible; box-sizing: border-box; position: relative; word-wrap: break-word; overflow-wrap: break-word; word-break: keep-all; padding-left: 1rem; } 
.card-content li::before { content: ""; position: absolute; left: 0; top: 16px; transform: translateY(-50%); width: 7px; height: 7px; background: url('../images/sub/list-bul03.svg') no-repeat center center; background-size: contain; } 
.card-content li:last-child { margin-bottom: 0; } 


/*-------------------------------------------------------------------------------------------------------------------------*/

/* 시험 페레데이션 step */
.step-container { display: flex; gap: 100px; width: 100%;} 
.step-left {width:180px; height: 50px; border-radius: 25px; display: flex; align-items: center; justify-content: center; background-color: #28548C; position: relative;}
.step-left p {font-size: 25px; font-weight: 600; color: #fff;}
.step-right {flex:1; background-color: #eee; padding: 20px 30px; display: flex; flex-direction: column; align-items: flex-start; border-radius: 15px; background-color: #fff; border: 1px solid #d2d2d2; margin-bottom: 30px;}
.tit-txt { color: #00134E; font-weight: 600; font-size: 20px;} 
.step-left::after { content: ''; width: 12px; height: 12px; position: absolute; top:50%; right: -6px; transform: translateY(-50%); background-color: #fff; border: 2px solid #d2d2d2; border-radius: 100%; } 
.step-left::before { content: ''; width: 100px; height: 2px; position: absolute; top:50%; right:-100px; transform: translateY(-50%); background-color: #d2d2d2; } 
.list-info01 {position: relative; margin-left: 14px; word-break: keep-all;}
.list-info01 li {color: #df8f13; font-size: 17px; font-weight: 600;}
.list-info01 li::before { content: '\203B'; display: inline-block;  position: absolute; left: -15px; top:0;}
.data-box .list-info2::after {top:0;}
.step-right .info-down { display: flex;}
.step-right .info-down li { font-size: 16px;} 

@media (max-width:1024px){
    .step-container{ gap: 70px; }
    .step-left::before { content: ''; width: 70px; height: 2px; position: absolute; top:50%; right:-70px; transform: translateY(-50%); background-color: #d2d2d2; }
}
@media (max-width:950px){
    .step-right .info-down { display: flex; flex-direction: column; }
    .step-right .info-down li:first-child { margin-bottom: 5px; } 
}
@media (max-width:820px) {
    .step-left {width:150px; height: 45px;}
    .step-left p {font-size: 22px;}
}
@media (max-width:768px){
    .step-container { display: block; }
    .step-left { width: 100%; height: 50px; border-radius: 15px 15px 0 0 ; justify-content: flex-start; padding-left: 20px;} 
    .step-left p {font-size: 24px;}
    .tit-txt{ font-size: 19px;} 
    .step-left::after { display: none; } 
    .step-left::before { display: none; }
    .step-right { border-radius: 0 0 15px 15px; padding: 20px; }
}

/* 프로젝트 정보 헤더 */
.project-info { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; align-self: stretch; } 
.info-header { display: flex; padding: 3px 12px 3px 8px; justify-content: center; align-items: center; gap: 8px; border-radius: 4px; background: #f8f9fe; color: #0072ff; font-size: 14px; font-weight: 600; line-height: 22px; letter-spacing: -0.5px; } 

/* 정보 리스트 컨테이너 */
.step-details > .info-list { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; align-self: stretch; margin-top: 16px; height: 0; } 
.info-item { display: flex; align-items: flex-start; gap: 2px; align-self: stretch; flex-direction: column; } 
.info-text { color: #38383D; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: -0.5px; } 
.info-text li { width: 100%; position: relative; overflow: hidden; border-radius: 25px; padding: 48px 0 32px 0; }
.info-separator { height: 1px; align-self: stretch; background: #ECECF1; margin: 8px 0; } 

/* 스텝 이미지 컨테이너 */
.step-image { display: flex; width: 274px; height: 274px; justify-content: center; align-items: center; margin: 0 auto; } 
.step-image img { max-width: 100%; height: auto; } 

@media (min-width: 768px){
	.step-container { flex-direction: row; flex-wrap: wrap; } 
	/* .step-column { width: 274px; margin-right: 32px; } 
	.step-details { width: calc(100% - 314px); } */
	.project-info { width: 500px; } 
	.step-image { margin: 0; } 
}





/* brand-color */
.brand-color-wrapper { display: flex; flex-direction: column; gap: 15px; } 
.brand-color-wrapper .wrap { display: flex; gap: 20px; } 
.brand-color { position: relative; width: 100%; min-width: 250px; height: 100px; margin-bottom: 15px; } 
.brand-color.color-blue { background-color: #0072ff; } 
.brand-color.color-red { background-color: #ed2065; } 
.brand-color.color-yellow { background-color: #ff9d00; } 
.brand-color.color-black { background-color: #323232; } 
.brand-color.color-gray { background-color: #b9b9b9; } 
.brand-color-type { background-color: #b9b9b9; width: 200px; height: 50px; border-radius: 25px; display: flex; justify-content: center; align-items: center; color: #fff; } 
.brand-color-innner .title { font-weight: 600; font-size: 24px; } 
.brand-color-innner .cont { font-size: 18px; } 
.brand-color .cont { position: absolute; bottom: 0; right: 0; margin: 0 7px 3px 0; color: #fff; } 
@media (max-width: 1400px){
 .gray-border-box { flex-direction: column; gap: 50px; } 
 .brand-color-wrapper { justify-content: center; align-items: center; } 
 }
@media (max-width: 768px){
 .brand-color-wrapper .wrap { flex-direction: column; gap: 25px; } 
 .brand-color { width: 300px; margin-bottom: 5px; } 
 .brand-color-innner .title { font-size: 20px; } 
 .brand-color-innner .cont { font-size: 14px; } 
 }


 /* separate-box */
.separate-box { width: 100%; border: 1px solid #c9c9c9; border-radius: 20px; margin-bottom: 50px; /* display: flex; */
 align-items: center; gap: 12rem; padding: 20px; } 
.separate-box .list-info { margin-bottom: 0; font-weight: 600; color: #C57A24}
.separate-box.service { display: flex; } 
.separate-box .separate-cont { /* flex-grow: 1; */}
.separate-box .separate-cont ol { font-size: 22px; } 
.separate-box .separate-cont ol > li { font-weight: 600; color: #0072ff; } 
.separate-box .separate-cont ul { list-style-type: disc; /* margin: 6px 0px 25px 24px; */}
.separate-box .separate-cont ul.seperate-desc { margin: 0; margin-top: 10px; } 
.separate-cont > .text-title { margin: 0; font-size: 20px; color:#004f9f; line-height: 1; } 
.separate-cont p { color: #333; font-weight: 400; padding-left: 25px; line-height: 1.7; font-size: 17px; margin: 10px 0px 10px -23px; } 
.text-title > i { margin-right: 5px; font-size: 20px; } 
.tab-inner-box02.separate-box.gap { gap: 0; } 

@media (max-width: 1200px){
 .separate-box { flex-direction: column; gap: 3rem; } 
 .separate-box .separate-image { min-width: 20rem; } 
 .separate-box .separate-cont ol { gap: 70px; } 
 }

@media (max-width: 950px){
 .separate-box .separate-cont ol { font-size: 20px; display: block; } 
 }

/* prepare-box */
.prepare-box { border-radius: 25px; display: flex; justify-content: center; align-items: center; gap: 3rem; padding: 20px 0; } 
.prepare-box .prepare-image { text-align: center; display: flex; align-items: center; justify-content: center; } 
.prepare-box .prepare-cont p { font-size: 28px; font-weight: 600; } 
.prepare-box .prepare-cont span { font-size: 22px; font-weight: 500; } 
@media (max-width: 768px){
 .prepare-box { flex-direction: column; gap: 1rem; } 
 .prepare-box .prepare-cont { text-align: center; } 
 .prepare-box .prepare-cont p { font-size: 24px; } 
 .prepare-box .prepare-cont span { font-size: 18px; } 
 }

/* gray-box */
.gray-border-box { display: flex; gap: 15px; justify-content: center; align-items: center; padding: 65px 30px; border: 1px solid #e2e2e2; border-radius: 10px; min-height: 150px; } 
.gray-grid-box { display: flex; justify-content: center; align-items: center; padding: 30px; margin-top: 20px; border: 1px solid #e2e2e2; border-radius: 10px; min-height: 150px; 
background-image: linear-gradient(to right, #e2e2e2 1px, transparent 1px), linear-gradient(to bottom, #e2e2e2 1px, transparent 1px); background-size: 20px 20px; background-color: white; background-clip: border-box; /* 배경을 테두리 안쪽으로 자르기 */}
.text-box { padding: 30px 0 0px 0; line-height: 1.5; } 
.logo-wrapper { display: flex; gap: 30px; margin-bottom: 70px; } 
.logo-wrapper > div { flex: 1; } 
.logo-wrapper-right { display: flex; flex-direction: column; gap: 30px; } 

@media (max-width: 768px){
 .logo-wrapper { flex-direction: column; } 
 .text-box { font-size: 16px; } 
 .text-box { padding: 20px 0 0 0; } 
 }

/* 검색결과 없음 페이지 */
.search-result {width: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; margin-top: 60px;}
.search-result img {width: 228px; height: 228px;}
.search-result .search-txt1 {font-size: 32px; font-weight: 600; margin-bottom: 15px; text-align: center; word-break: keep-all;}
.search-result .search-txt1 span {color: #0072FF; font-weight: bold;}
.search-result .search-txt2 {font-size: 25px; font-weight: 600; color: #767676; margin-bottom: 30px; text-align: center; word-break: keep-all;}
.search-result .back-home {width: 226px; height: 60px; border: 1px solid #e4e4e4; border-radius: 30px; font-size: 20px; display: flex; align-items: center; justify-content: center; margin-bottom: 55px;}
.search-result .back-home i {margin: 2px 0 0 5px; font-size: 20px;}
.search-result-info {background-color: #f9f9f9; width: 100%; height: 203px; border-radius: 20px; padding: 35px 70px;}
.search-result-info .tit {font-size: 21px; font-weight: 600; color: #c42338; margin-bottom: 15px; word-break: keep-all; padding-left: 27px; position: relative;}
.search-result-info .tit::before {content:'\F332'; font-family: "bootstrap-icons"; position: absolute; top:0; left: 0; font-weight: 100;}
.search-result-info .text-list-dept01 {margin-left: 25px; margin-bottom: 0;}

@media (max-width: 768px) {
    .search-result img {width: 190px; height: 190px;}
    .search-result .search-txt1 {font-size: 28px;}
    .search-result .search-txt2 {font-size: 21px;}
    .search-result .back-home {width: 200px; height: 50px; font-size: 18px;}
    .search-result .back-home i {font-size: 18px;}
    .search-result-info {height: fit-content; padding: 35px;}
    .search-result-info .tit {font-size: 19px; margin-bottom: 10px; padding-left: 24px;}
}
@media (max-width: 550px) {
    .search-result img {width: 160px; height: 160px;}
    .search-result .search-txt1 {font-size: 24px;}
    .search-result .back-home {width: 180px; height: 45px; font-size: 16px;}
    .search-result .back-home i {font-size: 16px;}

    .search-result-info {height: fit-content; padding: 20px;}
    .search-result-info .tit {font-size: 18px; margin-bottom: 10px; padding-left: 22px;}
    .search-result-info .text-list-dept01 li {font-size: 16px;}
}