@charset "utf-8";
	.sub_bg{background:url('') no-repeat center top;}

	#container{clear:both; position:relative; width:100%; text-align:center; margin:0 auto; z-index:100; background:url('../images/news_bg.png') 6rem bottom no-repeat;}
	#container:after{content:""; display:block; height:0; clear:both; visibility:hidden;}

	@media screen and (max-width: 768px) {
		#container {padding-top: 0;}
	}

/*서브비주얼*/			
	#container #sub_visual{clear:both; position:relative; width:100%; height: 542px; text-align:center;}
	#container #sub_visual .subvisual_inner{position:relative; width:100%; text-align: left; font-size: 1.5rem; font-weight: 200; color:#fff; margin: 0 auto; max-width: 1658px; padding:173px 1.25rem 0; box-sizing: border-box;}
	#container #sub_visual .subvisual_inner h2{display: block; padding-top:1.25rem; font-size: 4rem; font-family: GmarketSans; font-weight: 600; color: #fff; letter-spacing: 0.02rem;}
	#container #sub_visual .subvisual_inner h2 .sub_bg_smtext{ display: block; font-size: 1.5rem; color:#fff; font-family: 'SCoreDream'; letter-spacing: -0.02em; font-weight: 500;}

	#container .sub_bg01{background:url('../images/mn_vis_01.jpg') no-repeat center top;) no-repeat center 5rem;}
	#container .sub_bg02{background:url(../images/sb_vis_02.jpg) no-repeat center 0;}
	#container .sub_bg03{background:url(../images/sb_vis_03.jpg) no-repeat center 0;}
	#container .sub_bg04{background:url(../images/sb_vis_04.jpg) no-repeat center 0;}

	@media screen and (max-width: 1024px) {
		#container #sub_visual{height: 284px;}
		#container #sub_visual .subvisual_inner{padding: 120px 1.25rem 0; font-size: 0.875rem;}
		#container #sub_visual .subvisual_inner h2{ font-size: 2rem; padding-top: 0.25rem;}
		#container #sub_visual .subvisual_inner h2 .sub_bg_smtext{padding: 0; font-size: 0.875rem;}
	}
	@media screen and (max-width:500px) {
		#container #sub_visual .subvisual_inner{padding: 100px 1.75rem 0;}
	}

