
/* 기본 상태 - 좌측 정렬 */
h4 {
    position: relative;
    display: inline-block; /* `inline-block`으로 유지 */
    font-size: 32px;
    line-height: 1.5em;
    color: #000514;
    font-weight: 800;
    text-align: left; /* 기본적으로 좌측 정렬 */
    margin-left:0px;
}

/* 좌측 정렬을 위한 :before */
h4:before {
    content: "";
    position: absolute;
    left: 0;
    top: -5px;
    width: 28px;
    height: 3px;
    background: #e42431;
    border-radius: 999px;
}

@media (max-width: 1200px) {
    h4 { font-size: 30px; }
}
@media (max-width: 1024px) {
    h4 { font-size: 28px; }
}
@media (max-width: 768px) {
    h4 { font-size:24px; }
}

/* 서비스사업 */
.ServiceBox {position:relative; margin:0 0 30px; padding:20px; border-radius:10px; z-index:0; box-sizing:border-box; 
	background: #fbeaea;
    background: linear-gradient(-40deg, #fbeaea 10%, #f3c7c7);
    background: -webkit-linear-gradient(-40deg, #fbeaea 10%, #f3c7c7);
}
.ServiceBox .T_Img {width:100px; height:100px; background:#fff; border-radius:30%; overflow:hidden; margin:0 0 10px;}
.ServiceBox .T_Img img {width:100%; height:100%; object-fit:cover; object-position:center;}
.ServiceBox .SBtxt {overflow:hidden; color:#555; z-index:2;}
.ServiceBox .SBtxt em {display:block; margin-bottom:10px; font-size:13px; font-weight:normal; color:#444;}
.ServiceBox .SBtxt strong {
	display:block; position:relative; font-size:18px; line-height:1.3; color:#1e9cad; z-index:1;
	border-bottom:1px dashed rgba(255,255,255,.5); padding:0 0 10px; font-family:'TheJamsil'; font-weight:normal;
}
.ServiceBox .SBtxt strong:before {content:""; display:inline-block; position:absolute; left:0; bottom:-2px; width:100%; height:10px;}
.ServiceBox .SBtxt .txt {font-size:16px; color:#222;}

@media(min-width:767px) {
	.ServiceBox {min-height:280px; margin:30px 0; padding:70px 30px;}
	.ServiceBox .T_Img {position:absolute; right:30px; top:calc(50% - 95px); width:150px; height:150px; z-index:1;}
	.ServiceBox .T_Img img {width:100%; height:100%;}
	.ServiceBox .SBtxt {padding-right:200px;}
	.ServiceBox .SBtxt em {font-size:15px;}
	.ServiceBox .SBtxt strong {font-size:26px; line-height:1.3;}
	.ServiceBox .SBtxt strong:before {left:0; bottom:-5px; height:20px;}
	.ServiceBox .SBtxt .txt {font-size:16px;}
}

@media(min-width:1024px) {
	.ServiceBox {padding:70px 50px;}
	.ServiceBox .T_Img {right:50px; top:-35px; width:240px; height:240px; box-shadow:0 5px 5px rgba(0 0 0 / 5%);  }
	.ServiceBox .T_Img img {width:100%; height:100%;}
	.ServiceBox .SBtxt {padding-right:300px;}
	.ServiceBox .SBtxt em {font-size:15px;}
	.ServiceBox .SBtxt strong {font-size:32px; line-height:1.3;}
	.ServiceBox .SBtxt strong:before {left:0; bottom:-5px; height:20px;}
	.ServiceBox .SBtxt .txt {font-size:16px;}

	.C2all_inner .back span a {width:100px; height:30px; line-height:30px; font-size:18px}
}

@media(min-width:1280px) {
	.ServiceBox {min-height:280px; width:1063px; margin:30px 0 auto; padding:70px; border-radius:30px;}
	.ServiceBox .T_Img {right:70px; top:-35px; width:420px; height:340px; margin:0;}
	.ServiceBox .T_Img img {width:100%; height:100%;}
	.ServiceBox .SBtxt {padding-right:447px;}
	.ServiceBox .SBtxt em {font-size:15px;}
	.ServiceBox .SBtxt strong {font-size:30px; line-height:1.3; padding:0 0 20px; color:#e42431}
	.ServiceBox .SBtxt strong:before {left:0; bottom:-1px; height:18px;}
	.ServiceBox .SBtxt .txt {font-size:20px;}

	.ServiceBox.type .SBtxt {padding-right:0;}
	.C2all_inner .back span a {width:110px; height:30px; line-height:30px; font-size:18px}
}
p.basic_txt2 {position:relative; font-size:20px; color:#444; line-height:27px;}
p.basic_txt2 > span.bul {font-family: 'S-CoreDream-4Regular','Malgun Gothic', dotum, sans-serif; color:#32144f; position:absolute; left:0; top:8px; }
p.basic_txt2 {
	padding: 10px 0 0px 0 !important;
}
p.basic_txt2 > strong {
    background-color: #003894;
    color: #fff;
    padding: 3px 15px;
    border-radius: 25px;
}
p.basic_txt > strong { background: linear-gradient(135deg, #216bc0 0%, #101477 30%) 0 0 / 200% 100%; */
    background: rgb(77, 153, 162);
    /* background: linear-gradient(270deg, rgba(77, 153, 162, 1) 0%, rgba(151, 183, 138, 1) 100%); */
    background-image: linear-gradient(to right, #8cbb7e 0%, #e42431 100%) !important;; color:#fff; padding:3px 15px; border-radius:25px;}

.sub_con_view3 {
  padding: 20px;
}

.sub_con_view3_in {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px; /* 아이템 사이 간격 */
}

.step_flow {
  display: flex;
  flex-direction: column;
  width: 320px;
  text-align: center;
  border-radius: 8px;
  position: relative;
}

.step_head {
  background-image: linear-gradient(to right, #8cbb7e 0%, #1e9cad 100%);
  color: #fff;
  font-size: 18px;
  padding: 15px 0;
  border-radius: 8px 8px 0 0;
}

.step_head b {
  color: #fff;
}

.step_info {
  border: 1px solid #48a89b;
  border-top: 0px;
  border-radius: 0 0 8px 8px;
  padding: 15px 0;
  font-weight: normal;
  font-size: 18px;
  line-height:23px;
  min-height: 97px;
  background-color: #fff;
}

.step_info2 {
  padding-top: 27px;
}

.right_arrow {
  width: 12px;
  height: 12px;
  background: #fff;
  border-top: 1px solid #48a89b;
  border-right: 1px solid #48a89b;
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  right: -6px;
  margin-top: -6px;
}

/* 마지막 요소의 화살표 제거 */
.step_flow:last-child .right_arrow {
  display: none;
}

/* 반응형 */
@media (max-width: 768px) {
  .sub_con_view3_in {
    flex-direction: column;
    align-items: center;
  }

  .step_flow {
    width: 90%;
  }

  .right_arrow {
    display: none;
  }
}

/* 인사말(기본 18px) */
.greeting{
  padding: 0 0 60px;
}

.greeting__inner{
  max-width: 1440px;
  margin: 0 auto;

  font-size: 18px;           /* ✅ 기본 폰트 18px */
  line-height: 1.9;
  color: #222;
  word-break: keep-all;
}

.greeting__headline{
  margin: 0 0 28px;
  font-size: 26px;
  line-height: 1.35;
  font-weight: 800;
  letter-spacing: -0.5px;
}

.greeting__inner p{
  margin: 0 0 18px;
}

.greeting__thanks{
  margin-top: 26px;
  font-weight: 700;
}

.greeting__sign{
  margin-top: 10px;
  font-weight: 600;
}

/* ✅ 반응형: 모바일에서 가독성/여백 최적화 */
@media (max-width: 768px){
  .greeting{
    padding: 40px 0;
  }

  .greeting__inner{
    padding: 0 16px;
    font-size: 18px;        /* 기본은 그대로 */
    line-height: 1.85;
  }

  .greeting__headline{
    font-size: 22px;
    margin-bottom: 20px;
  }

  .greeting__inner p{
    margin-bottom: 16px;
  }
}

/* ✅ 아주 작은 화면에서만 살짝 다운(선택) */
@media (max-width: 360px){
  .greeting__inner{
    font-size: 17px;
  }
}


.tab { display: flex; flex-wrap: wrap; gap: 10px;}
.tab li { width: calc(24% - 7px); background: #f3f3f3;  border-radius:50px; border:3px solid #fff; }
.tab li:hover { border:3px solid #666; }
.tab li.active { border:3px solid #e01b25; background-color:#fff;
    /*background-image: linear-gradient(to right, #8cbb7e 0%, #1e9cad 100%) !important; border-radius:10px 10px 25px; */ }
.tab li a { cursor: pointer; color: #333; display: block; height: 60px; line-height: 60px; font-size: 22px; font-weight: 800; text-align: center; }
.tab li.active a { color: #e01b25; }
.tab_item { display: none; }
.tab_item.active { display: block; }

@media (max-width: 1024px) {
	.tab { margin-bottom: 15px; }
	.tab li a {font-size:16px; height: 45px; line-height: 45px; text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;}
}

.timeline {
	line-height: 1.4em;
	list-style: none;
	margin: 15px 0 0 0;
	padding: 0;
	width: 100%;
}
 .timeline .timeline-item {
	 padding-left: 40px;
	 position: relative;
}
 .timeline .timeline-item:last-child {
	 padding-bottom: 0;
	 letter-spacing:-1px;
}
 .timeline .timeline-info {
	 font-size: 2.128rem;
    color: #D5D7E9;
    font-weight: 700;
    font-family: 'SCDream';
    line-height: 1;
	margin-top:-5px;
	 margin-bottom: 10px;
	 text-transform: uppercase;
	 white-space: nowrap;
}
.timeline-item:hover .timeline-info {
	color:#000e7b;
}
 .timeline .timeline-marker {
	 position: absolute;
	 top: 0;
	 bottom: 0;
	 left: 0;
	 width: 15px;
}
 .timeline .timeline-marker:before {
	 background: #ecf5e5;
	 border: 2px solid #ecf5e5 transparent ;
	 border-radius: 100%;
	 content: "";
	 display: block;
	 height: 20px;
	 position: absolute;
	 top: 2px;
	 left: 0px;
	 width: 20px;
	 /*
	 transition: background 0.3s ease-in-out, border 0.3s ease-in-out;
	 */
	 background: transparent;
	 border: 2px solid #ecf5e5;
}
 .timeline .timeline-marker:after {
	 content: "";
	 width: 2px;
	 background: #efefef;
	 display: block;
	 position: absolute;
	 top: 23px;
	 bottom: 0;
	 left: 9px;
}
 .timeline .timeline-item:last-child .timeline-marker:after {
	 content: none;
}
 .timeline .timeline-item:not(.period):hover .timeline-marker:before {
	 background: transparent;
	 border: 3px solid #e01b25;
}
 .timeline .timeline-content {
	 padding-bottom: 40px;
}
 .timeline .timeline-content p:last-child {
	 margin-bottom: 0;
} 
 .timeline .timeline-title {
	 margin-bottom: 20px;	 
	 font-size: 20px;
	 letter-spacing:-1px;
	 position:relative;
	 padding-left:60px;
	 line-height:23px;
}
 .timeline .timeline-title span{
	 font-weight: bold;
	 margin-right: 20px;
	 position:absolute;
	 left:0;
}
 @media (min-width: 768px) {
	 .timeline .timeline-split .timeline, .timeline .timeline-centered .timeline {
		 display: table;
	}
	 .timeline .timeline-split .timeline-item, .timeline .timeline-centered .timeline-item {
		 display: table-row;
		 padding: 0;
	}
	 .timeline .timeline-split .timeline-info, .timeline .timeline-centered .timeline-info, .timeline .timeline-split .timeline-marker, .timeline .timeline-centered .timeline-marker, .timeline .timeline-split .timeline-content, .timeline .timeline-centered .timeline-content, .timeline .timeline-split .period .timeline-info, .timeline .timeline-centered .period .timeline-info {
		 display: table-cell;
		 vertical-align: top;
	}
	 .timeline .timeline-split .timeline-marker, .timeline .timeline-centered .timeline-marker {
		 position: relative;
	}
	 .timeline .timeline-split .timeline-content, .timeline .timeline-centered .timeline-content {
		 padding-left: 40px;
	}
	 .timeline .timeline-split .timeline-info, .timeline .timeline-centered .timeline-info {
		 padding-right: 35px;
	}

}
 @media (min-width: 992px) {
	 .timeline .timeline-centered, .timeline .timeline-centered .timeline-item, .timeline .timeline-centered .timeline-info, .timeline .timeline-centered .timeline-marker, .timeline .timeline-centered .timeline-content {
		 display: block;
		 margin: 0;
		 padding: 0;
	}
	 .timeline .timeline-centered .timeline-item {
		 padding-bottom: 40px;
		 overflow: hidden;
	}
	 .timeline .timeline-centered .timeline-marker {
		 position: absolute;
		 left: 50%;
		 margin-left: -7.5px;
	}
	 .timeline .timeline-centered .timeline-info, .timeline .timeline-centered .timeline-content {
		 width: 50%;
	}
	 .timeline .timeline-centered > .timeline-item:nth-child(odd) .timeline-info {
		 float: left;
		 text-align: right;
		 padding-right: 30px;
	}
	 .timeline .timeline-centered > .timeline-item:nth-child(odd) .timeline-content {
		 float: right;
		 text-align: left;
		 padding-left: 30px;
	}
	 .timeline .timeline-centered > .timeline-item:nth-child(even) .timeline-info {
		 float: right;
		 text-align: left;
		 padding-left: 30px;
	}
	 .timeline .timeline-centered > .timeline-item:nth-child(even) .timeline-content {
		 float: left;
		 text-align: right;
		 padding-right: 30px;
	}

}

@media (max-width:768px) {
	.timeline .timeline-info {
		font-size: 2.228rem;
	}
	.timeline .timeline-title {
		font-size: 14pt;
	}
}