/*서브레프트메뉴*/				
.snb{position:absolute; left:0; bottom:0; width:100%; border-top:1px solid rgba(255,255,255,0.25);}
.snb .snb_wrap{width: 100%; max-width: 1658px; display: flex; align-items:center; justify-content: flex-start; margin: 1.25rem auto;}
.snb .snb_wrap .snb_home{ display:block; width: 30px; height:30px; margin-left: 1.5rem; background: url(../images/hd_home.png) no-repeat center center; background-size:contain; text-indent: -999999em;}
.snb .snb_wrap h3{display:inline-block; width: auto; min-width: 12rem; margin:0 3rem; text-align: center; font-size: 1.25rem; white-space: nowrap; font-weight: 500; color: #fff; border-left:1px solid rgba(255,255,255,0.4); border-right: 1px solid rgba(255,255,255,0.4);}
.snb .snb_wrap dl{ display:block; justify-content: flex-start; width:100%;}
.snb .snb_wrap dl dd > ul{list-style:none; display: flex; justify-content: flex-start; column-gap: 3rem; width: 100%; margin:0;}
.snb .snb_wrap dl dd > ul > li{ position:relative;}
.snb .snb_wrap dl dd > ul > li > a{display:block; font-size:1.25rem; font-weight:500; color:#fff; letter-spacing: -0.02em; transition: color 0.3s ease;}
.snb .snb_wrap dl dd > ul > li > a.on,
.snb .snb_wrap dl dd > ul > li > a:hover{color:#5dccff;}
.snb .snb_wrap dl dd > ul > li > a.on::after,
.snb .snb_wrap dl dd > ul > li > a:hover::after {width:100%;}
.snb_mobile_btn{display: none;}

@media all and (max-width:1024px){
	.snb .snb_wrap{ margin: 0.75rem auto; background-size: 18px;}
	.snb .snb_wrap h3{min-width: 8.5rem; margin: 0 1rem 0 4rem; font-size: 0.9375rem;}
	.snb .snb_wrap dl dd > ul > li > a{font-size: 0.9375rem;}
	.snb .snb_wrap dl dd > ul{column-gap: 1.5rem;}
}
@media all and (max-width:768px){
    .snb{ padding:0.75rem 0 0.5rem 0; margin-top: 1.25rem;}
    .snb .snb_wrap{ display:block; max-width:100%;  margin:0 auto;  padding:0 1rem; background:none;  box-sizing:border-box; }
    .snb .snb_wrap .snb_home,
	.snb .snb_wrap h3{display: none; }
    .snb .snb_wrap dl{ width:100%; overflow-x:auto; }
    .snb .snb_wrap dl::-webkit-scrollbar{ display:none;}
    .snb .snb_wrap dl dd > ul{ display:flex; flex-wrap:wrap; column-gap:1.5rem; width:100%;  padding-bottom:0.25rem; }
    .snb .snb_wrap dl dd > ul > li > a{  font-size:0.95rem; white-space:nowrap;}
}
@media all and (max-width:500px){
 	.snb .snb_wrap dl dd > ul{ display:flex; flex-wrap:wrap; gap:0.75rem 0; width:100%;  padding-bottom:0.25rem; }
	.snb .snb_wrap dl dd > ul > li{ width:calc(33.3%); }
	.snb .snb_wrap dl dd > ul > li:after{content:""; display:block; position:absolute; left:0; top:50%; width:1px; height:16px; transform: translatey(-50%); background:rgba(255,255,255,0.4);}
	.snb .snb_wrap dl dd > ul > li:nth-child(1):after,
	.snb .snb_wrap dl dd > ul > li:nth-child(4):after{display: none;}
}
.cnt_sns{position: absolute; right: 0; top:-45px; width:145px; z-index: 10;}
.cnt_sns a{display:inline-block; width:31px; height:31px; padding:0 1px; vertical-align:top;}
.cnt_sns a.face{background:url('../images/sb_snb_sns_01.jpg') no-repeat 0 0; vertical-align:top; text-indent: -99999em;}
.cnt_sns a.tw{background:url('../images/sb_snb_sns_02.jpg') no-repeat 0 0; vertical-align:top; text-indent: -99999em;}
.cnt_sns a.print{background:url('../images/sb_snb_sns_03.jpg') no-repeat 0 0; vertical-align:top; text-indent: -99999em;}

/*컨텐츠시작*/
#container .cnti_inner{position: relative; width:100%; margin:0 auto; }

#content{ position: relative; width:100%; min-height:500px; max-width: 1560px; margin: 0 auto;}

	@media screen and (max-width: 1600px) {
    	#content{padding: 0 3rem;}
	}
	@media all and (max-width:1280px){
		#content{padding: 0 2rem;}
	}
	@media screen and (max-width: 1024px) {
    	#content{padding: 0 1rem;}
	}

#content .substance {clear:both;  position:relative; font-size:16px; padding-top: 5rem; padding-bottom: 8rem; display: flow-root;}
#content .substance h4 {display: block; font-size: 2.5rem; font-family: 'SCoreDream', sans-serif; color: #000; font-weight: 700; text-align: left; margin: 0 0 20px 0;}
#content .substance h5 {
    font-size: 20px;
    color: #333;
    font-weight: 500;
    margin-top: 2.75rem;
    margin-bottom: 1.5rem;  /* ✔ 공간은 margin으로만 처리 */
    padding-bottom: 0;       /* ✔ 핵심 수정 */

    font-family: 'SCoreDream';
    letter-spacing: -0.02em;
	 line-height: 180%;
    opacity: 0;
    transform: translateY(20px);
    animation: fadeUp 0.8s ease-out forwards;
}
#content .substance h5 > em{display: block; width: 100%; text-align: left; font-size: 0.9375rem; color: #000; font-weight: 700; letter-spacing: -0.03em; line-height: 160%; margin-bottom: 1rem;}
#content .substance h6 {font-size: 22px;line-height: 30px;color: #003366;margin: 60px 0px 35px 0px;font-weight: 600;}

	@media all and (max-width:1024px){
		#content .substance{padding-top: 2.5rem;}
		#content .substance h4{font-size: 1.875rem;}
		#content .substance h5{font-size: 1rem;margin-top: 0.75rem;padding-bottom: 0.5rem;}
	}

@keyframes fadeUp {
  0% {
    opacity: 0;
    transform: translateY(20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}


input.bdCmBtn{display:inline-block; font-size:16px; height:30px; padding:5px 10px 7px 10px; color:#424242; border:1px solid #114291; background-color:#fff; font-weight:bold;}
input.bdCmBtn:hover {background:#114291; color:#fff; font-weight:bold;text-decoration: none}

a.bdCmBtn span{display:inline-block; font-size:16px; height:23px; padding:5px 10px 7px 10px; background:#114291; color:#fff; border:1px solid #114291;}

/**/
.text_left{text-align:left !important;}
.text_right{text-align:right !important;}
.text_600{font-weight:600;}
.text_green{color:#00b4cb;}
.text_gray{color:#CCC;}
.text_red{color:#ff4200;}
.text_blue{color:#0091fa;}
.text_20{font-size:20px;}
.text_bold{font-weight:600;}
.text_height200{line-height:200%;}
.text_height180{line-height:180%;}
.float_r{float:right;}
.caution{font-size:15px; font-weight:normal; line-height:180%; padding:0 0 5px 22px !important; margin:5px 0 !important;}
.pad_t10{padding-top:10px;}
.pad_t20{padding-top:20px;}
.pad_t30{padding-top:30px;}
.pad_t40{padding-top:40px;}
.pad_b40{padding-bottom:40px;}
.pad_b30{padding-bottom:30px;}
.pad_b20{padding-bottom:20px;}
.pad_b10{padding-bottom:10px;}
.mar_t60{margin-top:60px;}
.mar_b40{margin-bottom:40px;}
.mar_left10{margin-left:10px;}
.mar_left40{margin-left:40px;}
strong{font-weight:700;}
.list_snone{list-style:none;}
.line_solid	{clear:both;display:block;margin:20px 0;border-bottom:1px solid #dadada;}
.line_dashed{clear:both;display:block;margin:20px 0;border-bottom:1px dashed #dadada;}
.line_dotted{clear:both;display:block;margin:30px 0;border-bottom:1px dotted #dadada;}
.line_double{clear:both;display:block;margin:20px 0;border-bottom:3px double #eaeaea;}
.line_solid_t2{clear:both;display:block;margin-bottom:20px;border-top:2px solid #667484;}
.line_solid_b2{clear:both;display:block;border-bottom:2px solid #667484;}
.line_solid_b1{clear:both;display:block;margin:20px 0;border-bottom:1px solid #667484;}
.unline a{text-decoration:none;}
.unline a:hover{text-decoration:underline;}

/* tab */
.tab_txt:after,
.tab_list:after {content:" "; display:block; float:none; clear:both;}
.tab_txt{margin-bottom:33px;}
.tab_txt ul{display:table; width:100%; overflow:hidden; table-layout:fixed; text-align:center;}
.tab_txt li{display:table-cell; min-width:16.6666%; word-break:break-all !important;}
.tab_txt ul.box5 > li{min-width:16.6666%;}
.tab_txt a{display:block; padding:15px 15px 15px 15px; color:#8f98a4; font-size:16px; letter-spacing:-1px; background-color:#ffffff; text-decoration:none; border-width:1px; border-color:#dadada; border-style:solid; border-top-width:1px; border-left-width:0; border-bottom-width:1px;}
.tab_txt li:first-child a{border-left-width:1px;}
.tab_txt li a:hover{color:#fe9167;}
.tab_txt li a.on{background-color:#fe9167; border-color:#fe9167; color:#fff; text-decoration:none;}
.tab_txt li:nth-child(1) a,
.tab_txt li:nth-child(2) a,
.tab_txt li:nth-child(3) a,
.tab_txt li:nth-child(4) a,
.tab_txt li:nth-child(5) a,
.tab_txt li:nth-child(6) a,
.tab_txt li:nth-child(7) a{border-top-width:1px}
.tab_txt li:nth-child(7n+1) a{border-left-width:1px;}
.tab_txt li.spec a{letter-spacing:-2px;}

/*큰 동그라미 블릿 리스트*/
#content .substance .list_02{margin:5px 0 25px 0;}
#content .substance .list_02 > li{position:relative; padding:4px 0 4px 18px; font-size:16px; line-height:1.7; color:#424242; font-weight:400;}
#content .substance .list_02 > li:before{content:''; position:absolute; top:0; left:0; margin-top:14px; margin-left:4px; width:5px; height:5px; background:#fe9167; border-radius:10px;}
#content .substance .list_02 > li .list_02_01{margin:6px 0; padding:0;}
#content .substance .list_02 > li .list_02_01 > li{position:relative; padding: 3px 0 3px 13px; font-size:15px; color:#5a5a5a; font-weight:400; line-height:1.8;}
#content .substance .list_02 > li .list_02_01 > li:before{content:""; display:block; position:absolute; left:2px; top:15px; width:3px; height:3px; background:#999;}
#content .substance .list_02 > li .list_02_01 > li > .list_02_01_01{margin:6px 0; padding:0;}
#content .substance .list_02 > li .list_02_01 > li > .list_02_01_01 > li{position:relative; padding:3px 0 3px 13px; font-size:15px; line-height:170%;}
#content .substance .list_02 > li .list_02_01 > li > .list_02_01_01 > li:before{content:""; display:block; position:absolute; left:1px; top:16px; width:6px; height:1px; background:#333;}
#content .substance .list_02 > li .list_02_01 > li > .list_02_01_02{margin:6px 0; padding:0;}
#content .substance .list_02 > li .list_02_01 > li > .list_02_01_02 > li{position:relative; padding:3px 0 3px 13px; font-size:15px; line-height:170%;}
#content .substance .list_02 > li .list_02_01 > li .list_02_01_01_01{margin:4px 0; padding:0;}
#content .substance .list_02 > li .list_02_01 > li .list_02_01_01_01 > li{position:relative; padding:3px 0 3px 20px; font-size:15px; line-height:170%;}

	@media all and (max-width:1024px){
		#content .substance .list_02 > li{font-size: 0.875rem;}
	}

/*작은 동그라미 블릿 리스트*/
#content .substance .list_01{ margin:0 0 10px 10px;}
#content .substance .list_01 > li{clear:both; position:relative; padding: 4px 0 4px 19px; font-size:17px; line-height:180%;}
#content .substance .list_01 > li:before{content:""; display:block; position:absolute; top:0; left:0; margin-top:12px; width:5px; height:5px; border-radius:50%; border:4px solid #bd4d57;}
#content .substance .list_01 .list_01_01{margin:6px 0; padding:0;}
#content .substance .list_01 .list_01_01 > li{position:relative; padding:3px 0 3px 13px; font-size:16px; line-height:180%; font-weight:400;}
#content .substance .list_01 .list_01_01 > li:before{content:""; display:block; position:absolute; left:1px; top:17px; width:6px; height:1px; background:#333;}
#content .substance .list_01 .list_01_01_01{margin:6px 0; padding:0;}
#content .substance .list_01 .list_01_01_01 > li{position:relative; padding:3px 0 3px 13px; font-size:16px; line-height:180%; font-weight:400;}
#content .substance .list_01 .list_01_01_01 > li:before{content:""; display:block; position:absolute; left:2px; top:15px; width:3px; height:3px; background:#ae8c67;}
@media all and (max-width:1024px){
		#content .substance .list_01 > li{font-size: 0.875rem;}
		#content .substance .list_01 > li:before{margin-top:6px;}
	}

/*작은네모 블릿 리스트*/
#content .substance .list_03{margin:5px 0 15px 0;}
#content .substance .list_03 > li{position:relative; padding:4px 0 4px 10px; font-size:15px; line-height:1.7; color:#686868; font-weight:400;}
#content .substance .list_03 > li:before{content:""; display:block; position:absolute; left:2px; top:15px; width:3px; height:3px; background:#999;}
#content .substance .list_03 > li .list_03_01{margin:4px 0 6px 0; padding:0;}
#content .substance .list_03 > li .list_03_01 > li{position:relative; padding:1px 0 1px 13px; font-size:15px; color:#5a5a5a; font-weight:400; line-height:1.6;}
#content .substance .list_03 > li .list_03_01 > li:before{content:""; display:block; position:absolute; left:1px; top:12px; width:6px; height:1px; background:#333;}

/* btn */
a.btn_d		{-webkit-transition: all 0.2s ease-out;	-moz-transition: all 0.2s ease-out;	-ms-transition: all 0.2s ease-out;-o-transition: all 0.2s ease-out;	transition: all 0.2s ease-out;  text-decoration:none;}
.btn_d		{display:inline-block; *zoom:1; cursor:pointer; white-space:nowrap; text-align:center; vertical-align:middle; line-height:1.4; border-style:solid; border-width:1px; padding:5px 10px; margin:0 0 3px 0;}
button.btn_d,
input[type="submit"],
input[type="button"]{cursor:pointer;}

.btn_d.btn_small {font-size:15px; padding:10px 12px; color:#fff; border-color:#158ccd; background-color:#158ccd; font-weight:bold; word-break: break-all;}
.btn_d.btn_small:hover {background:#158ccd; color:#fff; font-weight:bold;}

.btn_d.btn_small.cancel {font-size:15px; padding:10px 12px; color:#fff; border-color:#8e8e8e; background-color:#8e8e8e; font-weight:bold;}

.btn_d.btn_xsmall {font-size:13px; padding:5px 19px; color:#fff; border-color:#2674bf; background-color:#2674bf; font-weight:bold; word-break: break-all;}
.btn_d.btn_xsmall:hover {background:#fff; color:#2674bf; font-weight:bold;}
.btn_d.btn_xsmall.yellow {background: #ffb548; border-color:#ffb548;}
.btn_d.btn_xsmall:hover.yellow {background: #fff; border-color:#ffb548; color: #ea0a2a;}
.btn_d.btn_xxsmall {font-size:13px; padding:2px 5px; color:#fff; border-color:#2674bf; background-color:#2674bf; font-weight:bold; vertical-align:middle; word-break: break-all;}
.btn_d.btn_xxsmall:hover {background:#fff; color:#2674bf; font-weight:bold;}

.btn_d.disabled{color:#fff; background:#ddd; border-color:#ddd;}
.btn_d.disabled:hover {background:#ddd; color:#fff; border-color:#ddd;}

		@media all and (max-width:768px){
			.btn_d.btn_xsmall {font-size:0.875rem; padding:5px 5px;}
		}

/* tab */
.tbl_area{position:relative; clear:both; word-break:break-all !important;}
.tbl_area .table_tip{position:absolute; right:0; top:-25px; color:#666; font-size:14px; font-weight:normal;}
/* table */
.tbl_gray1{border-collapse:separate; border-top:1px solid #333; margin-left:-1px; width:100%;}
.tbl_gray1 thead th {background:#f4f4f4; font-size:15px; padding:15px 10px; border-left:1px solid #ddd; border-bottom:1px solid #ddd; text-align:center; font-weight:bold;}
.tbl_gray1 thead th:first-child{border-left:none;}
.tbl_gray1 thead th.le_bo_none,
.tbl_gray1 tbody th.le_bo_none,
.tbl_gray1 thead td.le_bo_none,
.tbl_gray1 tbody td.le_bo_none{border-left:none;}
.tbl_gray1 thead th.le_bo,
.tbl_gray1 tbody th.le_bo,
.tbl_gray1 thead td.le_bo,
.tbl_gray1 tbody td.le_bo{border-left:1px solid #ddd !important;}
.tbl_gray1 tbody th {background:#f8f8f8; font-size:15px; font-weight:bold;}
.tbl_gray1 tbody th {text-align:left;}
.tbl_gray1 tbody th:first-child,
.tbl_gray1 tbody td:first-child{border-left:none;}
.tbl_gray1 tbody td, .tbl_gray1 tfoot td {background:#fff; font-size:15px; }
.tbl_gray1 tbody th, .tbl_gray1 tbody td, .tbl_gray1 tfoot th, .tbl_gray1 tfoot td { border-left:1px solid #ddd; border-bottom:1px solid #ddd; text-align:center; padding:10px;/* word-break:break-all;*/}
.tbl_gray1 tbody td.tbltext_le{ text-align:left;}
			
/*페이징*/			
.ListBoardWrap .boardButtonMove{float:left; padding:24px 0 0 0;}
.ListBoardWrap .boardButton{float:right; padding:24px 0 0 0;}
.ListBoardWrap .boardPaging{width:100%; margin:25px 0 30px 0; text-align:center; vertical-align:middle; color:#666; font-size:14px;}
.ListBoardWrap .boardPaging a,
.ListBoardWrap .boardPaging b{display:inline-block; width:25px; height:25px; padding-right:2px; line-height:25px; margin-right:3px; color:#666; text-decoration:none; border:1px solid #aaa; border-radius:2px; -webkit-transition: 0.2s all; transition: 0.2s all; font-weight:normal; letter-spacing:-2px;}
.ListBoardWrap .boardPaging a.listBtn{background:#eee;}
.ListBoardWrap .boardPaging b,
.ListBoardWrap .boardPaging a:hover{color:#fff; background:#555; border:1px solid #555;}


/* =========================
   인사말 레이아웃
========================= */
/* =========================
   인사말 전체 폰트
========================= */
#content .substance {
    font-family: 'SCoreDream', sans-serif;
}

/* =========================
   상단 타이틀
========================= */
.eng-title {
    font-size: 14px;
    color: #414141;
    /* letter-spacing: -0.03em; */
    /* margin-bottom: 8px; */
    text-align: center;
    font-weight: 600;
}

#content .substance h4 {
    font-size: 2.5rem;
    font-weight: 700;
    text-align: center;
    margin: 0 0 20px 0;
    font-family: 'SCoreDream', sans-serif;
}

/* =========================
   레이아웃
========================= */
.content-wrapper {
    display: flex;
    align-items: flex-start;
    gap: 40px;
    position: relative;
    margin-top: 40px;
    padding-top: 40px;
    margin-bottom: 90px;
    padding-left: 30px;
    padding-right: 30px;
}

/* 꺾인 선 */
.content-wrapper::before {
    content: "";
    position: absolute;
    left: 0;
    top: 20px;
    width: 220px;
    height: 5px;
    background: url('../images/img_line.jpg') repeat-x;
}

.content-wrapper::after {
    content: "";
    position: absolute;
    left: 0;
    top: 20px;
    width: 5px;
    height: 60px;
    background: url('../images/img_line.jpg') repeat-y;
}

/* =========================
   좌우 비율
========================= */
.text-area {
    flex: 6;
    padding-left: 65px;
    text-align: left;
    padding-top: 40px;
}
.text-area,
.text-area * {
    font-family: 'SCoreDream', sans-serif;
}

.image-area {
    flex: 4;
    text-align: right;
    padding-top: 40px;
}

.image-area img {
    max-width: 100%;
    height: auto;
}

/* =========================
   메인 타이틀
========================= */
.blue-title {
    font-size: 38px;
    font-weight: 700;
    color: #0066b3;
    margin-bottom: 12px;
    white-space: nowrap;
}

/* =========================
   서브 타이틀
========================= */
.green-subtitle {
    color: #192531;
    font-size: 30px;
    font-weight: 700;
    margin-bottom: 50px;
}

/* =========================
   본문
========================= */
.description {
    font-size: 16px;
    line-height: 1.9;
    color: #323232;
    margin-bottom: 24px;
	max-width: 780px;
    font-weight: 500;
}

.strong-black {
    display: block;
    max-width: 720px;       /* 🔥 본문 기준 폭 */
    font-weight: 500;       /* 🔥 너무 두껍지 않게 */
    color: #323232;
    font-size: 18px;
    line-height: 1.8;
}

/* =========================
   대표이사
========================= */
.ceo-sign {
    margin-top: 40px;
}

.ceo-sign .ko {
    font-size: 21px;
    color: #192531;
    margin: 0;
    font-weight: 600;
}
.ceo-sign .en {
   font-size: 16px;
    color: #666;
    margin: 0;
    font-weight: 600;
}

/* =========================
   서브페이지 하단 배경 텍스트
========================= */

/* 콘텐츠 위로 */
#content > * {
    position: relative;
    z-index: 1;
}

/* =========================
   인사말 애니메이션
========================= */

/* 1. 애니메이션 정의 */
@keyframes fadeUp {
    0% {
        opacity: 0;
        transform: translateY(40px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 2. 기본 상태 */
.text-area > * {
    opacity: 0;
}

/* 3. 애니메이션 실행 */
.text-area > * {
    animation: fadeUp 1s ease forwards;
}

/* 4. 순차 등장 (핵심) */
.text-area > *:nth-child(1) { animation-delay: 0.1s; }
.text-area > *:nth-child(2) { animation-delay: 0.3s; }
.text-area > *:nth-child(3) { animation-delay: 0.5s; }
.text-area > *:nth-child(4) { animation-delay: 0.7s; }
.text-area > *:nth-child(5) { animation-delay: 0.9s; }
.text-area > *:nth-child(6) { animation-delay: 1.1s; }
.text-area > *:nth-child(7) { animation-delay: 1.3s; }
.text-area > *:nth-child(8) { animation-delay: 1.5s; }
.text-area > *:nth-child(9) { animation-delay: 1.7s; }
.text-area > *:nth-child(10){ animation-delay: 1.9s; }

/* =========================
   반응형
========================= */
@media screen and (max-width: 768px) {

    .content-wrapper {
        flex-direction: column;
        margin-top: 0px;
    }

    .text-area {
        flex: none;
        width: 100%;
        padding: 1.5rem 1.5rem;
    }

    .image-area {
        flex: none;
        width: 100%;
        text-align: center;
        padding: 0;
    }

    .blue-title {
        font-size: 1.3rem;
        white-space: normal;
    }

    .green-subtitle {
        font-size: 1.1rem;
        margin-bottom: 30px;
    }

    .description {
        font-size: 0.875rem;
    }

    #content::after {
        font-size: 60px;
        bottom: 20px;
    }
}

/* =========================
   연혁 전체 카드형
========================= */
/*
.history {
    max-width: 1500px;
    margin: 80px auto;
    padding: 0 20px;
    box-sizing: border-box;
    font-family: "SCoreDream", sans-serif;
}
.main-title { font-size: 36px; font-weight: 800; margin-bottom: 15px; text-align: center; }
h5 { font-size: 18px; color: #666; margin-bottom: 50px; text-align: center; font-weight: 400; }
.history_list {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    padding: 0;
    margin: 0;
    list-style: none;
    position: relative;
}
.history_item {
    width: calc(50% - 20px);
    background: #f9fafb;
    padding: 30px;
    border-radius: 15px;
    box-sizing: border-box;
    border-top: 4px solid #0066b3;
    transition: transform 0.3s ease;
}

.history_item:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.05);
}

.history_date {
    display: inline-block;
    font-size: 28px;
    font-weight: 800;
    color: #0f6fb7;
    margin-bottom: 20px;
    border-bottom: 2px solid #2b6bbc;
    padding-bottom: 5px;
}

.history_item ul {list-style: none;padding: 0;margin: 0;}

.history_element {
    margin-bottom: 20px;
}

.history_element dl {
    display: flex;
    align-items: flex-start;
    margin: 5px;
    gap: 5px;
}
.history_element dt {
    flex-shrink: 0;
    width: 70px;
    font-weight: 600;
    color: #b53641;
    font-size: 16px;
    line-height: 1.5;
}
.history_element dd {
    flex-grow: 1;
    margin: 0;
    font-size: 16px;
    color: #555;
    line-height: 1.5;
    word-break: keep-all;
    text-align: left;
}

@media all and (max-width: 1024px) {
    .history_item {
        width: 100%;
    }
}

@media all and (max-width: 640px) {
    .history_element dl {
        flex-direction: column;
        gap: 5px;
    }
    .history_element dt {
        width: 100%;
        color: #00b6c1;
    }
}
*/
/* =========================
   연혁 전체 끝
========================= */

.history_wrap{ width:100%; padding:3rem 0;}
.history_wrap .eng-title{ font-size:1.125rem; color:#999; margin-bottom:1rem;}
.history_wrap .main-title{ font-size:3rem; font-weight:700; color:#111; margin-bottom:2rem;}
.history_wrap h5{ line-height:1.8; color:#666; margin-bottom:6rem;}
.history_wrap .text_blue{ color:#16398f; font-weight:600;}

/* 상단 연도 */
.history_nav{ position:relative; padding:0 5rem; margin-bottom:8rem; overflow:hidden;}
.history_nav::before{ content:''; position:absolute; top:28px; left:0; width:100%; height:2px; background:#ddd;}
.history_nav .swiper-wrapper{ align-items:center;}
.history_nav .swiper-slide{ position:relative; text-align:center; cursor:pointer;}
.history_nav .swiper-slide span{ display:block; padding-top:3rem; font-size:2rem; font-weight:700; color:#cfcfcf; transition:all .3s;}
.history_nav .swiper-slide::before{ content:''; position:absolute; top:23px; left:50%; transform:translateX(-50%); width:10px;  height:10px; border-radius:50%; border:2px solid #dcdcdc; background:#fff; z-index:5;}
.history_nav .swiper-slide.active span{ color:#c62828;}
.history_nav .swiper-slide.active::before{ width:20px; height:20px; top:13px; border:6px solid #c62828;}

/* 화살표 */
.history_prev,
.history_next{ position:absolute; top:0.5rem; width:40px; height:40px; border:2px solid #ddd; background: #fff; border-radius:50%; cursor:pointer; z-index:10;}
.history_prev{ left:0;}
.history_next{ right:0;}
.history_prev::before,
.history_next::before{ content:''; position:absolute; top:50%; left:50%; width:12px; height:12px; border-top:2px solid #999; border-right:2px solid #999;}
.history_prev::before{ transform:translate(-30%,-50%) rotate(-135deg);}
.history_next::before{ transform:translate(-70%,-50%) rotate(45deg);}

/* 연혁 내용 */
.history_content{ max-width:1200px; margin:0 auto;}
.history_item{ display:flex; gap:6rem; padding-bottom:6rem;}
.history_item .year{ min-width:220px; font-size:4rem; font-weight:800; color:#c62828;}
.history_box{ flex:1; border-left:1px solid #ddd; padding-left:4rem;}
.history_box dl{ display:flex; gap:2rem; margin-bottom:2rem; align-items: center;}
.history_box dt{  min-width:50px; font-size:1.5rem; font-weight:700; color:#112d7c;}
.history_box dd{ font-size:1.125rem; line-height:1.7; color:#333; text-align: left;}
.history_box dd strong{ font-weight:700;}

@media(max-width:1024px){
    .history_item{ flex-direction:column; gap:2rem;}
    .history_item .year{font-size:3rem;}
    .history_box{ padding-left:2rem; border-left: none;}
}
@media(max-width:768px){
    .history_wrap{  padding:5rem 0; }
    .history_wrap .main-title{ font-size:2.5rem; }
    .history_nav{  padding:0 3rem; }
    .history_nav .swiper-slide span{  font-size:1.5rem;  padding-top:3rem;}
	.history_nav .swiper-slide.active::before{width: 14px; height: 14px;}
    .history_item .year{ font-size:2.5rem; }
	.history_box dl{gap: 1rem;}
	.history_box dd{ font-size:0.9375rem;}
}

/* 조직도 */
.org1 {position: relative; width: 100%; text-align: center;}
.org1 > li.num01_1{}
.org1 > li.num01_1 dl{position: relative; max-width: 15rem; margin: 0 auto; margin-bottom: 5.5rem;}
.org1 > li.num01_1 dl::before{content: ""; position: absolute; left: 50%; bottom:-3.5rem; width: 1px; height: 3.5rem; border-left: 1px dashed #d0d0d0; transform: translateX(-50%);}
.org1 > li.num01_1 dl dt { margin: 0 auto; background: #0091fa;/* 위쪽 색상 */color: #fff; font-size:1.5rem; padding: 20px 2%; /* 높이 축소 */text-align: center; border-radius: 10px; font-weight: 700;}
.org1 > li.num01_1 dl dd { background: #fff;/* 아래 흰색 */ border: 1px solid #dcdcdc; font-size:1.25rem; padding: 10px 2%; text-align: center; border-radius: 0 0 8px 8px; line-height: 1.6; position: relative;}
.org1 > li.num02 {position: relative; width: 100%; max-width: 65rem; margin: 0 auto; display: flex; justify-content: space-between; column-gap:4rem;}
.org1 > li.num02::before{content: ""; position: absolute; left: 50%; top:-2rem; width:calc(75% + 3rem); height: 1rem; border-top: 1px dashed #d0d0d0; transform: translateX(-50%);}
.org1 > li.num02 dl{position: relative; width:calc(25% - 3rem);}
.org1 > li.num02 dl::before{content: ""; position: absolute; left: 50%; top:-2rem; width: 1px; height: 2rem; border-left: 1px dashed #d0d0d0; transform: translateX(-50%);}
.org1 > li.num02 dl dt {background: #145ba2; color: #fff; padding: 15px 2%; text-align: center; border-radius: 10px; position: relative; font-weight: 700;}
.org1 > li.num02 dl dd {background: #fff; padding: 10px 2%; text-align: center; border: 1px solid #dcdcdc; border-radius: 0 0 10px 10px; line-height: 1.6;}
	@media all and (max-width:768px){
		.org1 > li.num01_1 dl{margin-bottom: 0.875rem;}
		.org1 > li.num01_1 dl dt,
		.org1 > li.num01_1 dl dd {padding: 8px;}
		.org1 > li.num02 {flex-direction:column; align-items:center;}
		.org1 > li.num02 dl {width:80%; margin:10px 0;}
		.org1 > li.num01_1 dl::before,
		.org1 > li.num02::before{display: none;}
		.org1 > li.num02 dl::before{top: -1.3rem; height: 2rem;}
	}

/* 주요사업분야 */
.major_symbol {display: flex; justify-content: center; align-items: center; width: 18.91%; padding-top: 18.91%; background: url(../images/symbol_bg.png) center/cover no-repeat; border-radius: 50%; position: relative; margin: 0 auto;}
.major_symbol .major_symbol_inner {position: absolute; left: 0; top:0; margin-left: 7.5%; margin-top: 7.5%; display: flex; justify-content: center; align-items: center; width: 85%; height: 85%; background: #0066b3; border-radius: 50%; box-shadow: 0 0 40px rgba(0, 123, 199, 0.35);}
.major_symbol .major_symbol_inner .line {position: absolute; left: 50.4%; bottom:-7rem; width: 1px; height: 7rem; border-left: 1px dashed #d0d0d0; transform: translateX(-50%);}
.major_symbol .major_symbol_inner .line:before {content: ""; width: 1rem; height: 1rem; border: 1px solid #0066b3; background: #fff; border-radius: 50%; position: absolute; top: -0.5rem; left: 51%; transform: translateX(-50%);}
.major_symbol_inner em {font-size:1.8rem; letter-spacing:-0.065em; color:#fff; font-weight: 700; line-height: 160%;}
.major_wrap { text-align:center;}
.major_wrap .major_list { position: relative; width: 100%; max-width:1560px; margin:8rem auto 0; display:flex; justify-content: space-between; gap:2rem;}
.major_wrap .major_list::before {content: ""; position: absolute; top: -3rem; left: 50%; transform: translateX(-50%); width: calc(80% + 1.5rem); height: 1px; border-top: 1px dashed #d0d0d0;}
.major_wrap .major_list_item { width: calc(20% - 1.6rem); position: relative; display:flex; flex-direction:column; align-items:center;}
.major_wrap .major_list_item .major_item_tit01{width: 100%; background: #16baff; border: 1px solid #16baff; border-radius: 10px 10px 0 0; height: 4.5rem; line-height: 1.4;  display: flex; justify-content: center; align-items: center; position: relative;}
.major_wrap .major_list_item .major_item_tit01::before{content: ""; width: 7px; height: 7px; background: #0066b3; border-radius: 50%; position: absolute; top: -3.25rem; left: 50%; transform: translateX(-50%); z-index: 100;}
.major_wrap .major_list_item .major_item_tit01::after{content: ""; position: absolute; top: -3rem; left: 50%; transform: translateX(-50%); width: 1px; height: 2.875rem; border-left: 1px dashed #d0d0d0; z-index:0;}
.major_wrap .major_list_item .major_item_tit01 em {color: #fff; font-size: 1.1875rem; font-weight: 600;}
.major_wrap .major_list_item .major_item_tit02{width: 100%; background: #fff; border: 1px solid #dcdcdc; border-radius: 0 0 10px 10px; padding: 1.75rem; text-align: left; flex-grow: 1;}

@media all and (max-width:1280px){
	.major_wrap .major_list{gap:1rem;}
	.major_wrap .major_list_item { width: calc(20% - 0.8rem);}
	.major_wrap .major_list_item .major_item_tit02{padding: 0.75rem;}
	.major_symbol .major_symbol_inner .line{bottom: -6rem; height: 6rem;}
	.major_wrap .major_list::before{width: calc(80% + 0.8rem);}
}
@media all and (max-width:1024px){
	.major_wrap .major_list_item .major_item_tit01 em,
	.major_symbol_inner em{font-size: 1rem;}
}
@media all and (max-width:768px){
	.major_symbol {width: 40%; padding-top:40%; margin:0 auto;}
	.major_wrap .major_list{flex-direction: column; margin: 2rem auto 0;}
	.major_wrap .major_list_item { width:100%;}
	.major_wrap .major_list::before,
	.major_wrap .major_list_item .major_item_tit01::after,
	.major_wrap .major_list_item .major_item_tit01::before{display: none;}
	.major_wrap .major_list_item .major_item_tit01{height: 3.5rem;}
	.major_wrap .major_list_item .major_item_tit02{padding-bottom: 0;}
}

/* 경영방침 */
/* [공통] 전체 컨테이너 */
/* 경영방침 */
/* [공통] 전체 컨테이너 */
.policy_clean_container {
    max-width: 1200px;
    margin: 0px auto 80px;
    background: #ffffff;
    border: 1px #e3e3e3 solid;
    padding-top: 70px;
    border-radius: 30px;
    padding-bottom: 20px;
}

.policy_wrap {position: relative;padding: 20px;}

/* [레이아웃] 연결 간격 */
.policy_01_wrap { 
    display: flex; 
    justify-content: center; 
    align-items: center; 
    column-gap: 100px; 
    margin-bottom: 50px; 
}

/* [타이틀] 왼쪽 박스 */
.policy_01_tit {
    width: 210px;
    flex-shrink: 0;
    color: #ffffff;
    font-size: clamp(15px, 2vw, 18px); /* 반응형 폰트 */
    font-weight: 800;
    position: relative;
    border: 1px solid #d0d0d0;
    padding: 18px 0;
    border-radius: 10px;
    text-align: center;
    background: #b53641;
    z-index: 2;
}

/* [연결선] 데스크탑 전용 */
.policy_01_tit::before { 
    content: ""; position: absolute; right: -100px; top: 50%; 
    width: 100px; height: 1px; border-bottom: 1px dashed #bbb; z-index: 1; 
}

/* [컬러 박스] 우측 상단 */
.policy_01_inner {
    width: 650px;
    min-height: 140px;
    border-radius: 15px;
    padding: 25px clamp(20px, 5vw, 50px); /* 패딩 반응형 */
    color: #262626;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    position: relative;
}

/* 첫 번째 항목 여백 추가 */
.policy_01_wrap.first_item .policy_01_inner {
    padding-top: 40px;
    padding-bottom: 40px;
}

/* 왼쪽 원형 포인트 */
.policy_01_inner::after { 
    content: ""; position: absolute; width: 10px; height: 10px; 
    background: #fff; border-radius: 50%; top: 50%; left: 0; 
    transform: translate(-50%, -50%); z-index: 3; 
}

/* [리스트] */
.inner_list { 
    display: inline-block; list-style: none; padding: 0; margin: 0; 
    text-align: left; 
}

.inner_list li { 
    display: flex; 
    align-items: center; 
    justify-content: flex-start; 
    margin-bottom: 12px; 
    white-space: nowrap; /* 데스크탑은 한 줄 유지 */
}

.inner_list li:last-child { margin-bottom: 0; }

/* 리스트 내부 텍스트 - 반응형 적용 */
.list_tit {
    display: flex;
    align-items: center;
    position: relative;
    font-size: clamp(15px, 2.5vw, 18px); /* 폰트 크기 조절 */
    font-weight: 700;
    padding-left: 20px;
    flex-shrink: 0;
    color: #333333;
}

.list_tit::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 4px;
    border-radius: 50%;
    border: 3px solid #b53641;
    background-color: transparent;
    box-sizing: content-box;
}

.list_dash { margin: 0 10px; font-size: 15px; opacity: 0.8; }

.list_con { 
    font-size: clamp(13px, 2.2vw, 16px); /* 폰트 크기 조절 */
    opacity: 0.95; font-weight: 400; 
}

/* 배경색 및 포인트 컬러 */
.policy_01_inner.b1 {background: #ffffff;border: 1px #b53641 solid;} .policy_01_inner.b1::after {border: 2px solid #b53641;}
.policy_01_inner.b2 {background: #ffffff;background: #ffffff;border: 1px #b53641 solid;} .policy_01_inner.b2::after {border: 2px solid #357ABD;border: 2px solid #b53641;}
.policy_01_inner.b3 {background: #ffffff;background: #ffffff;border: 1px #b53641 solid;} .policy_01_inner.b3::after {border: 2px solid #255A91;border: 2px solid #b53641;}
.policy_01_inner.b4 {background: #ffffff;background: #ffffff;border: 1px #b53641 solid;} .policy_01_inner.b4::after {border: 2px solid #b53641;}

/* 하단 화살표 */
.policy_01_inner::before { 
    content: ""; position: absolute; left: 50%; bottom: -30px; 
    width: 8px; height: 8px; border-right: 2px solid #d0d0d0; 
    border-bottom: 2px solid #d0d0d0; transform: translateX(-50%) rotate(45deg); 
}
.policy_01_wrap:last-child .policy_01_inner::before { display: none; }

/* ===================================================
   [반응형 최적화] 태블릿 & 모바일
   =================================================== */
@media all and (max-width: 1024px) {
	.policy_clean_container { padding: 30px; }
    .policy_01_wrap { 
        flex-direction: column; 
        gap: 15px; 
        margin-bottom: 60px; 
    }
    
    /* 점선 및 옆쪽 동그라미 숨김 */
    .policy_01_tit::before, .policy_01_inner::after { display: none; }
    
    .policy_01_tit { 
        width: 100%; 
        max-width: 300px; 
        padding: 12px 0; 
    }
    
    .policy_01_inner { 
        width: 100%; 
        padding: 20px; 
        min-height: auto; 
    }
    
    .inner_list li { 
        white-space: normal; /* 텍스트 줄바꿈 허용 */
        flex-wrap: wrap;     /* 내용이 길면 아래로 */
        margin-bottom: 15px;
    }
    
    .list_dash { display: none; } /* 모바일에서는 하이픈 제거가 더 깔끔 */
    
    .list_tit { 
        width: 100%; 
        margin-bottom: 5px; 
        padding-left: 18px;
    }
    
    .list_con { 
        width: 100%; 
        padding-left: 18px; /* 동그라미 라인에 맞춤 */
        line-height: 1.4;
    }

    /* 하단 화살표 위치 조정 */
    .policy_01_inner::before { bottom: -40px; }
}

@media all and (max-width: 480px) {
	
    .policy_clean_container { padding: 10px; }
    .policy_01_wrap { margin-bottom: 50px; }
    .policy_01_inner { border-radius: 10px; }
}

/* 경영방침 전체 컨테이너 끝*/





/* 사업소개 상단 섹션 */
.business { 
    position: relative; 
    display: flex; 
    width: 100%; 
    margin: 80px auto; 
    align-items: flex-start; 
}

/* [수정] 이미지 박스가 위로 올라오도록 설정 */
.business .business_le { 
    position: relative; 
    text-align: left; 
    padding-right: 4rem; 
    width: 40%; 
    box-sizing: border-box; 
    z-index: 10; /* 숫자를 높여서 텍스트 박스보다 위로 올림 */
}

.business .business_le img { 
    width: 100%; 
    max-width: 555px; 
    height: auto; 
    /* 이미지에 그림자를 살짝 주면 텍스트 박스 위에 떠 있는 느낌이 더 살아납니다 (선택사항) */
    /* filter: drop-shadow(10px 10px 20px rgba(0,0,0,0.1)); */
}

/* 텍스트 박스 */
.business .business_ri { 
    position: relative; 
    width: 60%; 
    text-align: left; 
    padding: 5.75rem 0 0 0; 
    box-sizing: border-box; 
    z-index: 1; /* 이미지보다 낮은 숫자로 설정 */
}

/* 배경 회색 박스 */
.business .business_ri::before { 
    content: ""; 
    position: absolute; 
    top: 2rem; 
    left: -14%; 
    width: 114%; 
    height: 100%; 
    background: #f4f7f9; 
    z-index: -1; /* 가장 아래에 배치 */
}

.business .business_ri .business_con { 
    display: block; 
    font-size: 16px; 
    color: #333; 
    line-height: 180%; 
    margin-bottom: 2rem; 
}

/* 하단 6개 이미지 리스트 (기존과 동일) */
.busi_img { 
    display: flex; 
    flex-wrap: wrap; 
    justify-content: flex-start; 
    gap: 1rem; 
    margin-top: 6rem; 
    width: 100%; 
    margin-bottom: 80px;
    padding: 0;
    list-style: none;
}

.busi_img > li { 
    width: calc(16.666% - 0.85rem); 
    border: 1px solid #ccc; 
    box-sizing: border-box; 
    background: #fff;
}

.busi_img > li img { width: 100%; height: auto; display: block; }

/* 반응형 구간 */
@media all and (max-width: 1024px) {
    .business { flex-direction: column; }
    .business .business_le { width: 100%; padding-right: 0; text-align: center; margin-bottom: 2rem; }
    .business .business_ri { width: 100%; padding: 2rem 1rem; }
    .business .business_ri::before { left: 0; width: 100%; top: 0; }
    
    .busi_img > li { width: calc(33.333% - 0.7rem); }
}

@media all and (max-width: 768px) {
    .busi_img > li { width: calc(50% - 0.5rem); }
}

.busi_img > li {
    transition: all 0.3s ease; /* 부드러운 변화 기록 */
}

.busi_img > li:hover {
    transform: translateY(-10px); /* 위로 살짝 들림 */
    border-color: #bd4d57;        /* 연우CST 포인트 컬러로 강조 */
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}


/* =================================================   
   인증서 섹션 시작
================================================= */
/* =================================================   
   인증서 섹션 (왼쪽 정렬 + 포인트 컬러 버전)
================================================= */
.certificate_wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 60px 40px; /* 간격 최적화 */
    margin: 80px auto;
    padding: 0 20px;
    list-style: none;
}

/* 카드 개별 항목 */
.certificate_wrap > li {
    width: calc(25% - 30px);
    background: #fff;
    border-radius: 12px; /* 곡률 살짝 증가 */
    overflow: hidden;
    border: 1px solid #e5e5e5;
    box-sizing: border-box;
    opacity: 0;
    transform: translateY(30px);
    animation: fadeUp 0.8s ease forwards;
    transition: all 0.3s ease-in-out;
}

/* 순차적 등장 애니메이션 */
.certificate_wrap > li:nth-child(1) { animation-delay: 0.1s; }
.certificate_wrap > li:nth-child(2) { animation-delay: 0.2s; }
.certificate_wrap > li:nth-child(3) { animation-delay: 0.3s; }
.certificate_wrap > li:nth-child(4) { animation-delay: 0.4s; }
.certificate_wrap > li:nth-child(5) { animation-delay: 0.5s; }
.certificate_wrap > li:nth-child(6) { animation-delay: 0.6s; }

/* 카드 호버 효과 */
.certificate_wrap > li:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 35px rgba(0,0,0,0.12);
    border-color: #b53641; 
}

/* -------------------------
   카드 상단 제목 (왼쪽 정렬 + 동그라미)
-------------------------- */
/* -------------------------
   카드 상단 제목 (중앙 정렬 + 글자에 밀착된 동그라미)
-------------------------- */
.certificate_tit {
    text-align: center;       /* 다시 중앙 정렬로 변경 */
    background: #b53641;
    padding: 1.4rem 0.5rem;
    color: #fff;
    font-size: 16px; 
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: background 0.3s ease;
    
    display: flex;            /* 내부 요소 정렬을 위해 flex 사용 */
    justify-content: center;  /* 동그라미+글자 뭉치를 가로 중앙으로 */
    align-items: center;      /* 세로 중앙 정렬 */
    gap: 10px;                /* [중요] 동그라미와 글자 사이의 고정 간격 */
}

/* 제목 바로 왼쪽에 붙는 흰색 테두리 동그라미 */
.certificate_tit::before {
    content: "";
    display: inline-block;    /* 글자와 함께 나란히 배치 */
    width: 5px;
    height: 5px;
    border-radius: 50%;
    border: 3px solid #fff;   /* 흰색 테두리 */
    background-color: transparent;
    flex-shrink: 0;           /* 원 모양 유지 */
    box-sizing: content-box;
    
    /* 미세한 높이 조절이 필요하다면 아래 주석 해제 후 조정 */
    /* margin-top: -1px; */ 
}

/* 모바일 대응 */
@media (max-width: 768px) {
    .certificate_tit {
        font-size: 16px;
        gap: 8px; /* 모바일에서는 간격 살짝 축소 */
    }
}

/* -------------------------
   카드 이미지 영역
-------------------------- */
.certificate_img {
    padding: 30px; 
    display: flex;
    justify-content: center;
    align-items: center;
    background: #f7f7f7; 
    height: 380px; 
    overflow: hidden;
}

.certificate_img img {
    width: auto;
    max-width: 90%;
    height: auto;
    max-height: 100%;
    object-fit: contain;
    box-shadow: 5px 10px 20px rgba(0,0,0,0.1); /* 이미지 그림자 살짝 연하게 */
    background: #fff; 
    image-rendering: -webkit-optimize-contrast; 
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.certificate_wrap > li:hover img {
    transform: scale(1.04);
    box-shadow: 8px 15px 30px rgba(0,0,0,0.2);
}
.certificate_img{
    position:relative;
    padding:30px;
    display:flex;
    justify-content:center;
    align-items:center;
    background:#f7f7f7;
    height:380px;
    overflow:hidden;
    text-decoration:none;
}

/* 어두운 오버레이 */
.certificate_img::after{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.35);
    opacity:0;
    transition:0.3s;
}

/* 확대 아이콘 */
.zoom_icon{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%, -50%) scale(0.8);
    width:70px;
    height:70px;
    border-radius:50%;
    background:rgba(255,255,255,0.95);
    color:#b53641;
    font-size:42px;
    font-weight:300;
    line-height:65px;
    text-align:center;
    z-index:2;
    opacity:0;
    transition:all 0.3s ease;
}

/* hover 효과 */
.certificate_img:hover::after{
    opacity:1;
}

.certificate_img:hover .zoom_icon{
    opacity:1;
    transform:translate(-50%, -50%) scale(1);
}

.certificate_img:hover img{
    transform:scale(1.05);
}

/* -------------------------
   반응형 설정 (모바일 최적화)
-------------------------- */
@media (max-width: 1024px) {
    .certificate_wrap { gap: 30px 15px; }
    .certificate_wrap > li { width: calc(50% - 10px); }
    .certificate_img { height: 340px; padding: 20px; }
}

@media (max-width: 768px) {
    .certificate_wrap { margin: 40px auto; }
    .certificate_wrap > li { width: 100%; }
    .certificate_img { height: auto; min-height: 300px; }
    
    .certificate_tit { 
        font-size: 16px; 
        padding: 1rem 1.2rem; 
    }
    .certificate_tit::before {
        width: 4px;
        height: 4px;
        border-width: 2px; /* 모바일에서는 동그라미도 살짝 작게 */
        margin-right: 10px;
    }
}

@keyframes fadeUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* =========================
   인증서 끝
========================= */




/* =================================================
    YOUN WOO CST Partner Page - 최종 통합 CSS (문구 양쪽 추가)
==================================================== */
/* [1. 애니메이션 정의] */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* [2. 공통 레이아웃] */
.partner_wrap { 
    width: 100%; 
    max-width: 1250px; 
    margin: 0 auto; 
    position: relative; 
    display: flex; 
    flex-direction: column; 
    align-items: center; 
    gap: 30px; 
}

/* [3. 서브 타이틀 디자인] */
.sub_graph_title {
    font-size: 24px;
    font-weight: 800;
    color: #003366;
    text-align: center;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin: 60px 0 10px;
    opacity: 0; 
    animation: fadeInUp 0.8s ease-out forwards;
}

/* 타이틀 양쪽 선 스타일 */
.sub_graph_title::before, 
.sub_graph_title::after {
    content: "";
    flex-grow: 0.1;
    min-width: 50px;
    height: 2px;
    background: linear-gradient(to right, transparent, #003366);
}
.sub_graph_title::after { 
    background: linear-gradient(to left, transparent, #003366); 
}

/* 두 번째 타이틀 전용 (위쪽에 카드가 있으므로 여백 확보) */
.sub_graph_title.type02 {
    margin-top: 50px !important; 
    margin-bottom: 10px !important; 
    animation-delay: 0.6s; 
}

/* [4. 첫 번째 서브 타이틀 밑 설명문구 스타일] */
.sub_graph_desc_01 {
    font-size: 18px;
    color: #5c5c5d;
    text-align: center;
    margin: 0 0 60px 0; /* 아래쪽 카드 섹션과의 간격 */
    width: 100%;
    opacity: 0;
    animation: fadeInUp 0.8s ease-out forwards;
    animation-delay: 0.2s;
    font-weight: 500;
}

/* [5. 두 번째 서브 타이틀 밑 설명문구 스타일] */
.sub_graph_desc_02 {
    font-size: 18px;
    color: #5c5c5d;
    text-align: center;
    margin: 0 0 30px 0; /* 아래쪽 그래프 박스인형과의 간격 */
    width: 100%;
    opacity: 0;
    animation: fadeInUp 0.8s ease-out forwards;
    animation-delay: 0.7s;
    font-weight: 500;
}

/* [6. 상단 카드 섹션] */
.partner_cards_row { 
    display: flex; 
    justify-content: space-between; 
    gap: 30px; 
    width: 100%; 
}

.partner_card {
    flex: 1; 
    background: #fff; 
    border: 1px solid #eee; 
    border-radius: 20px;
    padding: 30px 15px; 
    text-align: center;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    opacity: 0; 
    animation: fadeInUp 0.8s ease-out forwards;
}

/* 카드 순차 딜레이 */
.partner_card:nth-child(1) { animation-delay: 0.3s; }
.partner_card:nth-child(2) { animation-delay: 0.4s; }
.partner_card:nth-child(3) { animation-delay: 0.5s; }

.partner_card:hover {
    transform: translateY(-10px); 
    border-color: #bd4d57 !important;       
    box-shadow: 0 15px 30px rgba(189, 77, 87, 0.15); 
    cursor: pointer;
}

.partner_card:hover .card_logo img {
    transform: scale(1.05);
}
.card_logo img { 
    max-width: 150px; 
    height: auto; 
    margin-bottom: 20px; 
    transition: transform 0.3s ease;
}
.card_product img { 
    max-width: 100%; 
    height: auto; 
    border-radius: 10px; 
}

/* [7. 그래프 배경 박스 영역] */
.graph_bg_box {
    width: 100%;
    background: #fff;
    border: 1px solid #e5e5e5;
    border-radius: 30px;
    padding: 40px 20px; 
    position: relative;
    margin-bottom: 120px;
    box-sizing: border-box;
    opacity: 0;
    animation: fadeInUp 1s ease-out forwards;
    animation-delay: 0.9s; /* 문구들이 모두 나오고 마지막에 등장 */
}

/* 박스 내부 이미지 반응형 정렬 */
.graph_bg_box .graph_img {
    display: block;
    margin: 35px auto;
    max-width: 100%; 
    height: auto;
}

/* =================================================
   [8. 모바일 대응 반응형 스타일] 768px 이하
==================================================== */
@media (max-width: 768px) {
    .partner_wrap { 
        gap: 15px !important; 
        padding: 0 20px 40px; 
    }
    
    /* 카드 가로 배열 -> 세로 배열 변경 */
    .partner_cards_row { 
        flex-direction: column; 
        align-items: center; 
        gap: 15px;
    }
    .partner_card { 
        width: 100%; 
        max-width: 400px; 
    }

    /* 타이틀 및 설명글 모바일 간격 조정 */
    .sub_graph_title { 
        font-size: 20px; 
        margin: 40px 0 10px !important; 
    }
    .sub_graph_title::before, 
    .sub_graph_title::after { 
        min-width: 30px; 
    }
    .sub_graph_title.type02 { 
        margin-top: 35px !important; 
    }
    
    .sub_graph_desc_01 {
        font-size: 14px;
        margin: 0 0 25px 0;
    }
    .sub_graph_desc_02 {
        font-size: 14px;
        margin: 0 0 20px 0;
    }

    /* 그래프 배경 박스 모바일 최적화 */
    .graph_bg_box {
        padding: 20px 15px !important; 
        margin-bottom: 40px !important;
        border-radius: 20px;
        height: auto; 
    }
}

/* =========================
   주요 협력업체 끝끝
========================= */




/*주요사업분야*/
.tri_value_wrap {
    position: relative;
    width: 100%;
    max-width: 800px;
    height: 500px;
    margin: 80px auto;
    display: flex;
    justify-content: center;
}

.tri_item {
    position: absolute;
    z-index: 2;
}

/* 위치값 설정 */
.tri_item.top { top: 0; left: 50%; transform: translateX(-50%); }
.tri_item.bottom_left { bottom: 0; left: 5%; }
.tri_item.bottom_right { bottom: 0; right: 5%; }

.tri_circle {
    width: 230px;
    height: 230px;
    background: #fff;
    border: 1px solid #d0d0d0;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    padding: 20px;
    box-sizing: border-box;
}

/* 호버 시 하단 리스트의 b1 색상과 매칭 */
.tri_item:hover .tri_circle {
    border-color: #4A90E2;
    transform: scale(1.08) translateY(-10px);
    box-shadow: 0 15px 35px rgba(74, 144, 226, 0.15);
}

.tri_num { font-size: 0.85rem; font-weight: 800; color: #4A90E2; margin-bottom: 8px; letter-spacing: 1px; }
.tri_tit { font-size: 1.35rem; font-weight: 700; color: #222; margin-bottom: 12px; }
.tri_txt {font-size: 15px;color: #777;word-break: keep-all;line-height: 1.4;}

/* 작은 동그라미 점선 설정 */
.tri_line_svg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    z-index: 1;
    overflow: visible;
}

.dotted_poly {
    fill: none;
    stroke: #0091fa;
    stroke-width: 1; /* 동그라미 크기 */
    stroke-dasharray: 0.1, 05; /* 첫번째 값은 점의 길이(0.1로 작게), 두번째는 간격 */
    stroke-linecap: round; /* 선의 끝을 둥글게 해서 원형으로 만듦 */
    stroke-linejoin: round;
}

/* 호버 시 선 색상도 은은하게 반응 */
.tri_value_wrap:hover .dotted_poly {
    stroke: #b0c9e8;
    transition: stroke 0.5s ease;
}

/* 반응형 */
@media all and (max-width: 768px) {
    .tri_value_wrap { height: auto; display: block; padding-top: 0px; margin: 40px auto; }
    .tri_item { position: relative; left: auto !important; right: auto !important; top: auto !important; bottom: auto !important; transform: none !important; margin: 0 auto 3rem; }
    .tri_circle { width: 190px; height: 190px; margin: 0 auto; }
    .tri_line_svg { display: none; }
}
.material-symbols-outlined {
    font-family: 'Material Symbols Outlined';
    font-weight: normal;
    font-style: normal;
    font-size: 50px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    /* 리가처(아이콘 합치기) 설정 활성화 */
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    
    color: #4A90E2;
    font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 48;
    transition: all 0.3s ease;
}

/* 호버 시 색상이 채워지는 효과 */
.tri_item:hover .material-symbols-outlined {
    font-variation-settings: 'FILL' 1, 'wght' 400;
}
/*주요사업분야*/
/* 기본 레이아웃 */
.biz_section { max-width: 1500px; margin: 100px auto; padding: 0 20px; box-sizing: border-box; }
.biz_header { text-align: left; margin-bottom: 60px; }
.main-title { font-size: 40px; font-weight: 800; margin-bottom: 15px; color: #1a1a1a; }
.sub-title { font-size: 18px; color: #666; font-weight: 400; line-height: 1.6; }


/* 사업분야 그리드 */
.biz_grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
    margin: 80px auto;
	padding: 0 20px;
	max-width: 1500px;
}

/* 카드 아이템 스타일 */
.biz_item {
    background: #fff;
    border: 1px solid #e1e8ed;
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    display: flex;
    flex-direction: column;
    text-align: left;
}

.biz_item:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(0, 102, 179, 0.1); /* 포인트 블루 컬러 반영 그림자 */
    border-color: #b53641;
}

/* 상단 배경 영역 */
.biz_img_box {
    height: 80px;
    background: #b53641; 
    position: relative;
}

.biz_img_box .num {
    position: absolute;
    bottom: 25px;
    left: 25px;
    font-size: 19px;
    font-weight: 800;
    color: rgb(255 255 255); /* 배경에 녹아드는 블루 번호 */
    letter-spacing: -0.02em;
}

/* 텍스트 컨텐츠 영역 */
.biz_txt_box {
    padding: 35px 35px;
    flex-grow: 1;
}

/* 텍스트 컨텐츠 영역 */
.biz_txt_box {
    padding: 35px 35px;
    flex-grow: 1;
}

.biz_txt_box h3 {
    font-size: 18px;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 20px;
    position: relative;
    padding-bottom: 15px;
    
    /* [중요] 기존에 줬던 padding-left가 있다면 0으로 초기화하거나 삭제하세요 */
    padding-left: 0; 
}

/* 동그라미 포인트 (글자 왼쪽 밖으로 배치) */
.biz_txt_box h3::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: -20px;       /* 글자 왼쪽에 배치하기 위해 마이너스 값 유지 */
    margin-top: 7px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    border: 4px solid #b53641; /* 색상만 파란색으로 변경 */
    
    /* [핵심] 수치를 안 바꿔도 구멍이 나오게 만드는 설정 */
    box-sizing: content-box; 
    background-color: transparent; /* 혹은 #fff */
}

/* 제목 하단 포인트 선 */
.biz_txt_box h3::after {
    content: '';
    position: absolute;
    bottom: 0;
    
    /* [수정] left: 0으로 두면 이제 글자 시작점에 딱 맞습니다 */
    left: 0;            
    
    width: 30px;
    height: 3px;
    background: #0066b3;
}

.biz_txt_box p {
    font-size: 16px;
    color: #555;
    line-height: 1.8;
    margin-bottom: 25px;
    min-height: 70px;
    word-break: keep-all;
    letter-spacing: -0.03em;
}

/* 하단 리스트 영역 */
.biz_list {
    list-style: none;
    padding: 0;
    margin: 0;
    border-top: 1px solid #f2f2f2;
    padding-top: 20px;
}

.biz_list li {
    font-size: 14px;
    color: #444;
    padding-left: 15px;
    position: relative;
    margin-bottom: 10px;
    font-weight: 500;
}

/* 리스트 포인트 (#0066b3) */
.biz_list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 7px;
    width: 5px;
    height: 5px;
    background: #0066b3;
    border-radius: 1px; /* 약간 각진 느낌으로 전문성 강조 */
}

/* 반응형 모바일 */
@media all and (max-width: 1200px) {
    .biz_grid { grid-template-columns: repeat(2, 1fr); }
}

@media all and (max-width: 768px) {
    .biz_grid {grid-template-columns: 1fr;margin: 0 auto;}
    .main-title { font-size: 32px; }
    .biz_header { text-align: center; margin-bottom: 40px; }
}




/* =================================================
   오시는길  YOUN WOO CST Location Page - 최종 통합 CSS
==================================================== */
/* ==========================================================================
   YOUN WOO CST Location Page - 최종 통합본 (반응형 & 등장 애니메이션 추가)
   ========================================================================== */

/* [1. 기존 스타일 기본 보존 및 카카오 제어] */
.kakaomap { width:100%; }
.half_round { position:relative; width:100%; padding:15px 0 5px 0px; font-size: 17px; text-align: left; }
.half_round:after { content:""; display:block; height:0; clear:both; visibility:hidden; }
.half_round > li { margin-bottom:.5rem; padding-top:.4rem; line-height: 1.9rem; font-size: 15px; }

.root_daum_roughmap .cont { display: none !important; }
.root_daum_roughmap .wrap_controllers { display: none !important; }

/* =================================================
   [2. 1300px 가로폭 고정 규격 가이드]
==================================================== */
.location_header_center,
.top_info_row_final,
.map_wrap_final,
.bottom_route_final {
    max-width: 1300px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
}

.location_header_center { text-align: center; margin-bottom: 80px; }

/* =================================================
   [3. 💡 중간 타이틀 모음, 라인 아이콘 및 눈높이 칼정렬 제어]
==================================================== */
.top_info_row_final {
    display: flex;
    justify-content: space-between;
    align-items: flex-start; 
    gap: 80px;               
    border-top: 2px #003366 solid;
    padding-bottom: 15px;

    /* 🎬 [애니메이션 1] 전체 정보 영역 스르륵 등장 효과 */
    animation: fadeInUp 0.8s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}

/* 소재지와 연락처를 묶어주는 패널 */
.info_blocks_wrap {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start; 
    gap: 4rem;
}

.info_col_final { display: flex; }
.info_col_final.side_left { justify-content: flex-start; }
.info_col_final.side_right { justify-content: flex-start; }

.info_inner_box {
    text-align: left;
    display: flex;
    flex-direction: column;
    min-width: 340px;
}

/* SVG 전용 라인 아이콘 타이틀 스타일 */
.info_title_final { 
    font-size: 18px; 
    font-weight: 800; 
    color: #003366; 
    margin: 0 0 16px 0; 
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-align: left;
}
.line_icon {
    width: 20px;
    height: 20px;
    fill: #0066b3;
}

/* 소재지 내부 컨텐츠 박스 */
.info_content_final { 
    display: flex; 
    flex-direction: column; 
    gap: 6px; 
    padding-bottom: 24px; 
}

.info_text_final { font-size: 16px; color: #333; line-height: 1.5; text-align: left; }
.info_text_final .post_code { color: #0066b3; font-weight: 700; }
.info_sub_text_final { font-size: 16px; color: #777; margin: 0; line-height: 1.5; text-align: left; }

.info_sub_flex_final { display: flex; flex-direction: column; gap: 6px; }
.info_sub_flex_final strong { color: #555; font-weight: 700; display: inline-block; margin-right: 8px; }

/* 중앙 세로 구분선 */
.center_divider_final {
    width: 1px;
    height: 120px;           
    background-color: #e5e5e5;
    margin: 65px 70px 0 50px; 
    align-self: flex-start;
    flex-shrink: 0;
}

/* 우측 길찾기 버튼 영역 */
.info_btn_wrap {
    flex-shrink: 0;
    margin-top: 60px;        
}
.btn_find_route_square {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 135px;
    height: 45px;           
    background-color: #003366;
    color: #fff !important;
    text-decoration: none;
    border-radius: 12px;     
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    box-shadow: 0 4px 12px rgba(0,51,102,0.12);
}
.btn_find_route_square:hover {
    background-color: #0066b3;
    transform: translateY(-4px);
    box-shadow: 0 8px 20px rgba(0,102,179,0.25);
}
.btn_find_route_square .btn_text {
    font-size: 16px;
    font-weight: 700;
    letter-spacing: -0.5px;
}
.btn_find_route_square .btn_arrow_big {
    font-size: 20px;
    font-style: normal;
    transition: transform 0.3s ease;
}
.btn_find_route_square:hover .btn_arrow_big {
    transform: translateX(4px);
}

/* =================================================
   [4. 지도 하단 보텀라인 튀어나옴 전면 보정]
==================================================== */
.map_wrap_final {
    margin-top: 30px;
    width: 100%;
    margin-bottom: 40px;
}
.map_inner_border {
    width: 100%;
    border-bottom: 1px solid #c6c6c0;
}
.root_daum_roughmap { width: 100% !important; display: block !important; margin: 0 auto; }

/* =================================================
   [5. 하단 찾아오시는 길 및 얇은 자동차 아이콘 가이드]
==================================================== */
.bottom_route_final { margin-bottom: 120px; text-align: left; }
.route_main_title_final {
    font-size: 21px;
    font-weight: 800;
    color: #222;
    margin: 0 0 30px 0;
    border-bottom: 1px #0066b3 solid;
    text-align: left;
    padding-bottom: 20px !important;
}
.route_detail_list_final { padding: 0 !important; margin: 0; }
.route_detail_list_final li { list-style: none !important; margin-bottom: 40px; text-align: left; }
.route_detail_list_final li:last-child { margin-bottom: 0; }

.route_tag_css { 
    display: inline-flex; 
    align-items: center;
    gap: 8px;
    margin-right: .15rem; 
    padding: 0.2rem 1.1rem 0.2rem 0.9rem; 
    color: #fff; 
    border-radius: 30px; 
    background: #0066b3; 
    font-weight: 500; 
    line-height: 1.7rem;
    font-size: 15px;
    vertical-align: middle;
}
.car_svg_icon {
    width: 18px;
    height: 18px;
    fill: #fff;
    vertical-align: middle;
}

.duration_tag { font-size: 16px; color: #bd4d57; font-weight: 600; margin-left: 5px; vertical-align: middle; }

.route_path_final {
    font-size: 16px;
    color: #2b2a2a;
    border-bottom: 1px dashed #ddd;
    padding: 16px 15px;
    margin-top: 12px;
    line-height: 1.6;
    text-align: left;
}
.route_path_final .arrow { color: #aaa; margin: 0 6px; }


/* =================================================
   [6. 모바일 반응형 완벽 최적화 버전] 768px 이하
==================================================== */
@media (max-width: 768px) {
    h6 {
        font-size: 18px !important;    
        line-height: 26px !important;
        margin: 30px 0px 20px 0px !important; 
    }

    .sub_title_center { font-size: 14px; line-height: 1.6; padding: 0 10px; margin-bottom: 30px !important; }
    
    .top_info_row_final { 
        flex-direction: column; 
        gap: 20px; 
        align-items: stretch; 
        padding: 0px 15px 20px 15px; 
    }
    
    .info_blocks_wrap { 
        flex-direction: column; 
        gap: 25px; 
        width: 100%; 
        align-items: stretch; 
    }
    
    .info_inner_box { 
        min-width: 100%; 
        text-align: left; 
    }
    
    .info_title_final { font-size: 16px; margin-bottom: 10px; }
    .info_text_final { font-size: 14.5px; line-height: 1.4; }
    .info_sub_text_final { font-size: 12.5px; margin-top: 2px; }
    
    .info_content_final { padding-bottom: 0px; gap: 4px; }
    .info_sub_flex_final { gap: 4px; }
    
    .center_divider_final { display: none; }
    
    .info_btn_wrap { 
        width: 100%; 
        margin-top: 10px; 
    }
    
    .btn_find_route_square { 
        width: 100%; 
        height: 50px; 
        flex-direction: row; 
        gap: 8px; 
        border-radius: 8px; 
    }
    .btn_find_route_square .btn_text { margin-bottom: 0; font-size: 15px; }
    .btn_find_route_square .btn_arrow_big { font-size: 16px; }

    .map_wrap_final { margin-top: 20px; margin-bottom: 30px; padding: 0 15px; }
    .root_daum_roughmap { height: 300px !important; } 

    .bottom_route_final { margin-bottom: 60px; padding: 0 15px; }
    .route_main_title_final { font-size: 18px; padding-bottom: 12px !important; margin-bottom: 20px; }
    
    .route_tag_css { font-size: 13px; padding: 0.2rem 0.8rem; line-height: 1.5rem; }
    .duration_tag { font-size: 13.5px; }
    
    .route_path_final { 
        font-size: 13.5px; 
        word-break: keep-all; 
        padding: 12px 5px; 
        line-height: 1.5;
    }
    .route_path_final .arrow { margin: 0 3px; }
}

/* =================================================
   🎬 [신규] 부드러운 스르륵 애니메이션 Keyframes 기획
==================================================== */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px); /* 아래에서 20px 지점부터 시작 */
    }
    to {
        opacity: 1;
        transform: translateY(0);    /* 제자리로 착석 */
    }
}